Material Design 시리즈 의 Behavior 는 결제 암호 창 과 상품 속성 선택 효 과 를 실현 합 니 다.

오늘 의 효 과 는 알 리 페 이,타 오 바 오,징 둥 등 전자상거래 앱 에서 흔히 볼 수 있다.예 를 들 어 알 리 페 이 가 비밀번호 창 을 입력 하고 쇼핑 몰 에서 주문 할 때 상품 속성 을 선택 할 때 아래 에서 PopupWindow 가 떠 올 랐 습 니 다.그러면 오늘 은 Behavior 로 이 두 가지 효 과 를 실현 하 겠 습 니 다.그 결과 코드 가 한 줄 만 필요 하 다 는 것 을 알 게 될 것 입 니 다.
현재 사용 하고 있 는 앱 정리:
1.알 리 페 이 팝 업 을 모방 하여 결제 비밀 번 호 를 입력 합 니 다.
2.타 오 바 오/티몰 팝 업 상품 속성 선택 상자.
3.첫 페이지 가 위아래 로 미 끄 러 지 는 것 을 알 고 있 습 니 다.ToolBar 와 Navigation Bar 를 숨 깁 니 다.
4. …
시리즈 블 로그:
1.Material Design 시리즈,Behavior 의 BottomSheet Behavior 와 BottomSheet Dialog
2.Material Design 시리즈,Behavior 의 SwipeDismiss Behavior
3.Material Design 시리즈,사용자 정의 Behavior 위 미끄럼 표시 끝 단추
4.Material Design 시리즈,사용자 정의 Behavior 구현 Android 알 기 홈 페이지
5.Material Design 시리즈,사용자 정의 동작 지원 모든 보기
효과 미리 보기

인용문
제 기술 군 에서 친구 들 이 Behavior 에 대해 토론 을 했 습 니 다.저도 놀 러 갔 고 저도 Behavior 에 대해 시리즈 블 로 그 를 썼 습 니 다.Behavior 를 선택 하고 ctrol+t 를 선택 한 후에 Behavior 의 실현 유형 을 발 견 했 습 니 다.BottomSheet Behavior,저 는 Android 홈 페이지 에 가서 자 료 를 뒤 져 보 았 습 니 다.뒤 져 보 니 서 프 라 이 즈 를 발 견 했 습 니 다.다음은 이 서 프 라 이 즈 를 소개 하 겠 습 니 다.
더 많은 글 은 구 글/바 이 두 에서 내 이름 을 검색 하 세 요:엄 진 걸 씨,1 위 는 바로 저 입 니 다.
BottomSheet Behavior 어떻게 해 요?
이 게임 을 하려 면 먼저 Behavior 가 Coordinator Layout 의 하위 View 인 Layout Params(이 유 를 보고 설명)이기 때문에 Coordinator Layout 는 절대 없어 서 는 안 됩 니 다.먼저 전체 레이아웃 을 보 여 드 리 겠 습 니 다.

<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>

 <LinearLayout
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:layout_above="@+id/tab_layout"
 android:gravity="center"
 android:orientation="vertical"
 app:layout_behavior="@string/appbar_scrolling_view_behavior">

 <Button
  android:id="@+id/btn_bottom_sheet_control"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:text="sheet   /  " />

 </LinearLayout>

 <LinearLayout
 android:id="@+id/tab_layout"
 android:layout_width="match_parent"
 android:layout_height="?actionBarSize"
 android:layout_alignParentBottom="true"
 android:background="@android:color/holo_purple"
 app:layout_behavior="@string/bottom_sheet_behavior">

 <Button
  android:layout_width="0dp"
  android:layout_height="match_parent"
  android:layout_weight="1"
  android:text="  " />

 <Button
  android:layout_width="0dp"
  android:layout_height="match_parent"
  android:layout_weight="1"
  android:text="  " />

 <Button
  android:layout_width="0dp"
  android:layout_height="match_parent"
  android:layout_weight="1"
  android:text="  " />

 <Button
  android:layout_width="0dp"
  android:layout_height="match_parent"
  android:layout_weight="1"
  android:text="  " />
 </LinearLayout>

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

대충 소개 하 겠 습 니 다.페이지 에는 Toolbar 와 하나의 Button:sheet 표시/숨 기기,그리고 android:id="@+id/tab 만 볼 수 있 습 니 다.layot"이 레이아웃 은 가로 입 니 다.Behavior:app:layot 를 설정 하 였 습 니 다.behavior="@string/bottom_sheet_behavior",테스트 를 통 해 tab 를 주지 않 으 면layot 는 BottomSheet Behavior 를 설정 합 니 다.전체 페이지 의 상단 에 떠 있 고 Toolbar 아래 에 있 습 니 다.BottomSheet Behavior 를 설정 하면 BottomSheet Behavior 에 의 해 자동 으로 페이지 아래쪽 밖으로 이동 하기 때문에 페이지 에 서 는 android:id="@+id/tab 가 보이 지 않 습 니 다.레이아웃
페이지 가 다 그 려 졌 는데,설마 그것 이 자동 으로 꺼 질 까요?어떻게 그것 의 열 림 과 닫 기 를 제어 합 니까?그러면 우 리 는 이 물건 의 실제 모습 을 살 펴 보 겠 습 니 다.제 가 안 드 로 이 드 의 공식 api 를 보면 BottomSheet Behavior 라 는 물건 은 정태 적 인 방법 이 있 습 니 다.BottomSheet Behavior.from(View)는 이 View 가 인용 한 BottomSheet Behavior 를 되 돌려 줍 니 다.

public static <V extends View> BottomSheetBehavior<V> from(V view) {
 ViewGroup.LayoutParams params = view.getLayoutParams();
 if (!(params instanceof CoordinatorLayout.LayoutParams)) {
 throw new Exception("The view is not a child of CoordinatorLayout");
 }
 CoordinatorLayout.Behavior behavior = params.getBehavior();
 if (!(behavior instanceof BottomSheetBehavior)) {
 throw new IllegalArgumentException("...");
 }
 return (BottomSheetBehavior<V>) behavior;
}

이 방법 은 이 View 가 Coordinator Layout 의 하위 View 인지 확인 합 니 다.그렇다면 이 View 의 Behavior 를 받 을 수 있 습 니 다.그래서 여러분 도 왜 제 가 처음에 Behavior 를 Coordinator Layout 서브 View 의 Layout Params 라 고 말 했 는 지 알 아야 합 니 다.
다음은 이 물건 을 받 은 후에 어떻게 사용 하 는 지 봅 시다.

private BottomSheetBehavior mBottomSheetBehavior;

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.bsbehavior_activity);
 Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
 setSupportActionBar(toolbar);
 getSupportActionBar().setDisplayHomeAsUpEnabled(true);

 findViewById(R.id.btn_bottom_sheet_control).setOnClickListener(onClickListener);
 //     tab_layout   BottomSheetBehavior
 mBottomSheetBehavior = BottomSheetBehavior.from(findViewById(R.id.tab_layout));
}
findViewById(R.id.btn_bottom_sheet_control).setOnClickListener(onClickListener);방금 말 한 페이지 의 Button 에 감청 을 설정 한 것 입 니 다.이 버튼 으로 tab 을 제어 합 니 다.layot 의 표시 와 숨 김.
나 는 그것 이 의존 하 는 View 의 현재 상 태 를 얻 을 수 있 는 방법 이 있다 는 것 을 발견 했다.mBottomSheet Behavior.getState()는 소스 코드 를 뒤 져 본 후에 그 반환 값 이 다음 과 같은 몇 가지 가 있 음 을 발견 했다.

/**
 * The bottom sheet is dragging.
 */
public static final int STATE_DRAGGING = 1;

/**
 * The bottom sheet is settling.
 */
public static final int STATE_SETTLING = 2;

/**
 * The bottom sheet is expanded.
 */
public static final int STATE_EXPANDED = 3;

/**
 * The bottom sheet is collapsed.
 */
public static final int STATE_COLLAPSED = 4;

/**
 * The bottom sheet is hidden.
 */
public static final int STATE_HIDDEN = 5;

내 가 STATE 를 보 았 을 때EXPANDED 와 STATECOLLAPSED 는 그 용법 을 알 게 되 었 습 니 다.펼 치고 숨 기 는 것 이 아 닙 니까?그래서 우 리 는 이 상 태 를 판단 합 니 다.숨 기 면 표시 하고 표시 하면 숨 깁 니 다.

@Override
public void onClick(View v) {
 if (v.getId() == R.id.btn_bottom_sheet_control) {
 if (mBottomSheetBehavior.getState() == BottomSheetBehavior.STATE_EXPANDED) {
  mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
 } else if (mBottomSheetBehavior.getState() == BottomSheetBehavior.STATE_COLLAPSED) {
  mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
 }
 }
}

여기까지 첫 페이지 에 있 는 Bottom 의 숨겨 진 모습 과 디 스 플레이 를 알 고 놀 았 습 니 다.알 리 페 이 타 오 바 오의 아래 탄창 이 어떻게 실현 되 는 지 살 펴 보 겠 습 니 다.
BottomSheetDialog 는 어떻게 합 니까?
이런 발견 도 안 드 로 이 드 홈 페이지 에서 BottomSheet Behavior 를 검색 할 때 발 견 된 것 입 니 다.BottomSheet Dialog 를 보 자마자 마음 이 미 친 듯 이 기뻐 했 습 니 다.나중에 제 가 검증 한 결과 효과 가 제 가 예상 한 것 과 똑 같 습 니 다.Dialog 라면 용법 은 일반 Dialog 와 다 를 바 가 없 을 것 입 니 다.
그리고 나 서 나 는 뉴 를 따라 BottomSheetDialog 를 만 들 었 다.

private BottomSheetDialog mBottomSheetDialog;

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 ...

 createBottomSheetDialog();
}

private void createBottomSheetDialog() {
 mBottomSheetDialog = new BottomSheetDialog(this);
 View view = LayoutInflater.from(this).inflate(R.layout.dialog_bottom_sheet, null, false);
 mBottomSheetDialog.setContentView(view);

 RecyclerView recyclerView = (RecyclerView) view.findViewById(R.id.recyclerView);
 ...
 recyclerView.setAdapter(adapter);
}

View 안 은 RecyclerView 입 니 다.

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.RecyclerView xmlns:android="http://schemas.android.com/apk/res/android"
 android:id="@+id/recyclerView"
 android:layout_width="match_parent"
 android:layout_height="match_parent" />

그리고 아래 코드 로 표시 와 숨 김 을 제어 합 니 다.

if (mBottomSheetDialog.isShowing()) {
 mBottomSheetDialog.dismiss();
} else {
 mBottomSheetDialog.show();
}

이 Dialog Show 가 나 왔 을 때 반 을 보 여 주 었 습 니 다.네,이 효과 가 정말 좋 습 니 다.그러면 우리 가 처음에 말 한 알 리 페 이 비밀번호 팝 업 창 과 타 오 바 오/티몰 상품 속성 선택 에 이 르 렀 습 니 다.우리 가 미 끄 러 질 때 아래 에 내용 이 있 으 면 EXPANDED 가 됩 니 다.일반적인 View(비 RecyclerView,Nested ScrollView)라면 계속 위로 미 끄 러 지지 않 고 아래 내용 은 계속 따라 나 오지 만 아래로 미 끄 러 져 숨 길 수도 있 고 dismiss 와 close 로 닫 을 수도 있 습 니 다.
BottomSheetDialog 의 신 갱
정 겨 운 프로그래머 로 서 제 가 밟 았 던 구덩이 와 해결 방안 을 여러분 과 공유 하 겠 습 니 다.
나 는 이 Dilaog 가 열 리 고 닫 히 면 Dialog.show()로 다시 열 수 없다 는 것 을 알 았 다.왜 일 까?
나 는 BottomSheetDialog 소스 코드 를 읽 고 다음 과 같은 코드 를 발견 했다.

 @Override
public void setContentView(View view, ViewGroup.LayoutParams params) {
 super.setContentView(wrapInBottomSheet(0, view, params));
}

private View wrapInBottomSheet(int layoutResId, View view, ViewGroup.LayoutParams params) {
 final CoordinatorLayout coordinator = View.inflate(getContext(),R.layout...., null);
 FrameLayout bottomSheet = (FrameLayout) coordinator.findViewById(R.id.design_bottom_sheet);
 BottomSheetBehavior.from(bottomSheet).setBottomSheetCallback(mBottomSheetCallback);
 ...
 return coordinator;
}

private BottomSheetCallback mBottomSheetCallback = new BottomSheetCallback() {
 @Override
 public void onStateChanged(@NonNull View bottomSheet, int newState) {
 if (newState == BottomSheetBehavior.STATE_HIDDEN) {
  dismiss();
 }
 }

 @Override
 public void onSlide(@NonNull View bottomSheet, float slideOffset) {
 }
};

즉,시스템 의 BottomSheetDialog 는 BottomSheetBehavior 를 기반 으로 포 장 된 것 으로,여기 서 우리 가 미끄러져 BottomSheetBehavior 의 View 를 숨 긴 후 내부 에 BottomSheetBehavior 가 설 치 된 상 태 를 STATE 로 판단 했다.HIDDEN,이어서 Dialog 를 닫 아 주 었 습 니 다.그래서 dialog.show()를 다시 호출 할 때 Dialog 는 이 상태 에서 HIDE 인 dialog 를 열 수 없습니다.
여기에 의문 이 하나 있다.
Google 은 왜 BottomSheetCallback 인 터 페 이 스 를 자체 적 으로 설정 하지 않 았 습 니까?
괜 찮 습 니 다.소스 코드 를 보면 간단 합 니 다.저희 가 직접 실현 하고 사용자 가 미 끄 러 지 는 것 을 듣 고 BottomSheetDialog 를 닫 은 후에 저 희 는 BottomSheetBehavior 의 상 태 를 BottomSheetBehavior.STATE 로 설정 합 니 다.COLLAPSED,즉 반 열 린 상태(BottomSheet Behavior.STATEEXPANDED 는 모두 열기)원본 코드 에 따라 설정 방법 을 제공 합 니 다.

private void setBehaviorCallback() {
 View view = mBottomSheetDialog.getDelegate().findViewById(android.support.design.R.id.design_bottom_sheet);
 final BottomSheetBehavior bottomSheetBehavior = BottomSheetBehavior.from(view);
 bottomSheetBehavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
 @Override
 public void onStateChanged(@NonNull View bottomSheet, int newState) {
  if (newState == BottomSheetBehavior.STATE_HIDDEN) {
  mBottomSheetDialog.dismiss();
  bottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
  }
 }
 @Override
 public void onSlide(@NonNull View bottomSheet, float slideOffset) {
 }
 });
}

이렇게 해서 BottomSheetDialog 가 닫 힌 후에 다시 열 수 없 는 문 제 를 해결 했다.
원본 다운로드:http://xiazai.jb51.net/201609/yuanma/AndroidBehavior(jb51.net).rar
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.

좋은 웹페이지 즐겨찾기