Android 側滑欄
1.匯入依賴（build.gradle)
因為需要用到 ” NavigationView “ Android是沒有自帶的
implementation 'com.android.support:design:29.0.1'
2.布局界面
nav_menu.xml——導航選單
<?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/fragment_05"
android:title="界面1" />
<item
android:id="@+id/fragment_06"
android:title="界面2" />
<item
android:id="@+id/fragment_07"
android:title="界面3" />
<item
android:id="@+id/fragment_08"
android:title="界面4" />
<item
android:id="@+id/fragment_09"
android:title="界面5" />
<item
android:id="@+id/fragment_10"
android:title="界面6" />
</group>
</menu>
nav_header.xml——NavigationView布局中的頭部布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:background="?attr/colorPrimary">
<ImageView
android:id="@+id/icon_image"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="10dp"
android:src="@mipmap/ic_launcher" />
<TextView
android:id="@+id/username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/icon_image"
android:layout_margin="10dp"
android:text="用戶名"
android:textColor="@android:color/black"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="@+id/mail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/username"
android:layout_margin="10dp"
android:text="***@qq.com"
android:textSize="14sp"
android:textColor="@android:color/black"/>
</RelativeLayout>
以上代碼效果為：一個頭像，一個昵稱，一個郵箱號；
activity_main——主界面
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:custom="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="0dp"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:background="@color/colorPrimary"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_gravity="center_vertical">
<ImageButton
android:id="@+id/btn_nva"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:paddingLeft="10dp"
android:src="@drawable/nav"
android:background="@null"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/textView_topTitle"
android:text="標題"
android:textSize="25dp"
android:textColor="@color/colorTitle"
android:layout_gravity="center_vertical"
android:textAlignment="center"
custom:ignore="RtlCompat" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal">
</LinearLayout>
</LinearLayout>
</LinearLayout>
<FrameLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
</FrameLayout>
</LinearLayout>
</RelativeLayout>
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
android:layout_width="200dp"
android:layout_height="match_parent"
android:layout_gravity="start"
app:menu="@menu/nav_menu"
app:headerLayout="@layout/nav_header"/>
</androidx.drawerlayout.widget.DrawerLayout>
界面效果為：一個頂部標題欄（內含三個模塊布局），一個碎片布局，左邊為側滑欄布局
其中主要實作NavigationView（側滑欄）陳述句為：
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
android:layout_width="200dp"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="@layout/nav_header"
app:menu="@menu/nav_menu"/>
android:layout_gravity：側滑欄打開位置（start，left，right）
app:headerLayout：側滑欄頭部布局
app:menu：側滑欄選單
3.Java代碼部分
//package com.example.jnjs_10_14;
import android.os.Bundle;
import android.view.MenuItem;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.ImageButton;
import android.widget.TextView;
import android.widget.Toast;
import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.core.view.GravityCompat;
import androidx.drawerlayout.widget.DrawerLayout;
import com.google.android.material.navigation.NavigationView;
public class MainActivity extends AppCompatActivity implements View.OnClickListener, NavigationView.OnNavigationItemSelectedListener {
private TextView textView_topTitle;
private FrameLayout content;
private NavigationView nav_view;
private ImageButton btn_nva;
private DrawerLayout drawer_layout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
private void initView() {
textView_topTitle = (TextView) findViewById(R.id.textView_topTitle);//標題
content = (FrameLayout) findViewById(R.id.content);//Fragment碎片布局
//左側隱藏的NavigationView布局
nav_view = (NavigationView) findViewById(R.id.nav_view);
nav_view.setNavigationItemSelectedListener(this);//nva選單的Item點擊事件鈕監聽
//左上角導航按鈕
btn_nva = (ImageButton) findViewById(R.id.btn_nva);
btn_nva.setOnClickListener(this);//監聽是否按下導航按鈕
//activity_main檔案內最外層布局
drawer_layout = (DrawerLayout) findViewById(R.id.drawer_layout);
drawer_layout.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.btn_nva://左上角導航按鈕
drawer_layout.openDrawer(GravityCompat.START);//設定左邊選單欄顯示出來
break;
}
}
/*
側滑欄導航item點擊事件監聽
*/
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
switch (menuItem.getItemId()){
case R.id.fragment_05:
Toast.makeText(MainActivity.this, "界面1", Toast.LENGTH_SHORT).show();
//加載碎片
getSupportFragmentManager().beginTransaction().replace(R.id.content,new Fragment_05()).commit();
drawer_layout.closeDrawer(GravityCompat.START);//關閉側滑欄
break;
case R.id.fragment_06:
Toast.makeText(MainActivity.this, "界面2", Toast.LENGTH_SHORT).show();
break;
case R.id.fragment_07:
Toast.makeText(MainActivity.this, "界面3", Toast.LENGTH_SHORT).show();
break;
case R.id.fragment_08:
Toast.makeText(MainActivity.this, "界面4", Toast.LENGTH_SHORT).show();
break;
case R.id.fragment_09:
Toast.makeText(MainActivity.this, "界面5", Toast.LENGTH_SHORT).show();
break;
case R.id.fragment_10:
Toast.makeText(MainActivity.this, "界面6", Toast.LENGTH_SHORT).show();
break;
}
return false;
}
}
以上代碼實作了點擊按鈕彈出側滑欄，對于滑動彈出側滑欄的代碼只需要使用“滑動監聽”配合以下代碼即可
drawer_layout.openDrawer(GravityCompat.START);//設定左邊選單欄顯示出來
drawer_layout.closeDrawer(GravityCompat.START);//關閉側滑欄
在網上找了很久的“點擊按鈕彈出側滑欄”的側滑欄教程，很多都沒有講到這個，真的很難受，最后自己總結了一套簡單的側滑欄綜合教程，希望能幫到各位
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/172422.html
標籤：其他