Question

我想为我的应用设置一个静态的底部栏。此栏应显示中间设备的小时数，而右边显示另一设备读取的温度。

here is an example of what I want

我的问题只是定位/大小。

当我启动它（使用android studio，在真实或虚拟设备上）时，它不起作用：预览不是我所需要的，我选择的尺寸似乎已经改变。

preview when I start on a device

但是当我热重新加载它时，它就变成了我想要的样子：

while hot-reloading 问题在于最终的应用不是热加载的应用。.

我可能已经确定问题所在，我使用MediaQuery.of（context）.size和一个生成器来获取上下文，以适合所有考虑大小的设备。此解决方案一定是肮脏的，但我什么也找不到。

这是我的代码，希望情况清楚...

return new MediaQuery(
    data: MediaQueryData.fromWindow(ui.window),
    child: Builder(
        builder: (context) {
          return  new Builder(
              builder: (
                  context) {
                return
                new MaterialApp(
                    home: new DefaultTabController(
                      length: 6,
                      child: Scaffold(
                        bottomNavigationBar:



                          new Container(
                            color: Colors.white,
                            width: MediaQuery.of(context).size.width,
                            height: MediaQuery.of(context).size.height*0.1,
                            alignment: Alignment.centerRight,
                            child: new Container(
                                      color: Colors.blue,
                                      width: MediaQuery.of(context).size.width* 2/3,
                                      alignment: Alignment.centerRight,
                                      child: new Row(
                                                children: <Widget>[
                                                  new Expanded(child: new Container(
                                                    color : Colors.yellow,
                                                    child: new Text('22 : 22' ),
                                                    alignment: Alignment.center,
                                                  )),
                                                  new Expanded(child:new Container(
                                                    color: Colors.pink,
                                                    child: new Text(' 37.8 °C'),
                                                    margin: new EdgeInsets.all(MediaQuery.of(context).size.width*0.02),
                                                    alignment: Alignment.centerRight,
                                                  ))
                                                ],
                                              ),
                                    ),


                          ),

感谢您的帮助。

Answer 1

您可以使用Stack并将其中一个窗口小部件绝对放置在另一个窗口之上：

new Stack(
    children: <Widget> [
        new Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget> [
                new Text(time),
            ],
        ),
        new Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: <Widget> [
                new Text(temperature)
            ],
        ),
    ],
),

其中time和temperature是在状态（Stateful Widgets)中设置的变量。然后将其包括在bottomNavigationBar中。

Answer 2

我最终将我以前的代码添加到StatelessWidget中，并在bottomNavigationBar的{{1}}字段中调用它：它可以完成工作。

然后我在创建的Scaffold中调用MediaQuery.of（context）

谢谢。

bottomNavigationBar只能在热重载时做我想要的

2 个答案: