Esse artigo faz parte de uma série chamada "Widgets da Semana", para saber mais sobre essa ela leia nossa introdução.
SafeArea
O video do Widget da semana postado no dia 14 de agosto de 2018, fala sobre a SafeArea. Esse widget inspeciona o modelo da tela do celular e ajusta a conteúdo para que ele fique formatado dentro dos limites.
Não so o modelo/formato da tela é importante, mas como hoje aparecem varias notificações e também existem os recortes de tela, seu aplicativo pode ficar assim:
Para resolver esse tipo de incompatibilidade nós podemos usar o SafeArea.
SafeArea(
child: //Seus Widgets
);
Para entender a diferença entre usar ou não usar o SafeArea veja o exemplo a baixo:
Esse aplicativo tem o seguinte código:
Container(
color: Colors.white,
child: Text(
'Esse texto invade a barra de notificação',
style: TextStyle(color: Colors.black),
),
);
Sem usar a SafeArea o texto invade a barra de notificação e, ao olhar no celular, o texto é cortado pelo formato das pontas da tela que é arredondado.
Se você apenas adicionar a SafeArea:
SafeArea(
child: Container(
color: Colors.white,
child: Text(
'Esse texto nao invade a barra de notificação',
style: TextStyle(color: Colors.black),
),
));
O resultado é bem melhor:
Sobre Nós
Eu e o pessoal da Flutter Nation estamos em uma página e um grupo no Facebook.
Também estamos no Meetup e no GitHub!
Top comments (0)