Dark Theme para Flutter


Há uma semana, no Google I / O 2019, a equipe do Android anunciou o suporte ao Android Q para o Dark Theme, um modo de interface do usuário escuro em todo o sistema que é alternado pelo usuário. Isso, então, levanta a questão: quando o Flutter adicionará suporte para esse novo recur

Primeiro, vamos começar com um MaterialApp típico que estabelece o tema para o restante da interface do usuário. Após, é utilizado da forma padrão de como um aplicativo define seu tema:

MaterialApp(
theme: ThemeData(
brightness: Brightness.light,
primaryColor: Colors.red,
),
);

Em Flutter, apresentamos uma propriedade darkTheme para MaterialApp, que permite especificar um segundo tema independente a ser usado apenas para o recurso Dark Theme do Android. Vamos apresentar um tema com uma configuração de Brightness.dark para o darkTheme do MaterialApp.

MaterialApp(
theme: ThemeData(
brightness: Brightness.light,
primaryColor: Colors.red,
),
darkTheme: ThemeData(
brightness: Brightness.dark,
),
);

Agora, quando você alternar o Dark Theme no seu sistema, seu aplicativo Flutter alternará automaticamente do tema normal para o darkTheme!

Graças ao uso de código pela interface do usuário do Flutter, a atualização do seu aplicativo para oferecer suporte a um ótimo recurso novo exige pouco mais do que adicionar uma nova propriedade à sua árvore de widgets. Nenhum estilo XML para atualizar, nenhum CSS para atualizar, apenas um parâmetro normal de Dart.

771 Visualizações
Awesome Flutter