我正在使用列來顯示 2 個文本。第一個文本代表標題，第二個文本顯示參考。我正在嘗試使用 max lines 屬性將參考文本拆分為多行，但文本與其他專案重疊。我嘗試使用 Expanded 和靈活的屬性來克服這個問題，但仍然沒有得到想要的輸出。這就是我想要做的：
Container(
color: Color(0xff1D1D1D),
width: double.maxFinite,
height: responsivness.safeBlockVertical! * 54.55,
// Stories Title
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: Text("Stories",
style: Theme.of(context).textTheme.headline1!),
),
// list of Stories
Expanded(
child: ListView.builder(
itemCount: 5,
shrinkWrap: true,
scrollDirection: Axis.horizontal,
itemBuilder: (context, index) {
return Stack(
clipBehavior: Clip.none,
children: [
Padding(
padding: EdgeInsets.all(h * .014),
child: Container(
width:
responsivness.safeBlockHorizontal! *
47,
height:
responsivness.safeBlockVertical! *
17,
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(10),
color: Colors.amber,
),
),
),
Positioned(
top: h * .19,
left: h * .016,
child: Column(
mainAxisAlignment:
MainAxisAlignment.start,
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
"Steve H.",
style: Theme.of(context)
.textTheme
.headline1!,
),
Text(
"I bet away my house and all the money i got",
style: Theme.of(context)
.textTheme
.bodyText2!,
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
],
),
),
],
);
},
),
),
],
),
),
uj5u.com熱心網友回復：
由于 Stack 小部件，您的文本重疊。您可以將文本包裹在一個大小的框中以提供固定寬度，或者您可以洗掉Stack小部件并使用 Column 代替。我在這里沒有發現堆疊的任何特殊用途，因此您可能可以毫無問題地將其洗掉。
uj5u.com熱心網友回復：
試試下面的代碼希望它對你有幫助。我認為問題來自Stack小部件，因此洗掉您的Stack和Positioned Widget，并使用Column()小部件代替。
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: Text("Stories",
style: Theme.of(context).textTheme.headline1!),
),
// list of Stories
Expanded(
child: ListView.builder(
itemCount: 5,
shrinkWrap: true,
scrollDirection: Axis.horizontal,
itemBuilder: (context, index) {
return Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
width: 200,
height: 100,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.amber,
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Steve H.",
),
Text(
"I bet away my house and all the money i got",
style: Theme.of(context).textTheme.bodyText2!,
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
],
),
),
],
);
},
),
),
],
),
),
您的結果螢屏-> 
uj5u.com熱心網友回復：
嘗試Text用固定的寬度包裹你的重疊SizedBox，看看它是否能解決你的問題。
uj5u.com熱心網友回復：
嘗試用容器包裝并指定任何寬度
Container(
width: 100,
child: Text(
"I bet away my house and all the money i got",
style: Theme.of(context).textTheme.subtitle1,
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
),
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/339513.html