如何将小部件放置在一行中包含的卡中?

时间:2018-06-15 15:06:09

标签: dart flutter

目前,我正在尝试创建一个卡片模板以插入列表视图。我希望带有图标按钮的列位于最右侧。我似乎无法找到一种方法来说明包含图标按钮的列需要向右刷新。

new Expanded(
            child: new ListView(
              shrinkWrap: true,
              padding: const EdgeInsets.fromLTRB(20.0, 0.0, 20.0, 0.0),
              children: <Widget>[
                new Card(
                  child: new Row(
                    children: <Widget>[
                      new Padding(
                        padding: const EdgeInsets.fromLTRB(0.0, 0.0, 10.0, 0.0),
                      ),
                      new Image(
                        //image: new AssetImage("assets/ic_access_alarm_red_24dp.png"),
                        image: new AssetImage("assets/pastDue.png"),
                        height: 50.0,
                        width: 50.0,
                      ),
                      new Padding(
                        padding: const EdgeInsets.fromLTRB(0.0, 0.0, 10.0, 0.0),
                      ),
                      new Column(
                        children: <Widget>[
                          new Text("This is the title"),
                          new Text("This is the Description"),
                          new Text("This is the date"),
                        ],
                      ),
                      new Column(
                        children: <Widget>[
                          new IconButton(
                            icon: new Icon(Icons.note_add),
                            onPressed: () {
                              select("AddCalibration");
                            }
                          ),
                          new IconButton(
                            icon: new Icon(Icons.edit),
                            onPressed: () {
                              select("EditInstrument");
                            }
                          )
                        ],
                      )
                    ],
                  )
                ),

                const Text("I am"),
                const Text("A ListView"),
              ],
            )
          )

This is a capture of what it currently looks like.

2 个答案:

答案 0 :(得分:1)

谢谢你,vbandrade!

这绝对解决了我的问题。

new Expanded(
              child: new ListView(
            shrinkWrap: true,
            padding: const EdgeInsets.fromLTRB(20.0, 0.0, 20.0, 0.0),
            children: <Widget>[
              new Card(
                child: new ListTile(
                  leading: new Image(
                    image: new AssetImage("assets/pastDue.png"),
                    height: 50.0,
                    width: 50.0,
                  ),
                  title: new Column(
                    children: <Widget>[
                      new Text("This is the title"),
                      new Text("This is the Description"),
                      new Text("This is the date"),
                    ],
                  ),
                  trailing: new Column(
                    children: <Widget>[
                      new IconButton(
                          icon: new Icon(Icons.note_add),
                          onPressed: () {
                            select("AddCalibration");
                          }),
                      new IconButton(
                          icon: new Icon(Icons.edit),
                          onPressed: () {
                            select("EditInstrument");
                          })
                    ],
                  ),
                ),
              ),
              const Text("I am"),
              const Text("A ListView"),
            ],
          ))

This is the end result.

答案 1 :(得分:0)

使用Expanded小部件将图标推到右侧

new Expanded(child: new Container())

所以在你的例子中: 新专栏(

 children: <Widget>[
 new Text("This is the title"),
 new Text("This is the Description"),
 new Text("This is the date"),],
 ),
 new Expanded(child: new Container()),
 new Column(
 children: <Widget>[
 new IconButton(
 icon: new Icon(Icons.note_add),
 onPressed: () {}),