ITPub博客

首页 > 应用开发 > Java > 视频聊天系统源码PageView滑动视图-Flutter

视频聊天系统源码PageView滑动视图-Flutter

原创 Java 作者:zhibo系统开发 时间:2020-07-29 14:10:36 0 删除 编辑
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main()=>runApp(MaterialApp(
  home: MyApp(),
));
//创建一个PageController,方便使用底部导航栏改变PageView的内容
PageController _pageController = new PageController();
int _curIndex = 0;//当前索引
//纯色页面,用Page类构造函数批量生成
var pages = <Widget>[
  Page(Colors.orange),
  Page(Colors.purple),
  Page(Colors.green)
];
class Page extends StatelessWidget {
  Color c;
  Page(this.c);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(color: c,),
    );
  }
}
class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("滑动"),
      ),
      //PageView滑动界面 []
      body: PageView.builder(
        controller: _pageController,
        itemBuilder: (context,index) => pages[index],
        itemCount: pages.length,
        //当滑动的时候改变当前索引,并刷新界面
        onPageChanged: (index){
          setState(() {
            _curIndex = index;
          });
        },
      ),
      //创建底部导航栏
      bottomNavigationBar: BottomNavigationBar(
        items: [
          BottomNavigationBarItem(
            title: Text("Orange"),
            icon:Icon(Icons.star)
          ),
          BottomNavigationBarItem(
            title: Text("Purple"),
            icon:Icon(Icons.star)
          ),
          BottomNavigationBarItem(
              title: Text("Green"),
              icon:Icon(Icons.star)
          )
        ],
        currentIndex: _curIndex,
          //在导航栏中利用Controller改变PageView
        onTap: (index){
          _pageController.jumpToPage(index);
        }
      ),
    );
  }
}


来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/69978258/viewspace-2707730/,如需转载,请注明出处,否则将追究法律责任。

请登录后发表评论 登录
全部评论

注册时间:2020-07-02

  • 博文量
    250
  • 访问量
    105464