Android App 에서 오른쪽으로 미 끄 러 지 는 소각 기능 을 실현 하 는 요점 분석
Scroller 와 View 의 scrollBy()와 scrollTo()의 사용 에 익숙 하 십 니까?제 가 예전 에 Scroller 류 의 미끄럼 실현 원 리 를 소 개 했 습 니 다.Android 는 Scroller 의 스크롤 실현 원 리 를 소스 코드 의 측면 에서 해석 할 수 있 도록 해 주 었 습 니 다.그 안에서 scrollBy()와 scrollto()방법 도 소 개 했 습 니 다.모 르 는 친구 들 은 이 효 과 를 실현 하 는 데 큰 도움 이 되 었 습 니 다.scrollBy()와 scrollto()를 아 는 친구 들 은 알 아야 합 니 다.어떤 View(예 를 들 어 Button)를 굴 리 려 면 이 View(Button)의 scrollBy()방법 을 직접 호출 합 니 다.이 View(Button)를 굴 리 는 것 이 아니 라 이 View 의 내용(Button 위의 문자)을 굴 리 는 것 입 니 다.따라서 View 를 전체적으로 굴 리 려 면 View 의 부모 레이아웃 에 scrollBy()방법 을 사용 하여 이 글 로 돌아 가 야 합 니 다.만약 에 우리 가 Activity 를 스크롤 하려 면 이 Activity 레이아웃 파일 의 맨 위 레이아웃 의 부모 레이아웃 을 스크롤 해 야 합 니 다.
예 를 들 어 아래 XML 레이아웃 파일
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical" >
</LinearLayout>
만약 에 우리 가 LinearLayout 를 스크롤 하면 우리 가 원 하 는 효 과 를 실현 하지 못 하고 LinearLayout 안의 내용 이나 하위 View 만 스크롤 할 수 있 기 때문에 LinearLayout 의 getParent()방법 으로 부모 레이아웃 을 가 져 와 야 합 니 다.사실은 안 드 로 이 드 시스템 은 우리 의 레이아웃 파일 의 맨 바깥쪽 에 FrameLayout 를 설치 합 니 다.그래서 저 희 는 사실 FrameLayout 를 굴 리 면 돼 요.실현 의 원 리 를 알 게 된 후에 코드 를 작성 합 시다.먼저 안 드 로 이 드 프로젝트 를 새로 만 들 고 Silding Finish 라 는 이름 을 지 었 습 니 다.
우리 의 요 구 는 한 인터페이스 에서 이 미끄럼 전환 효 과 를 제공 하 는 것 이 아 닐 수 있 기 때문에 우 리 는 이 부분 이 미 끄 러 지 는 논 리 를 추출 해 야 합 니 다.저 는 그 에 게 확장 Relative Layout 의 사용자 정의 레이아웃 인 Silding FinishLayout 를 썼 습 니 다.먼저 우 리 는 그 코드 를 봅 니 다.
package com.example.view;
import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewConfiguration;
import android.view.ViewGroup;
import android.widget.AbsListView;
import android.widget.RelativeLayout;
import android.widget.ScrollView;
import android.widget.Scroller;
/**
* RelativeLayout, IOS ,
* , Activity SildingFinishLayout,
* setTouchView() View
*
* @author xiaanming
*
* @blog http://blog.csdn.net/xiaanming
*
*/
public class SildingFinishLayout extends RelativeLayout implements
OnTouchListener {
/**
* SildingFinishLayout
*/
private ViewGroup mParentView;
/**
* View
*/
private View touchView;
/**
*
*/
private int mTouchSlop;
/**
* X
*/
private int downX;
/**
* Y
*/
private int downY;
/**
* X
*/
private int tempX;
/**
*
*/
private Scroller mScroller;
/**
* SildingFinishLayout
*/
private int viewWidth;
/**
*
*/
private boolean isSilding;
private OnSildingFinishListener onSildingFinishListener;
private boolean isFinish;
public SildingFinishLayout(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public SildingFinishLayout(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
mTouchSlop = ViewConfiguration.get(context).getScaledTouchSlop();
mScroller = new Scroller(context);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
super.onLayout(changed, l, t, r, b);
if (changed) {
// SildingFinishLayout
mParentView = (ViewGroup) this.getParent();
viewWidth = this.getWidth();
}
}
/**
* OnSildingFinishListener, onSildingFinish() finish Activity
*
* @param onSildingFinishListener
*/
public void setOnSildingFinishListener(
OnSildingFinishListener onSildingFinishListener) {
this.onSildingFinishListener = onSildingFinishListener;
}
/**
* Touch View
*
* @param touchView
*/
public void setTouchView(View touchView) {
this.touchView = touchView;
touchView.setOnTouchListener(this);
}
public View getTouchView() {
return touchView;
}
/**
*
*/
private void scrollRight() {
final int delta = (viewWidth + mParentView.getScrollX());
// startScroll , computeScroll() scrollTo item
mScroller.startScroll(mParentView.getScrollX(), 0, -delta + 1, 0,
Math.abs(delta));
postInvalidate();
}
/**
*
*/
private void scrollOrigin() {
int delta = mParentView.getScrollX();
mScroller.startScroll(mParentView.getScrollX(), 0, -delta, 0,
Math.abs(delta));
postInvalidate();
}
/**
* touch View AbsListView, ListView, GridView
*
* @return
*/
private boolean isTouchOnAbsListView() {
return touchView instanceof AbsListView ? true : false;
}
/**
* touch view ScrollView
*
* @return
*/
private boolean isTouchOnScrollView() {
return touchView instanceof ScrollView ? true : false;
}
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
downX = tempX = (int) event.getRawX();
downY = (int) event.getRawY();
break;
case MotionEvent.ACTION_MOVE:
int moveX = (int) event.getRawX();
int deltaX = tempX - moveX;
tempX = moveX;
if (Math.abs(moveX - downX) > mTouchSlop
&& Math.abs((int) event.getRawY() - downY) < mTouchSlop) {
isSilding = true;
// touchView AbsListView,
// , item , item
if (isTouchOnAbsListView()) {
MotionEvent cancelEvent = MotionEvent.obtain(event);
cancelEvent
.setAction(MotionEvent.ACTION_CANCEL
| (event.getActionIndex() << MotionEvent.ACTION_POINTER_INDEX_SHIFT));
v.onTouchEvent(cancelEvent);
}
}
if (moveX - downX >= 0 && isSilding) {
mParentView.scrollBy(deltaX, 0);
// ListView ScrollView
if (isTouchOnScrollView() || isTouchOnAbsListView()) {
return true;
}
}
break;
case MotionEvent.ACTION_UP:
isSilding = false;
if (mParentView.getScrollX() <= -viewWidth / 2) {
isFinish = true;
scrollRight();
} else {
scrollOrigin();
isFinish = false;
}
break;
}
// touch view AbsListView ScrollView
// AbsListView, ScrollView
if (isTouchOnScrollView() || isTouchOnAbsListView()) {
return v.onTouchEvent(event);
}
// true
return true;
}
@Override
public void computeScroll() {
// startScroll scroller.computeScrollOffset() true,
if (mScroller.computeScrollOffset()) {
mParentView.scrollTo(mScroller.getCurrX(), mScroller.getCurrY());
postInvalidate();
if (mScroller.isFinished()) {
if (onSildingFinishListener != null && isFinish) {
onSildingFinishListener.onSildingFinish();
}
}
}
}
public interface OnSildingFinishListener {
public void onSildingFinish();
}
}
저 희 는 onLayout()방법 에서 getParent()방법 으로 이 레이아웃 의 부모 레이아웃 을 가 져 오고 컨트롤 의 폭 을 가 져 옵 니 다.주로 다음 실현 을 위 한 준비 작업 입 니 다.우리 의 미끄럼 논 리 는 주로 View 의 scrollBy()방법,scrollTo()방법 과 Scroller 류 를 이용 하여 이 루어 집 니 다.손가락 이 보 기 를 끌 때 손가락 이 화면 에서 미 끄 러 지 는 거 리 를 감청 합 니 다.View 의 scrollBy()방법 으로 View 는 손가락 이 미 끄 러 지면 서 미 끄 러 집 니 다.손가락 이 화면 을 떠 날 때스크롤 러 류 startScroll()방법 을 논리 적 으로 사용 하여 미 끄 러 지 는 인 자 를 설정 한 다음 View 의 scrollTo 에 따라 스크롤 합 니 다.
View 의 미끄럼 에 대해 Touch 이벤트 소비의 처리 등 문제 가 존재 하기 때문에 우 리 는 View 의 전체 Touch 사건 에 대해 잘 알 아야 한다.가장 중요 한 것 은 Activity 안에 ListView,GridView,ScrollView 등 컨트롤 이 있다 는 것 이다.만약 에 우리 Activity 에 ListView,GridView 등 컨트롤 이 존재 한다 면우 리 는 Activity 의 가장 바깥쪽 구 조 를 구 르 는 것 은 전혀 효과 가 없다.Touch 사건 이 ListView,GridView 등 컨트롤 에 의 해 소비 되 었 기 때문에 Activity 의 가장 바깥쪽 구 조 는 Touch 사건 을 얻 지 못 하고 Touch 논 리 를 실현 하지 못 하기 때문에 이 Touch 사건 문 제 를 해결 하기 위해 setTouch View(View touch View)방법 을 제공 했다.이 방법 은 Touch 사건 을 View 위 에 동적 으로 설정 하 는 것 이기 때문에 위의 문제 에 대해 우 리 는 OnTouch Listener 를 ListView,GridView 위 에 직접 설정 합 니 다.이렇게 하면 Activity 의 가장 바깥쪽 에서 Touch 사건 을 받 아들 이지 못 하 는 문 제 를 피 할 수 있 습 니 다.
다음은 onTouch()방법 을 보 겠 습 니 다.
일단 저희 가 ACTION 에서...DOWN 기록 누 른 X,Y 좌표
그리고 ACTIONMOVE 에 서 는 만약 에 우리 가 수평 방향 에서 미 끄 러 지 는 거리 가 mTouchSlop 보다 크 고 수직 방향 에서 미 끄 러 지 는 거리 가 mTouchSlop 보다 작 으 면 Activity 가 미 끄 러 지 는 상태 에 있다 는 것 을 나타 낸다.만약 에 touch View 가 ListView,GridView 또는 그 하위 클래스 일 때 우리 의 손가락 이 ListView,GridView 위 에 있 고 item 의 클릭 사건 이 발생 함 에 따라그래서 저희 가 터치 뷰 에 ACTION 을 설 치 했 습 니 다.CANCEL 은 item 의 클릭 이 벤트 를 취소 하고 이 레이아웃 의 부모 레이아웃 을 scrollBy()로 스크롤 합 니 다.또한 TouchView 가 AbsListView 또는 ScrollView 라면 true 로 돌아 가 AbsListView 또는 ScrollView 자체 의 ACTION 을 취소 합 니 다.MOVE 사건 의 가장 직관 적 인 느낌 은 바로 우리 가 활동 을 미 끄 러 뜨 릴 때 AbsListView 나 ScrollView 의 상하 미끄럼 을 금지 하 는 것 이다.
마지막 으로 ACTIONUP 에 서 는 손가락 이 미 끄 러 지 는 거리 가 컨트롤 길이 의 2 분 의 1 이상 이면 Activity 를 화면 에서 미 끄 러 뜨리 는 것 을 의미 합 니 다.그렇지 않 으 면 시작 위치 로 미 끄 러 집 니 다.저 희 는 Scroller 류 의 startScroll()방법 으로 시작 위치,미끄럼 거리 와 시간 을 설정 한 다음 에 post Invaidate()를 호출 하여 화면 을 새로 고침 한 다음 에 coptute Scroll()방법 으로 갑 니 다.우 리 는 scrollto()방법 을 이용 하여 이 레이아웃 의 부모 레이아웃 을 스크롤 합 니 다.스크롤 이 끝 난 후에 인터페이스 가 화면 에서 미 끄 러 지 는 지 여 부 를 판단 합 니 다.만약 에 OnSilding Finish Listener 인터페이스의 onSilding Finish()방법 을 호출 하면 됩 니 다.따라서 onSilding Finish()방법 에서 finish 인터페이스 만 사용 하면 됩 니 다.
전체 슬라이딩 레이아웃 의 코드 가 바로 이 모양 입 니 다.그 다음 에 우 리 는 사용 하 겠 습 니 다.메 인 인터페이스 Activity 는 세 개의 버튼 만 있 고 각각 일반 레이아웃 의 Activity 로 이동 합 니 다.ListView 의 Activity 와 ScrollView 가 있 는 Activity 가 있 습 니 다.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical" >
<Button
android:id="@+id/normal_activity"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text=" Activity" />
<Button
android:id="@+id/absListview_activity"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text=" AbsListView Activity" />
<Button
android:id="@+id/scrollview_activity"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text=" ScrollView Activity" />
</LinearLayout>
그 다음 에 MainActivity 의 코드 입 니 다.ID 에 따라 Button 을 예화 한 다음 에 Button 에 OnClickListener 이 벤트 를 설정 하고 서로 다른 단 추 를 누 르 면 서로 다른 Activity 로 이동 한 다음 에 오른쪽 에서 왼쪽으로 미 끄 러 지 는 애니메이션 을 설정 하고 onBackPressed()방법 을 다시 씁 니 다.핸드폰 물리 키보드 의 반환 단 추 를 누 르 면 왼쪽 에서 오른쪽으로 미 끄 러 지 는 애니메이션 을 추가 합 니 다.
package com.example.slidingfinish;
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.Button;
import com.example.slidingfinish.R;
public class MainActivity extends Activity implements OnClickListener {
@Override
protected void onCreate(Bundle savedInstanceState) {
requestWindowFeature(Window.FEATURE_NO_TITLE);
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button mButtonNormal = (Button) findViewById(R.id.normal_activity);
mButtonNormal.setOnClickListener(this);
Button mButtonAbs = (Button) findViewById(R.id.absListview_activity);
mButtonAbs.setOnClickListener(this);
Button mButtonScroll = (Button) findViewById(R.id.scrollview_activity);
mButtonScroll.setOnClickListener(this);
}
@Override
public void onClick(View v) {
Intent mIntent = null;
switch (v.getId()) {
case R.id.normal_activity:
mIntent = new Intent(MainActivity.this, NormalActivity.class);
break;
case R.id.absListview_activity:
mIntent = new Intent(MainActivity.this, AbsActivity.class);
break;
case R.id.scrollview_activity:
mIntent = new Intent(MainActivity.this, ScrollActivity.class);
break;
}
startActivity(mIntent);
overridePendingTransition(R.anim.base_slide_right_in, R.anim.base_slide_remain);
}
//Press the back button in mobile phone
@Override
public void onBackPressed() {
super.onBackPressed();
overridePendingTransition(0, R.anim.base_slide_right_out);
}
}
여기에 ListView 가 포 함 된 Activity 코드 를 붙 여 놓 았 습 니 다.레이아웃 을 먼저 보고 슬라이딩 레이아웃 을 사용자 정의 합 니 다.Silding Finish Layout 는 XML 의 맨 위 에 놓 아야 합 니 다.
<?xml version="1.0" encoding="UTF-8"?>
<com.example.view.SildingFinishLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/sildingFinishLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#556677" >
<ListView
android:id="@+id/listView"
android:cacheColorHint="@android:color/transparent"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</ListView>
</com.example.view.SildingFinishLayout>
package com.example.slidingfinish;
import java.util.ArrayList;
import java.util.List;
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import com.example.slidingfinish.R;
import com.example.view.SildingFinishLayout;
import com.example.view.SildingFinishLayout.OnSildingFinishListener;
public class AbsActivity extends Activity {
private List<String> list = new ArrayList<String>();
@Override
protected void onCreate(Bundle savedInstanceState) {
requestWindowFeature(Window.FEATURE_NO_TITLE);
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_abslistview);
for (int i = 0; i <= 30; i++) {
list.add(" " + i);
}
ListView mListView = (ListView) findViewById(R.id.listView);
ArrayAdapter<String> adapter = new ArrayAdapter<String>(
AbsActivity.this, android.R.layout.simple_list_item_1, list);
mListView.setAdapter(adapter);
SildingFinishLayout mSildingFinishLayout = (SildingFinishLayout) findViewById(R.id.sildingFinishLayout);
mSildingFinishLayout
.setOnSildingFinishListener(new OnSildingFinishListener() {
@Override
public void onSildingFinish() {
AbsActivity.this.finish();
}
});
// touchView ListView
mSildingFinishLayout.setTouchView(mListView);
mListView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
startActivity(new Intent(AbsActivity.this, NormalActivity.class));
overridePendingTransition(R.anim.base_slide_right_in,
R.anim.base_slide_remain);
}
});
}
// Press the back button in mobile phone
@Override
public void onBackPressed() {
super.onBackPressed();
overridePendingTransition(0, R.anim.base_slide_right_out);
}
}
ID 를 이용 하여 Silding FinishLayout 인 스 턴 스 를 찾 고 setTouchView()방법 으로 touch View 를 ListView 위 에 설정 한 다음 setOnSilding FinishListener()를 호출 하여 OnSilding FinishListener 를 설정 하고 onSilding Finish()에서 finish 인터페이스 를 사용 하면 됩 니 다.프로젝트 를 실행 하기 전에 중요 한 동작 이 하나 더 있 습 니 다.그리고 제 가 카드 에 걸 린 문 제 는 바로 Activity 를 투명 하 게 설정 해 야 한 다 는 것 입 니 다.즉,테마 android:theme="@android:style/theme.Translucent"를 설정 해 야 합 니 다.
<activity
android:name=".AbsActivity"
android:theme="@android:style/Theme.Translucent" >
</activity>
<activity
android:name=".NormalActivity"
android:theme="@android:style/Theme.Translucent" >
</activity>
<activity
android:name=".ScrollActivity"
android:theme="@android:style/Theme.Translucent" >
</activity>
자,이제 우 리 는 프로젝트 를 실행 해서 효 과 를 볼 수 있 습 니 다.
바로 우리 가 원 하 는 효과 입 니 다.미끄럼 전환 인터페이스 효 과 를 넣 으 려 면 세 단계 만 있 으 면 됩 니 다.먼저 Activity 레이아웃 의 가장 바깥쪽 을 Silding Finish Layout 로 수정 한 다음 에 Activity 에서 setTouch View()방법 으로 touch View 를 설정 하고 OnSilding FinishListener 감청 을 onSilding Finish()방법 에서 finish 인터페이스 로 설정 합 니 다.마지막 으로 Activity 의 배경 을 투명 하 게 설정 합 니 다.(Activity 레이아웃 파일 을 설정 한 최상 위 레이아웃 배경 색상 이 투명 한 것 이 아니 라 구분 해 야 합 니 다.)편리 하지 않 습 니까?자,오늘 의 설명 은 여기까지 입 니 다~
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Bitrise에서 배포 어플리케이션 설정 테스트하기이 글은 Bitrise 광고 달력의 23일째 글입니다. 자체 또는 당사 등에서 Bitrise 구축 서비스를 사용합니다. 그나저나 며칠 전 Bitrise User Group Meetup #3에서 아래 슬라이드를 발표했...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.