[Flutter]Table

更新於 發佈於 閱讀時間約 1 分鐘


class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Center(
child: Table(
columnWidths: const <int, TableColumnWidth>{
0: FixedColumnWidth(50.0),
1: FixedColumnWidth(50.0),
},
border: TableBorder.all(
color: Colors.black87, width: 2.0, style: BorderStyle.solid),
children: const <TableRow>[
TableRow(
children: <Widget>[
Text('Name'),
Text('Age'),
],
),
TableRow(
children: <Widget>[
Text('Tom'),
Text('20'),
],
),
],
),
);
}
}

columnWidths為指定索引及固定列宽;border為設定表格樣式。








留言
avatar-img
留言分享你的想法!
avatar-img
小黑與程式的邂逅
8會員
123內容數
嗨,我是一名程式設計師,會在這分享開發與學習紀錄。
2023/12/28
解析成List List items=json.decode(jsonStr); print(items[0]["your_key"]); 解析成Map Map<String, dynamic> user = json.decode(json); print('${user['your_k
Thumbnail
2023/12/28
解析成List List items=json.decode(jsonStr); print(items[0]["your_key"]); 解析成Map Map<String, dynamic> user = json.decode(json); print('${user['your_k
Thumbnail
2023/12/26
這邊會使用WebSocketChannel去與http://www.websocket.org做連線。 連線 final channel = IOWebSocketChannel.connect('wss://echo.websocket.events'); 接收 StreamBui
Thumbnail
2023/12/26
這邊會使用WebSocketChannel去與http://www.websocket.org做連線。 連線 final channel = IOWebSocketChannel.connect('wss://echo.websocket.events'); 接收 StreamBui
Thumbnail
2023/12/26
Dio是一個Dart Http請求庫,支援Restful API、FormData、攔截器、請求取消、Cookie管理、檔案上傳/下載、逾時等。 加入 dependencies: dio: ^x.x.x #请使用pub上的最新版本 使用 GET Response response;
Thumbnail
2023/12/26
Dio是一個Dart Http請求庫,支援Restful API、FormData、攔截器、請求取消、Cookie管理、檔案上傳/下載、逾時等。 加入 dependencies: dio: ^x.x.x #请使用pub上的最新版本 使用 GET Response response;
Thumbnail
看更多
你可能也想看
Thumbnail
2025 vocus 推出最受矚目的活動之一——《開箱你的美好生活》,我們跟著創作者一起「開箱」各種故事、景點、餐廳、超值好物⋯⋯甚至那些讓人會心一笑的生活小廢物;這次活動不僅送出了許多獎勵,也反映了「內容有價」——創作不只是分享、紀錄,也能用各種不同形式變現、帶來實際收入。
Thumbnail
2025 vocus 推出最受矚目的活動之一——《開箱你的美好生活》,我們跟著創作者一起「開箱」各種故事、景點、餐廳、超值好物⋯⋯甚至那些讓人會心一笑的生活小廢物;這次活動不僅送出了許多獎勵,也反映了「內容有價」——創作不只是分享、紀錄,也能用各種不同形式變現、帶來實際收入。
Thumbnail
嗨!歡迎來到 vocus vocus 方格子是台灣最大的內容創作與知識變現平台,並且計畫持續拓展東南亞等等國際市場。我們致力於打造讓創作者能夠自由發表、累積影響力並獲得實質收益的創作生態圈!「創作至上」是我們的核心價值,我們致力於透過平台功能與服務,賦予創作者更多的可能。 vocus 平台匯聚了
Thumbnail
嗨!歡迎來到 vocus vocus 方格子是台灣最大的內容創作與知識變現平台,並且計畫持續拓展東南亞等等國際市場。我們致力於打造讓創作者能夠自由發表、累積影響力並獲得實質收益的創作生態圈!「創作至上」是我們的核心價值,我們致力於透過平台功能與服務,賦予創作者更多的可能。 vocus 平台匯聚了
Thumbnail
這篇內容,將透過實戰教學,介紹GameMaker中的Room。包括Room的簡介、調整寬高、圖層功能的概述、用Object來建立實體。
Thumbnail
這篇內容,將透過實戰教學,介紹GameMaker中的Room。包括Room的簡介、調整寬高、圖層功能的概述、用Object來建立實體。
Thumbnail
此文件的目的是教授 Kotlin 程式語言的運算符,包括算數運算子、比較運算子、賦值運算子、位元運算子以及運算子的優先等級。這將有助於讀者更好地理解和撰寫 Kotlin 程式碼。
Thumbnail
此文件的目的是教授 Kotlin 程式語言的運算符,包括算數運算子、比較運算子、賦值運算子、位元運算子以及運算子的優先等級。這將有助於讀者更好地理解和撰寫 Kotlin 程式碼。
Thumbnail
本課程學習如何實作處理加、減、乘和除按鈕等計算機相關邏輯。
Thumbnail
本課程學習如何實作處理加、減、乘和除按鈕等計算機相關邏輯。
Thumbnail
本課程學習如何提取共同屬性,透過 Style 樣式包,套用至每個按鈕。來提升佈局的可讀性和好維護性。
Thumbnail
本課程學習如何提取共同屬性,透過 Style 樣式包,套用至每個按鈕。來提升佈局的可讀性和好維護性。
Thumbnail
本課程學習如何如何實作計算機介面,佈局文字元件及按鈕。學習使用 LinearLayout 垂直排列元件,調整背景色。透過 GridLayout 佈局計算機按鈕。
Thumbnail
本課程學習如何如何實作計算機介面,佈局文字元件及按鈕。學習使用 LinearLayout 垂直排列元件,調整背景色。透過 GridLayout 佈局計算機按鈕。
Thumbnail
本課程學習如何使用 LinearLayout 線性佈局中的 layout_weight 權重屬性。
Thumbnail
本課程學習如何使用 LinearLayout 線性佈局中的 layout_weight 權重屬性。
Thumbnail
顯示文字 Text('123456') 限制行數 Text('1\n2\n3\n4\n5\n6', maxLines: 2) 顯示樣式 字體大小 Text('123456', style: TextStyle(fontSize: 30)) 字體顏色 Text('12345
Thumbnail
顯示文字 Text('123456') 限制行數 Text('1\n2\n3\n4\n5\n6', maxLines: 2) 顯示樣式 字體大小 Text('123456', style: TextStyle(fontSize: 30)) 字體顏色 Text('12345
Thumbnail
在上一篇文章-跟著KP用21天征服Responsive Layout-W2-Flexbox基礎-flex-item的伸縮 。我們提到了flex-item的width會由自身的內容長度決定。這其實是件很不可控的事情,所以我們在開發上會傾向於對flex-item設置width。 flex-item
Thumbnail
在上一篇文章-跟著KP用21天征服Responsive Layout-W2-Flexbox基礎-flex-item的伸縮 。我們提到了flex-item的width會由自身的內容長度決定。這其實是件很不可控的事情,所以我們在開發上會傾向於對flex-item設置width。 flex-item
Thumbnail
網頁中經常會出現正方形的設計,在切版時如果直接設定固定寬高就是破版的節奏,但單用百分比設定長寬,RWD 時還是會變得不夠正,這邊提供兩個方法:
Thumbnail
網頁中經常會出現正方形的設計,在切版時如果直接設定固定寬高就是破版的節奏,但單用百分比設定長寬,RWD 時還是會變得不夠正,這邊提供兩個方法:
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News