Search code examples
androidflutterdartuser-interfacedismissible

how to add an icon in Dismissible in flutter?


little question for you..

in this picture in my dismissible widget when i drag it to right or left it will delete the items of my list . but the word just "Delete" isn't enough for me and i want to be trash icon next to my text also...

so what should i do ?

please help me.

enter image description here

unnecessary i think but my code :

return Dismissible(
                      key: UniqueKey(),
                      background: Container(
                        alignment: Alignment.center,
                        color: Colors.redAccent,
                        child: const Text(
                          'Delete',
                          style: TextStyle(
                            color: Colors.white,
                          ),
                          textAlign: TextAlign.center,
                        ),
                      ),
                      onDismissed: (direction) async {
                        await deletePost(listpost![index].id.toString());
                        setState(() {
                          listpost!.removeAt(index);
                          fetchAllPosts().then((value) => listpost = value);
                        });
                      },

Solution

  • Whenever you want two widgets next to each other, horizontally, you may use a Row widget - it accepts multiple children:

    enter image description here

    return Dismissible(
      key: UniqueKey(),
      background: Container(
        alignment: Alignment.center,
        color: Colors.redAccent,
        child: Row( // Wrap with a row here
          mainAxisAlignment: MainAxisAlignment.center,
          children: const [
            Icon(
              Icons.delete,
              color: Colors.white,
            ),
           
            Text(
              'Delete',
              style: TextStyle(
                color: Colors.white,
              ),
            ),
          ],
        ),
      ),
      onDismissed: (direction) async {
        await deletePost(listpost![index].id.toString());
        setState(() {
          listpost!.removeAt(index);
          fetchAllPosts().then((value) => listpost = value);
        });
      },
    );