如何在颤动中垂直扩展容器小部件

Question

试图扩展Expanded或Container 垂直以使其height与Row小部件height匹配，这是我的代码

    @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: ()=> onDepartClicked(),
      child: Container(
        padding: EdgeInsets.all(16),
        child: Card(
          child: Row(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Expanded(
                flex: 8,
                child: Padding(
                  padding: EdgeInsets.all(16),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      Text(department.name,
                        overflow: TextOverflow.visible,
                        style: TextStyle(fontSize: 20),
                      ),
                      Container(
                        margin: EdgeInsets.only(top: 8),
                        child: Row(
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: <Widget>[
                            Image.asset("assets/images/feedback.png", width: 20, height: 20,),
                            SizedBox(width: 4,),
                            Text(department.phone),
                            SizedBox(width: 16,),
                            Image.asset("assets/images/feedback.png", width: 20, height: 20,),
                            SizedBox(width: 4,),
                            Text(department.type),
                          ],
                        ),
                      ),
                      Container(margin: EdgeInsets.symmetric(vertical: 8),child: Divider(height: 0.3, color: Colors.grey,)),
                      Container(
                        child: Text(department.description,
                          maxLines: 3,
                          style: TextStyle(fontSize: 13),
                        ),
                      )
                    ],
                  ),
                ),
              ),
              Container(
                width: 40,
                decoration: BoxDecoration(
                    color: Colors.blue,
                    borderRadius: BorderRadius.only(topRight: Radius.circular(4), bottomRight: Radius.circular(4))
                ),
                child: Column(
                  mainAxisSize: MainAxisSize.max,
                  children: <Widget>[
                    Image.asset("assets/images/feedback.png",
                      width: 20,
                      height: 20,
                      fit: BoxFit.scaleDown,
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

我想在上面的代码中扩展此块（Row的第二个子代：]

Container(
            width: 40,
            decoration: BoxDecoration(
                color: Colors.blue,
                borderRadius: BorderRadius.only(topRight: Radius.circular(4), bottomRight: Radius.circular(4))
            ),
            child: Column(
              mainAxisSize: MainAxisSize.max,
              children: <Widget>[
                Image.asset("assets/images/feedback.png",
                  width: 20,
                  height: 20,
                  fit: BoxFit.scaleDown,
                ),
              ],
            ),
          ),

我想通过在父级中垂直扩展蓝色区域来实现此视图

Answer 1

将容器以height：double.infinity包裹在SizedBox中，以使其占用所有可用空间，在您情况下为行的高度。

Expanded(
            child: SizedBox(
               height:double.infinity,
               child:Container(
                  decoration: BoxDecoration(
                     color: Colors.blue,
                     borderRadius: BorderRadius.only(topRight: Radius.circular(4), bottomRight: Radius.circular(4))
                     ),
                  child: Image.asset("assets/images/feedback.png", width: 20, height: 20, fit: BoxFit.scaleDown,),
                  ),
              ),
          )