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 체험 의 전체 화면 몰입 식 투명 상태 표시 줄 효과 입 니 다.여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 메 시 지 를 남 겨 주세요.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Kotlin의 기초 - 2부지난 글에서는 Kotlin이 무엇인지, Kotlin의 특징, Kotlin에서 변수 및 데이터 유형을 선언하는 방법과 같은 Kotlin의 기본 개념에 대해 배웠습니다. 유형 변환은 데이터 변수의 한 유형을 다른 데이터...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.