flutter 顶部栏目信息AppBar参数

Scaffold(
      appBar: AppBar(
        centerTitle: true,   标题栏文字居中 
        title: Text('me-son'),  标题栏文字
        backgroundColor: Colors.red,  顶部栏目背景色
        
        leading: IconButton(  设置顶部栏目左侧图标,默认为箭头,实现事件需要IconButton
	          icon: Icon(Icons.menu),
	          onPressed: (){
	          },
	        ),  
	        
        actions: <Widget>[   给顶部栏目最右侧添加内容
          IconButton(
            icon:Icon(Icons.search),
            onPressed: (){},
          )
        ],
        
        iconTheme: IconThemeData(color: Colors.blue,size:24.0,opacity: 0.5),  设置栏目字体图标样式
        textTheme:TextTheme(title: TextStyle(color: Colors.blue) ),  设置栏目文字样式
      ),
	...
  );

去除顶部栏目右上角的debug贴纸
	在main.dart里的materialApp中与home同级设置
		debugShowCheckedModeBanner: false

代码示例:

import 'package:flutter/material.dart';

import '../main.dart';

class Me2 extends StatefulWidget {
  String title='me';


  @override
  _Home2State createState() => _Home2State();
}

class _Home2State extends State<Me2> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
    
      appBar: AppBar(
      
        centerTitle: true, //标题栏文字居中 
        title: Text('me-son'),
        backgroundColor: Colors.red, //顶部导航栏背景色
        leading: IconButton(
          icon: Icon(Icons.menu),
          onPressed: (){
            
          },
        ),  //设置顶部左侧图标,默认为箭头,实现事件需要IconButton
        actions: <Widget>[  //给右侧添加内容
          IconButton(
            icon:Icon(Icons.search),
            onPressed: (){},
          )
        ],
        iconTheme: IconThemeData(color: Colors.blue,size:24.0,opacity: 0.5), //设置字体图标样式
        textTheme:TextTheme(title: TextStyle(color: Colors.blue) ), //设置标题栏文字样式
      ),
      
      body: Home(),
    );
  }
}

class Home extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: <Widget>[
          Text('me-sonnnnn'),
          RaisedButton(
            color: Theme.of(context).accentColor,
            child: Text('回到根'),
            onPressed: (){
              Navigator.of(context).pushAndRemoveUntil( new MaterialPageRoute(builder: (context) => new Tabs(index: 2)), 
              (route) => route == null );
            },
          ),
        ],
      )
    );
  }
}

/*
单独的页面没有主题样式,需要通过Scaffold自行设置
 */
发布了670 篇原创文章 · 获赞 4 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/weixin_43294560/article/details/105539361