🔥RenderObjectWidget

🟢چند ماه پیش چالشی رو توی کانال گذاشتیم و یه انیمیشن ساده رو با هم طراحی کردیم.

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

🟢یکی از کارهایی که انجام دادم طراحی یه RenderObjectWidget از پایه بود که از نوع LeafRenderObjectWidget بود.

🟢حالا که بحث انواع ویجت ها و RenderObjectWidget ها داغه، یه بار دیگه ادرس گیتهاب مربوط به این چالش رو میگذارم که با روند ساخت یه RenderObjectWidget از پایه اشنا بشید.

❓سوالاتت رو زیر این پست بپرس. 😍

⭐️توی گیتهاب هم یه استار بزن و باعث خشنودی قلبی من بشو که باعث میشه خدا ازت راضی باشه 😝

https://github.com/mohammadtaherri/multi_slice_progress_indicator

@purecoder_ir

🔥ParentDatawidget

🟢این نوع باید child مستقیم یا غیر مستقیم یه RenderObjectWidget باشن.

🟢میتونیم به ویجت Expanded که حتمن باید داخل column یا row قرار بگیره اشاره کنیم.
⚠️نری فقط Expanded رو نگاه کنی و بگی از این نوع نیست.
تا ته برو که برسی به Flexible.

🟢مثال دیگه ویجت Positioined که حتمن child مستقیم یا غیر مستقیم Stack باشه.

🟢این نوع ویجت ها فقط و فقط میتونن child یه RenderObjectWidget خاص باشن و دیگه نمیتونن به عنوان child ویجت های دیگه استفاده بشن.


🟢وقتی میگم child مستقیم یا غیر مستقیم یعنی چه؟

⭕️مستقیم یعنی مثلن Flexible مستقیم توی children یه Column قرار گرفته باشه.

⭕️غیر مستقیم یعنی خود Flexible توی یک یا چند ویجت Stateless یا Stateful پیچیده شده باشه و اون ویجت ها child ویجت Column شده باشن.

🟢یه قانون نانوشته این که باید child ویجت های MultiChildRenderObjectWidget بشن و زیاد معنی و مفهومی نداره که بخوان child ویجت های SingleChildeRenderObjectWidget ها بشن.

@purecoder_ir

🔥InheritedWidget

🟢این نوع ویجت خیلی معروفه و خیلی در موردش صحبت شده و نیازی به توضیح بیشتر نیست.

🟢این نوع رو میتونیم به عنوان سولوشن فلاتر برای مدیریت استیت تلقی کنیم.

🟢سوالات راجع به این نوع رو توی کامنت ها بپرسید.

⭕️البته این ویجت میتونه مدل های مختلفی داشته باشه, از جمله :

InheritedWidget
|
|___ InheritedModel
|
|___ InheritedNotifier

🟢ویجت هایی مثل Theme یا MediaQuery یا... در نهایت از این نوع هستن.

@purecoder_ir

🔥InheritedWidget

⁉️توی کدوم یک از متد های کلاس State بهتره از Theme.of(context) استفاده کنیم؟

build
initState
didUpdateWidget
didChangeDependencies

✅وقتی که از Theme.of(context) استفاده میکینم هدف این هست که علاوه بر دسترسی به تم با اپدیت شدن Theme، ویجت مورد نظر rebuild بشه و از تم جدید استفاده کنه .

🔥🔥🔥 وقتی ک توی یک استیت Theme.of(context) رو صدا میزنیم با هر بار اپدیت تم برنامه، استیت مورد نظر rebuild میشه و ابتدا متد didChangeDependencies و بعد متد build اجرا میشن.

در نتیجه اگ داخل این متد ها Theme.of(context) رو صدا بزنیم با هر بار اپدیت تم، استیت مورد نظر میتونه از تم جدید استفاده کنه 😍

❌اگ داخل initState این متد رو صدا بزنیم و اطلاعات مربوط به تم رو بگیریم، با اپدیت تم چون ک دیگ initState اجرا نمیشه در نتیجه استیت نمیتونه از تم جدید استفاده کنه .

✅پس مکان مناسب برای کال کردن Theme.of(context) متد های didChangeDependencies و build هست.

🔥اگه ویجت Stateless باشه هم کلن به دونه متد داریم و اونم build هست و داخل همون Theme.of(context) رو کال میکنیم و هر موقع که Theme اپدیت شد، ویجت مورد نظر هم ریبیلد میشه.

@purecoder_ir

اولین کدی که نوشتم توی زبان فرترن بود و دو تا دستور ساده ی read و write بود...

دستور write یه چیزی رو توی کنسول چاپ میکرد (مثل print) و read هم یه ورودی از کاربر دریافت میکرد.

و لذتی که از نوشتن
write("Hello World")
بردم، یکی از بهترین لذت های تمام عمر برنامه نویسیم بوده. 😍😍😅

واقعن روی ابرا بودم 😍

پ.ن: البته یادم نیست که سینتکس اش دقیقن همین بود یا نه 🤔

❓بر چه اساسی میگی یه پروژه بزرگه یا کوچیکه؟
❓چه معیاری برای سنجش داری؟

📝 ایجا کامنت کن...

🔥Clean Code
🔥JAVA - C# vs Dart

⭕️توی زبان های جاوا و سی شارپ یه قابلیتی به نام Method Overloading داریم.

✅یعنی میتونیم توی یه کلاس چنتا متد با نام یکسان داشته باشیم به شرطی که پارامتر های ورودی و یا return value متفاوتی داشته باشن.

✅یکی از خوبی هایی که این قابلیت در اختیارمون میگذاره این هست که توی این زبان ها میتونیم توی یک کلاس چندین Constructor داشته باشیم.

✅همه ی Constructor ها همنام هستن ولی پارامتر های ورودی متفاوت دارن.

❌از نظر قواعد کلین کد، اینکه توی یک کلاس چندین Constructor هم نام داشته باشیم زیاد جالب نیست و خوانایی کد رو پایین میاره.

🔥برای کلین تر شدن کدمون به ازای هر Constructor یه متد static میسازیم که یه نام با معنا و قابل فهم داره و اون متد از Constructor کلاس استفاده میکنه و یه نمونه از کلاس رو برمیگردونه.

😍حالا استفاده کنندگان از کلاس به جای استفاده از Constructor های زیاد و گیج کننده از متدهای استاتیک که نام های قابل فهم دارن استفاده میکنن.

⭕️زبان دارت قابلیت Method Overloading رو نداره.

❌از این رو امکان نوشتن چند متد هم نام در یک کلاس توی این زبان وجود نداره.

❌پس نمیتونیم چند Constructor هم نام هم داشته باشیم.

✅در عوض دارت، named constructor ها رو معرفی کرد و بهت اجازه میده Constructor های مختلف توی یه کلاس داشته باشی و اون ها رو با نام های مختلف مجزا کنی.

✅از این رو توی دارت نیازی به متد های استاتیک برای کلین تر شدن کد نیست.

👌پس از این نظر زبان دارت نسبت به جاوا و سی شارپ کمک بیشتری به کلین کد میکنه.

😍انگار توسعه دهندگان دارت قبل از توسعه، قواعد کلین کد رو خوندن. 😝

@purecoder_ir

این که خودتون رو توی یه Button ببینید چه حسی داره؟ 😄


🎉 اینم یه show case دیگه از Flutter


لینک زیر رو باز کنید و یه نگاهی به خودتون بندازید

https://payamzahedi.com/camera_button/



@persian_flutter

🔥Clean Commit

امروز قراره واژه ی جدیدی رو ابداع کنیم. دو مرد بزرگ یکی از قاره ی سبز و دیگری از آمریکا, یکی خالق Git و دیگری خالق واژه ی Clean, امروز به ما کمک میکنن تا واژه ی جدیدمون رو به دنیا معرفی کنیم.

ا Robert C. Martin, عموی 70 ساله و دوست داشتنی برنامه نویس ها, متولد سال 1952 در آمریکا و خالق فرهنگ Clean با مجموعه اثار شگفت انگیز خودش, در کنار Linus Benedict Torvalds, مرد 53 ساله ی فنلاندی و خالق Git, نقش مهمی رو در انگیزه ی شکل گیری داستان امروزمون ایفا میکنن.

😍ادامه ی این داستان رو از لینک زیر بخون :

https://purecoder.ir/clean-commit/

🔥اگه همیشه با نوشتن commit های گیت مشکل داری و نمیدونی چطوری ماست مالیش کنی😝😝 مقاله ی بالا رو بخون

@purecoder_ir

🔥Flutter Notification

⭕️توی فلاتر میتونی با استفاده از Notification ها, برای اجدادت (ancestor) یه نوتیف بفرستی.

✅برای این کار یه کلاس به اسم Notification داریم و یه ویجت به اسم NotificationListener.

✅برای ساخت نوتیفیکشن دلخواه خودت باید یه کلاس بسازی که از Notification ارث بری میکنه.

class CustomNotification extends Notification {

}

✅برای ارسال نوتیف, ویجت child یه ابجکت از Notification مورد نظر میسازه و متد dispatch رو روش کال میکنه.

notification.dispatch(context)

✅این نوتیف توی درخت بالا میره و بالا میره و بالا میره تا بالاخره توسط یکی از اجداد (ancestor) دریافت و هندل بشه.

🔥توجه داشته باش که از ancestor استفاده کردم و از parent استفاده نکردم چون که این نوتیف توسط هر کدوم از parent ها میتونه دریافت بشه.

✅برای دریافت و هندل کردن نوتیف باید از ویجت NotificationListener استفاده کنی.

🔰برای نمونه ScrollNotification ها که خود فلاتر توسط ویجت Scrollable میفرسته و توسط ancestor ها با قرار دادن NotificationListener توی درخت میتونه دریافت و هندل بشه.

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

@purecoder_ir

خونه های قدیمی وقتی بارون میومد و سقفش چکه میکرد... میرفتن همون تیکه ی سقف رو یه دستی به سر و روش میکشیدن و تعمیر میکردن.

اگه وضعیت هاد میشد کل سقف رو کاه گلی، چیزی میزدن 😅

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

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

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

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

🔥اخبار Google IO 2023 رو میتونید از کانال زیر دنبال کنید:

@persian_flutter

⭕️آدرس سایت:
https://purecoder.ir

⭕️گروه پرسش و پاسخ:
@purecoder_gp

⭕️کانال:
@purecoder_ir

⭕️پشتیبانی:
@PureCoder_support

💥سال گذشته یه پست در مورد یکی از ویژگی های جدید Dart 3 که Class modifier ها بودن داشتیم.

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

😍به زودی, خیلی زود, همه ی این ها رو خیلی ریز با هم یاد میگیریم.

@purecoder_ir

انتخاب شما کدومه؟ 🤔

Bloc یا Riverpod

تو این مقاله توضیح دادم که چرا Riverpod برنده واقعی توی این مقایسه هست.

قطعا این دوتا پکیج میتونن نیاز های اولیه و ساده هر پروژه ای رو حل کنن اما من چندتا سناریو طراحی کردم که توی اونها نشون میدم Riverpod چقدر میتونه خوب تر عمل کنه.

چند دقیقه وقت بزارید و با دقت مطالعش کنید.

اگه براتون مفید بود لایک یادتون نره

https://medium.com/snapp-x/riverpod-or-bloc-making-the-right-choice-for-your-real-world-app-7bc2e6b0b49

🔥Flutter Performance

⭕️هر فریم (frame) توی فلاتر ۷ فاز (phase) رو سپری میکنه تا در نهایت من و شما تصویر مربوط به اون فریم رو روی نمایشگر ببینیم :

1⃣User input
2⃣Animation
3⃣Build
4⃣Layout
5⃣Paint
6⃣Composite
7⃣Resterize

✅در ابتدا و توی مرحله ۱ انجین فلاتر (engine) ورودی های کاربر رو تشخیص میده و اون ها رو پردازش و در اختیار فریمورک (framework) قرار میده. (کالبک هایی داخل framework کال میشن)

برای مثال میتونیم به تاچ های کاربر اشاره کنیم.

🔸البته موارد دیگه ای رو هم میشه جزو user input بحساب اورد که ازش میگذریم.

✅مرحله ی ۲ تا ۶ به طور کامل توی فریمورک اتفاق میفته و هندل میشه.

🔸فریمورک به زبان دارت نوشته شده .

✅بعد از اون فریمورک یک سری کامند های گرافیکی رو به انجین میده و مرحله ی ۷ توی انجین انجام میشه.

🔸انجین به زبان c++ نوشته شده.

🔸همه ی کارهایی که داخل فریمورک انجام میشه توی ترد UI انجام میشه.

🔸مرحله اخر توی یه ترد دیگه انجام میشه.

@purecoder_ir

🔥دارت ۳، یک قدم رو به جلو

⭕️دارت ۳ با فیچر های جدید زیادی سرانجام چند روز پیش معرفی شد.

⭕️فیچر های جدید این نسخه رو میتونیم در موارد زیر خلاصه کنیم :

✅Records
✅Patterns
✅class modifiers

⭕️با class modifier ها میتونیم یه سر و سامون خوبی به کلاس هامون بدیم و بهتر مدیریتشون کنیم.

😍اگه از زیاد کد زدن خوشت نمیاد، خوشحال باش... چون دارت کلی سوپرایز جدید واست داره...

⭕️قراره pattern ها با دست های پشت پرده بهمون کمک کنن که کمتر کد بنویسیم. (خوشگل تر؟ 🤔🤔🤔 شاید...)

🟢با pattern ها به خصوص ساختار if و switch متحول میشه.

🟢میتونیم علاوه بر switch statement ها نوع دیگری از switch ها، یعنی switch expression ها رو هم از این به بعد داشته باشیم.

🟢با ترکیب قابلیت هایی که pattern بهمون میدن با sealed class ها میتونیم یه قدم رو به جلو برداریم و نیازمون به ابزار های خارجی رو کمتر کنیم.

⭕️حالا Record ها به دارت اضافه شدن، تا دارت از این نظر چیزی از زبان هایی مثل swift کم نداشته باشه.

🟢حتا Record ها رو اینجا خیلی منسجم تر میبینیم.

😍با این همه هنوز ابتدای راه ورژن ۳ هستیم و این موارد قراره جاده صاف کن بروز رسانی های جذاب اینده باشن.

@purecoder_ir

🔥دارت 3

⭕️یکی از فیچر های جدید و مهم دارت 3, class modifier ها هستن.

⭕️از این به بعد modifier های زیر رو داریم:

✅base
✅interface
✅final
✅sealed

⭕️همچنین از قبل abstract رو داشتیم.
✅abstract

⭕️علاوه بر اون توی دارت 3 یه کلاس دیگه نمیتونه به عنوان mixin استفاده بشه و برای اینکه یه کلاس بتونه mixin هم باشه باید از mixin class ها استفاده کنیم:
✅mixin class

⭕️استفاده از این modifier ها و به خصوص ترکیب کردنشون با هم ممکنه سخت بنظر برسه.

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

❓سخته؟

@purecoder_ir