Android 는 DrawerLayout 를 사용 하여 QQ 6.0 사 이 드 슬라이드 메뉴 를 모방 합 니 다.

본 논문 의 사례 는 Android 가 DrawerLayout 를 사용 하여 QQ 6.0 양쪽 슬라이드 메뉴 를 모방 하 는 구체 적 인 코드 를 공유 하 였 으 며,구체 적 인 내용 은 다음 과 같다.

위 는 효과 도.
실 현 된 소스 코드 와 글 이 인터넷 에 많이 올 라 와 있 습 니 다.비교적 유행 하 는 방법 은 FrameLayout,Horizontal ScrollView 또는 DrawerLayout 를 사용 하 는 것 입 니 다.
사실 QQ 6.X 버 전의 사 이 드 스 케 이 트 효 과 를 실현 하 는 가장 좋 은 방안 은 Horizontal ScrollView 를 사용 하 는 것 입 니 다.왼쪽 메뉴 의 투시 효 과 는 DrawerLayout 에서 실현 되 지 못 하거나 실현 하기 어렵 기 때문에 여기 서 DrawerLayout 를 사용 하여 효 과 를 만 드 는 것 을 소개 합 니 다.공식 적 으로 제공 하 는 컨트롤 이기 때문에 최적화 에 있어 서 우리 가 신경 쓸 필요 가 없습니다.
먼저 레이아웃 코드 를 올 립 니 다:
activity_side_menu.xml
DrawerLayout 에 대해 서 는 이미 알 고 있 을 것 이 라 고 믿 습 니 다.첫 번 째 키 보 기 는 메 인 인터페이스 이 고 뒤의 두 개의 Fragment 는 좌우 메뉴 입 니 다.Gravity 를 통 해 왼쪽 인지 오른쪽 인지 확인 할 수 있 습 니 다.여기 서 알 수 있 듯 이 메뉴 표시 줄 은 메 인 화면 에 표시 되 어 있 기 때문에 QQ 6.0 의 메뉴 투시 효 과 는 여기 서 실현 할 수 없습니다.메뉴 표시 줄 이 메 인 인터페이스의 일부분 을 덮어 쓰기 때 문 입 니 다.메 인 인터페이스의 layot 에 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>
좌우 의 미끄럼 메뉴 는 제 가 직접 그림 으로 대 체 했 습 니 다.코드 는 간단 합 니 다.여 기 는 붙 이지 않 겠 습 니 다.
SideMenuActivity.java
DrawerLayout 의 기본 미끄럼 가능 범 위 는 46dp 입 니 다.그래서 여기 서 저 는 setDrawerLeft EdgeSize 방법 을 사용 하여 반사 적 으로 미끄럼 가능 구역 을 다시 설정 하여 화면 너비 의 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%        
 }
 
 
 //        
 private void initEvent() {
  //setDrawerListener    ,   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);
 }
 
 //        
 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 는 나 인 올 드 안 드 로 이 드 의 제3자 라 이브 러 리 로 View 의 크기,위치,투명도 등 속성 을 바 꾸 는 데 사 용 됩 니 다.jar 패 키 지 는 소스 코드 에서 얻 을 수 있 습 니 다.
2.오른쪽 메뉴 는 시작 할 때 setDrawerLockMode 를 통 해 잠 겨 있 기 때문에 직접 그 릴 수 없고 단 추 를 누 르 는 방식 으로 만 팝 업 됩 니 다.이렇게 하 는 목적 은 채 팅 기록 의 왼쪽 획 과 제스처 충돌 을 없 애기 위해 서 입 니 다.관심 있 는 분 들 은 깊이 연구 해 보 세 요.
3.addDrawerListener,우선 setDrawerListener()  API 가 시간 이 지 났 기 때문에 addDrawerListener 로 바 꾸 려 면 addDrawerListener 감청 메뉴 의 열기 와 닫 기 등 을 사용 할 수 있 습 니 다.현재 동작 이 어떤 메뉴 인지 에 대한 판단 은 TAG 를 통 해 이 루어 집 니 다.
원본 다운로드:DrawerLayout 를 사용 하여 QQ 6.0 양쪽 슬라이더 메뉴 를 모방 합 니 다.
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.

좋은 웹페이지 즐겨찾기