Sobes.tech
Junior

Renderləmə anlayışını necə başa düşürsünüz?

sobes.tech Süni İntellekt

AI-dan cavab

Flutter-da render etmək prosesi, widget ağacını (widget tree) element ağacına, sonra isə render ağacına (render tree) çevirmək və nəticədə ekran üzərində göstərməkdir.

Əsas mərhələlər:

  1. Widget Ağacı: İstifadəçi interfeysinin deklarativ təsviri.
  2. Element Ağacı: Widget ağacının şərh edilməsi, burada widget nümunələrinə və widget vəziyyətinə (məsələn, StatefulWidget) istinadlar var. Element ağacı, Widget ağacı ilə Render ağacı arasında körpü rolunu oynayır.
  3. Render Ağacı: RenderObject obyektlərini ehtiva edir, bunlar özlərini necə çəkəcəyini (paint) və ölçü və mövqeyini necə müəyyən edəcəyini (layout) bilir. Bu, platformadan asılı olmayan abstrakt ağacdır.
  4. Çəkmə və Kompozisiya: GPU-dan asılı olmayan çəkim əmrləri Skia-ya (Flutter-un qrafik motoru) göndərilir və GPU-ya asılı əmrlərə çevrilir.
  5. Rasterləşdirmə: GPU əmrləri ekran piksellərinə çəkilir.
  6. Göstərmə: Piksellər cihazın ekranında göstərilir.

Render və layout qurma dövrü, vəziyyət dəyişiklikləri və ya Scheduler vasitəsilə frame aktivləşdirildikdə baş verir. Scheduler, build (Element ağacını qurmaq üçün) və layout / paint (Render ağacı üçün) funksiyalarının icrasını planlaşdırır.

// Sadə widget nümunəsi
class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // Hər widget istifadəçi interfeysinin bir hissəsini təsvir edir.
    // Flutter bu təsviri elementlər və RenderObject-lərə çevirir.
    return Container(
      color: Colors.blue,
      child: Text('Hello'),
    );
  }
}