• ListView


    列表使用

    body: new ListView(
              children: <Widget>[
                /*new Image.network(
                    'https://cdn2.jianshu.io/assets/web/banner-s-club-aa8bdf19f8cf729a759da42e4a96f366.png'),
                new Image.network(
                    'https://cdn2.jianshu.io/assets/web/banner-s-7-1a0222c91694a1f38e610be4bf9669be.png'),
                 */ //图片列表使用
                new ListTile(
                  leading: new Icon(
                    Icons.perm_camera_mic,
                  ),
                  title: new Text('perm_camera_mic'),
                ),
                new ListTile(
                  leading: new Icon(
                    Icons.perm_phone_msg,
                  ),
                  title: new Text('perm_phone_msg'),
                ),
              ],
            ),

    横向列表:ListView组件里加一个scrollDirection属性

    body: new Center(
                child: new Container(
                    height: 200.0,
                    child: new ListView(
                      scrollDirection: Axis.horizontal, //Axis.vertical:纵向列表
                      children: <Widget>[
                        new Container(
                           230.0,
                          color: Colors.lightBlue,
                        ),
                        new Container(
                           230.0,
                          color: Colors.lightGreen,
                        ),
                      ],
                    ))),

    Dart语言List的声明方式:

    • var myList = List(): 非固定长度的声明。
    • var myList = List(2): 固定长度的声明。
    • var myList= List<String>():固定类型的声明方式。
    • var myList = [1,2,3]: 对List直接赋值
    import 'package:flutter/material.dart';
    
    void main() =>
        runApp(MyApp(items: List<String>.generate(1000, (i) => 'item $i')));
    
    class MyApp extends StatelessWidget {
      final List<String> items;
      MyApp({Key key, @required this.items}) : super(key: key);
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'ListView Dome',
          home: new Scaffold(
            appBar: new AppBar(title: new Text('ListView Widget')),
            body: new ListView.builder(
                itemCount: items.length,
                itemBuilder: (context, index) {
                  return new ListTile(
                    title: new Text('${items[index]}'),
                  );
                }),
          ),
        );
      }
    }
  • 相关阅读:
    前端开发-学习资料库
    前端数据校验从建模开始
    让 Markdown 中的代码可以实时运行
    小而美的 React Form 组件
    React 实现一个漂亮的 Table
    RSuite 一个基于 React.js 的 Web 组件库
    管理系统的前端解决方案:Pagurian V1.3发布
    selenium java 自动化测试 基于火狐浏览器/谷歌浏览器
    java从ldap中导出数据到ldif文件中
    根据官方文档搭建springcloud之eureka
  • 原文地址:https://www.cnblogs.com/timba1322/p/12486562.html
Copyright © 2020-2023  润新知