Я не могу понять, как изменить цвет кнопки автоматического возврата appBar на другой цвет. он находится под эшафотом, и я пытался исследовать его, но не могу осмыслить его.
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.white,
title: Image.asset(
'images/.jpg',
fit: BoxFit.fill,
),
centerTitle: true,
),
ParentPage
и там вы можете добавить appBar один раз и везде, где вы можете использовать это вместоScaffold
вы также можете переопределить стрелку назад по умолчанию с помощью виджета по вашему выбору с помощью "перехода":
leading: new IconButton( icon: new Icon(Icons.arrow_back, color: Colors.orange), onPressed: () => Navigator.of(context).pop(), ),
все, что делает виджет AppBar, - это «ведущий» виджет по умолчанию, если он не установлен.
источник
AppBar
при нажатии также будет отображаться кнопка «Назад»ModalRoute
.automaticallyImplyLeading: false
в AppBar.Navigator.of(context).pop();
благодарность, чувакКазалось, было проще просто создать новую кнопку и добавить к ней цвет, вот как я это сделал для всех, кому интересно
Widget build(BuildContext context) { return Scaffold( appBar: AppBar( leading: BackButton( color: Colors.black ),
источник
AppBar( automaticallyImplyLeading: false, leading: Navigator.canPop(context) ? IconButton( icon: Icon( Icons.arrow_back, color: Colors.black, size: 47, ), onPressed: () => Navigator.of(context).pop(), ) : null, );
источник
Вы также можете установить глобальный цвет значка для приложения.
источник
Вы можете настроить AppBarWidget , ключевое слово с очень важно, или вы можете назначить пользовательские AppBarWidget для AppBar собственности строительных лесов :
import 'package:flutter/material.dart'; double _getAppBarTitleWidth( double screenWidth, double leadingWidth, double tailWidth) { return (screenWidth - leadingWidth - tailWidth); } class AppBarWidget extends StatelessWidget with PreferredSizeWidget { AppBarWidget( {Key key, @required this.leadingChildren, @required this.tailChildren, @required this.title, this.leadingWidth: 110, this.tailWidth: 30}) : super(key: key); final List<Widget> leadingChildren; final List<Widget> tailChildren; final String title; final double leadingWidth; final double tailWidth; @override Widget build(BuildContext context) { // Get screen size double _screenWidth = MediaQuery.of(context).size.width; // Get title size double _titleWidth = _getAppBarTitleWidth(_screenWidth, leadingWidth, tailWidth); double _offsetToRight = leadingWidth - tailWidth; return AppBar( title: Row( children: [ Container( width: leadingWidth, child: Row( mainAxisAlignment: MainAxisAlignment.start, children: leadingChildren, ), ), Container( color: Colors.green, width: _titleWidth, padding: const EdgeInsets.only(left: 5.0, right: 5), child: Container( padding: EdgeInsets.only(right: _offsetToRight), color: Colors.deepPurpleAccent, child: Center( child: Text('$title'), ), ), ), Container( color: Colors.amber, width: tailWidth, child: Row( children: tailChildren, ), ) ], ), titleSpacing: 0.0, ); } @override Size get preferredSize => Size.fromHeight(kToolbarHeight); }
Ниже приводится пример того, как его использовать:
import 'package:flutter/material.dart'; import 'package:seal_note/ui/Detail/DetailWidget.dart'; import 'package:seal_note/ui/ItemListWidget.dart'; import 'Common/AppBarWidget.dart'; import 'Detail/DetailPage.dart'; class MasterDetailPage extends StatefulWidget { @override State<StatefulWidget> createState() => _MasterDetailPageState(); } class _MasterDetailPageState extends State<MasterDetailPage> { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBarWidget(leadingChildren: [ IconButton( icon: Icon( Icons.arrow_back_ios, color: Colors.white, ), ), Text( '文件夹', style: TextStyle(fontSize: 14.0), ), ], tailChildren: [ Icon(Icons.book), Icon(Icons.hd), ], title: '英语知识',leadingWidth: 140,tailWidth: 50,), body: Text('I am body'), ); } }
источник
appBar: AppBar( iconTheme: IconThemeData( color: Colors.white, //modify arrow color from here.. ), );
источник
Чтобы изменить ведущий цвет для CupertinoPageScaffold
Theme( data: Theme.of(context).copyWith( cupertinoOverrideTheme: CupertinoThemeData( scaffoldBackgroundColor: Colors.white70, primaryColor: Styles.green21D877, // HERE COLOR OF LEADING ), ), child: CupertinoPageScaffold( navigationBar: CupertinoNavigationBar( brightness: Brightness.light, backgroundColor: Colors.white, middle: Text('Cupertino App Bar'), ), child: Container( child: Center( child: CupertinoActivityIndicator(), ), ), ), )
источник