flutter 表格布局

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "table表格布局",
      home: Scaffold(
        appBar: AppBar(
          title: Text("table"),
        ),
        body: Center(
          child: Table(
            //设置表格有多少列,并制定列宽
            columnWidths: const <int, TableColumnWidth>{
              //指定索引及固定列宽
              0: FixedColumnWidth(100.0),
              1: FixedColumnWidth(40.0),
              2: FixedColumnWidth(80.0),
              3: FixedColumnWidth(80.0),
            },

            //设置表格边框样式
            border: TableBorder.all(
                color: Colors.black26, width: 2.0, style: BorderStyle.solid),
            children: const <TableRow>[
              TableRow(children: <Widget>[
                Text('姓名'),
                Text('性别'),
                Text('年龄'),
                Text('体重'),
              ]),
              TableRow(children: <Widget>[
                Text('小红'),
                Text('女'),
                Text('20'),
                Text('50'),
              ]),
              TableRow(children: <Widget>[
                Text('小强'),
                Text('男'),
                Text('20'),
                Text('50'),
              ]),
            ],
          ),
        ),
      ),
    );
  }
}
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容