Android UI 체험 의 전체 화면 몰입 형 투명 상태 표시 줄 스타일

선언:
   Android 4.4 이후 구 글 은 몰입 형 전체 화면 체험 을 제공 했다.몰입 형 전체 화면 모드 에서 상태 표시 줄,가상 버튼 이 동적 으로 숨겨 져 있 고 응용 프로그램 은 완전한 화면 공간 을 사용 할 수 있 으 며 구 글 의 말 에 따라 사용자 에 게 그 상황 에 직면 하 는 체험 을 할 수 있다.한편,안 드 로 이 드 5.0 이후 구 글 은 ColorPalette 의 개념 을 제시 하여 개발 자가 시스템 구역 의 색 채 를 스스로 설정 하여 전체 앱 의 색 스타일 과 시스템 의 색 스타일 을 통일 시 킬 수 있 도록 했다.오늘 은 안 드 로 이 드 4.4 이상 의 전체 화면 몰입 식 투명 상태 표시 줄 효 과 를 어떻게 실현 하 는 지 배 워 보 겠 습 니 다.먼저 예상 효과 보기:

 우선 어느 부분 이 상태 표시 줄 이 고 어느 부분 이 네 비게 이 션 표시 줄 인지 구분 합 니 다.
상태 표시 줄 상태 표시 줄 은 다음 과 같 습 니 다.

탐색 표시 줄 NavigationBar 는 다음 과 같 습 니 다.

어떻게 실현 합 니까?
 1.)먼저 전체 화면 구현
 첫 번 째:상속 주제 특정 주제
 Android API 19 이상 에 서 는****.TranslucentDecor***와 관련 된 테 마 를 사용 할 수 있 습 니 다.해당 반투명 효 과 를 가 져 옵 니 다.Theme.Holo.NoAction Bar.TranslucentDecor 와 Theme.Holo.Light.NoAction Bar.TranslucentDecor 두 가지 테 마 는 새로 추 가 된 것 이기 때문에 values-v19 파일 폴 더 를 새로 만 들 고 styles 파일 을 만들어 다음 코드 를 추가 해 야 합 니 다.

 <style name="AppBaseTheme" parent="android:Theme.Holo.Light.NoActionBar.TranslucentDecor">
  <!-- Customize your theme here. -->
 </style>
두 번 째:activity 에서 코드 를 사용 하 는 방식
Android 4.4 이상 은 다음 코드 를 추가 할 수 있 습 니 다.

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
//     
window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
//     
window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
}
Android 5.0 이상 도 아래 코드 를 사용 하여 전체 화면 을 구현 할 수 있 습 니 다.

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS
 | WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
 | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
 | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
}
전체 화면 효과

이 상태 표시 줄 이 차지 하 는 위치 가 사라 진 것 을 발견 하기 어렵 지 않 습 니 다.app 의 레이아웃 과 겹 쳐 서 이 문 제 를 해결 하 겠 습 니 다.
2.상태 표시 줄 차지 문제 해결
첫 번 째:테 마 는 다음 과 같은 설정 을 추가 합 니 다.

<item name="android:fitsSystemWindows">true</item>
두 번 째:activity layot 루트 디 렉 터 리 에 아래 코드 추가

android:fitsSystemWindows="true"
세 번 째:자바 코드 설정 을 통 해

rootview.setFitsSystemWindows(true);
fitsSystemWindows 는 sdk>=19 시스템 에서 만 작 동 합 니 다.4.4 이상 의 시스템 입 니 다.이 속성 은 모든 view 에 설정 할 수 있 습 니 다.이 view 의 모든 padding 속성 이 유효 하지 않 습 니 다.투명 상태 표시 줄(StatusBar)이나 네 비게 이 션 표시 줄(NavigationBar)을 설정 해 야 이 속성 이 적 용 됩 니 다.
상기 상태 표시 줄 과 네 비게 이 션 표시 줄 이 투명 하 게 설정 되 어 있다 면 이 View 에 상태 표시 줄 높이 와 같은 padding Top 을 자동 으로 추가 하 는 것 과 네 비게 이 션 표시 줄 높이 와 같은 padding Bottom 을 추가 하 는 것 과 같 습 니 다.효 과 는 다음 과 같 습 니 다.

 3.상태 표시 줄 탐색 표시 줄 배경 색 설정
4.4 이상 은 contentView 의 배경 색 을 수정 하거나 동적 으로 view 를 contentView 에 추가 할 수 있 습 니 다.

 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
   //     
   window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
   //     
   window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
   //  contentview fitsSystemWindows
   ViewGroup contentView = (ViewGroup) findViewById(android.R.id.content);
   View childAt = contentView.getChildAt(0);
   if (childAt != null) {
    childAt.setFitsSystemWindows(true);
   }
   // statusbar  
   View view = new View(this);
   view.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, getStatusBarHeight(this)));
   view.setBackgroundColor(color);
   contentView.addView(view);
  }
동적 가 져 오기 StatusBarHeight 함 수 는 다음 과 같 습 니 다.

 /**
  *        
  *
  * @param context context
  * @return      
  */
 private static int getStatusBarHeight(Context context) {
  //        
  int resourceId = context.getResources().getIdentifier("status_bar_height", "dimen", "android");
  return context.getResources().getDimensionPixelSize(resourceId);
 }
동적 가 져 오기 NavigationBarHeight 함 수 는 다음 과 같 습 니 다.

 /**
  *        
  *
  * @param context context
  * @return      
  */
 public static int getNavigationBarHeight(Context context) {
  int resourceId = context.getResources().getIdentifier("navigation_bar_height", "dimen", "android");
  return context.getResources().getDimensionPixelSize(resourceId);
 }
그리고 Android 5.0 이상 구 글 은 상태 표시 줄 과 네 비게 이 션 표시 줄 의 배경 색 을 업데이트 할 수 있 는 새로운 api 를 제공 합 니 다.

 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
   window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS
     | WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
   window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
     | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
     | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
   window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
   //       
   window.setStatusBarColor(color);
   //       
   window.setNavigationBarColor(color);
   ViewGroup contentView = ((ViewGroup) findViewById(android.R.id.content));
   View childAt = contentView.getChildAt(0);
   if (childAt != null) {
    childAt.setFitsSystemWindows(true);
   }
//   contentView.setPadding(0, getStatusBarHeight(this), 0, 0);
  }
이렇게 총체 적 효과 가 실현 되 었 다

4.)전체 자바 코드 구현 방식 붙 이기

 private void initWindows() {
  Window window = getWindow();
  int color = getResources().getColor(android.R.color.holo_blue_light);
  if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
   window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS
     | WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
   window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
     | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
     | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
   window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
   //       
   window.setStatusBarColor(color);
   //       
   window.setNavigationBarColor(color);
   ViewGroup contentView = ((ViewGroup) findViewById(android.R.id.content));
   View childAt = contentView.getChildAt(0);
   if (childAt != null) {
    childAt.setFitsSystemWindows(true);
   }
  } else if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
   //     
   window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
   //     
   window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
   //  contentview fitsSystemWindows
   ViewGroup contentView = (ViewGroup) findViewById(android.R.id.content);
   View childAt = contentView.getChildAt(0);
   if (childAt != null) {
    childAt.setFitsSystemWindows(true);
   }
   // statusbar  
   View view = new View(this);
   view.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, getStatusBarHeight(this)));
   view.setBackgroundColor(color);
   contentView.addView(view);
  }
 }
요약:
 저 는 더욱 뚜렷 한 효 과 를 나타 내기 위해 상태 표시 줄 배경 색 과 제목 표시 줄 의 색 이 일치 하지 않 습 니 다.실제 개발 에서 일반적인 상황 에서 저 희 는 통 일 된 색 으로 설정 하고 시각 적 으로 전체 페이지 가 더욱 통일 되 고 사용 자 를 app 에 진정 으로 몰입 하 게 합 니 다.
위 에서 설명 한 것 은 안 드 로 이 드 UI 체험 의 전체 화면 몰입 식 투명 상태 표시 줄 효과 입 니 다.여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 메 시 지 를 남 겨 주세요.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!

좋은 웹페이지 즐겨찾기