Flutter-Sliver列表内的Sliver Layout水平滚动
问题内容:
我尝试在 Sliver List(CustomScrollview-SliverList)中* 制作水平可滚动列表 *
这是我的代码:
import 'package:flutter/material.dart';
class DetailScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomScrollView(
slivers: <Widget>[
DetailAppBar(),
SliverPadding(
padding: EdgeInsets.all(16.0),
sliver: SliverList(
delegate: SliverChildListDelegate(
[
Card(child: Text('data'),),
Card(child: Text('data'),),
Card(child: Text('data'),),
Card(child: Text('data'),),
// Scrollable horizontal widget here
],
),
),
),
],
),
bottomNavigationBar: NavigationButton());
}
}
您能给我例子或解决方案吗?我真的需要一些帮助。
问题答案:
使用的ListView
内部SliverToBoxAdapter
。
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomScrollView(
slivers: <Widget>[
SliverPadding(
padding: EdgeInsets.all(16.0),
sliver: SliverList(
delegate: SliverChildListDelegate(
[
Card(
child: Text('data'),
),
Card(
child: Text('data'),
),
Card(
child: Text('data'),
),
Card(
child: Text('data'),
),
],
),
),
),
SliverToBoxAdapter(
child: Container(
height: 100.0,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: 10,
itemBuilder: (context, index) {
return Container(
width: 100.0,
child: Card(
child: Text('data'),
),
);
},
),
),
),
],
),
);
}