时间戳

首页 > 解决方案 > 在颤振堆栈中右对齐图像

flutter - 在颤振堆栈中右对齐图像

问题描述

  child: Stack(
          //alignment: Alignment.center,

          children: <Widget>[
            Container(
              alignment: Alignment.center,
              width: MediaQuery.of(mContext).size.width / 1.7,
              decoration: ShapeDecoration(
                shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(30.0)),
                gradient: LinearGradient(
                    colors: gradient,
                    begin: Alignment.topLeft,
                    end: Alignment.bottomRight),
              ),
              child: Text(title,
                  style: TextStyle(
                      color: Colors.white,
                      fontSize: 18,
                      fontWeight: FontWeight.w500)),
              padding: EdgeInsets.only(top: 16, bottom: 16),
            ),



            Visibility(

              visible: isEndIconVisible,
              child: Padding(
                  padding: EdgeInsets.only(right: 10),
                  child: ImageIcon(
                    AssetImage("assets/ic_forward.png"),
                    size: 30,
                    color: Colors.white,
                  )),
            ),
          ],
        ),

我有一个按钮，它应该位于屏幕的中心。位于按钮中心的文本和右箭头。因为我想把按钮放在中心，所以我把对齐中心放在中间，所以右箭头作为中心。谁能帮我解决这个问题？我也想知道我们在哪里点击了这个按钮。

标签： flutterflutter-layout

解决方案

您可以使用简单的行小部件来实现您预期的用户界面。看看下面的代码可能对你有帮助。

Stack(
    alignment: Alignment.center,
    children: <Widget>[
      Container(
        alignment: Alignment.center,
        width: MediaQuery.of(context).size.width / 1.7,
        decoration: ShapeDecoration(
          shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(30.0)),
            color: Colors.red
          ,
        ),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Text("vdsv",
                style: TextStyle(
                    color: Colors.white,
                    fontSize: 18,
                    fontWeight: FontWeight.w500)),
            Visibility(
              visible: true,
              child: Padding(
                  padding: EdgeInsets.only(right: 10),
                  child: ImageIcon(
                    AssetImage("assets/images/logo.png"),
                    size: 30,
                    color: Colors.white,
                  )),
            ),
          ],
        ),
        padding: EdgeInsets.only(top: 16, bottom: 16),
      ),

    ],
  )

推荐阅读