[Dev log] Flutter BottomBar Item 레퍼런스 코드

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

   Widget bottomNavigationBarWidget() {
    return BottomNavigationBar(
      // 애니메이션 고정. 고정하지 않는다면 아이콘이 커진다. 
      type: BottomNavigationBarType.fixed,
      onTap: (int index) {
        print(index);
        setState(() {
          selectedIndex = index;
        });
      },
      selectedFontSize: 12,
      selectedItemColor: Colors.black,
      selectedLabelStyle: TextStyle(color: Colors.black),
      items: [
        bottomNavigationBarItem("home", "소통"),
        bottomNavigationBarItem("search", "검색"),
        bottomNavigationBarItem("chat", "채팅"),
        bottomNavigationBarItem("my", "마이"),
      ],
    );
  }

// 위에서 아이콘 이름에 해당하는 "home_off.svg","search_off.svg","chat_off.svg"에 해당하는 것을 파라메터로 받아 아래에 적용해준다.
  BottomNavigationBarItem bottomNavigationBarItem(
      String iconName, String label) {
    return BottomNavigationBarItem(
      icon: Padding(
        // 아이콘과 명칭이름 서로 간격을 띄어주는 역할을 함
        padding: const EdgeInsets.only(bottom: 3),
        child: SvgPicture.asset(
          'assets/icons/${iconName}_off.svg',
          width: 22,
        ),
      ),
      label: label,
    );
    // 클릭하면 다른 아이콘으로 변환 _on.svg가 있다면
    activeIcon: Padding(
        // 아이콘과 명칭이름 서로 간격을 띄어주는 역할을 함
        padding: const EdgeInsets.only(bottom: 3),
        child: SvgPicture.asset(
          'assets/icons/${iconName}_on.svg',
          width: 22,
        ),
      ),
      label: label,
  }
  
    Widget build(BuildContext context) {
    return Scaffold(
      appBar: ...
      body: ...
      bottomNavigationBar: bottomNavigationBarWidget(),
    );
  }
      

BottomNavigationBarItem을 제네릭으로만 생각하였으나,

import 'package:flutter/material.dart'; 에 선언된 클래스중 하나였다.

그외, svg는 물감으로 된 아이콘들을 보통 쓴다.
사진같은 이미지는 png로..