Flutter 之 ListTite (九十)

1. ListTile

  const ListTile({
    Key? key,
    this.leading,
    this.title,
    this.subtitle,
    this.trailing,
    this.isThreeLine = false,
    this.dense,
    this.visualDensity,
    this.shape,
    this.style,
    this.selectedColor,
    this.iconColor,
    this.textColor,
    this.contentPadding,
    this.enabled = true,
    this.onTap,
    this.onLongPress,
    this.mouseCursor,
    this.selected = false,
    this.focusColor,
    this.hoverColor,
    this.focusNode,
    this.autofocus = false,
    this.tileColor,
    this.selectedTileColor,
    this.enableFeedback,
    this.horizontalTitleGap,
    this.minVerticalPadding,
    this.minLeadingWidth,
  })

2. ListTile 示例

class MSListTileDemo extends StatelessWidget {
  const MSListTileDemo({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("ListTileDemo")),
      body: SingleChildScrollView(
        child: Column(
          children: [
            ListTile(
              leading: Icon(Icons.people), // 左侧组件
              title: Text("标题"), // 标题组件
              subtitle: Text("副标题"), // 副标题
              trailing: Icon(Icons.search), // 右侧组件
              isThreeLine: false, //  是否三行 默认false，为ture时 ,subtitle不可以为空
              dense: false, // 是否使用缩小布局
              visualDensity:
                  VisualDensity(horizontal: -1.0, vertical: -1.0), // 紧凑程度 -4～4
              shape: RoundedRectangleBorder(
                  side: BorderSide(color: Colors.red),
                  borderRadius: BorderRadius.circular(8)), // 形状
              style: ListTileStyle
                  .list, // ListTile 样式  list 使用适合列表的标题字体，drawer 使用适合抽屉的标题字体
              selectedColor: Colors.cyan, // 选中时 组件颜色
              iconColor: Colors.pink[200], // icon 颜色
              textColor: Colors.black87, // 文本颜色
              contentPadding: EdgeInsets.all(8), // 内容内边距
              enabled: true, // 是否可用，默认为 true
              onTap: () {
                print("onTap 1");
              }, // 单击事件 回调
              onLongPress: () {
                print("onLongPress 1");
              }, // 长按事件回调
              selected: false, // 是否选中
              autofocus: false, // 是否自动聚焦
              tileColor: Colors.amber[200], // ListTile颜色
              selectedTileColor: Colors.yellow, // 选中时 ListTile颜色
              enableFeedback: true, // 是否给予按压反馈
              horizontalTitleGap: 16.0, // 标题和左右组件的水平间隔
              minVerticalPadding: 6, // 垂直方向 最小内边距
              minLeadingWidth: 20, // 左侧组件 最小宽度
            ),
            ListTile(
              leading: Icon(Icons.question_mark), // 左侧组件
              title: Text("Flutter"), // 标题组件
              subtitle: Text(
                  "Flutter是Google开源的构建用户界面（UI）工具包，帮助开发者通过一套代码库高效构建多平台精美应用，支持移动、Web、桌面和嵌入式平台。 [5]  Flutter 开源、免费，拥有宽松的开源协议，适合商业项目。Flutter已推出稳定的2.0版本"), // 副标题
              trailing: Icon(Icons.search), // 右侧组件
              isThreeLine: false, //  是否三行 默认false，为ture时 ,subtitle不可以为空
              dense: false, // 是否使用缩小布局
              visualDensity:
                  VisualDensity(horizontal: -1.0, vertical: -1.0), // 紧凑程度 -4～4
              shape: RoundedRectangleBorder(
                  side: BorderSide(color: Colors.red),
                  borderRadius: BorderRadius.circular(8)), // 形状
              style: ListTileStyle
                  .list, // ListTile 样式  list 使用适合列表的标题字体，drawer 使用适合抽屉的标题字体
              selectedColor: Colors.cyan, // 选中时 组件颜色
              iconColor: Colors.pink[200], // icon 颜色
              textColor: Colors.black87, // 文本颜色
              contentPadding: EdgeInsets.all(8), // 内容内边距
              enabled: true, // 是否可用,默认为 true
              onTap: () {
                print("onTap 2");
              }, // 单击事件 回调
              onLongPress: () {
                print("onLongPress 2");
              }, // 长按事件回调
              selected: true, // 是否选中
              autofocus: false, // 是否自动聚焦
              tileColor: Colors.amber[200], // Tile颜色
              selectedTileColor: Colors.yellow, // 选中时 Tile颜色
              enableFeedback: true, // 是否给予按压反馈
              horizontalTitleGap: 16.0, // 标题和左右组件的水平间隔
              minVerticalPadding: 6, // 垂直方向 最小内边距
              minLeadingWidth: 20, // 左侧组件 最小宽度
            ),
          ],
        ),
      ),
    );
  }
}