Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
4.6k views
in Technique[技术] by (71.8m points)

dart - FLutter :matching Listtile height to card height

enter image description hereI am trying to match the listtile height to the height of the card but listtile height is very small. it has default height which is very small. i want to change it to match the height of the card.please help me. Following below is my code .

 Container(
                margin: EdgeInsets.only(top: 16),
                child: ListView.builder(
                    itemCount: listitems.length,
                    shrinkWrap: true,
                    physics: ClampingScrollPhysics(),
                    itemBuilder: (context, index) {
                      return Column(children:<Widget>[
                        Container(
                          height: 100,
                          child: Card(
                            semanticContainer: true,
                            clipBehavior: Clip.antiAliasWithSaveLayer,

                            child:ListTile(
                              leading: Image.network('https://images.unsplash.com/photo-1550251592-aee2da85a87e?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80'),
                            ),
                            shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(10.0),
                            ),
                            elevation: 5,
                            margin: EdgeInsets.all(10),
                          ),
                        ),
                      ]);
                    }),
              ),

Any help would be much appreciated


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

If I understood the documentation correctly, ListTile is just a pre-customized composition of a row with a fixed-height. I couldn't figure out what final result you're looking for but I checked your code,

a.Using Container instead of ListTile to set a row/column composition would help you, though I used the container alone and it worked.

b.Try removing the parent container(the one with the height:110), put a Container as the child of the card. (your content can go under the new container instead of listTile). please tell me if you're looking for a specific result and my answer is irrelevant.

return Scaffold(
      body: Container(
        margin: EdgeInsets.only(top: 16),
        child: ListView.builder(
            itemCount: listitems.length,
            shrinkWrap: true,
            physics: ClampingScrollPhysics(),
            itemBuilder: (context, index) {
              return Column(children:<Widget>[
                Card(
                  semanticContainer: true,
                  clipBehavior: Clip.antiAliasWithSaveLayer,
                  child:Container(
                    child: Image.network('the image url'),
                  ),
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(10.0),
                  ),
                  elevation: 5,
                  margin: EdgeInsets.all(10),
                ),
              ]);
            }),
      ),
    );

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...