Question

我正在尝试布局两个小部件。顶部是PhotoView，底部是滑块。我需要滑块占用尽可能多的空间，其余的要由PhotoView占用。

我尝试使用Column类包装所有内容。


 @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: GestureDetector(
          onTapDown: (TapDownDetails details) {print("Tapped");}),
          child: Column(children: [
            Container(
                child: Center(
              child: Container(
                  margin: EdgeInsets.fromLTRB(10, 0, 10, 0),
                  child: Container(
                    child: hasPermission
                        ? PhotoView(
                            imageProvider:
                                FileImage(filename)),
                          )
                        : Text("Waiting"),
                  )),
            )),
            Slider(
              min: 0,
              max: 10,
              value: 5,
              onChanged: (double value) {
                print(value);
              },
            ),
          ])),
    );
  }

问题在于它在底部溢出，并显示“底部被无限像素所覆盖”。

我怀疑原因是PhotoView是不受限制的，列也是如此，但是我需要PhotoView受视图高度（滑块高度）的限制。

Answer 1

不是无限的滑块。将顶部（间接包含PhotoView的容器）包裹在扩展（https://docs.flutter.io/flutter/widgets/Expanded-class.html）中。

我建议不要手动计算高度和宽度，因为没有它通常可以达到相同的效果，然后您可以“免费”对所有动态窗口几何形状变化（例如更改手机方向）做出反应。 / p>

如何在边框中安排边框布局？

1 个答案: