在 Flutter 中放置一个 Sized 框以在列表视图构建器和 AppBar 之间添加一个小部件
Put a Sized box to add a widget between List view buiilder and AppBar in flutter
这可能非常简单,但我只是想不出如何在列表视图生成器和应用栏之间放置一个小部件。这是我正在使用的代码。
body: Padding(
padding: const EdgeInsets.all(8.0),
child: ScrollWrapper(
promptAlignment: Alignment.bottomRight,
promptTheme: const PromptButtonTheme(
icon: Icon(
Icons.arrow_upward_rounded,
color: Colors.white,
size: 20,
),
color: Colors.black87,
),
builder: (context, properties) => ListView.builder(
itemCount: 20,
itemBuilder: (BuildContext context, int index) {
return Container(
height: 500,
margin: EdgeInsets.symmetric(
horizontal: width > 700 ? width * 0.2 : 8,
vertical: 6,
),
child: PostCard(),
);
},
),
),
),
我尝试将 ScrollWrapper 放入列中并添加了大小框来调用我的小部件,但它不起作用。
这是我想要的布局图。
谁能指出我哪里错了?
不确定是否得到你想要做的,但如果你只是想在你的应用栏和你的滚动包装器之间放置一些空白 space 你可以通过改变
来增加顶部填充
padding: const EdgeInsets.all(8.0),
至
padding: const EdgeInsets.fromLTRB(8, 20, 8, 8),
你觉得这有意义吗?
您是否尝试过将 ScrollWrapper 包装在展开的内容中,然后将其放在列中。下面是 Column 中的 listView 及其上方的大小框的示例。
Widget build(BuildContext context) {
return Scaffold(
extendBody: true,
appBar: AppBar(),
body: Column(
children: [
SizedBox(width: MediaQuery.of(context).size.width, height: 200,),
Expanded(
child: ListView(children: <Widget>[
Container(
height: 50,
color: Colors.amber[600],
child: const Center(child: Text('Entry A')),
),
Container(
height: 50,
color: Colors.amber[500],
child: const Center(child: Text('Entry B')),
),
Container(
height: 50,
color: Colors.amber[100],
child: const Center(child: Text('Entry C')),
),
],),
),
],
)
);
}
这可能非常简单,但我只是想不出如何在列表视图生成器和应用栏之间放置一个小部件。这是我正在使用的代码。
body: Padding(
padding: const EdgeInsets.all(8.0),
child: ScrollWrapper(
promptAlignment: Alignment.bottomRight,
promptTheme: const PromptButtonTheme(
icon: Icon(
Icons.arrow_upward_rounded,
color: Colors.white,
size: 20,
),
color: Colors.black87,
),
builder: (context, properties) => ListView.builder(
itemCount: 20,
itemBuilder: (BuildContext context, int index) {
return Container(
height: 500,
margin: EdgeInsets.symmetric(
horizontal: width > 700 ? width * 0.2 : 8,
vertical: 6,
),
child: PostCard(),
);
},
),
),
),
我尝试将 ScrollWrapper 放入列中并添加了大小框来调用我的小部件,但它不起作用。
这是我想要的布局图。
谁能指出我哪里错了?
不确定是否得到你想要做的,但如果你只是想在你的应用栏和你的滚动包装器之间放置一些空白 space 你可以通过改变
来增加顶部填充padding: const EdgeInsets.all(8.0),
至
padding: const EdgeInsets.fromLTRB(8, 20, 8, 8),
你觉得这有意义吗?
您是否尝试过将 ScrollWrapper 包装在展开的内容中,然后将其放在列中。下面是 Column 中的 listView 及其上方的大小框的示例。
Widget build(BuildContext context) {
return Scaffold(
extendBody: true,
appBar: AppBar(),
body: Column(
children: [
SizedBox(width: MediaQuery.of(context).size.width, height: 200,),
Expanded(
child: ListView(children: <Widget>[
Container(
height: 50,
color: Colors.amber[600],
child: const Center(child: Text('Entry A')),
),
Container(
height: 50,
color: Colors.amber[500],
child: const Center(child: Text('Entry B')),
),
Container(
height: 50,
color: Colors.amber[100],
child: const Center(child: Text('Entry C')),
),
],),
),
],
)
);
}