gpt4 book ai didi

flutter - 如何使 AppBar 居中以及如何减小 PreferredSize 中的前导图标大小?

转载 作者:IT王子 更新时间:2023-10-29 07:16:36 33 4
gpt4 key购买 nike

如何使整个AppBar居中以及如何减少前导图标?

我尝试使用 Center 小部件和 Column 以及 mainAxisAlignment.center 不工作。我尝试将 widthheight 添加到前导图标容器中。但没有任何效果

appBar: PreferredSize(
child: AppBar(
leading: Container(
decoration: BoxDecoration(..),
child: Icon(..),
),
title: TextFormField(
...
),
actions: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
...
),
CupertinoSwitch(
...
)
],
)
],
),
preferredSize: Size.fromHeight(80.0)),

As shown here.

最佳答案

作为一个选项

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
appBar: AwesomeAppBar(height: 80),
),
);
}
}

class AwesomeAppBar extends PreferredSize {
final double height;

const AwesomeAppBar({Key key, @required this.height});

@override
Widget build(BuildContext context) {
return LayoutBuilder(builder: (context, snapshot) {
return Container(
padding: EdgeInsets.only(top: MediaQuery.of(context).padding.top),
height: height,
color: Theme.of(context).primaryColor,
child: Row(
children: <Widget>[
Container(
padding: EdgeInsets.all(16),
child: Icon(
Icons.arrow_back,
color: Colors.white,
),
),
Expanded(
child: Container(
height: 32,
alignment: Alignment.centerLeft,
padding: EdgeInsets.symmetric(horizontal: 16),
margin: EdgeInsets.only(right: 16),
decoration: ShapeDecoration(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
color: Colors.white,
),
child: Text('Search'),
),
),
SwitchWithText(),
SizedBox(width: 16),
],
),
);
});
}

@override
Size get preferredSize => Size.fromHeight(height);
}

class SwitchWithText extends StatefulWidget {
@override
_SwitchWithTextState createState() => _SwitchWithTextState();
}

class _SwitchWithTextState extends State<SwitchWithText> {
@override
Widget build(BuildContext context) {
return Row(
children: <Widget>[
Text('Online', style: TextStyle(color: Colors.white)),
CupertinoSwitch(
value: true,
onChanged: (b) {},
activeColor: Colors.lightBlueAccent,
),
],
);
}
}

enter image description here

关于flutter - 如何使 AppBar 居中以及如何减小 PreferredSize 中的前导图标大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57197976/

33 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com