O que você sabe sobre a estrutura interna do Flutter?

O núcleo do Flutter consiste no motor, na estrutura e nos widgets.

• Motor Flutter: Escrito em C++ e fornece uma API de baixo nível para renderização, manipulação de texto, threads e plugins. Interage diretamente com a plataforma (iOS, Android, Web, Desktop) e APIs gráficas (por exemplo, Skia). O motor gere a renderização, operações assíncronas e o ciclo de vida da aplicação.

• Estrutura Flutter (Framework): Escrito em Dart e fornece uma camada de abstração sobre o motor. Inclui vários componentes prontos a usar:

  • Fundação: Classes básicas e funções auxiliares.
  • Renderização: Camada para gerir a árvore de objetos de renderização e o seu desenho.
  • Widgets: Blocos básicos de construção de UI que formam a árvore de widgets.
  • Material Design e Cupertino: Conjuntos de widgets que implementam estilos Material Design e design ao estilo iOS.

• Widgets: Em Flutter tudo é um widget. Os widgets descrevem a configuração da UI. Existem dois tipos principais:

  • StatelessWidget: Widget sem estado interno mutável. A sua UI depende apenas dos seus parâmetros de entrada (properties).
  • StatefulWidget: Widget que pode ter um estado mutável. Consiste no próprio widget e num objeto State, onde se armazena o estado e a lógica de construção da UI (build).

Processo de renderização:

1. Build: O framework chama o método build() do widget, que devolve uma árvore de outros widgets.
2. Árvore de Elementos: Com base na árvore de widgets, é criado uma árvore de elementos (Element Tree), que representa a estrutura da UI. Os elementos ligam os widgets aos objetos de renderização correspondentes.
3. Árvore de Objetos de Renderização: Os elementos criam e gerem a árvore de objetos de renderização (Render Object Tree). Os objetos de renderização são responsáveis pelo layout, pintura e hit testing.
4. Pintura: O motor usa Skia (em dispositivos móveis e desktop) ou CanvasKit (na web) para desenhar os objetos de renderização na tela.

Programação reativa:

Flutter usa uma abordagem reativa para construir a UI. Quando o estado muda, o framework reconstrói essa parte da árvore de widgets que depende dele. Isto é feito de forma automática e eficiente graças ao mecanismo de diffing e à rápida criação e destruição de widgets.

Recarregamento a quente (Hot Reload) e Reinício a quente (Hot Restart):

• Hot Reload: Insere o código Dart atualizado na aplicação em execução sem perder o estado. Ideal para iteração rápida de UI.
• Hot Restart: Reinicia a aplicação do zero com o código atualizado e o estado reiniciado. Utilizado quando o Hot Reload não funciona, por exemplo, ao fazer alterações em initState ou variáveis globais.

Código específico de plataforma:

Flutter permite interagir com as APIs nativas da plataforma através de canais de plataforma (Platform Channels). Isto permite chamar métodos do código nativo (Java/Kotlin no Android, Swift/Objective-C no iOS) e receber os resultados de volta em Dart.

// Exemplo de uso do Canal de Plataforma
import 'package:flutter/services.dart';

static const platform = MethodChannel('samples.flutter.dev/battery');

Future<void> getBatteryLevel() async {
  String batteryLevel;
  try {
    final int result = await platform.invokeMethod('getBatteryLevel');
    batteryLevel = 'Nível da bateria: $result %.';
  } on PlatformException catch (e) {
    batteryLevel = "Não foi possível obter o nível da bateria: '${e.message}'.";
  }
  // Atualizar UI
}