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

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

这不是无界的滑块。在Expanded（https://docs.flutter.io/flutter/widgets/Expanded-class.html）中包装顶部（间接包含PhotoView的Container）。

我建议不要手动计算高度和宽度的路线，因为通常可以在没有它的情况下实现相同的效果，然后您可以“免费”响应所有动态窗口几何变化（如电话方向变化）。