androidflutterflutter-list-tile

ListTile not appearing correctly in flutter


I want the list tiles to appear on top of the background, the text is appearing just fine but the color of the tiles is appearing behind the logo.

I tried putting it in a stack so it's positioned correctly on top of each other but no use, I also tried using the Positioned and Expanded widgets as suggested by BlackBox AI but nothing, I didn't find any questions online that resembles this one and I'm still a beginner so I have no idea how to troubleshoot this, here's my code so far,
EDIT: ok I had a problem with pasting the code here so heres a link to it (https://pastecode.io/s/0zop54cs)

and here's the emulator, dont mind the hideous design


Solution

  • As mentioned in this comment from a similar issue on GitHub, ListTile paint its background on its Material ancestor.

    To make the tileColor being painted on top of the backdrop filter, you need to wrap the ListView widget with its own Material widget and give it a transparent color to not interfere with other stylings:

    Material(
      color: Colors.transparent,
      child: ListView(
        // ...
      ),
    )
    

    Alternatively, you can also wrap each individual ListTile with its own Material widget.