溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶(hù)服務(wù)條款》

Android如何使用DrawerLayout仿QQ6.0雙側(cè)滑菜單

發(fā)布時(shí)間:2021-05-12 14:19:22 來(lái)源:億速云 閱讀:303 作者:小新 欄目:移動(dòng)開(kāi)發(fā)

小編給大家分享一下Android如何使用DrawerLayout仿QQ6.0雙側(cè)滑菜單,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!

具體內(nèi)容如下

Android如何使用DrawerLayout仿QQ6.0雙側(cè)滑菜單

上面是效果圖。

相關(guān)實(shí)現(xiàn)的源碼和文章網(wǎng)上已經(jīng)很多了,比較流行的做法分別是使用 FrameLayout, HorizontalScrollView或者是DrawerLayout

其實(shí)要實(shí)現(xiàn)QQ 6.X版本側(cè)滑效果最好的方案是使用HorizontalScrollView,因?yàn)樽髠?cè)菜單的透視效果在DrawerLayout下無(wú)法實(shí)現(xiàn),或者說(shuō)實(shí)現(xiàn)起來(lái)很麻煩,所以在這里我們還是先介紹使用DrawerLayout來(lái)制作效果,畢竟是官方給的控件,優(yōu)化方面不需要我們自己操心了。

先上布局代碼

activity_side_menu.xml

關(guān)于DrawerLayout相信大家已經(jīng)有一定了解了,第一個(gè)子視圖是主界面,后面兩個(gè)Fragment是左右菜單,通過(guò)Gravity來(lái)確實(shí)在左邊還是右邊。從這里我們可以看出,菜單欄一定是顯示在主界面上面的,所以,QQ6.0的菜單透視效果這里無(wú)法實(shí)現(xiàn),因?yàn)椴藛螜跁?huì)覆蓋掉主界面的一部分內(nèi)容。對(duì)主界面的layout調(diào)用bringToFront的話(huà),會(huì)讓界面失去滑動(dòng)效果,如果哪位朋友有解決方案,歡迎指導(dǎo)。

<?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è)的滑動(dòng)菜單我是直接用了一張圖片來(lái)代替,代碼很簡(jiǎn)單,這里我就不貼出來(lái)了。

SideMenuActivity.java

DrawerLayout默認(rèn)的可滑動(dòng)范圍是46dp,所以在這里,我調(diào)用setDrawerLeftEdgeSize方法通過(guò)反射重新設(shè)置了可滑動(dòng)區(qū)域,設(shè)置為屏幕寬度的60%,不過(guò)這個(gè)方法有個(gè)缺陷,就是滑動(dòng)的時(shí)候速度不是很均勻,如果要完善的話(huà),可以通過(guò)重寫(xiě)DrawerLayout的源代碼來(lái)解決,不過(guò)目前可以先用這種方案折中一下。

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);  //設(shè)置屏幕左邊的60%區(qū)域?yàn)榭苫瑒?dòng)區(qū)域
 }
 
 
 //初始化抽屜層監(jiān)聽(tīng)
 private void initEvent() {
  //setDrawerListener已經(jīng)廢棄,請(qǐng)使用addDrawerListener
  activity_side_menu.addDrawerListener(new myDrawListener());
 }
 
 /**
  * 抽屜滑動(dòng)范圍控制
  */
 private void setDrawerLeftEdgeSize(Activity activity, DrawerLayout drawerLayout, float displayWidthPercentage) {
  if (activity == null || drawerLayout == null)
   return;
  try {
   // 通過(guò)反射獲取到DrawerLayout的mLeftDragger屬性
   Field leftDraggerField = drawerLayout.getClass().getDeclaredField("mLeftDragger");
   leftDraggerField.setAccessible(true);
   ViewDragHelper leftDragger = (ViewDragHelper) leftDraggerField.get(drawerLayout);
   // 找到 edgesize 并設(shè)置為 accessible
   Field edgeSizeField = leftDragger.getClass().getDeclaredField("mEdgeSize");
   edgeSizeField.setAccessible(true);
   int edgeSize = edgeSizeField.getInt(leftDragger);
   // 重新設(shè)置 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)聽(tīng)器
 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) {
 
  }
 }
 
 
}

注意事項(xiàng):

1.ViewHelper是nineoldandroids的第三方庫(kù),用于改變View的大小,位置和透明度等屬性,jar包可在源代碼中獲得。

2.右側(cè)菜單在開(kāi)始時(shí)通過(guò)setDrawerLockMode鎖定了,因此無(wú)法直接劃出,只能通過(guò)點(diǎn)擊按鈕的方式彈出,這樣做的目的是為了避免和聊天記錄的左劃刪除手勢(shì)沖突,有興趣的朋友可以深入研究一下。

3.addDrawerListener,首先setDrawerListener()  API已經(jīng)過(guò)時(shí)了,所以要改為addDrawerListener,可以使用addDrawerListener監(jiān)聽(tīng)菜單的打開(kāi)與關(guān)閉等等。這里對(duì)于當(dāng)前操作是哪個(gè)菜單的判斷是通過(guò)TAG判斷的。

Android是什么

Android是一種基于Linux內(nèi)核的自由及開(kāi)放源代碼的操作系統(tǒng),主要使用于移動(dòng)設(shè)備,如智能手機(jī)和平板電腦,由美國(guó)Google公司和開(kāi)放手機(jī)聯(lián)盟領(lǐng)導(dǎo)及開(kāi)發(fā)。

以上是“Android如何使用DrawerLayout仿QQ6.0雙側(cè)滑菜單”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對(duì)大家有所幫助,如果還想學(xué)習(xí)更多知識(shí),歡迎關(guān)注億速云行業(yè)資訊頻道!

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI