下面的代碼負責顯示設備的特性(為了方便演示,我把代碼縮短了,但我的問題的本質是可見的。)。這很簡單。告訴我如何添加我在照片中用紅色標記的線條。正好是這個長度,并且與文本的距離正好是這個距離。
return Scaffold(
body: Align(
alignment: Alignment.topCenter,
child: Container(
constraints: BoxConstraints(maxWidth: 800, maxHeight: 300),
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(5.0),
),
child: SingleChildScrollView(
child: Card(
child: Column(
children: [
ListTile(
title: const Text('Brand:', style: TextStyle(fontWeight: FontWeight.w400, fontSize: 25)),
trailing: Text('${device.brand} ', style: const TextStyle(fontWeight: FontWeight.w400, fontSize: 20 ))),
ListTile(
title: const Text('Operation system:', style: TextStyle(fontWeight: FontWeight.w400, fontSize: 25)),
trailing: Text('${device.operation_system} ', style: const TextStyle(fontWeight: FontWeight.w400, fontSize: 20 ))),
],),)))));}}

uj5u.com熱心網友回復:
您可以在小部件Divider之間使用ListTile。
ListTile(..),
Divider(color: Colors.red, endIndent: 16, indent: 16), // THIS
ListTile(...)
雖然使用 contentPadding: EdgeInsets.zeroon后它也會有一些空格ListTile,但我們可以使用Transform.translateon Divider。
Transform.translate(
offset: Offset(0, -18), //adjust based on your need
child: Divider(...)
如果您使用Containerfor 分隔符,您還將獲得transfom
Container(
transform: Matrix4.translationValues(0, -16, 0),
....
),
更多關于 Transform.translate。您還可以檢查ListView.separated。
uj5u.com熱心網友回復:
我們也可以使用Container 顏色
Container(height: 1, color: Colors.grey)
喜歡
ListTile(
leading: Icon(Icons.home),
title: Text('Home'),
),
Container(height: 1, color: Colors.grey), //divider
ListTile(
leading: Icon(Icons.logout),
title: Text('Logout'),
),
中Divider不可用 cupertino.dart。因此,即使這樣,我們也可以使用相同的 Container 技術ListView.separated:
ListView.separated(
itemCount: 100,
itemBuilder: (context, index) {
return row;
},
separatorBuilder: (context, index) {
return Container(
height: 1,
color: Styles.productRowDivider, // Custom style
);
},
);
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/439363.html
