وقتی که تصاویر برنامه و کش میکنید حتما سایز مناسب انتخاب کنید تا فایل های حجیم بصورت فشرده کش بشن
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
مورد بعدی برای زمان توسعه و دیباگ استفاده میشه, اگر این ویژگی فعال کنید فریمورک فلاتر سایز تصاویر و با debugImageOverheadAllowance مقایسه میکنه و در صورتی که تصاویر بزرگتر از این اندازه بودن رنگ و نوع نمایش تصویر و تغییر میده تا متوجه مشکل بشید.
سایز پیش فرض debugImageOverheadAllowance برابر با 128کیلوبایت است
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
سایز پیش فرض debugImageOverheadAllowance برابر با 128کیلوبایت است
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
This media is not supported in your browser
VIEW IN TELEGRAM
▪️ آموزش طراحی انیمیشن و افکت Parallax به همراه ویجت PageView
🌐 youtu.be/v_ozYdwKdaU
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
🌐 youtu.be/v_ozYdwKdaU
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
معماری فلاتر
▪️ همونطور که میدونید فریمورک فلاتر از بخش های زیادی تشکیل و به دلیل چند سکویی بودن پیچیدگی های زیادی داره.
▫️ قصد داریم تا در یک مجموعه پست به شکل کلی با معماری و آناتومی اپلیکیشن های فلاتری آشنا بشیم.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
▪️ همونطور که میدونید فریمورک فلاتر از بخش های زیادی تشکیل و به دلیل چند سکویی بودن پیچیدگی های زیادی داره.
▫️ قصد داریم تا در یک مجموعه پست به شکل کلی با معماری و آناتومی اپلیکیشن های فلاتری آشنا بشیم.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
معماری فریمورک فلاتر از پنج بخش اصلی تشکیل شده است.
دو بخش اول به زبان دارت
بخش سوم یا موتور فریمورک با استفاده از زبان های C/C++ طراحی شده
و دو بخش آخر نیز وابسته به پلتفرم هستند.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
دو بخش اول به زبان دارت
بخش سوم یا موتور فریمورک با استفاده از زبان های C/C++ طراحی شده
و دو بخش آخر نیز وابسته به پلتفرم هستند.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
▫️ بخش Dart
بخش اصلی برنامه فلاتر است که توسط توسعهدهنده برنامه نوشته میشود. این بخش مسئول پیادهسازی منطق تجاری برنامه و ترکیب ویجتها برای ایجاد رابط کاربری است.
▫️بخش Framework
یک کتابخانه کد منبع است که APIهای سطح بالاتری را برای توسعه برنامههای Flutter فراهم میکند. این APIها شامل ویجتها، تست برخورد، تشخیص حرکت، دسترسیپذیری و ورودی متن میشوند.
▫️ بخش Engine
بخشی از Flutter است که مسئول رندر کردن صحنههای ترکیب شده توسط Framework است. این صحنهها شامل رابط کاربری برنامه و سایر عناصر گرافیکی مانند متن و تصاویر هستند.
▫️ بخش Embedder
بخشی از Flutter است که مسئول تعامل برنامه با سیستم عامل است. این تعامل شامل دسترسی به خدماتی مانند سطوح رندرسازی، دسترسیپذیری و ورودی میشود.
▫️ بخش Runner
بخشی از Flutter است که برنامه را در پلتفرم هدف قابل اجرا میکند. این بخش قطعاتی را که توسط Embedder ارائه میشوند، به یک بسته برنامه ترکیب میکند.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
بخش اصلی برنامه فلاتر است که توسط توسعهدهنده برنامه نوشته میشود. این بخش مسئول پیادهسازی منطق تجاری برنامه و ترکیب ویجتها برای ایجاد رابط کاربری است.
▫️بخش Framework
یک کتابخانه کد منبع است که APIهای سطح بالاتری را برای توسعه برنامههای Flutter فراهم میکند. این APIها شامل ویجتها، تست برخورد، تشخیص حرکت، دسترسیپذیری و ورودی متن میشوند.
▫️ بخش Engine
بخشی از Flutter است که مسئول رندر کردن صحنههای ترکیب شده توسط Framework است. این صحنهها شامل رابط کاربری برنامه و سایر عناصر گرافیکی مانند متن و تصاویر هستند.
▫️ بخش Embedder
بخشی از Flutter است که مسئول تعامل برنامه با سیستم عامل است. این تعامل شامل دسترسی به خدماتی مانند سطوح رندرسازی، دسترسیپذیری و ورودی میشود.
▫️ بخش Runner
بخشی از Flutter است که برنامه را در پلتفرم هدف قابل اجرا میکند. این بخش قطعاتی را که توسط Embedder ارائه میشوند، به یک بسته برنامه ترکیب میکند.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
📣 شروع ترم جدید
🔰 با سلام خدمت کاربران فلاتر لرن, فردا یکم بهمن ماه ثبت نام ترم جدید دوره آموزشی استادی فلاتر آغاز میشود.
💠 ساعت ثبت نام اطلاع رسانی میشود.
▪️ برای پشتیبانی بهتر دانشجویان جدید این ترم هم همانند دوره های قبل با ظرفیت محدود بازگشایی میشود.
توضیحات و سرفصل های کامل دوره👇
🌐 دوره آموزش پیشرفته فلاتر
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
🔰 با سلام خدمت کاربران فلاتر لرن, فردا یکم بهمن ماه ثبت نام ترم جدید دوره آموزشی استادی فلاتر آغاز میشود.
💠 ساعت ثبت نام اطلاع رسانی میشود.
▪️ برای پشتیبانی بهتر دانشجویان جدید این ترم هم همانند دوره های قبل با ظرفیت محدود بازگشایی میشود.
توضیحات و سرفصل های کامل دوره👇
🌐 دوره آموزش پیشرفته فلاتر
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
آموزش برنامه نویسی فلاتر Flutter
📣 شروع ترم جدید 🔰 با سلام خدمت کاربران فلاتر لرن, فردا یکم بهمن ماه ثبت نام ترم جدید دوره آموزشی استادی فلاتر آغاز میشود. 💠 ساعت ثبت نام اطلاع رسانی میشود. ▪️ برای پشتیبانی بهتر دانشجویان جدید این ترم هم همانند دوره های قبل با ظرفیت محدود بازگشایی میشود.…
📣 ثبت نام ترم جدید فعال شد
🔰 43 ساعت محتوا در قالب 29 فصل و 146 درس
🔰 امکان ثبت نام ترم جدید فقط تا آخر امروز میباشد
توضیحات و سرفصل های کامل دوره👇
🌐 دوره آموزش پیشرفته فلاتر
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
🔰 43 ساعت محتوا در قالب 29 فصل و 146 درس
🔰 امکان ثبت نام ترم جدید فقط تا آخر امروز میباشد
توضیحات و سرفصل های کامل دوره👇
🌐 دوره آموزش پیشرفته فلاتر
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
آموزش برنامه نویسی فلاتر Flutter
📣 ثبت نام ترم جدید فعال شد 🔰 43 ساعت محتوا در قالب 29 فصل و 146 درس 🔰 امکان ثبت نام ترم جدید فقط تا آخر امروز میباشد توضیحات و سرفصل های کامل دوره👇 🌐 دوره آموزش پیشرفته فلاتر ⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
4 ساعت تا پایان ثبت نام این ترم
دوستانی که هنوز ثبت نام نکردند برای دریافت تخفیف ۲۰درصدی ایمیل خودشون به پشتیبانی ارسال کنند
دوستانی که هنوز ثبت نام نکردند برای دریافت تخفیف ۲۰درصدی ایمیل خودشون به پشتیبانی ارسال کنند
تکنیک skeleton در طراحی کاربری چیست؟
▪️ احتمالا در خیلی از اپلیکیشن یا وبسایتها قبل از اینکه اطلاعات لود شوند انیمیشنی شبیه به تصویر بالا را مشاهده کرده اید.
به این تکنیک Skeleton میگویند.
این تکنیک نماینگر لحظه لود کردن اطلاعات میباشد و به کاربران قبل از آن درباره ساختار کلی رابط کاربری اطلاعاتی میدهد.
▫️ یکی از مزایا این روش ایجاد توهم کوتاه بودن زمان انتظار است.
▫️ مزیت مهم دیگر کاهش بار شناختی کاربران است, به جای اینکه کاربران را با نشان دادن ابتدا یک صفحه خالی و سپس بلافاصله یک صفحه کامل محتوا تحت فشار قرار دهید، اسکلت های صفحه به کاربران کمک می کند پردازش کنند که صفحه چگونه خواهد بود و به آنها زمان می دهد تا قبل از اینکه با مقدار زیادی اطلاعات در یکبار مواجه شوند، مدل های ذهنی ساختار صفحه را توسعه دهند.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
▪️ احتمالا در خیلی از اپلیکیشن یا وبسایتها قبل از اینکه اطلاعات لود شوند انیمیشنی شبیه به تصویر بالا را مشاهده کرده اید.
به این تکنیک Skeleton میگویند.
این تکنیک نماینگر لحظه لود کردن اطلاعات میباشد و به کاربران قبل از آن درباره ساختار کلی رابط کاربری اطلاعاتی میدهد.
▫️ یکی از مزایا این روش ایجاد توهم کوتاه بودن زمان انتظار است.
▫️ مزیت مهم دیگر کاهش بار شناختی کاربران است, به جای اینکه کاربران را با نشان دادن ابتدا یک صفحه خالی و سپس بلافاصله یک صفحه کامل محتوا تحت فشار قرار دهید، اسکلت های صفحه به کاربران کمک می کند پردازش کنند که صفحه چگونه خواهد بود و به آنها زمان می دهد تا قبل از اینکه با مقدار زیادی اطلاعات در یکبار مواجه شوند، مدل های ذهنی ساختار صفحه را توسعه دهند.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
نحوه رندر شدن عناصر در فلاتر
▪️ در این مجموعه پست ها یک نگاه گذرایی به نحوه رندر شدن عناصر گرافیکی در فریمورک فلاتر داریم تا بیشتر با هسته فلاتر آشنا شویم.
در پست های قبلی با معماری فلاتر آشنا شدیم
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
▪️ در این مجموعه پست ها یک نگاه گذرایی به نحوه رندر شدن عناصر گرافیکی در فریمورک فلاتر داریم تا بیشتر با هسته فلاتر آشنا شویم.
در پست های قبلی با معماری فلاتر آشنا شدیم
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
آموزش برنامه نویسی فلاتر Flutter
نحوه رندر شدن عناصر در فلاتر ▪️ در این مجموعه پست ها یک نگاه گذرایی به نحوه رندر شدن عناصر گرافیکی در فریمورک فلاتر داریم تا بیشتر با هسته فلاتر آشنا شویم. در پست های قبلی با معماری فلاتر آشنا شدیم ⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
🟣 برای مثال میخواهیم ببینیم که این ویجت یا لوگو فلاتر به چه شکلی توسط فریمورک فلاتر پردازش میشود.
در حال حاضر فلاتر دو موتور گرافیکی اصلی دارد به نام های Skia و Impella که موتور فلاتر بین یکی از آن دو انتخاب میکند.
این موتورهای گرافیکی به وسیله یک پایپ لاین رندر از GPU ماشین استفاده میکنند.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
در حال حاضر فلاتر دو موتور گرافیکی اصلی دارد به نام های Skia و Impella که موتور فلاتر بین یکی از آن دو انتخاب میکند.
این موتورهای گرافیکی به وسیله یک پایپ لاین رندر از GPU ماشین استفاده میکنند.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
آموزش برنامه نویسی فلاتر Flutter
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
▪️اگر از مباحث درخت ویجت و سایر لیست های رندر گذر کنیم میرسیم به نحوه پردازش گرافیکی تک تک ویجت های یک صفحه, که در اینجا همان یک ویجت لوگو فلاتر را در اختیار داریم.
▫️ تمام ویجت ها ابتدا تبدیل به مسیر میشوند و این مسیرها در ادامه نیز به مجموعه ای از مثلث ها تبدیل میشوند.
بعد از مشخص شدن مثلث ها تمام رئوس آنها وارد بخشی به نام Shader میشوند که یک قطعه کد داخلی از فریمورک میباشد.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
▫️ تمام ویجت ها ابتدا تبدیل به مسیر میشوند و این مسیرها در ادامه نیز به مجموعه ای از مثلث ها تبدیل میشوند.
بعد از مشخص شدن مثلث ها تمام رئوس آنها وارد بخشی به نام Shader میشوند که یک قطعه کد داخلی از فریمورک میباشد.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
آموزش برنامه نویسی فلاتر Flutter
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
▪️بعد از محاسبه رئوس مثلث توسط Shader محل قرار گیری ویجت در صفحه نمایش مشخص میشود.
بعد از این قسمت پیکسل هایی که درون مثلث ها قرار میگیرند محاسبه میشود به این قسمت Rasterization گفته میشود.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
بعد از این قسمت پیکسل هایی که درون مثلث ها قرار میگیرند محاسبه میشود به این قسمت Rasterization گفته میشود.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
آموزش برنامه نویسی فلاتر Flutter
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
▪️ بعد از تمام این مراحل نوبت به رنگ آمیزی هر مثلث میرسد
برای این کار ابتدا فلاتر هر مثلث را بررسی میکند آیا به رنگ نیاز دارد یا خیر سپس خروجی محاسبات Shader و به بخش Fragment Shader ارسال میکنه تا رنگ مورد نیاز برای این بخش تولید شود.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
برای این کار ابتدا فلاتر هر مثلث را بررسی میکند آیا به رنگ نیاز دارد یا خیر سپس خروجی محاسبات Shader و به بخش Fragment Shader ارسال میکنه تا رنگ مورد نیاز برای این بخش تولید شود.
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
بهترین منابع برای آموزش رایگان برنامه نویسی فلاتر در سال 2024
▪️ فلاتر یک فریم ورک برنامه نویسی چندسکویی است که به وسیله آن میتوانید برای سیستم عامل های اندروید, iOS اپلیکیشن طراحی کنید. همچنین قابلیت طراحی وب اپلیکیشن و نرم افزارهای دسکتاپ را نیز دارید.
🌐 بهترین منابع برای آموزش رایگان برنامه نویسی فلاتر
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
▪️ فلاتر یک فریم ورک برنامه نویسی چندسکویی است که به وسیله آن میتوانید برای سیستم عامل های اندروید, iOS اپلیکیشن طراحی کنید. همچنین قابلیت طراحی وب اپلیکیشن و نرم افزارهای دسکتاپ را نیز دارید.
🌐 بهترین منابع برای آموزش رایگان برنامه نویسی فلاتر
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
آموزش برنامه نویسی فلاتر Flutter
کتاب های آموزش برنامه نویسی فلاتر + دانلود PDF ▪️وجود یک منبع خوب در زمینه یادگیری برنامه نویسی میتواند به شما در رسیدن به هدفتان کمک بسیار زیادی کند. استفاده از کتاب به عنوان یک منبع آموزشی همیشه گزینه محبوبی به شمار میرفته است. ▫️در این مقاله 7 کتاب کاربردی…
🟣 کتاب Flutter Complete Reference به لیست کتاب ها اضافه شد
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir
⚜️اولین مرجع فارسی فلاتر @flutter_learn_ir