MaterialDesign-沉浸式设计兼容封装

状态栏

1. 5.0+ API

5.0+自动实现了沉浸式效果,状态栏的颜色跟随你的主题里面的colorPrimaryDark属性。
 
(1)通过设置主题达到
<!-- Application theme. -->
   <style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
<item name="android:textColor">@color/mytextcolor</item>
<item name="colorPrimary">@color/colorPrimary_pink</item>
<item name="colorPrimaryDark">@color/colorPrimary_pinkDark</item>
<!--         <item name="android:windowBackground">@color/background</item> -->
<!--         <item name="colorAccent">#906292</item> -->
   </style>
(2)通过设置样式属性解决
<item name="android:statusBarColor">@color/system_bottom_nav_color</item>
(3)通过代码设置
//5.0+可以直接用API来修改状态栏的颜色。
getWindow().setStatusBarColor(getResources().getColor(R.color.material_blue_grey_800));
(注意:要在setContentView方法之前设置)
2. 4.4 API
(低于4.4API,不可以做到)
用到一些特殊手段!----4.4(KitKat)新出的API,可以设置状态栏为透明的。
1.在属性样式里面解决(不推荐使用,因为兼容不好)
<item name="android:windowTranslucentStatus">true</item>
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颜色。
不会出现toolbar被状态栏遮挡的情况。
巧妙地解决:步骤:
1.在最外层容器设置android:fitsSystemWindows="true"
 不要给Toolbar设置android:fitsSystemWindows="true"
2.直接将最外层容器(也可以修改-android:windowBackground颜色)设置成状态栏想要的颜色
3.下面剩下的布局再包裹一层正常的背景颜色。


3)修改Toolbar的高度
1.不要给Toolbar设置android:fitsSystemWindows="true"
2.需要知道状态栏的高度是多少?去源码里面找找
   <!-- Height of the status bar -->
   <dimen name="status_bar_height">24dp</dimen>
   <!-- Height of the bottom navigation / system bar. -->
   <dimen name="navigation_bar_height">48dp</dimen>
   反射手机运行的类:android.R.dimen.status_bar_height.


3.修改Toolbar的PaddingTop(因为纯粹增加toolbar的高度会遮挡toobar里面的一些内容)
toolbar.setPadding(
toolbar.getPaddingLeft(),
toolbar.getPaddingTop()+getStatusBarHeight(this), 
toolbar.getPaddingRight(),
toolbar.getPaddingBottom());
4.或者可以设置toolbar的高度(不推荐)

第三方的沉浸式解决方案:SystemTint。

5.0+ 可以用API解决  <item name="android:navigationBarColor">@color/system_bottom_nav_color</item>

底部虚拟导航沉浸效果

NavigationBar做出沉浸式效果



1. 5.x 底部虚拟导航沉浸效果
1)属性解决
navigationBarColor
2)代码
getWindow().setNavigationBarColor()



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

BaseActivity封装

import android.annotation.SuppressLint;
import android.annotation.TargetApi;
import android.content.Context;
import android.os.Build;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.util.DisplayMetrics;
import android.view.Display;
import android.view.View;
import android.view.WindowManager;
import android.view.ViewGroup.LayoutParams;

@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<android.os.Build.VERSION_CODES.LOLLIPOP){
			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<android.os.Build.VERSION_CODES.LOLLIPOP){
			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;//竖屏和横屏两种情况。
	}
	
}
activity调用
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.widget.Toolbar;
import android.view.View;

public class MainActivity2 extends BaseTranslucentActivity{

	private Toolbar toolbar;
	private View nav;

	@Override
	protected void onCreate(@Nullable Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		toolbar = (Toolbar)findViewById(R.id.toolbar);
		nav = findViewById(R.id.nav);
		setOrChangeTranslucentColor(toolbar, nav, getResources().getColor(R.color.colorPrimary_pink));
		
	}
}
布局文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="?attr/colorPrimary"
    tools:context="com.ricky.materialdesign.translucent.MainActivity" xmlns:app="http://schemas.android.com/apk/res/com.ricky.materialdesign.translucent">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:title="标题"
        app:titleTextColor="#ff0"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Dark"
        >
    </android.support.v7.widget.Toolbar>

    
    <ScrollView
        android:layout_width="match_parent"
        android:background="#fff"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <android.support.v7.widget.LinearLayoutCompat
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:divider="@drawable/abc_list_divider_mtrl_alpha"
            app:showDividers="beginning|middle"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/hello_world" />

            <android.support.v7.widget.AppCompatButton
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="24dp"
                android:layout_marginTop="23dp"
                android:onClick="showDialog"
                android:text="对话框" />

            <Button
                android:id="@+id/button2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="24dp"
                android:layout_marginTop="23dp"
                android:onClick="showPopup"
                android:text="泡泡窗口ListPopupWindow" />
            <Button
                android:id="@+id/button3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="24dp"
                android:layout_marginTop="23dp"
                android:onClick="showPopupMenu"
                android:text="PopupMenu" />

<!--             <EditText -->
<!--                 android:layout_width="wrap_content" -->
<!--                 android:layout_height="wrap_content" -->
<!--                 android:layout_marginLeft="24dp" -->
<!--                 android:layout_marginTop="23dp" -->
<!--                 android:text="有内容" /> -->

            <android.support.v7.widget.AppCompatEditText
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="24dp"
                android:layout_marginTop="23dp"
                android:text="有内容" />

            <TextView
                android:id="@+id/textView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="27dp"
                android:text="Large Text"
                android:textAppearance="?android:attr/textAppearanceLarge" />

            <CheckBox
                android:id="@+id/checkBox1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="CheckBox" />

            <RadioButton
                android:id="@+id/radioButton1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="RadioButton" />

            <ProgressBar
                android:id="@+id/progressBar1"
                style="@style/Widget.AppCompat.ProgressBar.Horizontal"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content" />

            <RatingBar
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView2"
                android:layout_marginTop="65dp" />
            <RatingBar
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView2"
                android:layout_marginTop="65dp" />
            <RatingBar
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView2"
                android:layout_marginTop="65dp" />
            <RatingBar
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView2"
                android:layout_marginTop="65dp" />
            <RatingBar
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView2"
                android:layout_marginTop="65dp" />
            <RatingBar
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView2"
                android:layout_marginTop="65dp" />
            <RatingBar
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView2"
                android:layout_marginTop="65dp" />
            <RatingBar
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView2"
                android:layout_marginTop="65dp" />
            <RatingBar
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView2"
                android:layout_marginTop="65dp" />
        </android.support.v7.widget.LinearLayoutCompat>
    </ScrollView>
    <View 
       android:id="@+id/nav"
       android:layout_width="fill_parent"
       android:layout_height="1dp"
       android:layout_weight="0"
       android:background="?attr/colorPrimary"
        />
</LinearLayout>

样式

<resources>

    <!--
        Base application theme, dependent on API level. This theme is replaced
        by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
    -->
    <style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!--
            Theme customizations available in newer API levels can go in
            res/values-vXX/styles.xml, while customizations related to
            backward-compatibility can go here.
        -->
    </style>

    <!-- Application theme. -->
    <style name="AppTheme" parent="AppBaseTheme">
        <!-- All customizations that are NOT specific to a particular API-level can go here. -->
<!--         <item name="android:textColor">@color/mytextcolor</item> -->
        <item name="colorPrimary">@color/colorPrimary_pink</item>
        <item name="colorPrimaryDark">@color/colorPrimary_pinkDark</item>
<!--         <item name="android:windowBackground">@color/background</item> -->
<!--         <item name="colorAccent">#906292</item> -->
		<item name="android:navigationBarColor">@color/colorPrimary_pink</item>//values-v21
		<item name="android:statusBarColor">@color/colorPrimary_pink</item>
    </style>

</resources>




  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值