zoukankan      html  css  js  c++  java
  • Flutter之解决页面底部黄色条纹的方法

    用Flutter写页面时,有时页面内容太多,底部会出现黄色条纹。

    解决方法:在组件外增加一层ListView即可。

    如将代码:

    body: Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Image.asset('assets/images/gameover.png', 100,height: 100,),
            Container(
              child:Text('游戏结束',style: TextStyle(
                fontSize: 40,
                color: Colors.green
                ),
              ),
              margin: const EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 20.0),
            ),
            Container(
              child:Text('您的分数为:${_score}',style: TextStyle(
                fontSize: 40,
                color: Colors.green
                ),
              ),
              margin: const EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 50.0),
            ),
            Container(
              child:Text('开始时间为:${_time}',style: TextStyle(
                fontSize: 40,
                color: Colors.green
                ),
              ),
              margin: const EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 50.0),
            ),
            Container(
              child:Text('结束时间为:${_endTime}',style: TextStyle(
                fontSize: 40,
                color: Colors.green
                ),
              ),
              margin: const EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 50.0),
            ),
            RaisedButton(
              onPressed: (){
                Navigator.pop(context,true);
              },
              textColor: Colors.white,
              clipBehavior: Clip.hardEdge,
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.all(Radius.circular(22.0))),
                padding: const EdgeInsets.all(0.0),
                child: Container(
                   260,
                  height: 44,
                  decoration: const BoxDecoration(
                    gradient: LinearGradient(
                      colors: <Color>[
                        Color(0xff25D1D1),
                        Color(0xff3BE6AD),
                        Color(0xff20DDAA)
                      ],
                    ),
                  ),
                  padding: const EdgeInsets.all(10.0),
                  child: Container(
                    alignment: Alignment.center,
                    child: Text('重新开始游戏')),
                ),
            )
          ],
      )
    )

    改成

    body: Center(
      child: ListView(
        children:[
          Column(
            mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Image.asset('assets/images/gameover.png', 100,height: 100,),
                Container(
                  child:Text('游戏结束',style: TextStyle(
                    fontSize: 40,
                    color: Colors.green
                    ),
                  ),
                  margin: const EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 20.0),
                ),
                Container(
                  child:Text('您的分数为:${_score}',style: TextStyle(
                    fontSize: 40,
                    color: Colors.green
                    ),
                  ),
                  margin: const EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 50.0),
                ),
                Container(
                  child:Text('开始时间为:${_time}',style: TextStyle(
                    fontSize: 40,
                    color: Colors.green
                    ),
                  ),
                  margin: const EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 50.0),
                ),
                Container(
                  child:Text('结束时间为:${_endTime}',style: TextStyle(
                    fontSize: 40,
                    color: Colors.green
                    ),
                  ),
                  margin: const EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 50.0),
                ),
                RaisedButton(
                  onPressed: (){
                    Navigator.pop(context,true);
                  },
                  textColor: Colors.white,
                  clipBehavior: Clip.hardEdge,
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.all(Radius.circular(22.0))),
                    padding: const EdgeInsets.all(0.0),
                    child: Container(
                       260,
                      height: 44,
                      decoration: const BoxDecoration(
                        gradient: LinearGradient(
                          colors: <Color>[
                            Color(0xff25D1D1),
                            Color(0xff3BE6AD),
                            Color(0xff20DDAA)
                          ],
                        ),
                      ),
                      padding: const EdgeInsets.all(10.0),
                      child: Container(
                        alignment: Alignment.center,
                        child: Text('重新开始游戏')),
                    ),
                )
              ],
          )
        ]
      )
    )

    效果为:

  • 相关阅读:
    [原创]RTX使用printf输出后进入hardfault中断的处理方法
    [原创]单片机 HexToStr and HexToBcd BcdToStr
    [原创]单片机-HexToStr or HexToAsc
    再看 AspriseOCR
    [源创] STM32F103ZET6 基于XMODEM 通讯的 BOOTLOADER案列IAP
    单片机串口——如何判定接收一帧数据的完成
    [原创] 关于步科eview人机界面HMI的使用
    [原创] STM32 定时器TIMx 编码器应用 函数 TIM_EncoderInterfaceConfig 分析
    单片机的 HexToStr HexToBcd BcdToStr 几个转换函数
    [转载] 全局键盘钩子(WH_KEYBOARD)
  • 原文地址:https://www.cnblogs.com/luoyihao/p/14718665.html
Copyright © 2011-2022 走看看