沉浸式设计android,Android 沉浸式设计Translucent

什么是沉浸式

官方的沉浸式Translucent：就是让整个APP沉浸(充斥了整个屏幕)在屏幕里面，没有显示状态栏，甚至没有显示底部导航栏。

平时大家所讨论的沉浸式：比如QQ的顶部Toolbar和状态栏程一体的颜色。

兼容开发：

5.0+ API

5.0+自动实现了沉浸式效果，状态栏的颜色跟随你的主题里面的colorPrimaryDark属性。

1)通过设置主题达到

@color/mytextcolor

@color/colorPrimary_pink

@color/colorPrimary_pinkDark

2)通过设置样式属性解决

@color/system_bottom_nav_color

3)通过代码设置

//5.0+可以直接用API来修改状态栏的颜色。

getWindow().setStatusBarColor(getResources().getColor(R.color.material_blue_grey_800));

4.4 API

(低于4.4API，不可以做到)

用到一些特殊手段！----4.4(KitKat)新出的API，可以设置状态栏为透明的。

1.在属性样式里面解决(不推荐使用，因为兼容不好)

true

2.再代码里面解决

getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

setContentView(R.layout.activity_main);

出现副作用：

APP的内容顶到最上面去了，即状态栏会遮挡一部分界面。很坑

解决办法(有几种)：

1)给Toolbar设置android:fitsSystemWindows="true"

该属性的作用：设置布局时，是否考虑当前系统窗口的布局，如果为true就会调整整个系统窗口

布局(包括状态栏的view)以适应你的布局。

但是：又出现了一个bug,当里面有ScrollView并且ScrollView里面有Edittext的时候，就会出现软键盘一弹起就会把toolbar拉下来，很难看

这种办法有什么价值呢？如果里面没有ScrollView就可以用。

2)推荐

灵感：发现给布局最外层容器设置android:fitsSystemWindows="true" 可以达到状态栏透明，并且露出底色---android:windowBackground颜色。

巧妙地解决：步骤：

1.在最外层容器设置android:fitsSystemWindows="true"

2.直接将最外层容器(也可以修改-android:windowBackground颜色)设置成状态栏想要的颜色

3.下面剩下的布局再包裹一层正常的背景颜色。

3)修改Toolbar的高度

1.设置状态栏的透明属性,不要给Toolbar设置android:fitsSystemWindows="true"

2.需要知道状态栏的高度是多少？去源码里面找找

24dp

48dp

反射手机运行的类：android.R.dimen.status_bar_height.

3.修改Toolbar的PaddingTop(因为纯粹增加toolbar的高度会遮挡toobar里面的一些内容)

toolbar.setPadding(

toolbar.getPaddingLeft(),

toolbar.getPaddingTop()+getStatusBarHeight(this),

toolbar.getPaddingRight(),

toolbar.getPaddingBottom());

private int getStatusBarHeight(Context context) {

// 反射手机运行的类：android.R.dimen.status_bar_height.

int statusHeight = -1;

try {

Class> clazz = Class.forName("com.android.internal.R$dimen");

Object object = clazz.newInstance();

String heightStr = clazz.getField("status_bar_height").get(object).toString();

int height = Integer.parseInt(heightStr);

//dp--->px

statusHeight = context.getResources().getDimensionPixelSize(height);

} catch (Exception e) {

e.printStackTrace();

}

return statusHeight;

}

NavigationBar沉浸式效果

5.x 底部虚拟导航沉浸效果

1)属性解决

navigationBarColor

2)代码

getWindow().setNavigationBarColor()

4.4

用到一些特殊手段！----4.4(KitKat)新出的API，可以设置虚拟导航栏为透明的。

步骤：

1)在布局底部添加一个高度为0.1dp的view

2)动态设置底部View的高度为虚拟导航栏的高度

View nav = findViewById(R.id.nav);

LayoutParams p = nav.getLayoutParams();

p.height += getNavigationBarHeight(this);

nav.setLayoutParams(p);

3.做兼容性判断

1)SDK版本不一样

两个区间：1. 大于5.0；2.=<4.4sdk<5.0

2)有的没有虚拟导航栏

判断是否有虚拟导航栏(源码里面有方法可以得到是否有虚拟导航，反射得到)

3)有的有虚拟导航，但是还可以开关

判断是否虚拟导航栏打开了

一步解决2)3)两个问题： NavigationBarHeight=整个屏幕的高度 - 内容部分view的高度 判断是否>0

代码：

@TargetApi(Build.VERSION_CODES.JELLY_BEAN_MR1)

public class BaseTranslucentActivity extends AppCompatActivity {

@Override

protected void onCreate(@Nullable Bundle savedInstanceState) {

// TODO Auto-generated method stub

super.onCreate(savedInstanceState);

//判断版本,如果[4.4,5.0)就设置状态栏和导航栏为透明

if(android.os.Build.VERSION.SDK_INT>=android.os.Build.VERSION_CODES.KITKAT

&&android.os.Build.VERSION.SDK_INT

getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

//设置虚拟导航栏为透明

getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);

}

}

@SuppressLint("NewApi")

public void setOrChangeTranslucentColor(Toolbar toolbar,View bottomNavigationBar, int translucentPrimaryColor){

//判断版本,如果[4.4,5.0)就设置状态栏和导航栏为透明

if(android.os.Build.VERSION.SDK_INT>=android.os.Build.VERSION_CODES.KITKAT

&&android.os.Build.VERSION.SDK_INT

if(toolbar!=null){

//1.先设置toolbar的高度

LayoutParams params = toolbar.getLayoutParams();

int statusBarHeight = getStatusBarHeight(this);

params.height += statusBarHeight ;

toolbar.setLayoutParams(params );

//2.设置paddingTop，以达到状态栏不遮挡toolbar的内容。

toolbar.setPadding(

toolbar.getPaddingLeft(),

toolbar.getPaddingTop()+getStatusBarHeight(this),

toolbar.getPaddingRight(),

toolbar.getPaddingBottom());

//设置顶部的颜色

toolbar.setBackgroundColor(translucentPrimaryColor);

}

if(bottomNavigationBar!=null){

//解决低版本4.4+的虚拟导航栏的

if(hasNavigationBarShow(getWindowManager())){

LayoutParams p = bottomNavigationBar.getLayoutParams();

p.height += getNavigationBarHeight(this);

bottomNavigationBar.setLayoutParams(p);

//设置底部导航栏的颜色

bottomNavigationBar.setBackgroundColor(translucentPrimaryColor);

}

}

}else if(android.os.Build.VERSION.SDK_INT>=android.os.Build.VERSION_CODES.LOLLIPOP){

getWindow().setNavigationBarColor(translucentPrimaryColor);

getWindow().setStatusBarColor(translucentPrimaryColor);

}else{

//<4.4的，不做处理

}

}

private int getNavigationBarHeight(Context context) {

return getSystemComponentDimen(this, "navigation_bar_height");

}

/**

* 获取状态栏的高度

* @param context

* @return

*/

private int getStatusBarHeight(Context context) {

// 反射手机运行的类：android.R.dimen.status_bar_height.

return getSystemComponentDimen(this, "status_bar_height");

}

private static int getSystemComponentDimen(Context context, String dimenName){

// 反射手机运行的类：android.R.dimen.status_bar_height.

int statusHeight = -1;

try {

Class> clazz = Class.forName("com.android.internal.R$dimen");

Object object = clazz.newInstance();

String heightStr = clazz.getField(dimenName).get(object).toString();

int height = Integer.parseInt(heightStr);

//dp--->px

statusHeight = context.getResources().getDimensionPixelSize(height);

} catch (Exception e) {

e.printStackTrace();

}

return statusHeight;

}

private static boolean hasNavigationBarShow(WindowManager wm){

Display display = wm.getDefaultDisplay();

DisplayMetrics outMetrics = new DisplayMetrics();

//获取整个屏幕的高度

display.getRealMetrics(outMetrics);

int heightPixels = outMetrics.heightPixels;

int widthPixels = outMetrics.widthPixels;

//获取内容展示部分的高度

outMetrics = new DisplayMetrics();

display.getMetrics(outMetrics);

int heightPixels2 = outMetrics.heightPixels;

int widthPixels2 = outMetrics.widthPixels;

int w = widthPixels-widthPixels2;

int h = heightPixels-heightPixels2;

System.out.println("~~~~~~~~~~~~~~~~h:"+h);

return w>0||h>0;//竖屏和横屏两种情况。

}

}