Flutter 布局练习之ListTile组件

2019/12/27 18:6:4 | 阅200 来源:好空间网络 [打印] [关闭]
 

ListTile组件一般用于新闻列表或者我的中心这些地方

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      title: "多窗口切换标题",
      home: Scaffold(
        appBar: AppBar(
          title: Text("ListTile布局练习"),
        ),
        body: MyListTile(),
      ),
    );
  }
}

class MyListTile extends StatelessWidget {
  ///ListTile一般用于新闻布局
  ///
  @override
  Widget build(BuildContext context) {
    return  ListView(
      children: ListTile.divideTiles(
        context: context,
        tiles:[
           ListTile(
            //被选中的项他的颜色和主题一致
            selected: true,
            //可以禁止点击事件
            enabled: false,
            leading: Image.network(
                "https://i0.hdslb.com/bfs/archive/ea77044282a72e436b4e19a84737a17b0f7eb5e4.jpg@412w_232h_1c_100q.jpg"),
            title: Text("BUYI | 冬日恋歌妆 | 心机变美日系甜妹 | 超实用日常妆容小技巧1.0!",maxLines: 1,  overflow:TextOverflow.ellipsis,),
            subtitle:Text("B站"),
            trailing:Icon(Icons.keyboard_arrow_right) ,
            onTap: () {
              print("列表被单击了..");
            },
            onLongPress: (){
            print("列表被长按了..");
            },
          ),
          ListTile(
            leading: Image.network(
                "https://i0.hdslb.com/bfs/archive/2dc498c6d8fc86b79a4ec99d33504ba3b5567a66.jpg@412w_232h_1c_100q.jpg"),
            title: Text("独家专访剑网3:沈剑心背后的男人是_____。最强监制怎么说?【哔哔Q第7期】",maxLines: 1,  overflow:TextOverflow.ellipsis,),
            subtitle:Text("B站"),
            trailing:Icon(Icons.keyboard_arrow_right) ,
            onTap: () {
              print("列表被单击了..");
            },
            onLongPress: (){
            print("列表被长按了..");
            },
          )
        ],
      ).toList(),
    );
    
   
  }
}


1:ListTile是个widget可以独立工作,也可以在ListTile.divideTiles之工作,在后者里他会在每个ListTile之间家一道分割线

都比较简单,代码里面一比较详细我就不在多说了,

但是这里要说下注意的地方

如果放到divideTiles里执行,好像必须放listview组件下,而且还需要在后面家说.toList() ,别问我为什么因为我一不知道....

效果图:


QQ图片20191226174025.png

经营许可证ICP:皖B2-20100052 公司邮箱:zcdnsz@jspkongjian.net
Copyright © 2004-2015, 安徽好空间网络科技有限公司 版权所有 , 本站素材部分来源于网络,如有侵权请告知删除。