Android 구현 배경 슬라이딩 로그 인 인터페이스(배경 팝 업 키 보드 를 압축 하지 않 음)

쓸데없는 말 은 그만 하고 실현 후의 효 과 를 살 펴 보 자.

사고의 방향 을 실현 하 다.
위의 gif 그림 의 효 과 를 보고 실현 과정 에서 만난 난점 을 열거 합 니 다.
어떻게 키 보드 를 팝 업 할 때 아래쪽 로그 인 레이아웃 을 가리 지 않 습 니까?
키보드 가 꺼 질 때 배경 그림 이나 배경 을 압축 하지 않 고'화면 이외'로 확장 하 는 방법;
"windowSoft InputMode"부터
Google 이 개발 자 에 게 소프트 키 보드 를 제어 하 는 숨겨 진 방법 을 공식 적 으로 제공 하 는 것 은 많 지 않 습 니 다.'windowSoftInputMode'는 우리 가 제어 할 수 있 는 소프트 키보드 팝 업 모드 의 방법 중 하나 라 고 할 수 있 습 니 다.그 속성 에 대한 설명 은 구 글 공식 과 인터넷 의 튜 토리 얼 에 대해 많은 이 야 기 를 했 습 니 다.그의 속성 값 은 두 부분 으로 구성 되 어 있 습 니 다.예 를 들 어'stateHidden|adjustResize'와 같은 형식 입 니 다.앞부분(사실은 뒤에 쓸 수 있 습 니 다)은 설 정 된 Activity 가 들 어 갈 때 소프트 키보드 의 상 태 를 나타 내 고 후반 부 는 소프트 키보드 가 꺼 질 때 페이지 가 어떻게 조정 되 는 지 나타 냅 니 다.
아래 에 선택 가능 한 속성 과 의 미 를 각각 열거 합 니 다.
위 목록 을 통 해 우 리 는 windowSoftInputMode 의 몇 가지 속성 값 의 의 미 를 알 수 있 습 니 다.우 리 는 구체 적 인 수요 에 따라 적당 한 속성 을 선택 할 수 있다.However ! 제품 수 요 는 영원히 속성 보다 진기한 꽃 이다.예 를 들 어 우리 가 실현 하고 자 하 는 이 효과:
소프트 키보드 팝 업 은 모든 입력 레이아웃 을 가리 지 않 습 니 다.단순히 입력 상자 컨트롤 을 남 겨 두 는 것 이 아 닙 니 다.
소프트 키보드 가 튕 겨 나 올 때 배경 이 압축 되 거나 위로 미 끄 러 질 수 없습니다.
먼저 첫 번 째 수요:우 리 는 adjustResize 속성 을 사용 하여 효 과 를 얻 을 수 있 습 니 다.이런 그림 이 자동 으로 위로 이동 하 는 것 을 볼 수 있 습 니 다.ok.효과 가 만 족 스 럽 다 면 저 는 할 말 이 없습니다.그러나 우리 사장 과 제품,UI 는 이렇게 좋 지 않 고 배경 이 압축 되 지 않 는 다 고 말 했 습 니 다.즉,우리 가 말 한 두 번 째 수요 입 니 다.그때 내 마음속 에 그들 에 게 말 하고 싶 은 mmp 가 있 었 다.하지만 과감하게 도전 하 는 안 드 로 이 드 프로그래머 로 서 이 작은 수 요 는 아무것도 아니다.

두 번 째 수요 에 대해 먼저 우 리 는 왜 그림 이 미 끄 러 지 는 지 알 아야 한다.왜냐하면 우 리 는 adjustResize 속성 을 설 정 했 기 때문이다.시스템 은 키보드 가 필요 로 하 는 공간 에 따라 전체 페이지 의 레이아웃 을 위로 이동 하고 페이지 레이아웃 의 크기 를 조정 하여 소프트 키보드 에 숨겨 지지 않 는 효 과 를 만족 시 켜 야 한다.밤 을 들다
휴대 전화 화면의 높이 는 1920 px 이 고 전체 Activity 의 레이아웃 높이 도 1920 px 이다.이 속성 을 설정 한 후 인터페이스 에 있 는 EditText 를 누 르 면 소프트 키보드 의 높이 가 800 px 입 니 다.이 소프트 키 보드 를 완전 하 게 표시 하기 위해 서 시스템 은 Activity 레이아웃 의 높이 를 1920 px-800px=1120 px 로 조정 합 니 다.
여기 서 레이아웃 의 크기 를 조정 할 것 이 라 고 말 했 습 니 다.예전 의 경험 에 따라 시스템 이 자동 으로 조절 하 는 구 조 는 우리 가 원 하 는 결과 가 아 닙 니 다.예 를 들 어 각종 미끄럼 가능 한 View 내장 문제 등 입 니 다.그렇다면 이 수 요 는 이 사고 에 따라 결말 을 낼 수 있 을 까?
windowSoftInputMode 가 adjustResize 로 설정 되 었 을 때 레이아웃 이 조 정 될 때 조 정 된 레이아웃 을 다시 그립 니 다.그리고 onMeasure,onSize Changed,onLayout 를 갑 니 다.
windowSoftInputMode 가 adjustPan 으로 설정 되 었 을 때 레이아웃 이 조 정 될 때 조 정 된 레이아웃 을 다시 그립 니 다.그리고 onMeasure,onLayout 를 갑 니 다.
여기 서 는 둘 다 onMeasure 방법 에 주의 하 셔 야 합 니 다.adjustPan 이 onSize Changed 를 가지 않 은 것 에 대해 서 는 나중에 소프트 키보드 팝 업 모니터링 에 관 한 글 에서 상세 하 게 설명 하 겠 습 니 다.
그러면 우 리 는 이 를 이용 하여 onMeasure 방법 으로 시스템 이 자동 으로 조정 하 는 레이아웃 크기 를 막 았 다.우리 배경 에 ViewPager 를 사 용 했 기 때문에 ViewPager 의 OnMeasure 방법 을 다시 써 야 합 니 다.

public class AutoViewPager extends ViewPager {
 private int mScreenHeight;
 public AutoViewPager(Context context) {
  this(context,null);
 }
 public AutoViewPager(Context context, AttributeSet attrs) {
  super(context, attrs);
  mScreenHeight = DensityUtil.getHeight(getContext());
 }
 @Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  heightMeasureSpec = MeasureSpec.makeMeasureSpec(mScreenHeight, MeasureSpec.EXACTLY);
  super.onMeasure(widthMeasureSpec, heightMeasureSpec);
 }
}

Density Util.getHeight 방법 은 화면 높이 를 얻 는 방법 입 니 다.

public static int getHeight(Context context) {
  DisplayMetrics dm = new DisplayMetrics();
  WindowManager mWm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
  mWm.getDefaultDisplay().getMetrics(dm);
  int screenHeight = dm.heightPixels;
  return screenHeight;
}

이러한 설정 을 통 해 우 리 는 배경 ViewPager 의 높이 를 화면의 높이 로 기록 합 니 다.이렇게 키보드 가 튀 어 나 올 때 ViewPager 의 크기 가 달라 집 니 다.테스트 를 통 해 우 리 는 이 방법 으로 배경 을 위로 이동 시 킬 수 있다.사실 저 희 는 컨트롤 에 대한 시스템 재 그림 을 조직 하지 않 고 최종 재 그림 의 ViewPager 높이 를 바 꾸 었 습 니 다.사용자 에 게 제 배경 이 변 하지 않 았 다 는 느낌 을 주 었 습 니 다.
마지막 으로 실 현 된 레이아웃 코드 를 첨부 합 니 다:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 android:id="@+id/rl_root"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical">
 <RelativeLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content">
  <com.goldenalpha.stock.master.views.AutoViewPager
   android:id="@+id/login_bg_banner"
   android:layout_width="match_parent"
   android:layout_height="match_parent"/>
  <LinearLayout
   android:id="@+id/ll_dot"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_centerHorizontal="true"
   android:layout_gravity="center_horizontal">
   <ImageView
    android:id="@+id/iv_dot_1"
    android:layout_width="7dp"
    android:layout_height="7dp"
    android:layout_marginRight="8dp"
    android:background="@drawable/banner_dot_shape_select"/>
   <ImageView
    android:id="@+id/iv_dot_2"
    android:layout_width="7dp"
    android:layout_height="7dp"
    android:layout_marginRight="8dp"
    android:background="@drawable/bander_dot_shape_noselect"/>
   <ImageView
    android:id="@+id/iv_dot_3"
    android:layout_width="7dp"
    android:layout_height="7dp"
    android:background="@drawable/bander_dot_shape_noselect"/>
  </LinearLayout>
 </RelativeLayout>
 <RelativeLayout
  android:id="@+id/activity_login"
  android:layout_width="match_parent"
  android:layout_height="270dp"
  android:layout_alignParentBottom="true"
  android:paddingBottom="@dimen/login_margin_bottom"
  android:layout_marginLeft="10dp"
  android:layout_marginRight="10dp"
  android:background="@drawable/login_shape"
  android:orientation="vertical">
  <LinearLayout
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:orientation="vertical">
   <RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <RelativeLayout
     android:id="@+id/rl_phone_name"
     android:layout_width="match_parent"
     android:layout_height="wrap_content">
     <TextView
      android:id="@+id/tv_area_code"
      style="@style/Text.normal"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_centerVertical="true"
      android:layout_marginLeft="@dimen/login_tv_margin_left"
      android:padding="5dp"
      android:text="+86">
      <requestFocus/>
     </TextView>
     <View
      android:layout_width="0.3dp"
      android:layout_height="10dp"
      android:layout_centerHorizontal="true"
      android:layout_centerVertical="true"
      android:layout_marginLeft="@dimen/login_line_margin"
      android:layout_toRightOf="@id/tv_area_code"
      android:background="@color/gray"/>
     <EditText
      android:id="@+id/et_phone_num"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginLeft="@dimen/login_et_margin_left"
      android:background="@null"
      android:hint="         "
      android:inputType="phone"
      android:maxLength="11"
      android:maxLines="1"
      android:paddingBottom="20dp"
      android:paddingTop="20dp"
      android:textColor="@color/black"
      android:textColorHint="@color/gray"
      android:textCursorDrawable="@null"
      android:textSize="@dimen/font_normal">
      <requestFocus/>
     </EditText>
    </RelativeLayout>
    <View
     android:id="@+id/line_phone_num"
     android:layout_width="match_parent"
     android:layout_height="0.5dp"
     android:layout_below="@+id/rl_phone_name"
     android:layout_centerHorizontal="true"
     android:layout_marginLeft="@dimen/login_line_margin"
     android:layout_marginRight="@dimen/login_line_margin"
     android:background="@color/gray"/>
    <RelativeLayout
     android:id="@+id/rl_check_num"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_alignLeft="@+id/line_phone_num"
     android:layout_alignRight="@+id/line_phone_num"
     android:layout_below="@+id/line_phone_num">
     <EditText
      android:id="@+id/et_check_num"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_centerInParent="true"
      android:layout_toLeftOf="@+id/btn_get_check"
      android:background="@null"
      android:hint="      "
      android:inputType="number"
      android:maxLength="4"
      android:maxLines="1"
      android:paddingBottom="20dp"
      android:paddingLeft="120dp"
      android:paddingTop="20dp"
      android:textColor="@color/black"
      android:textColorHint="@color/gray"
      android:textCursorDrawable="@null"
      android:textSize="@dimen/font_normal"/>
     <com.goldenalpha.stock.master.views.CountDownButton
      android:id="@+id/btn_get_check"
      android:layout_width="@dimen/login_btn_check_width"
      android:layout_height="@dimen/login_btn_check_height"
      android:layout_alignParentRight="true"
      android:layout_centerVertical="true"
      android:layout_marginBottom="@dimen/login_btn_check_margin_bottom"
      android:layout_marginTop="@dimen/login_btn_check_margin_top"
      android:gravity="center"
      android:text="     "
      android:textColor="@color/gray"
      android:textSize="@dimen/font_normal"
      app:defaultBackgroundResource="@drawable/btn_check_gray_shape"/>
    </RelativeLayout>
    <View
     android:id="@+id/line_check_num"
     android:layout_width="match_parent"
     android:layout_height="0.5dp"
     android:layout_below="@+id/rl_check_num"
     android:layout_centerHorizontal="true"
     android:layout_marginLeft="25.3dp"
     android:layout_marginRight="25.3dp"
     android:background="@color/driver_color"/>
   </RelativeLayout>
   <com.goldenalpha.stock.master.views.LoadingButton
    android:id="@+id/btn_phone_login"
    android:layout_width="@dimen/login_btn_phone_width"
    android:layout_height="@dimen/login_btn_phone_height"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="23dp"/>
   <FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="23dp">
    <ImageView
     android:id="@+id/tv_wx_login"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_gravity="center"
     android:src="@drawable/wx_login_selector"/>
   </FrameLayout>
  </LinearLayout>
 </RelativeLayout>
</RelativeLayout>

목록 파일 의 설정

<activity
  android:name=".activities.LoginActivity"
  android:launchMode="singleTask"
  android:screenOrientation="portrait"
  android:theme="@style/AppTheme"
  android:windowSoftInputMode="stateHidden|adjustResize">
 </activity>

위 에서 말 한 것 은 소 편 이 소개 한 안 드 로 이 드 실현 배경 미끄럼 로그 인 인터페이스(배경 팝 업 키 보드 를 압축 하지 않 음)입 니 다.여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 메 시 지 를 남 겨 주세요.소 편 은 제때에 답 해 드 리 겠 습 니 다.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!