【问题标题】:card with asset image and text in flutter带有资产图像和文本的卡片
【发布时间】:2021-02-27 04:58:32
【问题描述】:

我正在尝试复制 Iphone 的提示应用程序。这是页面:

我想在图片上的 ios 图像上添加文本“nouveautés”。我试过这样:

Card(
            
            child: Column(
              children: <Widget>[
                Text('Nouveautés'),
                Container(
                  child: ClipRRect(
                    borderRadius: BorderRadius.circular(15.0),
                      child: Image.asset('images/ios14.png')),
                ),

              ],
            ),
            
              
            margin: EdgeInsets.only(left: 20.0, right: 20.0,top : 5.0),
            
          )

它不起作用,所以我会感谢某人的帮助或想法。 提前谢谢!

【问题讨论】:

    标签: flutter dart layout card


    【解决方案1】:

    你可以复制粘贴这个例子:

    class MyWidget extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: Column(
            children: [
              Card(
                child: Container(
                  height: 300,
                  width: double.infinity,
                  decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(15.0),
                      image: DecorationImage(
                          fit: BoxFit.cover,
                          image: AssetImage('images/ios14.png'))),
                  child: Padding(
                    padding: const EdgeInsets.all(10.0),
                    child: Text('Nouveautés'),
                  ),
                ),
                margin: EdgeInsets.only(left: 20.0, right: 20.0, top: 5.0),
              )
            ],
          ),
        );
      }
    }
    

    【讨论】:

    • 你可以使用 Alignment.topLeft 作为 Container 代替 margin 并设置 Padding
    • @Reign 非常感谢,你知道圆角后面没有白色背景的方法吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-12-23
    • 2018-01-16
    • 2021-04-18
    • 1970-01-01
    • 2019-08-30
    相关资源
    最近更新 更多