Android DrawLayout和NavigationView優化
android自帶DrawLayout和NavigationView,使得我們可以将一些菜單隐藏起來,而不是放置在主螢幕上,然後可以通過滑動的方式将菜單顯示出來,這種方式既節省了螢幕空間,又實作了非常好的動畫效果,使用起來也很友善。之前使用的時候,在navigation上選中某個item後,退出drawLayout,預設會記住上一個的選項,感覺不是很好,後來實作了非記憶功能。
先看效果圖吧。
下面直接上步驟和相關代碼。
1.build.gradle引用兩個依賴
implementation 'de.hdodenhof:circleimageview:2.1.0'
implementation 'com.android.support:design:28.0.0'
2.activity_main.xml:隻是簡單地放置一個CircleImageView
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/DrawerLayout"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:focusable="true"
android:clickable="true"
android:focusableInTouchMode="true"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="true"
android:focusableInTouchMode="true"
tools:context=".Acitivity.WorksIndexActivity">
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:src="@mipmap/image0"
android:id="@+id/avatar"
app:layout_constraintTop_toTopOf="parent" android:layout_marginTop="16dp"
app:layout_constraintStart_toStartOf="parent" android:layout_marginStart="16dp"
/>
</android.support.constraint.ConstraintLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/nav_view"
android:layout_gravity="start"
app:menu="@menu/nav_menu"
app:headerLayout="@layout/nav_header"/>
</android.support.v4.widget.DrawerLayout>
3.在res檔案夾下的layout建立nav_header.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="0dp"
android:layout_height="200dp"
android:src="@mipmap/image2"
android:id="@+id/imageView7" app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent"
android:scaleType="fitXY" app:layout_constraintHorizontal_bias="0.0"/>
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="@mipmap/image0"
android:id="@+id/imageView8" app:layout_constraintStart_toStartOf="@+id/imageView7"
android:layout_marginStart="32dp" android:layout_marginBottom="32dp"
app:layout_constraintBottom_toBottomOf="@+id/imageView7"/>
<TextView
android:text="ID:1106488127"
android:textSize="12dp"
android:textColor="@color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textView9" app:layout_constraintStart_toEndOf="@+id/imageView8"
android:layout_marginStart="24dp" app:layout_constraintTop_toTopOf="@+id/imageView8"
android:layout_marginTop="30dp"/>
<TextView
android:text="zoom"
android:textSize="20dp"
android:textColor="@color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textView11" android:layout_marginStart="24dp"
app:layout_constraintStart_toEndOf="@+id/imageView8" android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="@+id/textView9"/>
</android.support.constraint.ConstraintLayout>
4.在res檔案夾下建立檔案夾menu,menu裡面建立檔案nav_menu.xml,注意這裡多了個選項id為menu_none,title為空,并顯示不可見,這裡是退出drawerlayout後不記憶上次選擇的關鍵,通過選擇menu_none實作“曲線救國”
<?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/index"
android:icon="@mipmap/home"
android:title="首頁"/>
<item android:id="@+id/discover"
android:icon="@mipmap/faxian"
android:title="發現"/>
<item android:id="@+id/love"
android:icon="@mipmap/aixin"
android:title="我喜歡的作品"/>
<item android:id="@+id/attention"
android:icon="@mipmap/guanzhu"
android:title="關注"/>
<item android:id="@+id/info"
android:icon="@mipmap/wodexiaoxi"
android:title="我的資訊"/>
<item android:id="@+id/setting"
android:icon="@mipmap/shezhi"
android:title="設定"/>
<item android:id="@+id/menu_none"
android:title=""
android:visible="false"/>
</group>
</menu>
5.MainActivity實作,給drawerLayout增加監聽事件。
public class MainActivity extends AppCompatActivity {
private DrawerLayout drawerLayout;
private NavigationView navigationView;
private float CurrentSlideOffset = 0.0f;
private Runnable ShouldHandleMenuClicked = null;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
drawerLayout = findViewById(R.id.DrawerLayout);
navigationView = findViewById(R.id.nav_view);
drawerLayout.addDrawerListener(new DrawerLayout.SimpleDrawerListener() {
@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
if (CurrentSlideOffset > slideOffset && slideOffset < 0.015f && ShouldHandleMenuClicked != null) {
ShouldHandleMenuClicked.run();
ShouldHandleMenuClicked = null;
runOnUiThread(() -> {
navigationView.setCheckedItem(R.id.menu_none);
});
}
CurrentSlideOffset = slideOffset;
}
});
ImageView avatar = findViewById(R.id.avatar);
avatar.setOnClickListener(v -> drawerLayout.openDrawer(GravityCompat.START));
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
switch (menuItem.getItemId()) {
case R.id.index:
ShouldHandleMenuClicked = () -> {
Toast.makeText(MainActivity.this,"你點選了首頁",Toast.LENGTH_SHORT).show();
};
break;
case R.id.discover:
ShouldHandleMenuClicked = () -> {
Toast.makeText(MainActivity.this,"你點選了發現",Toast.LENGTH_SHORT).show();
};
break;
case R.id.love:
ShouldHandleMenuClicked = () -> {
Toast.makeText(MainActivity.this,"你點選了我喜歡的作品",Toast.LENGTH_SHORT).show();
};
break;
case R.id.attention:
ShouldHandleMenuClicked = () -> {
Toast.makeText(MainActivity.this,"你點選了關注",Toast.LENGTH_SHORT).show();
};
break;
case R.id.info:
ShouldHandleMenuClicked = () -> {
Toast.makeText(MainActivity.this,"你點選了我的資訊",Toast.LENGTH_SHORT).show();
};
break;
case R.id.setting:
ShouldHandleMenuClicked = () -> {
Toast.makeText(MainActivity.this,"你點選了設定",Toast.LENGTH_SHORT).show();
};
break;
}
drawerLayout.closeDrawers();
return true;
}
});
}
}