我們在平常使用手機(jī)時可以看到很多的App的會有側(cè)滑菜單欄的效果，這次我將使用SlidingPaneLayout來實(shí)現(xiàn)這個功能。

首先我們先看下最終效果：

---

SlidingPaneLayout

SlidingPaneLayout提供了一個水平的、多窗格的布局。使用該控件我們可以實(shí)現(xiàn)側(cè)滑的效果，其布局文件下面的第一個子控件是作為一個導(dǎo)航視圖(也就是滑動后左邊視圖)，其余部分是內(nèi)容視圖。

可以簡單的嘗試一下

<?xml version="1.0" encoding="utf-8"?> <androidx.slidingpanelayout.widget.SlidingPaneLayout 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" android:gravity="center_horizontal" tools:context=".MainActivity"> <LinearLayout android:layout_width="150dp" android:layout_height="match_parent" android:background="@color/colorPrimary" android:orientation="vertical"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="LeftMenu" android:textSize="20sp" android:layout_margin="10dp"/> LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center" android:orientation="vertical"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="main" android:textSize="30sp" android:layout_margin="10dp"/> LinearLayout> androidx.slidingpanelayout.widget.SlidingPaneLayout>

通過上面的布局，我們可以實(shí)現(xiàn)一個測滑的效果

---

左側(cè)欄縮放

通過下面這段代碼，使得左側(cè)欄滑動時有一個縮放的效果

SlidingPaneLayout slidingPaneLayout = findViewById(R.id.sliding_layout); //獲取到左側(cè)導(dǎo)航欄 mLeftView = slidingPaneLayout.getChildAt(0); slidingPaneLayout.setPanelSlideListener(new SlidingPaneLayout.PanelSlideListener() { @Override public void onPanelSlide(@NonNull View panel, float slideOffset) { //滑動窗格的位置更改時調(diào)用 //設(shè)置側(cè)面欄縮放 mLeftView.setPivotX(-mLeftView.getWidth() / 6.0f); mLeftView.setPivotY(mLeftView.getHeight() / 2.0f); mLeftView.setScaleX(0.7f + 0.3f * slideOffset); mLeftView.setScaleY(0.7f + 0.3f * slideOffset); } @Override public void onPanelOpened(@NonNull View panel) { //在滑動窗格完全打開時調(diào)用 } @Override public void onPanelClosed(@NonNull View panel) { //當(dāng)滑動窗格完全關(guān)閉時調(diào)用 } }); mLeftView = slidingPaneLayout.getChildAt(0); slidingPaneLayout.setPanelSlideListener(new SlidingPaneLayout.PanelSlideListener() { @Override public void onPanelSlide(@NonNull View panel, float slideOffset) { //滑動窗格的位置更改時調(diào)用 //設(shè)置側(cè)面欄縮放 mLeftView.setPivotX(-mLeftView.getWidth() / 6.0f); mLeftView.setPivotY(mLeftView.getHeight() / 2.0f); mLeftView.setScaleX(0.7f + 0.3f * slideOffset); mLeftView.setScaleY(0.7f + 0.3f * slideOffset); } @Override public void onPanelOpened(@NonNull View panel) { //在滑動窗格完全打開時調(diào)用 } @Override public void onPanelClosed(@NonNull View panel) { //當(dāng)滑動窗格完全關(guān)閉時調(diào)用 } });

在onPaneSlide中有兩個參數(shù)，第一個參數(shù)是被移動的view，第二個參數(shù)則是滑動時的偏移值，范圍是0~1

當(dāng)我們對一個View設(shè)置縮放動畫時，縮放軸點(diǎn)默認(rèn)是該View的中心點(diǎn)。如果我們想改變縮放軸點(diǎn)位置，可以通過setPivotX(float pivotX)設(shè)置縮放軸點(diǎn)X軸的坐標(biāo)，通過setPivotY(float pivotY)設(shè)置縮放軸點(diǎn)Y軸的坐標(biāo)。再通過setScaleX和setScaleY來實(shí)現(xiàn)最終的縮放效果。

實(shí)現(xiàn)效果：

在SlidingPaneLayout下添加個背景顏色效果會更好些

android:background="@color/colorPrimary"

---

主要內(nèi)容(右側(cè))縮放

在onPanelSlide方法下加上下面一段代碼，即可實(shí)現(xiàn)

mMainView.setScaleX(1f - 0.3f * slideOffset); mMainView.setScaleY(1f - 0.3f * slideOffset);

還可以再給右邊設(shè)置個陰影的效果

mMainView.setElevation(6.0f * slideOffset);

---

自定義SlidingPaneLayout

上面就是最終要實(shí)現(xiàn)的側(cè)滑欄的三個最主要的內(nèi)容。理解上面三個其實(shí)就可以做出一開始給的那種效果。但有些時候，可能我們不希望通過滑動來顯示出左邊的導(dǎo)航欄，而是直接通過點(diǎn)擊一個按鈕來打開左邊欄。在SlidingPaneLayout中并沒這樣的方法來禁止它滑動，這時候我們就需要自己來自定義。

public class CusSlidingPaneLayout extends SlidingPaneLayout { //是否禁止 private boolean isForbid = false; public CusSlidingPaneLayout(@NonNull Context context) { this(context, null); } public CusSlidingPaneLayout(@NonNull Context context, @Nullable AttributeSet attrs) { this(context, attrs, 0); } public CusSlidingPaneLayout(@NonNull Context context, @Nullable AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); } /** * 讓外面可以調(diào)用此方法來禁止滑動 * * @param isForbid */ public void forbidSlide(boolean isForbid) { this.isForbid = isForbid; } /** * 攔截觸屏事件 * * @param ev * @return */ @Override public boolean onInterceptTouchEvent(MotionEvent ev) { if (ev.getAction() == MotionEvent.ACTION_MOVE) { if (isForbid) { return false; } } return super.onInterceptTouchEvent(ev); } @Override public boolean onTouchEvent(MotionEvent ev) { if (ev.getAction() == MotionEvent.ACTION_MOVE) { if (isForbid) { return false; } } return super.onTouchEvent(ev); } }

---

Demo地址

https://github.com/barry-b/SlideMenuDemo

總結(jié)

以上是生活随笔為你收集整理的android 三个点按钮实现_Android 常用侧滑栏实现的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。