反照微信例子页面 AppBar

1.前面的bar和底部的buttom

2.源代码

import 'package:flutter/material.dart';
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  //进入整个主页
  @override
  Widget build(BuildContext context) {
    //设置为Meter风格应用
    return MaterialApp(
      title: '大成Flutter例子',
      theme: ThemeData(

        primarySwatch: Colors.orange,
      ),
      home: MyHomePage(title: '大成例子'),


    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _selectedIndex = 1;
  final _widgetOptions = [
    Text("Index 0: 微信"),
    Text("Index 1: 通讯录"),
    Text("Index 2: 发现"),
    Text("Index 3: 我"),
  ];


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: Icon(Icons.find_in_page),

        title: Text("反微信"),
        actions: <Widget>[
          IconButton (icon:Icon(Icons.search), tooltip:'搜索',onPressed:(){},),
          IconButton(icon:Icon(Icons.add), tooltip: '增加', onPressed: (){},),



        ],
      ),
      body: Center(
        child: _widgetOptions.elementAt(_selectedIndex),
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: <BottomNavigationBarItem>[
          BottomNavigationBarItem(icon: Icon(Icons.info), title: Text('微信')),
          BottomNavigationBarItem(icon: Icon(Icons.call), title: Text('通讯录')),
          BottomNavigationBarItem(icon: Icon(Icons.search), title: Text('查询')),
          BottomNavigationBarItem(icon: Icon(Icons.adb), title: Text('我')),

        ],
        currentIndex: _selectedIndex,
        fixedColor: Colors.deepPurpleAccent,
        onTap: _onItemTapped,
      ),

    );
  }

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }
}


 

发布了297 篇原创文章 · 获赞 16 · 访问量 3万+

猜你喜欢

转载自blog.csdn.net/keny88888/article/details/105367656