如何在 Flutter 中使我的应用程序标题和选项卡标签尽可能大

Question

我正在制作一个供视力有限的人使用的 flutter 应用程序，我希望将所有文本的大小设置为适合视口宽度，直至指定的最大字体大小。实际的宽度和高度是动态的，所以我想使用媒体查询之类的东西来设置合理的尺寸。

我没有尝试移动文本大小，我找不到任何对我有帮助的 SO 答案。

这是我现在尝试使用的代码，但它不起作用。

class HomeTabs extends StatefulWidget {
  const HomeTabs({Key? key}) : super(key: key);

  @override
  State<StatefulWidget> createState() => HomeTabsState();
}

class HomeTabsState extends State<HomeTabs> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {

    User _user = Provider.of<User>(context, listen: false);

    return DefaultTabController(
    
      length: 2,
    
      child: Scaffold(

        drawer: AppDrawer(),
            
        appBar: AppBar(

          toolbarHeight: 100,
            
          iconTheme: IconThemeData(color: iconColor),
            
          backgroundColor: branding,

          centerTitle: true,

          title: FittedBox(

                       fit: BoxFit.contain,
                       
                       child: Text(_user.companyName),

                    ),
            
          bottom: TabBar(
            
            isScrollable: false,
            
            tabs:  [

              SizedBox(

                height: 100,
            
                 child:  Tab( 
                
                    child: FittedBox(

                      fit: BoxFit.contain,
                
                      child: Text( 'Notifications', style: tabStyle))
                
                  ),
              ),

              SizedBox(

                height: 100,

                child:  Tab( 

                  child: FittedBox(

                    fit: BoxFit.contain,
                
                    child: Text( 'Cases', style: tabStyle))
                
                ),
              ),
            ],
          ),
        ),
....

Answer 1

试试这个保持应用栏大小

PreferredSize(
            preferredSize: Size.fromHeight(100.0), // here the desired height
            child: AppBar(
              centerTitle: true,
              title: Text("Example"),
            )
        )

结果 ->

Answer 2

像这样使用 Container 的 constraints 作为标题。

          title: Container(
            constraints: BoxConstraints(
                minWidth: MediaQuery.of(context).size.width - 50),
            child: FittedBox(
              child: Text(
                '_user.companyName',
              ),
            ),
          )

对于 Tabs，只需将 FittedBox 替换为 Tab。

FittedBox(
                  child: Tab(
                    child: Text(
                      'Cases',
                    ),
                  ),
                ),

如何在 Flutter 中使我的应用程序标题和选项卡标签尽可能大

How to make my app title and tab labels as large as possible in Flutter

flutter

flutter-layout

fitted-box