Android使用DrawerLayout仿QQ6.0雙側(cè)滑菜單
本文實例為大家分享了Android使用DrawerLayout仿QQ6.0雙側(cè)滑菜單的具體代碼,供大家參考,具體內(nèi)容如下
上面是效果圖。
相關實現(xiàn)的源碼和文章網(wǎng)上已經(jīng)很多了,比較流行的做法分別是使用 FrameLayout, HorizontalScrollView或者是DrawerLayout
其實要實現(xiàn)QQ 6.X版本側(cè)滑效果最好的方案是使用HorizontalScrollView,因為左側(cè)菜單的透視效果在DrawerLayout下無法實現(xiàn),或者說實現(xiàn)起來很麻煩,所以在這里我們還是先介紹使用DrawerLayout來制作效果,畢竟是官方給的控件,優(yōu)化方面不需要我們自己操心了。
先上布局代碼:
activity_side_menu.xml
關于DrawerLayout相信大家已經(jīng)有一定了解了,第一個子視圖是主界面,后面兩個Fragment是左右菜單,通過Gravity來確實在左邊還是右邊。從這里我們可以看出,菜單欄一定是顯示在主界面上面的,所以,QQ6.0的菜單透視效果這里無法實現(xiàn),因為菜單欄會覆蓋掉主界面的一部分內(nèi)容。對主界面的layout調(diào)用bringToFront的話,會讓界面失去滑動效果,如果哪位朋友有解決方案,歡迎指導。
<?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/activity_side_menu" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.luna.sidemenuactivity.SideMenuActivity"> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/main_content" android:scaleType="centerCrop"/> <Button android:id="@+id/btn_openleft" android:layout_width="60dp" android:layout_height="60dp" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:background="@android:color/transparent" android:onClick="openLeftSideMenu" /> <Button android:id="@+id/btn_openright" android:layout_width="50dp" android:layout_height="50dp" android:layout_alignParentTop="true" android:layout_alignParentRight="true" android:background="@android:color/transparent" android:onClick="openRightSideMenu" /> </RelativeLayout> <fragment android:id="@+id/id_left_menu" android:name="com.luna.sidemenuactivity.LeftMenuFragment" android:layout_width="300dp" android:layout_height="match_parent" android:layout_gravity="start" android:tag="LEFT" /> <fragment android:id="@+id/id_right_menu" android:name="com.luna.sidemenuactivity.RightMenuFragment" android:layout_width="100dp" android:layout_height="match_parent" android:layout_gravity="end" android:tag="RIGHT" /> </android.support.v4.widget.DrawerLayout>
左右側(cè)的滑動菜單我是直接用了一張圖片來代替,代碼很簡單,這里我就不貼出來了。
SideMenuActivity.java
DrawerLayout默認的可滑動范圍是46dp,所以在這里,我調(diào)用setDrawerLeftEdgeSize方法通過反射重新設置了可滑動區(qū)域,設置為屏幕寬度的60%,不過這個方法有個缺陷,就是滑動的時候速度不是很均勻,如果要完善的話,可以通過重寫DrawerLayout的源代碼來解決,不過目前可以先用這種方案折中一下。
package com.luna.sidemenuactivity; import android.app.Activity; import android.os.Bundle; import android.support.v4.view.GravityCompat; import android.support.v4.widget.DrawerLayout; import android.support.v4.widget.ViewDragHelper; import android.support.v7.app.AppCompatActivity; import android.util.DisplayMetrics; import android.util.Log; import android.view.View; import com.nineoldandroids.view.ViewHelper; import java.lang.reflect.Field; public class SideMenuActivity extends AppCompatActivity { DrawerLayout activity_side_menu; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_side_menu); initView(); initEvent(); } //初始化界面控件 void initView() { activity_side_menu = (DrawerLayout) findViewById(R.id.activity_side_menu); activity_side_menu.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED, GravityCompat.END); setDrawerLeftEdgeSize(this, activity_side_menu, 0.6f); //設置屏幕左邊的60%區(qū)域為可滑動區(qū)域 } //初始化抽屜層監(jiān)聽 private void initEvent() { //setDrawerListener已經(jīng)廢棄,請使用addDrawerListener activity_side_menu.addDrawerListener(new myDrawListener()); } /** * 抽屜滑動范圍控制 */ private void setDrawerLeftEdgeSize(Activity activity, DrawerLayout drawerLayout, float displayWidthPercentage) { if (activity == null || drawerLayout == null) return; try { // 通過反射獲取到DrawerLayout的mLeftDragger屬性 Field leftDraggerField = drawerLayout.getClass().getDeclaredField("mLeftDragger"); leftDraggerField.setAccessible(true); ViewDragHelper leftDragger = (ViewDragHelper) leftDraggerField.get(drawerLayout); // 找到 edgesize 并設置為 accessible Field edgeSizeField = leftDragger.getClass().getDeclaredField("mEdgeSize"); edgeSizeField.setAccessible(true); int edgeSize = edgeSizeField.getInt(leftDragger); // 重新設置 edgesize ,以屏幕寬度為比例 DisplayMetrics dm = new DisplayMetrics(); activity.getWindowManager().getDefaultDisplay().getMetrics(dm); edgeSizeField.setInt(leftDragger, Math.max(edgeSize, (int) (dm.widthPixels * displayWidthPercentage))); } catch (NoSuchFieldException e) { Log.e("NoSuchFieldException", e.getMessage()); } catch (IllegalArgumentException e) { Log.e("IllegalArgumentExp", e.getMessage()); } catch (IllegalAccessException e) { Log.e("IllegalAccessException", e.getMessage()); } } public void openLeftSideMenu(View view) { activity_side_menu.openDrawer(GravityCompat.START); } public void openRightSideMenu(View view) { activity_side_menu.openDrawer(GravityCompat.END); activity_side_menu.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED, GravityCompat.END); } //自定義抽屜監(jiān)聽器 class myDrawListener implements DrawerLayout.DrawerListener { @Override public void onDrawerSlide(View drawerView, float slideOffset) { View mContent = activity_side_menu.getChildAt(0); float Scale = 0.5f * (1.0f + slideOffset); if (drawerView.getTag().equals("LEFT")) { drawerView.setAlpha(Scale); ViewHelper.setTranslationX(mContent, drawerView.getMeasuredWidth() * slideOffset); mContent.invalidate(); } else { drawerView.setAlpha(Scale); ViewHelper.setTranslationX(mContent, -drawerView.getMeasuredWidth() * slideOffset); mContent.invalidate(); } } @Override public void onDrawerOpened(View drawerView) { } @Override public void onDrawerClosed(View drawerView) { activity_side_menu.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED, GravityCompat.END); } @Override public void onDrawerStateChanged(int newState) { } } }
注意事項:
1.ViewHelper是nineoldandroids的第三方庫,用于改變View的大小,位置和透明度等屬性,jar包可在源代碼中獲得。
2.右側(cè)菜單在開始時通過setDrawerLockMode鎖定了,因此無法直接劃出,只能通過點擊按鈕的方式彈出,這樣做的目的是為了避免和聊天記錄的左劃刪除手勢沖突,有興趣的朋友可以深入研究一下。
3.addDrawerListener,首先setDrawerListener() API已經(jīng)過時了,所以要改為addDrawerListener,可以使用addDrawerListener監(jiān)聽菜單的打開與關閉等等。這里對于當前操作是哪個菜單的判斷是通過TAG判斷的。
源碼下載:使用DrawerLayout仿QQ6.0雙側(cè)滑菜單
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
- Android抽屜布局DrawerLayout的簡單使用
- Android實現(xiàn)側(cè)滑菜單DrawerLayout
- Android側(cè)滑菜單之DrawerLayout用法詳解
- Android布局控件DrawerLayout實現(xiàn)完美側(cè)滑效果
- Android關于BottomNavigationView使用指南
- Android NavigationView頭部設置監(jiān)聽事件
- Android BottomNavigationView底部導航效果
- Android中NavigationView的使用與相關問題解決
- Android DrawerLayout布局與NavigationView導航菜單應用
相關文章
Android中用Bmob實現(xiàn)短信驗證碼功能的方法詳解
本文給大家分享通過第三方平臺Bmob實現(xiàn)發(fā)送驗證碼和校驗驗證碼的功能,非常不錯,具有參考借鑒價值,感興趣的朋友一起看看吧2016-09-09Android Studio kotlin生成編輯類注釋代碼
這篇文章主要介紹了Android Studio kotlin生成編輯類注釋代碼,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-03-03Kotlin自定義View系列教程之標尺控件(選擇身高、體重等)的實現(xiàn)
這篇文章主要給大家介紹了關于Kotlin自定義View系列教程之標尺控件(選擇身高、體重等)實現(xiàn)的相關資料,文中通過示例代碼介紹的非常詳細,需要的朋友可以參考借鑒,下面隨著小編來一起學習學習吧2018-07-07Android利用SeekBar實現(xiàn)簡單音樂播放器
這篇文章主要為大家詳細介紹了Android利用SeekBar實現(xiàn)簡單音樂播放器,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-06-06Android Studio 3.6 layout文件text模式切換問題
這篇文章主要介紹了Android Studio 3.6 layout文件text模式切換問,本文給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-03-03