我有一个非常简单的NavigationRail,我测试了选中和未选中标签的不同字体大小.当两者保持相同的字体大小时,对齐没有问题,但如果我给所选标签赋予更大的值,或者如果我放一个更长的文本,其他标签显然会居中对齐.有没有一种方法可以控制这种行为,要么全部对齐,要么单独对齐?

Screenshot

这是我的代码:

    return Scaffold(
      appBar: AppBar(
        title: tituloAppBar,
        backgroundColor: colorBackground,
      ),
      body: Row(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          SafeArea(
              child: NavigationRail(
            selectedIndex: selectedIndex,
            onDestinationSelected: changeDestination,
            extended: MediaQuery.of(context).size.width >= 850,
            unselectedIconTheme: const IconThemeData(color: Colors.grey),
            destinations: const <NavigationRailDestination>[
              NavigationRailDestination(
                icon: Icon(Icons.search),
                label: Text('Buscar Talleres y Extracurriculares'),
              ),
              NavigationRailDestination(
                icon: Icon(Icons.engineering),
                label: Text('Ingeniería y Agronomía'),
              ),
              NavigationRailDestination(
                icon: Icon(Icons.business),
                label: Text('Sociales y Administración'),
              ),
              NavigationRailDestination(
                icon: Icon(Icons.local_hospital),
                label: Text('Salud'),
              ),
              NavigationRailDestination(
                icon: Icon(Icons.school),
                label: Text('Iniciales'),
              ),
              NavigationRailDestination(
                icon: Icon(Icons.design_services),
                label: Text('Talleres y Extracurriculares'),
              ),
            ],
            selectedLabelTextStyle:
                TextStyle(color: Colors.lightBlue, fontSize: 20),
            unselectedLabelTextStyle: 
                TextStyle(color: Colors.grey, fontSize: 18),
            groupAlignment: -1,
            minWidth: 56,
          ))
        ],
      ),
    );

我try 将填充、extAlign字段更改 for each Widget文本.我try 了包装其他小工具来设置填充或边距,但都不起作用.

推荐答案

您好,您只需要将NavigationRail包起来,它就会像这个image一样工作

这是代码:

return Scaffold(
  appBar: AppBar(
    title: tituloAppBar,
    backgroundColor: colorBackground,
  ),
  body: Row(
    mainAxisAlignment: MainAxisAlignment.start,
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      Flexible(
        child: NavigationRail(
          selectedIndex: _counter,
          onDestinationSelected: (value) {
            setState(() {
              _counter = value;
            });
          },
          extended: MediaQuery.of(context).size.width >= 850,
          unselectedIconTheme: const IconThemeData(color: Colors.grey),
          destinations: const <NavigationRailDestination>[
            NavigationRailDestination(
              icon: Icon(Icons.search),
              label: Text('Buscar Talleres y Extracurriculares'),
            ),
            NavigationRailDestination(
              icon: Icon(Icons.engineering),
              label: Text('Ingeniería y Agronomía'),
            ),
            NavigationRailDestination(
              icon: Icon(Icons.business),
              label: Text('Sociales y Administración'),
            ),
            NavigationRailDestination(
              icon: Icon(Icons.local_hospital),
              label: Text('Salud'),
            ),
            NavigationRailDestination(
              icon: Icon(Icons.school),
              label: Text('Iniciales'),
            ),
            NavigationRailDestination(
              icon: Icon(Icons.design_services),
              label: Text('Talleres y Extracurriculares'),
            ),
          ],
          selectedLabelTextStyle:
              TextStyle(color: Colors.lightBlue, fontSize: 20),
          unselectedLabelTextStyle:
              TextStyle(color: Colors.grey, fontSize: 18),
          groupAlignment: -1,
          minWidth: 56,
        ),
      )
    ],
  ),
);

Flutter相关问答推荐

如何将图像从顶部和底部半向外设置为飘动

在Flutter中创建具有固定行的压缩水平列表

如何从模型列表中生成DropdownButtonFormField?

为什么我需要等待重新访问Firestore数据库,即使它已经做了之前?

为什么他们实例化类,然后丢弃该实例?

在框中保存对象列表时,类型推断无法正常工作

我怎样才能在Ffltter中显示html布局链接?

将记录/元组用作SplayTreeMap中的键

Firebase WHERE过滤器在日期字段中不起作用

导航回上一页会将我带回Ffltter应用程序中的登录页面

如何将小部件代码移动到另一个文件以获得更好的可读性

当 Dart SDK 版本范围不匹配时,为什么依赖解析器不会抛出错误?

如何在 Flutter 中创建厚度沿着容器逐渐减小的边框

在参数为空时保持命名参数的默认值

Flutter ImagePicker - 在 onPressed 中异步获取图像显示 lint 警告

Flutter:如何从运行时创建的列表中访问单个子部件的值

Flutter - 根据从第一个 DropdownButtonForm 中 Select 的内容在第二个 DropdownButton 上显示选项

Flutter sliver 持久化

如何更改中心的圆形进度指示器

更改文本字段Flutter 中最大字母的 colored颜色