دوره زبان تخصصی برای برنامه‌نویسان (هدیه ویژه ثبت‌نام در دوره‌های متخصص) (فرصت محدود ⏰)
۰ ثانیه
۰ دقیقه
۰ ساعت
۱ محمد علی
دسترسی به درخت طراحی
یلدا محصلی حل شده توسط یلدا محصلی

چه طور می‌توان در vs code به درخت طراحی flutter دسترسی داشت؟


اول باید برنامه‌تون رو تو حالت دیباگ اجرا کنید. می‌تونید از دستور زیر استفاده کنید:

flutter run --debug

یا تو VS Code با زدن F5 برنامه رو اجرا کنید.

2. دسترسی به DevTools
بعد از اینکه برنامه اجرا شد، تو ترمینال یه لینک به شما داده می‌شه (چیزی شبیه http://127.0.0.1:9100)، اون رو تو مرورگر باز کنید.

اگه از VS Code استفاده می‌کنید:

وقتی برنامه اجرا بشه، برید به بخش Debug و گزینه Flutter DevTools رو انتخاب کنید تا ابزار باز بشه.
3. استفاده از ابزارها
حالا که DevTools باز شده، می‌تونید از ابزارهای مختلفش استفاده کنید:

Widget Inspector: بررسی درخت ویجت‌ها و مشکلات UI.
Performance: بررسی عملکرد و پیدا کردن نقاط کند.
Memory: چک کردن مصرف حافظه.
Timeline: دیدن زمان‌بندی اجرای کد.

بهترین پاسخ
یلدا محصلی ۱۹ دی ۱۴۰۳، ۱۵:۱۰