瞎扯
大年三十,新年快乐.
趁着春晚唱歌的时间,瞎写一点.过年期间只能保持不断,算是写个标题,定个目录吧
PageView
直接看代码:
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => new _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _selectPage = 0;
var _page = [
new UserPager(),
new GoodsPage(),
new UserPager(),//目前就写了2个页面.这个凑个数
];
var _bottom = [
new BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text('首页'),
),
new BottomNavigationBarItem(
icon: Icon(Icons.shop),
title: Text('2'),
),
new BottomNavigationBarItem(
icon: Icon(Icons.people),
title: Text('3'),
)
];
var _pageController = new PageController(initialPage: 0);
void _bottomSelect(index) {
_pageController.animateToPage(index,
duration: new Duration(milliseconds: 1000), curve: Curves.ease);
}
void _onPageChanged(index) {
setState(() {
_selectPage = index;
});
}
///主体内容
Widget body() => PageView.builder(
onPageChanged: _onPageChanged,
controller: _pageController,
itemBuilder: (BuildContext context, int index) {
return _page[index];
},
itemCount: _page.length,
);
///浮动按钮
Widget float() => new FloatingActionButton(
tooltip: 'Increment',
child: new Icon(Icons.add),
onPressed: () {
Navigator.pushNamed(context, '123');
},
);
@override
Widget build(BuildContext context) {
return new Scaffold(
body: body(),
floatingActionButtonLocation: FloatingActionButtonLocation.endFloat,
floatingActionButton: float(),
bottomNavigationBar: new BottomNavigationBar(
items: _bottom,
onTap: _bottomSelect,
currentIndex: _selectPage,
));
}
}
和Listview一样.也是使用的PageView.builder.
用这个也是一样.为了动态创建,这里我是写死了.
controller
这个就相当于控制页面显示的.比如跳转到第几页之类的.
看名字就知道.控制器的意思.常说的MVC中的C
_pageController.animateToPage(index,
duration: new Duration(milliseconds: 1000), curve: Curves.ease);
三个参数:index
第几页,duration
动画时间,curve
加速器类型;
onPageChanged
这个就和android一样,页面切换时 的回调,
好了.就到这里
用起来还是很简单的.
就目前Flutter更的这些就已经能写一个简单的APP了.哈哈
网友评论