Material Design 시리즈 의 Behavior 위 에서 미끄러져 서 끝 단 추 를 표시 합 니 다.

효과 미리 보기

원본 코드 는 문장의 끝 에 있다.
인용문
때때로 우리 의 페이지 내용 이 너무 길 때,페이지 밑 에 미 끄 러 진 사용자 가 다시 꼭대기 까지 미 끄 러 지 는 것 은 매우 번거롭다.안 드 로 이 드 는 iOS 가 status Bar 를 눌 러 서 꼭대기 로 돌아 갈 수 있 는 것 이 아니 라,일반적으로 Toolbar/ActionBar 를 두 번 누 르 거나 밑 에 단 추 를 놓 는 것 이다.
오늘 은 아래쪽 에 맨 위로 돌아 가 는 단 추 를 놓 습 니 다.그러면 우리 의 전통 적 인 방식 은 바로 이 슬라이딩 뷰 를 감청 하 는 것 이다.예 를 들 어 ScrollView/ListView/RecyclerView/GridView 등 이다.만약 에 우리 가 Coordinator Layout 를 사용한다 면 모든 것 이 매우 so easy 가 될 것 이다.
오늘 우 리 는 사용자 정의 Behavior 를 이용 하여 맨 위로 돌아 가 는 단추 의 점진 적 인 애니메이션 효 과 를 실현 합 니 다.만약 나의 Behavior 박문 에 관심 이 있다 면,관 리 는 문장 상단 에서 나의 Behavior 에 관 한 다른 박문 을 찾 을 수 있다.
사용자 정의 Bahavior 의 실현?
저 희 는 Coordinator Layout.Behavior 를 선택 한 후 ctrl+t 를 선택 한 후에 실현 류 가 많 습 니 다.어떤 것 을 선택 하 시 겠 습 니까?이것 은 우리 가 조작 해 야 할 버튼 이 누구 인지,도대체 시스템 이 이미 실현 한 기본 클래스 를 사용 할 수 있 는 지 를 봐 야 한다.그래서 다음 과 같은 질문 을 던 졌 습 니 다.
Behavior 계승 시스템 의 어떤 BaseBahavior 를 사용자 정의 합 니까?
이 문 제 는 사실 so easy 입 니 다.MD 를 접촉 한 사람 이 FAB 를 들 어 본 적 이 있 을 것 입 니 다.즉,우리 의 FloatingAction Button 입 니 다.그래서 우리 도 FloatingAction Button 을 사용 하기 때문에 우리 가 사용자 정의 한 Behavior 도 FloatingAction Button 을 기반 으로 합 니 다.
그래서 우 리 는 그 중에서 Coordinator Layout.Behavior 후 ctrl+t 에서 FloatingAction Button.Behavior 를 보 았 습 니 다.이 녀석 은 우리 가 계승 해 야 할 것 입 니 다.이 를 이용 하여 FloatingAction Button 의 표시 와 숨겨 진 애니메이션 을 제어 합 니 다.
Scale UpShowBehavior 의 실현
손가락 을 위로 미 끄 러 뜨리 고 아래 부분의 페이지 가 나타 나 버튼 을 표시 하기 때문에 우 리 는 잠시 그것 을 Scale UpShowBehavior 의 실현 이 라 고 부 릅 니 다.
다음 큰 코드 가 왔 습 니 다.우선 FloatingAction Button.Behavior 를 계승 해 야 합 니 다.

public class ScaleUpShowBehavior extends FloatingActionButton.Behavior {
  public ScaleUpShowBehavior(Context context, AttributeSet attrs) {
    super();
  }
}

다음은 이 안의 중요 한 세 가지 방법 을 실현 한다.

//       。
onStartNestedScroll();

//       。
onNestedScroll();

//       。
onStopNestedScroll();

첫 번 째 방법 onStartNested Scroll:

onStartNestedScroll(CoordinatorLayout l, FloatingActionButton c, View directTargetChild, View v, int nestedScrollAxes)

onStartNested Scroll 은 문자 그대로 입 니 다.스크롤 을 시작 할 때 호출 됩 니 다.그러면 이 방법 은 boolean 의 반환 값 이 있 습 니 다.Coordinator Layout 에 게 이 Behavior 가 감청 할 미끄럼 방향 을 알려 주 셔 야 합 니 다.우 리 는 위아래 로 미 끄 러 질 때 FAB 를 표시 하거나 숨 깁 니 다.그래서 여기 서 return nested Scrollaxes==ViewCompat.SCROLLAXIS_VERTICAL;。
두 번 째 방법 onNested Scroll:

onNestedScroll(CoordinatorLayout l, FloatingActionButton child, View target, int dxConsumed, int dyConsumed, int dxUnconsumed, int dyUnconsumed)

응,네가 짐작 한 것 이 맞 아.이 방법 은 미끄럼 기간 에 호출 되 었 는데,바로 미 끄 러 지고 있 는 거 야.so,우 리 는 여기에서 view 의 애니메이션 을 제어 합 니 다.나의 테스트 를 통 해 규칙 을 발견 했다.

if (dyConsumed > 0 && dyUnconsumed == 0) {
  System.out.println("   。。。");
}
if (dyConsumed == 0 && dyUnconsumed > 0) {
  System.out.println("        。。。");
}
if (dyConsumed < 0 && dyUnconsumed == 0) {
  System.out.println("   。。。");
}
if (dyConsumed == 0 && dyUnconsumed < 0) {
  System.out.println("    ，    。。。");
}

따라서 우리 가 있 을 때 위 에서 미 끄 러 집 니 다.즉,사용자 가 페이지 의 아래 부분 을 볼 때 FAB 를 표시 해 야 합 니 다.

if (((dyConsumed > 0 && dyUnconsumed == 0) || (dyConsumed == 0 && dyUnconsumed > 0))
&& child.getVisibility() != View.VISIBLE) {//   
      AnimatorUtil.scaleShow(child, null);
    }

반대로 사용자 의 손가락 이 내 려 가 페이지 의 윗부분 을 표시 할 때 FAB 를 숨 깁 니 다.

if (((dyConsumed < 0 && dyUnconsumed == 0) || (dyConsumed == 0 && dyUnconsumed < 0))
&& child.getVisibility() != View.GONE && !isAnimatingOut) {
      AnimatorUtil.scaleHide(child, viewPropertyAnimatorListener);
    }

그럼 여기 있 는 완전한 코드 는:

@Override
public void onNestedScroll(CoordinatorLayout coordinatorLayout, FloatingActionButton child, View target, int dxConsumed, int dyConsumed, int dxUnconsumed, int dyUnconsumed) {

//    if (dyConsumed > 0 && dyUnconsumed == 0) {
//      System.out.println("   。。。");
//    }
//    if (dyConsumed == 0 && dyUnconsumed > 0) {
//      System.out.println("        。。。");
//    }
//    if (dyConsumed < 0 && dyUnconsumed == 0) {
//      System.out.println("   。。。");
//    }
//    if (dyConsumed == 0 && dyUnconsumed < 0) {
//      System.out.println("    ，    。。。");
//    }

  if (((dyConsumed > 0 && dyUnconsumed == 0) || (dyConsumed == 0
  && dyUnconsumed > 0)) && child.getVisibility() != View.VISIBLE) {//   
    AnimatorUtil.scaleShow(child, null);
  } else if (((dyConsumed < 0 && dyUnconsumed == 0) || (dyConsumed == 0
  && dyUnconsumed < 0)) && child.getVisibility() != View.GONE && !isAnimatingOut) {
    AnimatorUtil.scaleHide(child, viewPropertyAnimatorListener);
  }
}

애니메이션 과 FAB 는 숨겨 진 실현 을 보 여 줍 니 다.
눈치 빠 른 사람 은 분명히 보 았 을 것 이다.우리 위 에서 튀 어 나 온 몇 표 의 알 수 없 는 코드:

AnimatorUtil.scaleShow();
AnimatorUtil.scaleHide();
isAnimatingOut;
viewPropertyAnimatorListener;

이게 무슨 귀신 이지?
Animator Util.scale Show()는 FAB 를 애니메이션 으로 보 여 줍 니 다.이것 은 시스템 이 아니 라 사용자 정의 입 니 다.

//   view
public static void scaleShow(View view, ViewPropertyAnimatorListener viewPropertyAnimatorListener) {
  view.setVisibility(View.VISIBLE);
  ViewCompat.animate(view)
      .scaleX(1.0f)
      .scaleY(1.0f)
      .alpha(1.0f)
      .setDuration(800)
      .setListener(viewPropertyAnimatorListener)
      .setInterpolator(FAST_OUT_SLOW_IN_INTERPOLATOR)
      .start();
}

AnimatorUtil.scaleHide()는 FAB 를 점점 숨 기 는 데 사 용 됩 니 다.물론 우리 가 사용자 정의 애니메이션 이기 도 합 니 다.

//   view
public static void scaleHide(View view, ViewPropertyAnimatorListener viewPropertyAnimatorListener) {
  ViewCompat.animate(view)
      .scaleX(0.0f)
      .scaleY(0.0f)
      .alpha(0.0f)
      .setDuration(800)
      .setInterpolator(FAST_OUT_SLOW_IN_INTERPOLATOR)
      .setListener(viewPropertyAnimatorListener)
      .start();
}

view Property Animator Listener 와 isAnimating Out 은 숨겨 진 애니메이션 의 실행 을 감청 하 는 데 사 용 됩 니 다.애니메이션 이 실 행 된 후에 야 view.set Visibility(View.GONE);자,이게 방법 이 군.하하:

private boolean isAnimatingOut = false;

ViewPropertyAnimatorListener viewPropertyAnimatorListener = new ViewPropertyAnimatorListener() {

  @Override
  public void onAnimationStart(View view) {
    isAnimatingOut = true;
  }

  @Override
  public void onAnimationEnd(View view) {
    isAnimatingOut = false;
    view.setVisibility(View.GONE);
  }

  @Override
  public void onAnimationCancel(View arg0) {
    isAnimatingOut = false;
  }
};

Scale UpShowBehavior 사용
우선 우 리 는 시스템 처럼 String.xml 에서 값 을 정의 합 니 다.

 com.yanzhenjie.definebehavior.behavior.ScaleUpShowBehavior

그리고 xml 레이아웃 에서 사용:

<android.support.design.widget.FloatingActionButton
  android:id="@+id/fab"
  ...
  app:layout_behavior="@string/scale_up_show_behavior" />

물론 당신 도 xml 레이아웃 에 이러한 종류의 전체 이름 을 직접 쓰 지만 이런 식 으로 하면 나중에 이런 종류의 가방 을 수정 하 는 데 불리 합 니 다.
app:layout_behavior="com.yanzhenjie.definebehavior.behavior.ScaleUpShowBehavior"
자,잔 소 리 를 다 했 습 니 다.이 레이아웃 의 전체 코드 를 훑 어보 세 요.

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:layout_height="match_parent">

  <android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
      android:id="@+id/toolbar"
      android:layout_width="match_parent"
      android:layout_height="?attr/actionBarSize"
      app:popupTheme="@style/AppTheme.PopupOverlay" />
  </android.support.design.widget.AppBarLayout>

  <android.support.v7.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

  <android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    android:layout_margin="16dp"
    android:src="@mipmap/abc_ic_ab_back_top"
    app:layout_behavior="@string/scale_up_show_behavior"
    app:layout_scrollFlags="scroll|enterAlways|snap" />

</android.support.design.widget.CoordinatorLayout>

그리고 RecyclerView 에 아무 데 이 터 를 주 고 뛰 어 다 녀 보 세 요.하하,완벽 하지 않 나 요?
참,어떤 친구 들 은 activity 가 실행 되 자마자 이 FAB 를 보 았 기 때문에 우 리 는 onWindow FocusChanged()에 숨겨 야 합 니 다.

private boolean isInitializeFAB = false;

@Override
public void onWindowFocusChanged(boolean hasFocus) {
  super.onWindowFocusChanged(hasFocus);
  if (!isInitializeFAB) {
    isInitializeFAB = true;
    hideFAB();
  }
}

private void hideFAB() {
  FAB.postDelayed(new Runnable() {
    @Override
    public void run() {
      AnimatorUtil.scaleHide(FAB, new ViewPropertyAnimatorListener() {
        @Override
        public void onAnimationStart(View view) {
        }
        @Override
        public void onAnimationEnd(View view) {
          FAB.setVisibility(View.GONE);
        }
        @Override
        public void onAnimationCancel(View view) {
        }
      });
    }
  }, 500);
}

완벽 해!
원본 다운로드:http://xiazai.jb51.net/201609/yuanma/AndroidBehavior(jb51.net).rar
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.