Android 는 사용자 정의 컨트롤 Horizontal ScrollView 를 사용 하여 역사상 가장 간단 한 사 이 드 메뉴 를 만 듭 니 다.
9289 단어 android사용자 정의 컨트롤사 이 드 메뉴
1.원리 분석
옆으로 미 끄 러 지 는 것 은 손바닥 이 큰 화면 일 뿐 입 니 다.두 손바닥 정도 큰 레이아웃 을 넣 고 미 끄 러 지 려 면 다른 것 이 나 올 수 있 습 니 다.그렇다면 안 드 로 이 드 가 제공 하 는 Horizontal ScrollView 를 사용 하 는 것 을 고려 하지 않 는 이 유 는 무엇 입 니까?
Horizontal ScrollView 를 사용 하려 면 ACTIONDOWN , ACTION_MOVE 에서 감청,판단,컨트롤 위치 가 계속 바 뀌 었 나 요?NO!!!Horizontal ScrollView 자체 가 미 끄 러 지 는 기능 을 가지 고 있 습 니 다.
각종 충돌 을 수 동 으로 처리 해 야 합 니까?NO!!!그럼요.사건 배포 체 제 를 알 아 봐 야 겠 어 요~~
2.효과 도
네,메 인 화면 에서 QQ 한 장의 그림 을 만 들 었 습 니 다.왼쪽 에 한 형제의 레이아웃 파일 을 도 용 했 습 니 다~죄 송 해 요~누가 보기 좋 은 레이아웃,그림,아이콘 신마 가 있 는 지 보 내 주세요.감사합니다.
3.레이아웃 파일
<com.example.zhy_slidingmenu.SlidingMenu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scrollbars="none" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<include layout="@layout/layout_menu" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/qq" >
</LinearLayout>
</LinearLayout>
</com.example.zhy_slidingmenu.SlidingMenu>
먼저 우리 의 사용자 정의 View 입 니 다.그 안의 한 방향 수준의 LinearLayout 입 니 다.그 다음 에 하 나 는 메뉴 의 레이아웃 이 고 하 나 는 메 인 레이아웃 입 니 다~4.사용자 정의 SlidingMenu
다음은 저희 의 핵심 코드 입 니 다.
package com.example.zhy_slidingmenu;
import android.content.Context;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.MotionEvent;
import android.view.ViewGroup;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import com.zhy.utils.ScreenUtils;
public class SlidingMenu extends HorizontalScrollView
{
/**
*
*/
private int mScreenWidth;
/**
* dp
*/
private int mMenuRightPadding = 50;
/**
*
*/
private int mMenuWidth;
private int mHalfMenuWidth;
private boolean once;
public SlidingMenu(Context context, AttributeSet attrs)
{
super(context, attrs);
mScreenWidth = ScreenUtils.getScreenWidth(context);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
/**
*
*/
if (!once)
{
LinearLayout wrapper = (LinearLayout) getChildAt(0);
ViewGroup menu = (ViewGroup) wrapper.getChildAt(0);
ViewGroup content = (ViewGroup) wrapper.getChildAt(1);
// dp to px
mMenuRightPadding = (int) TypedValue.applyDimension(
TypedValue.COMPLEX_UNIT_DIP, mMenuRightPadding, content
.getResources().getDisplayMetrics());
mMenuWidth = mScreenWidth - mMenuRightPadding;
mHalfMenuWidth = mMenuWidth / 2;
menu.getLayoutParams().width = mMenuWidth;
content.getLayoutParams().width = mScreenWidth;
}
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b)
{
super.onLayout(changed, l, t, r, b);
if (changed)
{
//
this.scrollTo(mMenuWidth, 0);
once = true;
}
}
@Override
public boolean onTouchEvent(MotionEvent ev)
{
int action = ev.getAction();
switch (action)
{
// Up , , ,
case MotionEvent.ACTION_UP:
int scrollX = getScrollX();
if (scrollX > mHalfMenuWidth)
this.smoothScrollTo(mMenuWidth, 0);
else
this.smoothScrollTo(0, 0);
return true;
}
return super.onTouchEvent(ev);
}
}
하하,완공~위의 데모 그림 은 이 정도 코드 로~~코드 어때요?
네,코드 가 너무 짧 아서 설명 을 안 하 겠 습 니 다.여러분 스스로 주석 을 보 세 요~
5.확장
응,내 려 와.우 리 는 다음 절 차 를 보완 할 거 야.나 는 먼저 메뉴 레이아웃 을 ListView 로 바 꾸 어서 우리 가 충돌 하지 않 았 다 는 것 을 증명 하려 고 해.그리고 메뉴 의 오른쪽 여백 값 을 설정 할 속성 을 추가 합 니 다.한 가지 방법 을 알려 드 리 겠 습 니 다.자동 으로 메뉴 를 열 어 사용자 가 어떤 단 추 를 누 르 면 메뉴 가 천천히 미끄러져 나 올 수 있 습 니 다~
1.사용자 정의 속성 추가
a.우선 values 폴 더 아래 에 attr.xml 를 새로 만 들 고 다음 내용 을 기록 합 니 다.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<attr name="rightPadding" format="dimension" />
<declare-styleable name="SlidingMenu">
<attr name="rightPadding" />
</declare-styleable>
</resources>
b.레이아웃 에서 네 임 스페이스 와 사용 속성 을 설명 합 니 다.정의 가 끝 났 습 니 다.꼭 사용 하 시 겠 습 니까?
<com.example.zhy_slidingmenu.SlidingMenu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:zhy="http://schemas.android.com/apk/res/com.example.zhy_slidingmenu"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scrollbars="none"
zhy:rightPadding="100dp" >
우리 의 네 임 스페이스 를 볼 수 있 습 니 다:xmlns:zhy="http://schemas.android.com/apk/res/com.example.zhy_slidingmenuhttp://schemas.android.com/apk/res/우리 가방 이름 추가 하기;우리 의 속성:zhy:rightPadding="100 dp"여기 100 dp 를 설 치 했 습 니 다.
주:많은 사람들 이 저 에 게 힌트 가 없 으 면 어떻게 하 냐 고 물 었 습 니 다.그러면 클 린 은 프로젝트 를 내 렸 습 니 다.운 이 좋 으 면 힌트 가 있 습 니 다.음,운 이 좋 습 니 다~
c.사용자 정의 클래스 에서 속성 획득
public SlidingMenu(Context context, AttributeSet attrs, int defStyle)
{
super(context, attrs, defStyle);
mScreenWidth = ScreenUtils.getScreenWidth(context);
TypedArray a = context.getTheme().obtainStyledAttributes(attrs,
R.styleable.SlidingMenu, defStyle, 0);
int n = a.getIndexCount();
for (int i = 0; i < n; i++)
{
int attr = a.getIndex(i);
switch (attr)
{
case R.styleable.SlidingMenu_rightPadding:
// 50
mMenuRightPadding = a.getDimensionPixelSize(attr,
(int) TypedValue.applyDimension(
TypedValue.COMPLEX_UNIT_DIP, 50f,
getResources().getDisplayMetrics()));// 10DP
break;
}
}
a.recycle();
}
세 개의 매개 변수의 구조 방법 중 TypeArray 를 통 해 얻 으 면 됩 니 다~자,이렇게 하면 됩 니 다~사용자 정의 속성 이 많다 면 위의 절차 에 따라 하 시 면 됩 니 다~~
2.메뉴 를 여 는 방법 공개
우선 boolean isOpen 변 수 를 정의 하여 현재 메뉴 의 상 태 를 표시 합 니 다~~그리고 ACTIONUP 시 상태 변경:
case MotionEvent.ACTION_UP:
int scrollX = getScrollX();
if (scrollX > mHalfMenuWidth)
{
this.smoothScrollTo(mMenuWidth, 0);
isOpen = false;
} else
{
this.smoothScrollTo(0, 0);
isOpen = true;
}
return true;
}
다음 추가 방법:
/**
*
*/
public void openMenu()
{
if (isOpen)
return;
this.smoothScrollTo(0, 0);
isOpen = true;
}
/**
*
*/
public void closeMenu()
{
if (isOpen)
{
this.smoothScrollTo(mMenuWidth, 0);
isOpen = false;
}
}
/**
*
*/
public void toggle()
{
if (isOpen)
{
closeMenu();
} else
{
openMenu();
}
}
가 는 김 에 두 개 더...다음은 하 나 를 골 라 테스트 를 진행 하 겠 습 니 다.
홈 레이아웃 에 단 추 를 하나 더 추가 하여 toggleMenu()방법 을 터치 합 니 다.
주 활동
public class MainActivity extends Activity
{
private SlidingMenu mMenu ;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
mMenu = (SlidingMenu) findViewById(R.id.id_menu);
}
public void toggleMenu(View view)
{
mMenu.toggle();
}
}
자,현재 효과 도 를 보 세 요.저희 가 패 딩 을 100 dp 로 바 꿨 어 요.
그리고 저희 버튼 을 눌 러 서 하 효 과 를 보 세 요~
3.ListView 테스트 추가
자~~ListView 도 테스트 끝 났 습 니 다~여러분 은 원 하 는 대로 수정 하 실 수 있 습 니 다~~
참,오늘 테스트 용 QQ 의 목적 은 다음 에 제 가 위의 코드 를 가지 고 QQ 5.0 과 똑 같은 효 과 를 개조 하려 는 것 입 니 다.여러분 이 관심 이 있 으 면 미리 시도 해 보 세 요.QQ 의 메뉴 는 메 인 화면 아래 에 숨겨 져 있 는 것 처럼 그 려 진 것 이 아니 라 는 느낌 을 줄 수 있 습 니 다.우리 의 이 예 도 그런 효 과 를 낼 수 있 으 니 지 켜 보 세 요.나머지 는 다양한 크기 조정,투명도 애니메이션 입 니 다~~
위 내용 은 소 편 이 공유 하 는 안 드 로 이 드 가 사용자 정의 컨트롤 인 Horizontal ScrollView 를 사용 해 역사상 가장 간단 한 사 이 드 메뉴 를 만 드 는 것 으로 도움 이 되 기 를 바 랍 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Kotlin의 기초 - 2부지난 글에서는 Kotlin이 무엇인지, Kotlin의 특징, Kotlin에서 변수 및 데이터 유형을 선언하는 방법과 같은 Kotlin의 기본 개념에 대해 배웠습니다. 유형 변환은 데이터 변수의 한 유형을 다른 데이터...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.