代码之家  ›  专栏  ›  技术社区  ›  Claudio Castro

行高展开时底部的位置图标

  •  0
  • Claudio Castro  · 技术社区  · 5 年前

    情况如何:

    enter image description here

    我希望它看起来怎么样:

    enter image description here

    我的简化代码:

    Widget build(BuildContext context) {
        return Scaffold(
          backgroundColor: Colors.transparent,
          body: Column(
            children: <Widget>[
              Flexible(
                child: Container(),
              ),
              Container(
                decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.all(Radius.circular(20.0))),
                child: Row(
                  children: <Widget>[
                    IconButton(
                      onPressed: () {},
                      icon: Icon(Icons.camera_alt),
                      color: Colors.grey,
                    ),
                    Flexible(
                      child: TextField(
                        decoration: InputDecoration(
                          //Add th Hint text here.
                          hintText: "Digite sua mensagem",
                          border: OutlineInputBorder(),
                        ),
                        minLines: 1,
                        maxLines: 7,
                        controller: _textController,
                        onSubmitted: _handleSubmitted,
                      ),
                    ),
                    IconButton(
                      onPressed: () {},
                      icon: Icon(Icons.send),
                      color: Colors.grey,
                    ),
                  ],
                ),
              ),
            ],
          ),
        );
      }
    
    2 回复  |  直到 5 年前
        1
  •  1
  •   Mohamed Gaber    5 年前

    在您的行小部件中添加此行 crossAxisAlignment: CrossAxisAlignment.end,

        2
  •  0
  •   Mason    5 年前

    IntrensicHeight

    crossAxisAlignment: CrossAxisAlignment.stretch, Row

    然后添加 alignment: Alignment.bottomCenter, 对每一个 IconButton 小部件

    使用代码完成示例:

    child: IntrinsicHeight(
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: <Widget>[
            IconButton(
              onPressed: () {},
              icon: Icon(Icons.camera_alt),
              color: Colors.grey,
              alignment: Alignment.bottomCenter,
            ),
            ...
            IconButton(
              onPressed: () {},
              icon: Icon(Icons.send),
              color: Colors.grey,
              alignment: Alignment.bottomCenter,
            ),
        ]
    )
    

    我使用android studio中的dart开发工具检查所有小部件的绘制位置,找到需要更改的小部件。