Widget: Dismissible

Deslizar itens para um lado ou outro para descartá-los é um padrão de UI bastante comum.

Para implementar no Flutter, use o dismissible:

Dismissible(
  child: ListTile(
    title: Text(myString),
  ),
)

Ele recebe um child um background e uma key:

Dismissible(
  child: ListTile(
    title: Text(myString),
  ),
background: Container(
color: Colors.green,
),
key: ValueKey(myString),
)

Ele detecta os gestos de delizamento e anima o child.

 

TESTE COM UM LISTVIEW

Se você tem um widget com estado que cria um ListView, pode usar o callback onDismissed para chamar setState e remover um item da lista.

ListView(
itemCount: Items.length,
itemBuilder: (context, i){
return Dismissible(
...
onDismissed: (direction) {
setState(() {
items.removeAt(i);
});
}
);
}   
)

secondaryBackground

Para um dismissible multidirecional, ou seja, permite que o usuário deslize para os dois lados, esquerdo ou direito.

Dismissible(
  ...
background: Container(
color: Colors.green,
),
secondaryBackground: Container(
color: Colors.red,
child: Icon(Icons.cancel),
),
)

 

direction

Também tem uma propriedade direction para você deslizar na vertical.

Dismissible(
  ...
direction: DismissDirection.vertical,
...
)

 

 

97 Visualizações
Awesome Flutter