Flutterda Stepper vidjet haqida qisqacha.

Github repo : Link

#project

Flutterdagi Box vidjetlar haqida yaxshi tushuntirgan ekan.

https://www.youtube.com/watch?v=Cf2m_nX6JUE

Flutterda Render engine haqida (Skia vs Impeller).

Render engine.
Flutter mexanizm (engine) UI-ni render qilish va uni ekranda ko'rsatish uchun mas'ul bo'lgan Flutter-ning asosiy komponentini ifodalaydi. U vidjet va layout-lar kabi render qilingan obyektlar daraxti (tree)-ni saqlaydi, ular o'zlarining layout-ini aniqlash, ularning vizual tasvirini bo'yash (paint) va input hodisalarini boshqarish uchun javobgardir.

Flutter-dagi renderlash mexanizmi ikkita asosiy jarayonni amalga oshiradi: layout va paint. Layout bosqichida mexanizm ota (parent) tomonidan taqdim etilgan cheklovlar asosida har bir element/obyektning o'lchami va o'rnini aniqlash uchun render obyekti daraxtini tahlil (analyze) qiladi.

Layout bosqichi tugagach, mexanizm daraxtni yana tahlil qiladi va har bir render obyektiga, o'zini canvas ustiga bo'yashni buyuradi. Flutter-dagi renderlash mexanizmi apparat (hardware) tezlashuvidan foydalanadi va keraksiz paint-larni minimallashtirish orqali ish faoliyati (performance)-ni optimallashtiradi.

Bu yuqori unumdorlikdagi grafiklarni ko'rsatish va silliq animatsiyalarga imkon beradi. Renderlash mexanizmining imkoniyatlaridan foydalangan holda, Flutter dasturchilarga turli platformalar va qurilmalarda tezkor va qulay UI-larini yaratish imkonini beradi.

Skia.
Bu Android uchun standart renderlash mexanizmi va 3.10 versiyasigacha iOS uchun standart vosita edi. Flutter tomonidan UI-ni render qilish uchun ishlatiladigan 2D grafik kutubxonasi. U turli obyektlar, shakllar yoki matnlarga qo'llaniladigan shader-larni qo'llab-quvvatlaydi. Ushbu shader-lar kompilyatsiya qilinadi va ish vaqti (runtime)-da GPU-da bajariladi.

Shader-larni yaratish va kompilyatsiya qilish talabga qarab ketma-ket amalga oshiriladi va bu jarayon bir necha yuz millisekundni olishi mumkin, bu bitta kadrni 60 fps-da ko'rsatish uchun zarur bo'lgan 16 millisekunddan ancha uzoqroqdir. Natijada, kompilyatsiya jarayoni sezilarli kechikishlar va kadr tezligini 60 dan 6 fps-gacha pasayishiga olib kelishi mumkin, bu "compilation jank" deb nomlanadi.

Impeller.
Bu yangi render mexanizmi. Skia oʻrnini bosuvchi sifatida ishlab chiqilgan boʻlib, yaxshi animatsiyalarga imkon berish va “jank” muammosini hal qilish, shu bilan birga Skia bilan ilgari imkoni boʻlmagan 3D-ni qoʻllab-quvvatlash imkonini beradi.

Bundan tashqari, shuni ta'kidlash kerakki, Impeller Metal (IOS) va Vulkan (Android) kabi zamonaviy tezlashtirilgan grafik API-larning afzalliklaridan to'liq foydalanish va ularning imkoniyatlarini maksimal darajada oshirish uchun mo'ljallangan.

Skia'dan farqli o'laroq, Impeller runtime-da emas, balki build jarayonida shader-larni kompilyatsiya qiladi. Build jarayonida GLSL (OpenGL Shading Language) kodini SPIRV-ga kompilyatsiya qilish uchun Impeller shader kompilyatori (impellerc) ishlatiladi.

Bu dasturning dastlabki ishga tushirish vaqtini sezilarli darajada qisqartiradi va shader kompilyatsiya jank-larini yo'q qiladi. Bundan tashqari, shuni ta'kidlash kerakki, Flutter jamoasi ushbu yondashuvi APK/IPA hajmini kamaytiradi.

Ma'lumki, Impeller iOS, Android, Desktop va Embedder API foydalanuvchilarini qo'llab-quvvatlaydi, bu birinchi navbatda C++ mexanizmi tomonidan mo'ljallangan barcha platformalarni qo'llab-quvvatlashdan dalolat beradi. Bu shuni ko'rsatadiki, Impeller veb-platformani qo'llab-quvvatlash uchun mo'ljallanmagan.

Manba : Link

Qo'shimcha resurslar :
1. Link
2. Link
3. Link

#Flutter

True story 🙂🐱

Flutter arxitekturasi haqida.

Embedder (o'rnatuvchi).
Bu Flutterning ma'lum bir operatsion tizim bilan qanday ishlashini tarjima qilish uchun zarur bo'lgan og'ir yuklarni ko'taradi. U kirish nuqtasi (entry point)-ni yaratadi va sirtni ko'rsatish, xabar hodisalari siklini boshqarish, input va foydalanish imkoniyati (accessibility) kabi xizmatlarni taqdim etish uchun OS bilan muvofiqlashtiradi.

Misol uchun, agar siz Flutterni PS-5 da ishlashini istasangiz, buning uchun embedder ishlab chiqishingiz mumkin. U Flutter ish vaqtini siz tanlagan mashinada ishga tushirish uchun ajoyib imkoniyatlar yaratadi.

Engine (mexanizm).
Bu C/C++ da yozilgan bo'lib, u input, output, tarmoq so'rovlari bilan shug'ullanadi va renderlashning murakkab tarjimasini boshqaradi. Flutter o'zining renderlash mexanizmi sifatida Impeller (IOS va Android) va Skia (boshqa platformalar uchun)-dan foydalanadi.

Framework.
Bunda ilovangizni ishlab chiqishda siz doimiy ishlatadigan barcha narsalar mavjud. Flutter ilovalari to'g'ri theme-lardan foydalangan holda native iOS yoki Android ilovalari kabi ko'rinishi mumkin. Cupertino iOS uchun, Material esa Android uchun.

Vidjetlar ilovangizning qurilish bloklaridir. Sizning butun ilovangiz Stateful yoki Stateless vidjetlardan iborat bo'ladi. Flutter framework yuqori darajadagi animatsiya, chizish va bosilish-larni qo'llab-quvvatlaydi, bu siz yaratgan har qanday vidjetga o'zingiz xohlagan tarzda harakat qilish imkonini beradi.

Manba : Link

#Flutter

Flutterda VoidCallback va ValueChanged class-lar haqida.

Bu ikkala class ham shunchaki oddiy "typedef" hisoblanadi.

VoidCallback.

typedef VoidCallback = void Function();

ValueChanged.

typedef ValueChanged<T> = void Function(T value);

#Flutter

Flutterda Plugin va package farqi nimada ?

Plugin.
Plagin nativ kodni, ya'ni Android (java, kotlin), iOS (Swift/ObjC) va Webni o'z ichiga oladi, ular birgalikda plagin deb ataladi. Plagin uchun flutterning eng yaxshi namunasi url_launcher plaginidir.

Ushbu plaginning ortida joylashgan kod nativ koddir, shuning uchun bu plagin flutter ilovasida ishlatilganda va har qanday nativ platformada ishlatilganda, u mukammal ishlaydi.

Package.
Paket to'liq bitta dasturlash tili bilan yozilgan, flutter paketi misol sifatida Dart dasturlash tilidan foydalangan holda yozilgan. Agar siz o'zingiz paket yaratsangiz va paketda biron bir plagin ishlatilsa, u baribir paket deb ataladi, chunki siz o'zingiz hech qanday plagin yaratmayapsiz, aslida ba'zilar tomonidan yaratilgan plaginlardan foydalanasiz.

Manba : Link
Video : Link

#Flutter

Dartda Runes class haqida.

Runes - bu Unicode skalyar qiymatlari ketma-ketligini ifodalaydi. Unicode skalyar qiymatlari, Unicode standartidagi belgilarni ifodalovchi butun sonlardir.

Unicode - bu dunyodagi barcha yozuvda ishlatiladigan har bir harf, raqam va belgi uchun noyob raqamli qiymat. Dart string UTF-16 kod birliklari ketma-ketligi bo'lganligi sababli, Unicode-ni satr ichida ifodalash maxsus sintaksisni talab qiladi.

Dart string UTF-16 kod birliklarining oddiy ketma-ketligi bo'lgani uchun satrdagi 32-bitli Unicode qiymatlari maxsus sintaksis yordamida ifodalanadi.

Unicode-ni ifodalashning odatiy usuli - "\uXXXX", bu yerda XXXX 4 xonali o'n oltilik (hex) qiymatdir. Masalan, yurak belgisi ♥️ - "\u2665". 4 ta hex raqamdan ko'proq yoki kamroq belgilash uchun qiymatni {} qavs ichiga qo'yiladi. Masalan, kulgan belgi 😆 - "\u{1f606}".

String.runes va String.codeUnits metodlar, berilgan satrning 16-bitli UTF-16 kod birliklarining o'zgarmas ro'yxatini qaytaradi.

Manba : Link
Unicode List : Link

#Dart

Flutterda Visibility, Offstage vs Opacity vidjetlar haqida.

Visibility - "visible" parametr, bola vidjeti ko'rinadigan (true) yoki ko'rinmas (false) ekanligini hal qiladi. visible parametrni “false”ga o‘zgartirganingizda, bola vidjeti ekranda joy egallagan holda u yerda qoladi, lekin u user-ga ko'rinmaydi.

Offstage (sahnadan tashqari) - nomidan malum, bu vidjetdagi "offstage" parametr bola vidjeti haqiqatda ko‘rsatilayotganligini (false) yoki uning ekrandan butunlay olib tashlanganligini (true) aniqlaydi. "offstage" parametrga true qiymatini o‘rnatganingizda, bola vidjeti ekrandan yo‘qoladi, joy egallamaydi va butunlay ko‘rinmaydi.

Opacity - bu vidjet, bola vidjetning shaffofligi (transparency)-ni boshqarish uchun ishlatiladi. Shaffoflik 0,0 ga o'rnatilganda, bola vidjeti ko'rinmaydi, lekin hali ham bo'sh joy egallaydi va u bilan muloqot (interaction) qilish mumkin.

#Flutter

Haqiqat 😄

Dartda "parse" va "tryParse" metodlar farqi.

Dartdagi parse va tryParse metodlari raqamning String holatidan haqiqiy son qiymatiga aylantirish uchun ishlatiladi. Biroq, ikkala metod o'rtasida noto'g'ri input-lar bilan ishlashda farq bor.

Parse.
Bu metod int va double sinflarida mavjud bo'lib, satrni tahlil qilish va uni mos ravishda integer yoki double-ga aylantirish uchun ishlatiladi. Agar satrni yaroqli raqamga (valid number) ajratish mumkin bo'lmasa, FormatException xatolikni chiqaradi.

TryParse.
Bu metod int va double sinflarida ham mavjud va u parse metodiga o'xshab ishlaydi. Biroq, invalid input-lar uchun exception o'rniga tryParse metod null-ni qaytaradi. Bu dastur oqimini to'xtatmasdan, noto'g'ri kiritilgan ma'lumotlarni ehtiyotkorlik bilan boshqarishda qo'l keladi.

Manbalar:
parse : Link
tryParse : Link

#Dart

Dartda "null aware" operator turlari.

Safe Navigation (?.)
Obyektning maydonlari yoki metodlariga, obyekt null bo'lmagan holatdagina kirish imkonini beradi.

List<int>? nums;
print(nums?.length);

Default Null-Aware (??)
Obyekt yoki o'zgaruvchi null bo'lgan holatda, dastlabki qiymat beriladi.

int? a;
print(a ?? 10);

Fallback Assignment (??=)
O'zgaruvchi hozirgi vaqtda null bo'lganda qiymat beriladi, agar null bo'lmasa, qiymat berilmay o'tib ketadi.

String? name;
name ??= "David";
print(name);

Null-Aware Spread (...?)
Bir listni boshqa bir listga qo'shayotgan paytda, null bo'lmasagina qo'shadi.

List<int> list1 = [1, 2, 3];
List<int>? list2 = null;
List<int> list3 = [...list1, ...?list2];
print(list3); // [1, 2, 3]

Manba : Link

#Dart

Flutter 3.22 va Dart 3.4 versiyadagi yangiliklar

https://medium.com/flutter/io24-5e211f708a37

Future.wait orqali unumdorlik (performance)-ni yaxshilash.

Qo'shimcha manbalar :
1. Official doc : Link
2. Video : Link
3. Medium : Link

#Flutter

Yangi paket: UzPay 🇺🇿💳

= Pub.dev da: https://pub.dev/packages/uzpay

Va'da qilganimdek, O'zbek to'lov tizimlari uchun paket.

Aslida oddiy narsa, lekin dasturingizda hammasini sozlab chiqqani 1-2 kun ketib qolishi mumkin.

Qulaylik olib kelsa "duo" qilib qo'yarsiz.

Qo'llab quvvatlashni istasangiz "repo" ni "fork" qiling va PR yuboring: https://github.com/Mamasodikov/uzpay

Mukammal inson bo'lmagani kabi mukammal kod ham yo'q. Xatolar topsangiz "issue" oching (qarg'amang 😅)

Har doimgidek "LIKE BOSING" va paketni ommalashishiga hissa qo'shing.

P.S: "Readme" ni o'zbekcha yozdim, chunki paket faqat o'zbeklar uchun. Agar bizni mahsulotni faqat O'zbekistonda ishlatishsa nega inglizcha bo'lishi kerak. Ruslar ishlatsa ham o'zbekcha o'rgansin :)
Click va Payme dokumentatsiyalarini yozganlar uyalsa arziydi. Faqat Ingliz va Rus tilida..

#package #payment

@flutterblogs

Isolate-ga ajoyib misol keltirilgan ekan.

https://youtu.be/WFfaaLwLobA?feature=shared

Flutterda "build" rejimlari.

Flutter ilovangizni kompilyatsiya qilishda uchta rejimni va test uchun boshsiz (headless) rejimni qo'llab-quvvatlaydi.

Debug.
Nosozliklarni tuzatish rejimi sizga tez oʻzgarishlarni yetkazib berish uchun moʻljallangan, ammo ilova hajmi katta va unumdorligi (performance) minimal. Qurilma, Emulyator yoki Simulyator orqali tekshirish imkoniyati mavjud. Bu rejimda Flutter o'zgarishlarni tezroq aks ettirish uchun ilovani optimallashtiradi.

Profile.
Profil rejimi testlash paytida ilovangiz ish faoliyati (performance)-ni tahlil qilish uchun moʻljallangan. Ilovani Profil rejimida kompilyatsiya qilayotganda, Flutter ilovangizning ishlashini tekshirmoqchi ekanligingizni taxmin qiladi. Shunday qilib, iloji boricha tezroq ishlashni ta'minlash uchun uni butunlay optimallashtiradi.

Bu rejimida ilovangizni Emulator yoki Simulator-da ishga tushira olmaysiz. Chunki ular buni amalga oshirish uchun optimallashtirilmagan. DevTools esa yoqilgan bo'ladi.

Release.
Ilovangizni Play Store va App Store-ga tayyorlash uchun ishlab chiqilgan rejim. U tezroq ishga tushishni, tez bajarilishini va minimal hajmni ta'minlash uchun mo'ljallangan.

Official doc: Link
Manba : Link

#Flutter