안드로이드/머티리얼 디자인

[안드로이드] 머티리얼 디자인 - NavigationRailView

안드뽀개기 2022. 3. 28. 12:46
반응형

 

 

대부분의 앱들이 가로 네비게이션바를 채택하고 사용하고 있습니다.

하지만 구글에서는 세로 네비게이션바도 제공하고 있습니다.

바로 NavigationRailView...


res > menu > menu_navigation_rail.xml 을 생성합니다.

 

 

 

 

액티비티의 layout에 NavigationRailView를 추가합니다.

app:menu="@menu/menu_navigation_rail"

= menu_navigation_rail.xml 연결

 

app:itemRippleColor="@android:color/transparent"

= ripple 색상을 투명색으로 설정

 

app:headerLayout="@layout/layout_rail_header"

= NavigationRailView 상단에 커스텀 레이아웃 설정

 

app:labelVisibilityMode="unlabeled"

= 메뉴에 텍스트를 표시하지 않음

 

app:menuGravity="bottom"

= 메뉴 요소들의 배치를 하단으로 설정

 

app:itemIconTint="@color/select_navi_rail_icon_color"

= 선택된 메뉴의 아이콘 색상을 설정

 

app:itemIconTint="@color/select_navi_rail_text_color"

= 선택된 메뉴의 텍스트 색상을 설정

 

 

select_navi_rail_icon_color.xml과  select_navi_rail_text_color.xml 파일은 동일합니다.

해당 파일의 위치는 res > color > select_navi_rail_icon_color.xml 입니다.(res > values > colors 아닙니다)

 

 

 

 

 

Badge를 설정할 수 있습니다.

 

maxCharacterCount

=  Badge에 표시가능한 글자수

number

= Badge에 표시할 수 

 

 

 

maxCharacterCount와 number를 설정하지 않으면 Badge가 숫자가 없는 동그라미로 표시됩니다.

 

 

 

메뉴의 아이콘, HeaderLayout에  요소들에 대한 이벤트 처리를 할 수 있습니다.

 

 

 

 

 

 

전체 소스코드입니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

반응형