zoukankan      html  css  js  c++  java
  • 底部导航栏2

    代码:

    import 'package:flutter/material.dart';
    import 'pages/ariplay_screen.dart';
    import 'pages/email_screen.dart';
    import 'pages/home_screen.dart';
    import 'pages/scanner_screen.dart';
    class BottomNavigationWidget extends StatefulWidget {
    _BottomNavigationWidgetState createState() => _BottomNavigationWidgetState();
    }

    class _BottomNavigationWidgetState extends State<BottomNavigationWidget> {
    final _bottomNavColor = Colors.blue;
    int _currentIndex = 0;
    List<Widget> list = List();
    @override
    void initState(){
    list
    ..add(HomeScreen())
    ..add(ScannerScreen())
    ..add(EmailScreen())
    ..add(AirplayScreen());
    super.initState();
     
    }


    @override
    Widget build(BuildContext context) {
    return Scaffold(
    body: list[_currentIndex],
    bottomNavigationBar: BottomNavigationBar(
    items: [
    BottomNavigationBarItem(
    icon: Icon(
    Icons.home,
    color: _bottomNavColor,
    ),
    title: Text(
    'home',
    style: TextStyle(color: _bottomNavColor),
    )
    ),
    BottomNavigationBarItem(
    icon: Icon(
    Icons.email,
    color: _bottomNavColor,
    ),
    title: Text(
    'Email',
    style: TextStyle(color: _bottomNavColor),
    )
    ),
    BottomNavigationBarItem(
    icon: Icon(
    Icons.airplay,
    color: _bottomNavColor,
    ),
    title: Text(
    'Airplay',
    style: TextStyle(color: _bottomNavColor),
    )
    ),
    BottomNavigationBarItem(
    icon: Icon(
    Icons.scanner,
    color: _bottomNavColor,
    ),
    title: Text(
    'Scnner',
    style: TextStyle(color: _bottomNavColor),
    )
    )
     
    ],
    currentIndex: _currentIndex,
    onTap: (int index){
    setState(() {
    _currentIndex = index;
    });
    },
    ),
    );
    }
    }
     
    每个假页面的代码
    import 'package:flutter/material.dart';
    class AirplayScreen extends StatelessWidget {

    @override
    Widget build(BuildContext context) {
    return Scaffold(
    appBar: AppBar(title: Text('Airplay'),),
    body: Center(
    child: Text('Airplay'),
    ),
    );
    }
    }
    总结:
     

    底部导航栏2

    点击导航栏 变换布局

    Ontap:(int index){

    setState(){

    _xxxx = index;/

    }

    }

    //高亮状态的切换

    currentIndex : _xxxx

  • 相关阅读:
    日常问题--解决 ‘Could not fetch URL https://pypi.python.org’的问题
    scrapy(一)--Pycharm创建scrapy项目
    flask常用的第三方插件
    Django model补充(修改自带的user表以及获取单选值get_FOO_display)
    Django form组件应用
    Django auth权限和login_required用法
    flask--Django 基本使用
    Django分页器
    html备忘录
    jQuery备忘录
  • 原文地址:https://www.cnblogs.com/pp-pping/p/12172985.html
Copyright © 2011-2022 走看看