Flutter启动欢迎页之intro_slider

简介

• intro_slider是Flutter一个应用启动欢迎页面的插件，能够帮助你介绍你的应用，以显示你的应用程序的主要功能， 你能够更改图像，按钮，文本样式，颜色等，建立介绍屏幕从未如此简单快捷

• 目前官方版本是intro_slider 1.2.0

• intro_slider插件地址：pub.dartlang.org/packages/in…

• 本文具体效果能够查看个人github玩安卓项目：github.com/ngu2008/wan…

如何使用

• 先看效果图

• 具体使用

class SplashScreen extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new SplashScreenState() ;
  }
}
class SplashScreenState extends State<SplashScreen> {
  List<Slide> slides = new List();
  @override
  void initState() {
    super.initState();
    slides.add(
      new Slide(
        title: "Flutter",
        description:
        "Flutter是谷歌的移动UI框架，能够快速在iOS和Android上构建高质量的原生用户界面。 Flutter能够与现有的代码一块儿工做。在全世界，Flutter正在被愈来愈多的开发者和组织使用，而且Flutter是彻底免费、开源的。",
        styleDescription: TextStyle(
            color: Colors.white,
            fontSize: 20.0,
            fontFamily: 'Raleway'),
        marginDescription: EdgeInsets.only(left: 20.0, right: 20.0, top: 20.0, bottom: 70.0),
        colorBegin: Color(0xffFFDAB9),
        colorEnd: Color(0xff40E0D0),
        directionColorBegin: Alignment.topLeft,
        directionColorEnd: Alignment.bottomRight,
      ),
    );
    slides.add(
      new Slide(
        title: "Wanandroid",
        description:
        "这是一款使用Flutter写的WanAndroid客户端应用，在Android和IOS都完美运行,能够用来入门Flutter，简单明了，适合初学者,项目彻底开源，若是本项目确实可以帮助到你学习Flutter，谢谢start，有问题请提交Issues,我会及时回复。",
        styleDescription: TextStyle(
            color: Colors.white,
            fontSize: 20.0,
            fontFamily: 'Raleway'),
        marginDescription: EdgeInsets.only(left: 20.0, right: 20.0, top: 20.0, bottom: 70.0),
        colorBegin: Color(0xffFFFACD),
        colorEnd: Color(0xffFF6347),
        directionColorBegin: Alignment.topLeft,
        directionColorEnd: Alignment.bottomRight,
      ),
    );
    slides.add(
      new Slide(
        title: "Welcome",
        description:
        "赠人玫瑰，手有余香；\n分享技术，传递快乐。",
        styleDescription: TextStyle(
            color: Colors.white,
            fontSize: 20.0,
            fontFamily: 'Raleway'),
        marginDescription: EdgeInsets.only(left: 20.0, right: 20.0, top: 20.0, bottom: 70.0),
        colorBegin: Color(0xffFFA500),
        colorEnd: Color(0xff7FFFD4),
        directionColorBegin: Alignment.topLeft,
        directionColorEnd: Alignment.bottomRight,
      ),
    );
  }
  void onDonePress() {
    _setHasSkip();
    Navigator.of(context).pushAndRemoveUntil(
        new MaterialPageRoute(
            builder: (context) => App()),
            (route) => route == null);
  }
  
  void _setHasSkip ()async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    await prefs.setBool("hasSkip", true);
  }
  @override
  Widget build(BuildContext context) {
    return IntroSlider(
        slides: this.slides,
      onDonePress: this.onDonePress,
      nameSkipBtn: "跳过",
      nameNextBtn: "下一页",
      nameDoneBtn: "进入",
    );
  }
}
复制代码

• 舒适提示:欢迎访问个人Github主页，有更多Flutter相关资料；
• 本文为个人原创文章，未经容许，不得转载！