[Flutter] Bottom Navigation Bar Item label 없애기

flutter에서 bottomNavigationBar을 사용하면 각각의 아이템에서 icon과 label은 필수적으로 들어가야 한다. 다음과 같이 2개의 아이템을 넣었다고 하자.

import 'package:flutter/material.dart';

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

  @override
  _MainNavigatorState createState() => _MainNavigatorState();
}

class _MainNavigatorState extends State<MainNavigator> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Main Page'),
      ),
      body: Container(),
      bottomNavigationBar: BottomNavigationBar(
        items: [
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            label: 'home',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.calendar_today),
            label: 'calendar',
          ),
        ],
      ),
    );
  }
}

그러면 2개의 bottom navigation item이 생긴다.

이렇게 home, calendar로 label이 아이콘 밑에 들어가게 되는데 그냥 label 부분을 코드에서 없애면 오류가 난다. 따라서 아예 없애기 위해서는 속성을 추가해주어야 한다.

showSelectedLabels: false,
showUnselectedLabels: false,

위 두개의 속성을 Bottom Navigation에 넣어준다. 그러면 label이 없어지게 된다.

import 'package:flutter/material.dart';

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

  @override
  _MainNavigatorState createState() => _MainNavigatorState();
}

class _MainNavigatorState extends State<MainNavigator> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Main Page'),
      ),
      body: Container(),
      bottomNavigationBar: BottomNavigationBar(
        showSelectedLabels: false,
        showUnselectedLabels: false,
        items: [
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            label: 'home',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.calendar_today),
            label: 'calendar',
          ),
        ],
      ),
    );
  }
}