【问题标题】:How to create simple Listview with image Flutter如何使用图像 Flutter 创建简单的 Listview
【发布时间】:2021-06-30 23:15:44
【问题描述】:

我想知道如何实现类似或接近此的目标 image 而不是使用卡片 任何示例代码都将受到高度赞赏

【问题讨论】:

    标签: flutter user-interface layout


    【解决方案1】:

    试试这个代码

        ListView.builder(
                  itemCount: 2,
                  itemBuilder: (BuildContext context, int index) {
                    return Column(
                      mainAxisSize: MainAxisSize.min,
                      children: <Widget>[
                        Row(
                          children: <Widget>[
                            SizedBox(width: 10.0),
                            Image.asset(
                              'Your Asset',
                              height: 100,
                            ),
                            SizedBox(width: 20.0),
                            Expanded(
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                mainAxisSize: MainAxisSize.min,
                                children: <Widget>[
                                  Text(
                                    'Title Here',
                                    style: TextStyle(
                                      color: Colors.black,
                                      fontSize: 18.0,
                                      fontWeight: FontWeight.w500,
                                    ),
                                  ),
                                  SizedBox(width: 6.0),
                                  Text(
                                    'Subtitle Here',
                                    style: TextStyle(
                                      color: Colors.black,
                                      fontSize: 15.0,
                                      fontWeight: FontWeight.w300,
                                    ),
                                  ),
                                ],
                              ),
                            ),
                          ],
                        ),
                        Divider(
                          color: Colors.black,
                          thickness: 1.5,
                        ),
                      ],
                    );
                  },
                ),
    

    【讨论】:

    • 谢谢你忘了最后的分隔符
    • 现在检查,我添加了一个分隔符
    • 感谢最后一件事我如何将列表视图包装在容器中或类似的东西中以在后面添加白色背景
    猜你喜欢
    • 2015-04-12
    • 1970-01-01
    • 2020-08-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-10-05
    • 2017-06-18
    • 2011-08-08
    相关资源
    最近更新 更多