如何为包装在Listview中的容器提供onTap功能

时间:2018-09-17 07:58:37

标签: dart flutter

我有一个包装在列表视图中的容器列表,我需要提供一个onTap功能,例如当用户点击容器时,它应该为我提供该特定容器的值,以下是我的代码,我尝试使用Inkwell函数但是它抛出一个错误,说垂直端口视图。帮帮我,谢谢。

dynamic _allVehiclesDataView = new ListView(
  children: List.generate(this._allVehiclesData.length,
    (i) => new Container(
      decoration: new BoxDecoration(
        border:  Border(
          bottom:  BorderSide(width: 1.0, color: Colors.grey[300]),
        ),
      ),
      padding: const EdgeInsets.all(32.0),
      child: Row(
        children: [
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Container(
                  padding: const EdgeInsets.only(bottom:5.0),
                  child: Text(
                    this._allVehiclesData[i]["vehicle"]["registration"],
                    style: TextStyle(
                      fontWeight: FontWeight.bold,
                      fontSize: 20.0,
                    ),
                  ),
                ),
                Text(
                  'Location :',
                  style: TextStyle(
                    fontSize: 15.0,
                    color: Colors.grey,
                  ),
                ),
                Text(
                  (this._allVehiclesData[i]["address"] == null || 
                    this._allVehiclesData[i]["address"] == 'Not determined') ? 
                    "No data available" : ""+this._allVehiclesData[i]["address"]["LongLabel"],
                  style: TextStyle(
                    fontSize: 13.0,
                    fontWeight: FontWeight.bold,

                  ),
                ),
                Text(
                  'Last known update :',
                  style: TextStyle(
                    fontSize: 15.0,
                    color: Colors.grey[500],
                  ),
                ),
                Text(
                  (this._allVehiclesData[i]["deviceTime"]),
                  style: TextStyle(
                    fontSize: 13.0,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                this._allVehiclesData[i]["fuel"] != "null"?
                new Row(
                  children: <Widget>[ 
                    Text(
                      'Fuel Level :',
                      style: TextStyle(
                        fontSize: 15.0,
                        color: Colors.grey[500],
                      ),
                    ),
                    new Container(
                      decoration: new BoxDecoration(
                        shape : BoxShape.circle,
                        border: new Border.all(
                          color: Colors.blue[300],
                          width: 5.0,
                        )
                      ),
                    ),
                    Text(
                      (this._allVehiclesData[i]["fuel"].toString()),
                      style: TextStyle(
                        fontSize: 13.0,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ],
                ) : Text(''),
                this._allVehiclesData[i]["temperature"] != "null" ?
                new Row(
                  children: <Widget>[
                    Text(
                      'Temp :',
                      style: TextStyle(
                        fontSize: 15.0,
                        color: Colors.grey[500],
                      ),
                    ),
                    new Container(
                      decoration: new BoxDecoration(
                        shape : BoxShape.circle,
                        border: new Border.all(
                          color: Colors.red[300],
                          width: 5.0,
                        )
                      ),
                    ),
                    Text(
                      (' '+this._allVehiclesData[i]["temperature"].toString()+'  C'),
                      style: TextStyle(
                        fontSize: 13.0,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ],
                ):Text(""),
              ],
            ),
          ),
          status(i),
          // new InkWell(),
        ],
      ),
    ),
  ),
);

1 个答案:

答案 0 :(得分:1)

您可以将GestureDetector用于同一

通过onTap回调将Container包裹在GestureDetector

GestureDetector(
  // When the child is tapped, do your work
  onTap: () {
    ...
    ...
  },
  // Container
  child: Container(
    ...
  ),
);