13

How to set a border for ListTile widget? Here is no property "decoration" for it in docs. So I can't apply border for this element as usual. I also can't wrap ListTile's properties like title, subtitle, leading, trailing in Container because it doesn't work. However it could be really strange if here is no any cunning way to style ListTile with a border...

1
  • Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking.
    – Community Bot
    Sep 12, 2021 at 14:34

3 Answers 3

36

ListTile has "shape" property. To add border you can simply add this line of code. There is no need to wrap it in card or container.

 shape: RoundedRectangleBorder(
    side: BorderSide(color: Colors.black, width: 1),
    borderRadius: BorderRadius.circular(5),
  ), 

Happy coding...

11
const ListTile(
    leading: Icon(
        Icons.question_answer_outlined,
        color: Colors.blue,
        size: 25,
    ),
    title: Text('TEXTO'),
    trailing: Icon(
        Icons.arrow_forward_ios,
        color: Colors.black26,
        size: 15,
    ),
    shape: Border(
        bottom: BorderSide(),
    ),
),
6

Try below code.

Card(
  shape: RoundedRectangleBorder(
    side: BorderSide(
      color: Colors.green.shade300,
    ),
    borderRadius: BorderRadius.circular(15.0)
  ),
  child: ListTile(
    leading: Text('Name'),
    title: Text('Username')
  )
)
1
  • 1
    Flutter offers a lot of ways to style a ListTile, but I recommend just wrapping with a Container (or with a Card) Aug 12 at 21:09

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.