DEV Community

loading...

Utilizando o WIDGET SingleChildScrollView do FLUTTER para resolver estouro de pixels na tela

lucasberce71 profile image Lucas Bercê de Jesus ・1 min read

Faaala devs tudo certo? Hoje venho trazer uma técnica/dica valiosa na hora de montar seus widgets em tela no FLUTTER.
Quando estamos desenvolvendo nossos app, e colocamos muitos widgets em tela onde acabamos estourando a capacidade de pixels em tela o FLUTTER apresenta uma faixa amarela informando quantos pixels você ultrapassou na tela. E a maneira para resolvermos isso é adicionando um scroll na tela, de uma forma bem simples utilizando o widget SingleChildScrollView:

SingleChildScrollView(
    child: Container(
      child: ListView.builder(
       //O physics: BouncingScrollPhysics() Adiciona uma animação 
       //elástica no scroll
       physics: BouncingScrollPhysics(), 
       itemCount: 100, 
       itemBuilder: (context, index) {
        return ListTile(
         title: Text('Título $index'),
         subtitle: Text('Subttítulo $index'),
       );
      }
     ),
    ),
  ],
 ),
),
Enter fullscreen mode Exit fullscreen mode

E assim você consegue resolver os problemas de quebra de layout no seu app.

Espero que tenha ajudado vocês de alguma forma, até a próxima!!!!

Discussion (0)

pic
Editor guide