Render tree

RenderObject ağacının layout ve paint yaptığını öğrenirsin.

Render tree

RenderObject ağacı, layout ve paint işlemlerini yapan ağaçtır. Her Element, ilgili RenderObject'i oluşturur; bu nesne ekran konumunu, boyutunu ve çizimini hesaplar. layout ölçer, paint çizer.

class MyRenderBox extends RenderBox {
  @override
  void performLayout() {
    size = constraints.biggest;
  }

  @override
  void paint(PaintingContext context, Offset offset) {
    // çizim
  }
}

performLayout ve paint

RenderBox'ta performLayout size'ı belirler, paint çizimi yapar. constraints ebeveynden gelen boyut sınırlarıdır. Layout, üstten alta constraints akışı; paint ise alttan üste çizer.

Uygulama RenderBox tanımla

MyRenderBox adında bir RenderBox tanımla. performLayout metodunda size = constraints.biggest ata. paint metodunda context.canvas ile bir daire çiz: merkez offset + Offset(50, 50), yarıçap 20, Paint()..color = Colors.red. main'de MyRenderBox örneği al ve runtimeType yazdır.

Örnek çözümü göster

import 'package:flutter/material.dart';

class MyRenderBox extends RenderBox {
  @override
  void performLayout() {
    size = constraints.biggest;
  }

  @override
  void paint(PaintingContext context, Offset offset) {
    final canvas = context.canvas;
    canvas.drawCircle(
      offset + const Offset(50, 50),
      20,
      Paint()..color = Colors.red,
    );
  }
}

void main() {
  final renderBox = MyRenderBox();
  print(renderBox.runtimeType);
}

Kendini test et

RenderObject ağacı hangi iki işlemi yapar?
- State ve setState
- Event ve callback
- Layout ve paint
- HTTP ve JSON
Cevabı göster

Layout ve paint — RenderObject ağacı layout ile boyut hesaplar, paint ile ekrana çizer; state veya HTTP ile ilgilenmez.

size'ı ata

size = constraints.____;

Cevabı göster

size = constraints.biggest;

Render tree eşleşmeleri

RenderObject

Layout ve paint yapar
layout

Boyut hesaplar
paint

Çizim yapar
constraints

Ebeveynden sınırlar

Sıradaki ders: Build owner

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler