Flutter 如何在PageView中的页面之间留出一些空间(边距/填充)?
我正在使用Flutter 如何在PageView中的页面之间留出一些空间(边距/填充)?,flutter,dart,Flutter,Dart,我正在使用PageView.builder创建页面 PageView.builder( itemCount: _pagesList.length, itemBuilder: (BuildContext context, int index) { return Container( color: _pagesList[index], );
PageView.builder
创建页面
PageView.builder(
itemCount: _pagesList.length,
itemBuilder: (BuildContext context, int index) {
return Container(
color: _pagesList[index],
);
}
)
我目前拥有的:
我想要的是:
i、 e.我想在页面之间提供一些填充
(在滚动页面时)
原因:我将在这些页面中显示图像,由于图像将覆盖每页的整个宽度,因此滚动页面时看起来不太好看,因为它们是编织在一起的,如下所示:
如何解决此问题?尽最大努力:
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
home: Scaffold(
body: MyPageView()
)
);
}
}
class MyPageView extends StatefulWidget {
MyPageView({Key key}) : super(key: key);
_MyPageViewState createState() => _MyPageViewState();
}
class _MyPageViewState extends State<MyPageView> {
@override
Widget build(BuildContext context) {
return PageView(
children: <Widget>[
Container(
color: Colors.black,
child: Card(
color: Colors.red,
)
),
Container(
color: Colors.black,
child: Card(
color: Colors.blue,
),
),
Container(
color: Colors.black,
child: Card(
color: Colors.green,
),
),
],
);
}
}
导入“包装:颤振/材料.省道”;
void main()=>runApp(MyApp());
类MyApp扩展了无状态小部件{
//此小部件是应用程序的根。
@凌驾
小部件构建(构建上下文){
返回材料PP(
标题:“颤振演示”,
家:脚手架(
正文:MyPageView()
)
);
}
}
类MyPageView扩展了StatefulWidget{
MyPageView({Key}):超级(Key:Key);
_MyPageViewState createState()=>\u MyPageViewState();
}
类_MyPageViewState扩展状态{
@凌驾
小部件构建(构建上下文){
返回页面视图(
儿童:[
容器(
颜色:颜色,黑色,
孩子:卡片(
颜色:颜色,红色,
)
),
容器(
颜色:颜色,黑色,
孩子:卡片(
颜色:颜色,蓝色,
),
),
容器(
颜色:颜色,黑色,
孩子:卡片(
颜色:颜色。绿色,
),
),
],
);
}
}
在github上添加了一个功能请求:虽然没有多大区别:(请格式化您提供的代码,以便更好地阅读。另外,以一些介绍词的形式进行一些解释也很好。
PageController imagesController =
PageController(initialPage: 0, viewportFraction: 1.1);
PageView(
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: EdgeInsets.only(left: 10, right: 10),
child: Container(
color: _pagesList[index],
),
);
}
),