آماده سازی VSCode برای برنامه نویسی فلاتر

با سلام
من با فلاتر کار نکردم، اما در خصوص آماده سازی اولیه، این مقاله رو پیشنهاد می کنم بخونید و اجرا کنید:
https://roocket.ir/articles/5-ways-to-improve-development-with-visual-studio-code
مثلا این بخش خیلی مفید بودش: نوار فعالیت را از چپ به راست منتقل کنید

در خصوص قالب ِ رنگ بندی هم این مقاله به نظرم گزینه های خوبی رو معرفی میکنه:
https://roocket.ir/articles/5-hottest-vs-code-themes-to-use-in-2019

من خودم اصلا نمی تونم با رنگ بندی های تیره کار کنم، خیلی اذیت میشم، اگر شما هم رنگ بندی های روشن رو پسند می کنید بهتون از مقاله ی بالا این رنگ بندی رو پیشنهاد میکنم:
Winter is Coming - Light Theme

و یک سوال، اینی که نوشتید یعنی چی؟

دکمه هات ریلود (مثل ctrl+s)

@milad
توی اندروید استودیو وقتی ctrl+s رو میزنیم عملیات *** reload انجام میشه و خروجی سریع همون لحظه توی ایمولاتور نمایش داده میشه.
همچین امکانی میخواستم ببینم توی vscode هست یا نه

سلام الیاس جان
ترجیحا اگر سیستم خیلی قوی دارید از Android Studio استفاده کنید ( سیستم قوی منظورم رم 16 به بالا و هارد ssd ) چون امکانات خیلی بیشتری رو میده .
اما اگر قصد استفاده از Vs Code دارید بازم مشکلی نداره و با نصب یه سری پلاگین ها میتونید کارتون رو راه بندازید ( خودم از Vs Code استفاده میکنم چون مجبورم نیستم 10 تا IDE واسه زبان های مختلف نصب کنم ! )
برای شبیه ساز میتونی از شبیه ساز خود Android استفاده کنی . یا از شبیه ساز Nox . ( من خودم از Genymotion استفاده نمیکنم به دلایلی ... )
پلاگین های مورد نیاز Vs Code برای Flutter :
Dart - Flutter - IntelliJ Keybindings

همین ها کافیه ، ولی یه سری پلاگین دیگه هم هست نصبشون کن اگه خواستی .

@mojimich2015
ببخشید اون پلاگین های دیگشم میگین؟

• nox رو فلاتر میشناسه؟ چون avd سنگیه
• تم متریال و فونت خوب میشناسین؟
  تشکر

@mojimich2015
ببخشید من nox رو نصب کردم
ولی توی flutter doctor نمیشناسه
چیکار کنم؟

برای منم Nox رو توی Flutter Doctor نمیشناسه ولی Vs Code اون رو میشناسه .
پلاگین های اصلیش رو گفتم و با اینا میشه حرفه ای کار کرد ، واسه بقیه پلاگین ها هم Search بزنید مشخصه

سلام.
اگه بخوام به صورت کامل آماده سازی رو بگم (و البته خلاصه) به این شکله:
اول که پلاگین دارت و فلاتر رو نصب کنید. این مورد رو در داکیومنت خود فلاتر هم میتونید بخونید و این مرحله رو من فاکتور میگیرم:
https://flutter.dev/docs/development/tools/vs-code

شما اول یه تم مناسب نصب کنید. من از تم متریال استفاده میکردم (که چون با پایتون نمیساخت مجبور شدم عوضش کنم، با فلاتر مشکل نداره و خیلی خوبه؛ کلا تم یه چیز شخصیه. شاید دلیل عوض کردن تم من هم تنوع بود)
تم متریال:
https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-material-theme
تم فعلی من:
https://marketplace.visualstudio.com/items?itemName=sdras.night-owl

بعد نصب اون حتما آیکون های اکسپلور رو عوض کنید.
که من آیکون های متریال رو پیشنهاد میکنم:
https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme

تغییر فونت ادیتور هم ممکن هستش؛ اما باید فونت مناسب داشته باشید که معمولا خود تم ها فونت های سازگار با خودشون رو دارند که من نیازی به تغییر نمیبینم.

مرحله دیگه ای که هستش نصب پلاگین Snipp هستش که باعث میشه مطابق گفته خودتون استیت لس و استیت فول و انواع بیلدر و سایر چیز ها رو سریع بسازید.
این پلاگین رو از اینجا نصب کنید:
https://marketplace.visualstudio.com/items?itemName=Nash.awesome-flutter-snippets
راهنماش رو هم تو توضیحات میتونید بخونید مثلا با نوشتن statelessW میتونید ویجت استیت لس بسازید (دو سه کلمه رو بزنید تو سجست ها میاد)

برای شبیه ساز؛ من هم از NOX استفاده میکنم. برای اتصال NOX نیاز به یکسری کامند دارید که من اوایل خودم دستی وارد میکردم ولی پیشنهاد میکنم مخزن زیر رو ببینید:
https://github.com/mousedoc/nox-adb-connector
این هم کارتون رو ساده میکنه.
بعد نصب NOX، به لینک گیت هاب برید و nox-adb-connector.exe رو از پوشه EXE دانلود کنید و توی پوشه ای که NOX رو نصب کردید بریزید. حالا شبیه ساز رو اجرا کنید و بعد این که بالا اومد فایل nox-adb-connector.exe رو باز کنید.
با انجام این کار خودکار اسم دیوایس پایین سمت راست توی VSCode میاد.

در VSCode هم هات ریلود و همه چیز رو داریم. علاوه بر یه پنل کوچیک که به صورت شناور باز میشه موقع اجرا برنامتون، هر وقت فایل رو سیو کنید (اگه اروری نداشته باشه فایلتون) خودکار هات ریلود میشه برنامه و تغییرات اعمال میشه.
برای اجرا برنامه میتونید از کلید ctrl + f5 یا از منو Debug -> Start Without Debugging رو انتخاب کنید.
با انجام این کار پروژتون بیلد گرفته میشه و روی شبیه ساز اجرا میشه. یه پنل شناور هم باز میشه براتون (برای متوقف کردن و هات ریستارت و...)

یه مورد هم دلخواهه و بستگی به سبک کدنویسی شما داره.
شما وقتی در VSCode فرضا اسم یه ویجت رو میزنی، خودکار پارامتر های ویجت رو براتون لیست میکنه.
شما میتونید فرضا با کلید Enter یا Tab یکی از پارامتر ها رو انتخاب کنید و وارد کنید. بعضی افراد سبک کدنویسشون طوریه که پارامتر های ویجت رو هر کدوم در یک خط وارد میکنن و نیاز دارن بدون قبول پیشنهاد Enter بزنن.
برای این که قبول پیشنهاد ها با اینتر رو غیرفعال کنید (باید با Tab پیشنهاد ها رو قبول کنید)، کلید Ctrl + shift + p رو بزنید و عبارت settings.json رو وارد کنید.
در اونجا خط زیر رو وارد کنید و فایل رو ذخیره کنید:

"editor.acceptSuggestionOnEnter": "off",

البته من خودم این مورد رو غیرفعال کردم چون زیاد نیازی بهش نمیبینم؛ اگر چه سبک منم نیاز به اینتر زیاد داره اما با یه بار چپ و راست کردن کرسر میتونم پیشنهاد رو رد کنم.

در خود VSCode هم چیزای بسیار زیادی داریم که کمک میکنه به سرعت کدنویسیتون. فرضا انتخابگر های چندگانه، انتخابگر های بلاکی و...
که اینا رو باید خودتون از توی اینترنت پیدا کنید چون خیلی زیاد هستند و VSCode هم دستتون رو باز گذاشته.
یه مورد رو که بیشتر به فلاتر مربوطه براتون اینجا میگم.
فرضا شما اگه یه ویجت استیت فول ساختید و اسمش بوده Home و تصمیم گرفتید اسم اون رو تغییر بدید. شما نیازی ندارید دستی اینک ار رو انجام بدید کافیه روی اسم کلاس برید (همون کلاسی که از StatefulWidget ارث بری میکنه) و کلید F2 رو بزنید و اسم جدید رو وارد کنید.
خودکار اسم ویجتتون تغییر میکنه (حتی کلاسی که از State<Home> ارث بری کردید هم اسمش تغییر میکنه، البته اینا رو شاید متوجه نشید که دقیق چی میگم باید خودتون اجرا کنید)

در لینک زیر هم یه سری پلاگین هارو معرفی کرده
https://blog.maskys.com/my-vscode-plugins-for-flutter/