Блог

Я использую нижнюю панель навигации flutter. При нажатии на значки на панели навигации текст становится больше. Но для меня это немного великовато, как вы можете видеть на изображении ниже.
Изображение всплывающей нижней панели навигации

Я хочу управлять большим размером текста при нажатии и сделать его немного меньше. Как я могу это сделать в flutter?

Вот код:

 import 'package:flutter/material.dart';
import 'package:adminify/pages/PageOne.dart';
import 'package:adminify/pages/PageTwo.dart';
import 'package:adminify/pages/PageThree.dart';
import 'package:adminify/pages/PageFour.dart';
import 'package:adminify/pages/PageFive.dart';

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> with TickerProviderStateMixin {
  int _currentIndex = 0;

  @override
  void initState() {
    super.initState();
  }

  void navigationTapped(int page) {
    setState(() {
      _currentIndex = page;
    });
  }

  @override
  Widget build(BuildContext context) {
    // this is all pages here in list we can choose index when click bottom navigation bar
    List<Widget> _allPages = [
      PageOne(),
      PageTwo(),
      PageTree(),
      PageFour(),
      PageFive(),
    ];

    return Scaffold(
      body: _allPages[_currentIndex],
      bottomNavigationBar: buildBottomNavigationBar(),
    );
  }

  // Bottom navigation bar area you can choose icons what you want.
  BottomNavigationBar buildBottomNavigationBar() {
    return BottomNavigationBar(
      type: BottomNavigationBarType.fixed,
      fixedColor: Colors.red,
      currentIndex: _currentIndex,
      onTap: navigationTapped,    
      // iconSize: 28,
      items: [
        BottomNavigationBarItem(
          icon: Icon(Icons.home),
          title: Text(
            "Home",
            style: TextStyle(fontWeight: FontWeight.normal),
          ),
        ),
        BottomNavigationBarItem(
          icon: Icon(
            Icons.explore,
          ),
          title: Text(
            "Admission",
            style: TextStyle(fontWeight: FontWeight.normal),
          ),
        ),
        BottomNavigationBarItem(
          icon: Icon(Icons.cloud),
          title: Text(
            "University",
            style: TextStyle(fontWeight: FontWeight.normal),
            overflow: TextOverflow.clip,
            textAlign: TextAlign.center,
          ),
        ),
        BottomNavigationBarItem(
          icon: Icon(Icons.person),
          title: Text(
            "Favorites",
            style: TextStyle(fontWeight: FontWeight.normal),
          ),
        ),
        BottomNavigationBarItem(
          icon: Icon(Icons.verified_user),      
          title: Text(
            "Profile",
            style: TextStyle(fontWeight: FontWeight.normal),
          ),
        ),
      ],
    );
  }
}
  

selectedFontSize На BottomNavigationBar есть свойство. Вы можете использовать этот. Просто установите размер (interger) на желаемое значение.

Кроме того, на BottomNavigationBar также есть невыбранный размер шрифта, с помощью которого вы можете настроить все параметры заголовка на нужный размер.

       bottomNavigationBar: BottomNavigationBar(
        currentIndex: index,
        onTap: (int index) {
          setState(() {
            this.index = index;
          });
        },
        backgroundColor: Colors.white,
        type: BottomNavigationBarType.fixed,
        selectedFontSize: 12,
        unselectedFontSize: 12,
        items: [
          BottomNavigationBarItem(
            icon: ClipOval(
              child: Container(
                color:
        omitted ...
  

если вы проверите исходный код bottom_navigation_bar.dart , вы увидите, что активный размер шрифта нижней панели навигации фиксирован, он записан следующим образом:

 const double _kActiveFontSize = 14.0;
  

если вы хотите изменить это, я думаю, вам нужно создать свою собственную нижнюю панель навигации с нужным размером активного шрифта.

После краткого ознакомления с кодом BottomNavigationBar вы не сможете. Кажется, что он использует жестко запрограммированный, _kActiveFontSize который установлен на 14 . Проверьте bottom_navigation_bar.dart стиль в FixedLabel строке 366 или в ShiftingLabel строке 411. Возможно, вы захотите создать проблему, чтобы исправить этоhttps://github.com/flutter/flutter/issues