Android 에서 NavigationView 사용 및 관련 문제 해결

6417 단어 androidnavigationview
기본 사용
1.NavigationView 는 design 라 이브 러 리 에 의존 도 를 추가 합 니 다(최신 은 23.2.0).

compile 'com.android.support:design:23.1.1' 
2.그리고 DrawerLayout 레이아웃 에 NavigationView 를 추가 합 니 다.

<?xml version="1.0" encoding="utf-8"?>

<android.support.v4.widget.DrawerLayout
 android:id="@+id/drawer_layout"
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 android:layout_width="match_parent"
 android:layout_height="match_parent">

 <FrameLayout
  android:layout_width="match_parent"
  android:layout_height="match_parent">

  <LinearLayout
   android:id="@+id/main"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:orientation="vertical">

   <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="@color/colorPrimary"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

   ......
   
  </LinearLayout>
 </FrameLayout>

 <android.support.design.widget.NavigationView
  android:id="@+id/navigation"
  android:layout_width="wrap_content"
  android:layout_height="match_parent"
  android:layout_gravity="start"
  app:headerLayout="@layout/nav_header"
  app:menu="@menu/activity_main_drawer"/>

</android.support.v4.widget.DrawerLayout>
이 중 네 비게 이 션 뷰 설정android:layout_gravity="start" 속성 에 유의 해 야 한다.
3.그리고 NavigationView 는 사실 두 부분 으로 나 뉘 는데 하 나 는 머리 이 고 하 나 는 아래 메뉴 목록 부분 입 니 다.
다음 그림 에서 보 듯 이:

그 중 머리 통과 app:headerLayout="@layout/nav_header" 속성 추가,navheader 의 레이아웃 은 다음 과 같 습 니 다.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="192dp"
    android:theme="@style/ThemeOverlay.AppCompat.Dark">

 <ImageView
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="@drawable/nav_header_bg"
  android:scaleType="centerCrop"/>

 <ImageView
  android:layout_width="96dp"
  android:layout_height="96dp"
  android:layout_gravity="bottom"
  android:layout_marginBottom="36dp"
  android:padding="8dp"
  android:src="@drawable/ic_avatar"/>

 <TextView
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_gravity="bottom"
  android:padding="16dp"
  android:text="Jaeger"
  android:textAppearance="@style/TextAppearance.AppCompat.Body1"/>

</FrameLayout>
아래 메뉴 목록 부분 은 menu 파일 로 app:menu="@menu/activity_main_drawer"속성 을 통 해 추 가 됩 니 다.
activity_main_drawer.xml 파일 은 menu 폴 더 아래 에 있 습 니 다.내용 은:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

 <group android:checkableBehavior="single">
  <item
   android:id="@+id/nav_camera"
   android:icon="@drawable/ic_menu_camera"
   android:title="Import"/>
  <item
   android:id="@+id/nav_gallery"
   android:icon="@drawable/ic_menu_gallery"
   android:title="Gallery"/>
  <item
   android:id="@+id/nav_slideshow"
   android:icon="@drawable/ic_menu_slideshow"
   android:title="Slideshow"/>
  <item
   android:id="@+id/nav_manage"
   android:icon="@drawable/ic_menu_manage"
   android:title="Tools"/>
 </group>

 <item android:title="Communicate">
  <menu>
   <item
    android:id="@+id/nav_share"
    android:icon="@drawable/ic_menu_share"
    android:title="Share"/>
   <item
    android:id="@+id/nav_send"
    android:icon="@drawable/ic_menu_send"
    android:title="Send"/>
  </menu>
 </item>

</menu>
4.메뉴 목록 의 클릭 이벤트
메뉴 목록 의 클릭 이벤트 설정 코드 는 다음 과 같 습 니 다.

navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
   @Override
   public boolean onNavigationItemSelected(MenuItem item) {
    switch (item.getItemId()){
     case R.id.nav_personal_info:
      // do something
      break;
     ...
    }
    return false;
   }
  });
이로써 Navigation View 의 기본 적 인 사용 은 거의 해결 되 지 않 았 고 효 과 는 바로 앞 그림 에 표 시 된 효과 이다.
다음은 사용 과정 에서 발생 한 문제 와 해결 방식 이다.
1.메뉴 아이콘 색상 이 다른 색상 으로 렌 더 링 됨
NavigationView 기본 값 은 Android 디자인 규범 에 따라 메뉴 에 있 는 아이콘 을itemIconTint설정 한 색상 으로 렌 더 링 합 니 다.이 속성 을 설정 하지 않 으 면 기본 짙 은 회색 으로 보 여 줍 니 다.아이콘 색상 이 렌 더 링 되 지 않 으 려 면 다음 코드 를 통 해 해결 할 수 있 습 니 다.

   navigationView.setItemIconTintList(null);
2.메뉴 아이콘 과 텍스트 의 간격 이 너무 큽 니 다.
NavigationView 메뉴 에서 아이콘 과 텍스트 의 간격 은 32dp 이지 만 보통 우리 디자이너 가 내 는 효과 와 다 릅 니 다.이 때 다음 속성 을 다시 써 서 설정 할 수 있 습 니 다.

 <dimen name="design_navigation_icon_padding" tools:override="true">16dp</dimen>
총결산
이상 은 이 글 의 전체 내용 입 니 다.본 논문 의 내용 이 안 드 로 이 드 개발 자 여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 면 댓 글 을 남 겨 주 십시오.

좋은 웹페이지 즐겨찾기