⚡️⚡️function⚡️⚡️
3⃣

🔥🔥حالا با توجه به اینکه گفتیم هر function که تعریف میکنیم یه ابجکت از کلاس Function ساخته میشه و مفهوم callable class ها، انتظار میره که درک کنید که وقتی یه function رو بدون پرانتز به ورودی یه متد پاس میدیم و اون متد با گذاشتن پرانتز اون رو اجرا میکنه چه اتفاقاتی داره میوفته. 😍😍
#function

در مورد نظر سنجی بالا...

سه مورد اول خیلی به هم وابسته هستن ..
یه مفهوم به ظاهر جدا ولی در اصل وابسته

✔️برای درک و استفاده درست و بجا از key علاوه بر اینک خود key رو باید بشناسیم باید درک درست و عمیقی از BuildContext داشته باشیم.
در واقع key فقط یه ابزار ساده و سبک برای بعضی از کاربرد ها هست که وقتی میتونیم این کاربرد ها رو به خوبی درک کنیم که مفاهیم دیگه از جمله BuildContext رو درک کرده باشیم.

❌همین جوری الکی همه جا از key استفاده نکنید.

✔️استیت منیجمنت هم حتا وقتی یه درک خوب از BuildContext داشته باشیم خیلی قشنگتر و ساده تر میشه وگرنه فقط داریم از یه ابزار استفاده میکنیم .
فرقی نمیکنه پروایدر باشه یا بلاک یا گت یا....

✔️ولی مورد اخر یعنی معماری یه بحث جامع تر و مستقل تر هست تا حدودی.
و معماری نرم افزار رو میشه حتا مستقل از فریمورک مورد استفاده ، بهش پرداخت .
پس برای تبدیل شدن به یک معمار خوب باید از دنیای فریمورک ها بیایم بیرون و صرف نظر از هر فریمورکی یه معماری خوب طراحی کنیم و بعد بعضی از بخش های معماری رو برای تطبیق پذیری با فریمورک های مختلف منعطف کنیم.

⚡️⚡️Flutter Key⚡️⚡️
1⃣

توی چند پست آینده در مورد key ها صحبت میکنیم.
انواع اون ها رو بررسی میکنیم و کاربرد هر کدومشون رو میگیم.

🔥توی فلاتر یه کلاس به اسم Key داریم که abstract هست و پایه و اساس کلاس های دیگه هست.

این کلاس دو نوع فرزند داره
LocalKey
GlobalKey

این ها کلاس هایی هستند که از Key ارث بری کردند و دو نوع مختلف Key رو با کاربرد های مختلف برای ما میسازند.

پست های بعدی رو از دست ندید. 😍
#key
#flutter_key
#local_key
#global_key

⚡️⚡️Flutter Key⚡️⚡️
2⃣

🔥اولین نکته و اولین تفاوت این دو نوع Key رو از اسمشون میگیریم.

✔️کلید های global باید در کل اپ یکتا باشن ، یعنی اینکه اگه به یک ویجتی یه GlobalKey دادیم اون key رو دیگه نمیتونم به ویجت دیگه ای بدیم.

✔️اما LocalKey ها فقط در یک sub tree بررسی میشن یعنی اینکه میتونیم به دو تا ویجت LocalKey یکسان بدیم به شرط اینکه در یک sub tree نباشن.

🤔حالا اینکه این sub tree رو چگونه تحلیل کنیم و از کجا بفهمیم که کجاها مجاز نیستیم از LocalKey یکسان استفاده کنیم بستگی به مورد استفاده داره که به موقش در موردش صحبت میکنیم.

#key
#flutter_key
#local_key
#global_key

⚡️⚡️Flutter Key⚡️⚡️
3⃣

خب بریم سر وقت مهمترین تفاوت بین global ها و local ها :

🔥تفاوت اصلی اینجاست که GlobalKey ها حافظه دارن و LocalKey ها هیچ حافظه ای ندارن.

❓یعنی چی؟ وقتی که به یه ویجتی یه دونه GlobalKey اختصاص میدیم ، GlobalKey یه کار مهم میکنه و context ویجت رو توی خودش ذخیره میکنه (BuildContext).

✔️در نتیجه بعد از اون هر موقع و هر جایی با استفاده از اون key میتونیم به context ویجت دسترسی داشته باشیم و چون خود context هم اطلاعات دیگه از قبیل widget و State رو توی خودش داره میتونیم به اون ها هم دسترسی داشته باشیم.

✔️علاوه بر اون اگه اون ویجت توی درخت جابجا بشه و context اش تغییر کنه باز هم به context جدید دسترسی داریم.

🔥یه نکته هم بگیم که همه ویجت ها یه BuildContext اختصاصی برای خودشون دارن، همه ویجت ها و نه فقط استیت لس و استیت فول هایی که خودمون میسازیم.
همه ویجت شامل Text و Container و... یه BuildContext اختصاصی دارن که این context موقع ساخته شدن ویجت توی درخت ساخته میشه.

❌برخلاف global ها LocalKey هیچ حافظه ای نداره و هیچی توی خودش نگه نمیداره.

پس با توجه به این نکات :

✅ وقتی از GlobalKey استفاده میکنیم که بعدن و یه جای دیگه از برنامه نیاز داشته باشیم به context یا state یا خود اون widget دسترسی داشته باشیم.

✅وقتی از LocalKey ها استفاده میکنیم که فقط بخوایم به برچسب به اون ویجت بزنیم و با اون برچسب اون ویجت رو از بقیه متمایز کنیم.

🔥پس GlobalKey ها حافظه دارن و LocalKey ها صرفن یه برچسب هستن.

🔥البته GlobalKey ها علاوه بر داشتن حافظه میتونن کار برچسب گذاری (متمایز کردن) رو هم انجام بدن ولی اگه هدفمون فقط متمایز کردن ویجت از بقیه هست و نمیخایم بعدن یه جای دیگه به اطلاعاتش دسترسی داشته باشیم از LocalKey استفاده میکنیم.
#key
#flutter_key
#local_key
#global_key

⚡️⚡️Flutter Key⚡️⚡️
4️⃣
⛔️توی پست قبلی گفتیم که Globalkey ها حافظه دارن و Context ویجت رو توی خودشون ذخیره میکنن و بعدن با استفاده از اون میتونیم به context یا خود Widget یا State اون (در صورتی که ویجتی که key بهش اختصاص داده شده Stateful باشه) دسترسی پیدا کنیم و در مقابل LocalKey ها صرفن یه برچسب هستن.

اینجا یه نکته در مورد اون چیزی که واقعن داره اتفاق میوفته میگیم (Under the hood) , اگه زیاد علاقه ای ندارید میتونید از این نکته صرف نظر کنید.

🔥در واقع خود GlobalKey کار ذخیره Context رو انجام نمیده و Context ویجت توی خود GlobalKey ذخیره نمیشه.

❓پس کجا ذخیره میشه ؟
یه map وجود داره به شکل زیر
Map<GlobalKey , BuildContext> ـregistery

مپی که key های اون از جنس GlobalKey هستن و Value های اون از جنس BuildContext (البته دقیقن از جنس BuildContext نیستن ولی برای سادگی ما اینجا از نوع BuildContext در نظر میگیریم)

این مپ توی یه کلاسی که Element tree رو مدیریت میکنه وجود داره و وقتی که یه Element جدید ساخته میشه و mount میشه اگه key اختصاص داده شده به Widget اون Element از نوع Globalkey باشه یه عنصر به مپ اضافه میکنه :
_registery[gKey] = context;

اینجا gkey رو GlobalKey اختصاص داده شده به ویجت در نظر بگیرید و context رو هم buildContext ویجت.

وقتی هم که Element به اخر عمرش میرسه و unmount میشه این مپ اون عنصر رو حذف میکنه:
_registery.remove(gKey);

حالا خود کلاس GlobalKey به این مپ دسترسی داره و میتونه BuildContext متناظر با خودش رو پیدا کنه.

⛔️این نکته پیشرفته بود و سعی کردم که خیلی سادش کنم که بهتر متوجه بشید و برخی نکات خیلی ریز رو حذف کردم ولی میتونید ازش صرف نظر کنید.
#key
#flutter_key
#local_key
#global_key

⚡️⚡️Flutter Key⚡️⚡️
5⃣

تقسیم بندی انواع key ها در فلاتر

✔️اون هایی که رنگ مشکی دارن abstract هستن و بقیه کلاس های معمولی هستن .

✔️اون هایی که با <T> مشخص شدن Generic هستن.

#key #local_key
#flutter_key #flutter_key
#value_key #object_key #unique_key

⚡️⚡️Flutter Key⚡️⚡️
6️⃣ GlobalKey

در مورد GlobalKey ها باید بگیم ک:

✔️جنریک هستن و موقع نمونه سازی میتونیم واسشون یه Generic type مشخص کنیم. این Generic type باید از جنس State باشه.

درواقع اگه بخوایم GlobalKey رو به یه StatefulWidget اختصاص بدیم میتونیم براش type مشخص کنیم.
var key = GlobalKey<ScaffoldState>() ;

ویجت Scaffold یه StatefulWidget هست.

اگرم بخوایم به یه StatelessWidget یا... بدیمش هم میتونیم type مشخص نکنیم.

✔️یه پروپرتی (getter) به اسم currentContext دارن. (nullable)

✔️یه پروپرتی (getter) به اسم currentWidget دارن. (nullable)

✔️و یه پروپرتی هم به اسم currentState که type اش برابر type ای هست که برای GlobalKey مشخص کردیم.

گه اگه به ویجتی غیر از Stateful اختصاص بدیم این مقدار null برمیگردونه.


#key
#flutter_key
#local_key
#global_key

⚡️⚡️Flutter Key⚡️⚡️
7⃣ GlobalKey

#سوال
#بحث

❓توی پست شماره ۵ در مورد key ها یه شماتیک از key ها داشتیم و طبق اون گفتیم که کلاس GlobalKey یه abstract کلاس هست .

از کلاس های abstract هم که نمیشه نمونه ساخت ‼️‼️‼️

پس چه جوری داریم ازش نمونه میسازیم؟؟

⚡️⚡️Flutter Key⚡️⚡️
8️⃣ GlobalKey

مثال )
میدونیم که وقتی که از MaterialApp استفاده میکنیم یه دونه Navigator برامون میسازه و توی درخت قراره میده.

بعد از اون هر موقع که بخوایم از نویگیتور استفاده کنیم میگیم :
Navigator.of(context)

❓این کد دقیقن چکار مکینه ؟
با استفاده از context ای که بهش دادیم شروع میکنه به جستجو توی درخت (از parent ویجت شروع میکنه) و میره بالا تا یه نویگتور توی درخت پیدا کنه و بعد state اون رو برمیگیردونه , یعنی خروجی این متد یه NavigatorState هست.

🔥ویجت Navigator یه StatefulWidget هست و یه state به نام NavigatorState داره و متد Navigator.of(context) یه NavigatorState برمیگردونه.

حالا بعد از اون میگیم
Navigator.of(context).push...
که این متد push و بقیه متد هایی که استفاده میکنیم متد هایی هستن که داخل NavigatorState تعریف شدن.

🔥🔥حالا به جای این کار میتونیم موقع ساخت MaterialApp یه پارامتر به اسم navigatorKey بهش بدیم. و توی این پارامتر یه GlobalKey بدیم. در نتیجه MaterialApp این key رو میده به Navigator و بعد از اون میتونیم ازش برای پیدا کردن NavigatorState استفاده کنیم :‌

var myNavKey = GlobalKey<NavigatorState>();
......

return MaterialApp(
navigatorKey: myNavKey,
.....
);

حالا به جای :
Navigator.of(context)
میگیم :
myNavKey.currentState.push...

🔥پس بدون نیاز به context تونستیم که نویگیت رو انجام بدیم.
🔥این کاری هست که پکیج GetX انجام میده.

#key
#flutter_key
#local_key
#global_key

⚡️⚡️Flutter Key⚡️⚡️
9️⃣ GlobalKey

❓آیا کاری که توی پست قبلی کردیم توی پرفرمانس تاثیر داره؟؟

😍😍صدردرصد بلههههه.

🔥🔥وقتی که از
Navigator.of
استفاده میکنیم شروع میکنه توی درخت حرکت کردن و به دنبال Navigator گشتن.

هرچه ویجت Navigator به ویجتی که داخلش این متد رو call کردیم نزدیکتر باشه این جستجو سریع تر انجام میشه و هر چقدر دورتر باشه زمان بیشتری میبره.

ولی وقتی از GlobalKey استفاده میکنیم دیگه نیازی به جستجو نیست و همون موقع در لحظه با استفاده از key میتونیم به NavigatorSate برسیم.



#key
#flutter_key
#local_key
#global_key

⚡️⚡️Flutter Key⚡️⚡️
1️⃣0️⃣ GlobalKey

🔥یه نکته مهم دیگه در مورد GlobalKey ها اینکه همیشه توی پروژتون یه کلاس برای مدیریت GlobalKey ها داشته باشید.

مثلن یه فولدر به اسم common داشته باشید و اونجا یه فایل به اسم keys.dart درست کنید و کلاس زیر رو داخلش بگذارید :

class Keys{

static final navigatorKey = GlobalKey<NavigatorState>();
}

هر GlobalKey که قراره توی پروژه استفاده بشه رو داخل این کلاس تعریف کنید و static کنید و هر جایی خواستید ازش استفاده کنید.

❌اگه خواستید یه GlobalKey خارج این کلاس تعریف کنید .
مثلن یه GlobalKey توی یه State تعریف کنید اصلن و به هیچ وجه اون رو توی متد build نسازید :
Widget build(BuildContext context){
final gKey = GlobalKey();
return Scaffold(key: gkey);
}

اصلن این کار رو نکنید , چون با هر بار rebuild شدن یه GlobalKey جدید و کاملن متفاوت از قبلی میسازه.

✅توی چنین مواردی GlobalKey رو قبل متد build و توی initState بهش مقدار بدید.

#key
#flutter_key
#local_key
#global_key

⚡️⚡️Flutter Key⚡️⚡️
1️⃣1️⃣ GlobalKey

تا اینجا در مورد یکی از کاربرد های Globalkey به طور کامل صحبت کردیم و اون هم اختصاص GlobalKey به یه ویجت و دسترسی به context , state و خود widget در مکان های دیگه درخت بود.

ولی GlobalKey ها یه کاربرد مهم دیگه هم دارن.

🔥🔥با استفاده از GlobalKey میتونیم یه ویجت رو توی درخت جابجا کنیم (ویجت parent خودش رو تغییر بده) بدون اینکه اون ویجت state خودش رو از دست بده.

در مورد این کاربرد بعدن صحبت میکنیم.

#key
#flutter_key
#local_key
#global_key

⚡️⚡️اطلاعات عمومی⚡️⚡️

فلاتر از سه قسمت تشکیل شده
Framework
Engine
Embedder

اون قسمتی که ما برنامه نویس های فلاتر باهاش کار میکنیم Framework هست و کلن با زبان dart نوشته شده.

اما Engine با c++ نوشته شده.

قسمت Framework و Engine به وسیله یه کتابخونه به اسم dart:ui با هم ارتباط برقرار میکنن و این کتابخونه رابط بین این دو قسمت هست.

خود قسمت Framework همون طور که میبینید از لایه های مختلفی تشکیل شده.

هر لایه فقط میتونه به لایه زیری دسترسی داشته باشه.
مثلن لایه Rendering فقط به 4 لایه زیر خودش دسترسی داره.

⚡️⚡️اطلاعات عمومی⚡️⚡️

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

همه ما بر حسب عادت و چیزی که از اول یاد گرفتیم بالای همه فایل های فلاتر پروژمون کتابخونه material رو import میکنیم.

حالا مثلن وقتی که میخوایم به یه کانتینر Decoration بدیم یا یه جاهایی میخوایم از Border استفاده کنیم این Border و Decoration توی قسمت painting تعریف شدن.

یا وقتی که یه جایی از Offset یا Size استفاده میکنیم یا میخوایم به یه تکست Font Weight بدیم این ها داخل dart:ui تعریف شدن.

یا وقتی که یه CustomPainter میسازیم و اونجا از Canvas یا paint یا ... استفاده میکنیم این ها هم توی dart:ui تعریف شدن.

و....

ولی ما با یه import کردن کتابخونه material از همه اینها استفاده میکنیم.
درواقع کتابخونه material موارد مورد نیازی که توی لایه های دیگه قرار دارن و یا توی dart:ui قرار داره رو import و export میکنه که بتونیم ازشون استفاده کنیم.

از امشب بحث قبلیمون یعنی key ها رو ادامه میدیم و میریم سر وقت LocalKey ها.

خودتون رو اماده کنید که چند روز دیگه چند تا کوییز تو راهه. 😅😅😍

⚡️⚡️Flutter Key⚡️⚡️
1️⃣2️⃣ LocalKey

کار LocalKey ها این هست که به ویجت مورد نظر یه برچسب بزنن و اون رو از بقیه متمایز کنن.

❓حالا این برچسب زدن به چه درد میخوره و کجا باید ازشون استفاده کنیم؟
✔️دقیقن فقط یه کاربرد خاص دارن و اگه اون کاربرد رو بشناسیم میتونیم به خوبی ازشون استفاده کنیم.

🔥قبل از پرداختن به کاربرد یه یاداوری داشته باشیم.
همون طور که توی شماتیک پست قبل دیدیم LocalKey خودش یه کلاس abstract هست و نمیتونیم ازش نمونه بسازیم و برای استفاده از اون از subclass هاش یعنی ValueKey , ObjectKey یا uniqueKey استفاده میکنیم.
نوع PageStorageKey هم یه کاربرد دیگه داره که بعدن راجبش صحبت میکینم.
پس الان صحبتمون راجب سه نوع ValueKey , ObjectKey و uniqueKey هست.

بریم سر اصل مطلب...
❓کی از این ها استفاده کنیم ؟

✔️✔️✔️اگه یه لیست از ویجت های Stateful هم نوع داشتیم که قرار بود جایگاهشون توی لیست تغییر کنه(stateful ها میتونن فرزند اصلی لیست یا فرزند با واسطه باشن)برای هر Stateful یه key اختصاصی از این نوع در نظر میگیریم.(اگه stateful فرزند اصلی لیست بود به اون key رو میدیم و اگه فرزند با واسطه بود به فرزند اصلی (جد stateful) key رو میدیم)

مثلن وقتی که یه ListView داریم یا یه Column یا هر ویجت دیگه ای که قراره یه لیست از ویجت ها رو توی خودش داشته باشه.

✔️حالا اگه این ویجت هایی که قراره توی لیست قرار بگیرن از نوع Stateful بودن.
✔️همچنین Type یکسانی داشتن (مثلن همه از جنس MyStatefulWidget بودن / ویجت اختصاصی که از StatefulWidget ارث بری کرده)
✔️و علاوه بر اون قرار بود توی build های مختلف(setState) جایگاهشون توی لیست تغییر کنه.
✅در این حالت برای هر کدوم یه key اختصاص میدیم.

این که چه اتفاقی میوفته و چرا باید key بدیم رو بعدن توضیح میدیم.
توی پست های بعدی هم مثال میزنیم که بهتر متوجه بشید.

#key
#flutter_key
#local_key
#global_key