zoukankan      html  css  js  c++  java
  • Flutter中的Wrap组件

    看效果就知道这个wrap的作用了,文字忽略,背景忽略。。。,这个的作用就是其实我们本来的数据是一行的,

    然后一行放不下,就放下面去了,就相当于自动换行那种感觉。

     然后还有各种方向的,但是感觉看起来感觉还行的就这种,毕竟很多软件都用到了这样的


    class Layout extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
    // RaisedButton
    return Container(
    height: 200,
    400,
    color: Colors.deepOrangeAccent,
    child: Wrap(
    //填充满后会自动换行,扩展(所谓的牛布局)
    spacing: 10,
    runSpacing: 10,
    // direction: Axis.vertical, //方向变成垂直排列
    // runAlignment: WrapAlignment.end,
    // alignment: WrapAlignment.end,//右对齐
    children: [
    MyButton("斗罗大陆"),
    MyButton("斗破苍穹"),
    MyButton("霸道总裁爱上我"),
    MyButton("大主宰"),
    MyButton("武动乾坤"),
    MyButton("老婆粉了解一下"),
    MyButton("满级绿茶穿成小可怜"),
    MyButton("你微笑时很美"),
    ],
    ),
    );
    }
    }

    class MyButton extends StatelessWidget {
    final String text;

    const MyButton(this.text, {Key key}) : super(key: key);

    @override
    Widget build(BuildContext context) {
    // TODO: implement build
    return ElevatedButton(
    //raisedButton被弃用了,用这个好像还行,帮助文档说的
    child: Text(
    //研究半天,自己搞会了这个按钮。。。
    this.text,
    style: TextStyle(),
    ),
    style: ButtonStyle(
    foregroundColor: MaterialStateProperty.all(Colors.black),
    backgroundColor: MaterialStateProperty.all(Colors.white),
    side: MaterialStateProperty.all(
    BorderSide(
    1.0,
    color: Colors.lightBlueAccent,
    style: BorderStyle.solid,
    ),
    ),
    ),
    onPressed: () {},
    );
    }
    }

    因为很多组件被弃用了,所以得自己会看这些更新后的组件(我也不会,得摸索下,多看看源码,源码里面的注释非常的详细)

    牛崽成为大牛的发展路途将成为历史的里程碑
  • 相关阅读:
    操作系统演进和未来趋势(附下载)
    用树莓派构建一台服务器,永久运行网站
    用 Docker 构建 MySQL 主从环境
    (一)多线程:线程概述
    网站可访问性的五个自动化测试工具
    个人对前端工程化的理解
    MongoDB安装过程中出现service MongoDB failed to start,verify that you have sufficient privileges to start
    前端开发IDE
    atom插件:js,nodejs,es6补全,高度定制化
    atom离线手动安装atom插件
  • 原文地址:https://www.cnblogs.com/aolong/p/14578664.html
Copyright © 2011-2022 走看看