Android4.4以上实现沉浸式状态栏
![Flyme4.2 Android4.4.4上运行效果](https://i-blog.csdnimg.cn/blog_migrate/5baafd7cf2ec3875caab3770e9973691.webp?x-image-process=image/format,png)
-
如何实现
在 4.4 之后,Android Window支持了一些新的属性,其中有两个是这样的 .
WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION
正如它们的变量名的意思,使用这两个属性,可以使得状态栏和导航栏变为透明,导航栏指的就是Android下方的三大按键,当然只使用第一个属性也可以达到今天所要完成的效果。下面的示例代码将使状态栏和导航栏变得透明
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); initWindow(); }
@TargetApi(19) private void initWindow(){ if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT){ getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS); getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION); }
直接运行之后,状态栏直接透明了,但是并不是我们想要的效果,状态栏原本应该占有的位置没了。
Flyme4.2 Android4.4.4上运行效果这个问题也很好解决,在 style theme 添加
<item name="android:fitsSystemWindows">true</item>
之后我们再运行,却又发现,状态栏的位置出来了,但是。。。
![Flyme4.2 Android4.4.4上运行效果](https://i-blog.csdnimg.cn/blog_migrate/471cb5d21ec2b2210d15d5fc1279a8d2.webp?x-image-process=image/format,png)
实际上,状态栏已经透明了,只是状态栏底下没有颜色呀!
Google 了之后在 Github 找到了一个开源项目 SystemBarTint ,代码就变成下面这个样子:
private SystemBarTintManager tintManager;
@TargetApi(19)
private void initWindow(){
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT){
getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
tintManager = new SystemBarTintManager(this);
tintManager.setStatusBarTintColor(getColor(R.color.app_main_color));
tintManager.setStatusBarTintEnabled(true);
}
}
运行之后,发现运行效果跟第一张图一样,达到我们想要的效果了。
跟踪进去查看 SystemBarTint 的源代码,会发现 SystemBarTintManager 的构造方法里面除了获取 ActionBar 的高度等等这些配置之外,还有一个重要的方法 setupStatusBarView
@TargetApi(19)
public SystemBarTintManager(Activity activity) {
Window win = activity.getWindow();
ViewGroup decorViewGroup = (ViewGroup) win.getDecorView();
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
//省去部分代码...
if (mStatusBarAvailable) {
setupStatusBarView(activity, decorViewGroup);
}
if (mNavBarAvailable) {
setupNavBarView(activity, decorViewGroup);
}
}
于是接着查看 setupStatusBarView 的代码
private void setupStatusBarView(Context context, ViewGroup decorViewGroup) {
mStatusBarTintView = new View(context);
LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT, mConfig.getStatusBarHeight());
params.gravity = Gravity.TOP;
if (mNavBarAvailable && !mConfig.isNavigationAtBottom()) {
params.rightMargin = mConfig.getNavigationBarWidth();
}
mStatusBarTintView.setLayoutParams(params);
mStatusBarTintView.setBackgroundColor(DEFAULT_TINT_COLOR);
mStatusBarTintView.setVisibility(View.GONE);
decorViewGroup.addView(mStatusBarTintView);
}
可以发现这个开源项目能够解决我们的问题的原因在这,就是往 DecorView 加入一个 View, 而在代码中我们将这个 View 的背景设置成 ActionBar 一样的颜色,所以就达到了沉浸式的效果。到这里,基本也就分析完成了。
-
源代码
附上源代码地址: Github 源代码 .
项目是我最近刚建不久的,主要放了一些 Android 方面的练习,最近更新了RecycleView滚动时隐藏Toolbar和状态栏,类似pocket 和 滑动菜单栏,支持设置左右滑动呼出
转自:http://www.jianshu.com/p/f8374d6267ef
低版本中使用Material设计
Material Design真的很好看,动画效果真的很实用。前面也写了一些文章介绍如何编写Material风格的程序,但是很多都是一些新的api,低版本上面没有这些api,我们没办法使用。但是不用气馁,google官方,以及一些大牛,给我们提供了一些程序,让我们在低版本上面可以实现Material风格的程序,这里就给大家介绍一下。
妹子图截屏
使用support library
使用support library最新的版本,appcomt21,可以在较低版本上面实现部分风格,在之前的文章我已经说过了,这里在系统的说一下。
####应用主题
这部分的话之前的文章说过,链接在这里: http://blog.isming.me/2014/10/18/creating-android-app-with-material-design-one-theme/
使用gralde进行构建的话,在依赖中添加v7包:
1 2 3 4 5 | dependencies { compile 'com.android.support:appcompat-v7:21.0.+' compile 'com.android.support:cardview-v7:21.0.+' compile 'com.android.support:recyclerview-v7:21.0.+' } |
使用eclipse构建的话,加入最新的appcompat包即可。
另外在style文件中加入:
1 2 3 4 5 6 7 | <!-- extend one of the Theme.AppCompat themes --> <style name="Theme.MyTheme" parent="Theme.AppCompat.Light"> <!-- customize the color palette --> <item name="colorPrimary">@color/material_blue_500</item> <item name="colorPrimaryDark">@color/material_blue_700</item> <item name="colorAccent">@color/material_green_A200</item> </style> |
在appliaction中使用我们的这个Theme.MyTheme,上一次的文章中有个错误,这种情况下不需要在valus-v21中创建一个同名的继承自Material的theme,否则会报错。这样我们就可以使用Material风格了。不过低版本上面还是有很多地方不可以实现这种效果的。
使用Toolbar代替ActionBar。
android 5.0增加了ToolBar,可以用其代替ActionBar,在更低版本中,推荐使用,这样,动画特效更方便实现。
在布局文件中增加Toolbar:
1 2 3 4 5 6 | <android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimaryDark"/>
|
在代码中,使用Toolbar代替ActionBar(Activity必须是继承自ActionBarActivity的):
1 2 3 4 5 6 7 8 9 | @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(getLayoutResource()); Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); if (toolbar != null) { setSupportActionBar(toolbar); } } |
使用CardView
不详说了,参看我之前的博客吧http://blog.isming.me/2014/10/21/creating-app-with-material-design-two-list/。
使用动画
对于低版本,在support v7包中,提供了一些兼容,可以使用activity过渡动画(不过效果没有5.0的好)。
首先声明主题的时候,创建一个AppTheme.Base用来声明主题,在其上增加动画属性:
以下放在values/themes.xml中,用于适配低版本:
1 2 3 4 5 6 7 8 9 10 11 | <?xml version="1.0" encoding="utf-8"?> <resources> <style name="AppTheme" parent="AppTheme.Base"/> <style name="AppTheme.Base" parent="Theme.AppCompat"> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimary</item> <item name="android:windowNoTitle">true</item> <item name="windowActionBar">false</item> </style> </resources> |
以下放在values-v21/themes.xml中
1 2 3 4 5 6 7 8 9 10 | <?xml version="1.0" encoding="utf-8"?> <resources> <style name="AppTheme" parent="AppTheme.Base"> <item name="android:windowContentTransitions">true</item> <item name="android:windowAllowEnterTransitionOverlap">true</item> <item name="android:windowAllowReturnTransitionOverlap">true</item> <item name="android:windowSharedElementEnterTransition">@android:transition/move</item> <item name="android:windowSharedElementExitTransition">@android:transition/move</item> </style> </resources> |
在代码中启动新Activity的时候,使用v7包中的方法,具体过渡方法跟5.0一样,可以看我之前的博客:
1 2 3 4 | ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation( activity, transitionView, DetailActivity.EXTRA_IMAGE); ActivityCompat.startActivity(activity, new Intent(activity, DetailActivity.class), options.toBundle()); |
使用开源控件
对于很多的控件样式,动画,对话框等,使用兼容包无法完成,我们可以使用一些大神开发的第三方包来实现.
组件: https://github.com/navasmdc/MaterialDesignLibrary
https://github.com/keithellis/MaterialWidget
上面两个主要是一些实现了Material的组件
Material Design的对话框: https://github.com/afollestad/material-dialogs
这个github仓库收集了很多的开源实现,大家可以过来看看。https://github.com/lightSky/MaterialDesignCenter
其他
根据提供的规范,自己来实现相应的ui界面以及动画效果等等。
这里提供一下谷歌的规范地址:
谷歌设计规范:http://www.google.com/design/spec/material-design/introduction.html需要翻墙、http://design.1sters.com(中文)
图标素材:https://github.com/google/material-design-icons、https://github.com/Templarian/MaterialDesign
谷歌IO2014,Material Design的诠释:https://github.com/google/iosched
其他人写的应用:https://github.com/afollestad/cabinet
我写的一个应用,从之前的版本改过来,还没完成,大家随便看看就行了,也是Material Design:https://github.com/sangmingming/Meizitu
转自:http://blog.isming.me/2014/11/17/material-design-for-pre-lollipop-android/
低版本中使用Material设计
Material Design真的很好看,动画效果真的很实用。前面也写了一些文章介绍如何编写Material风格的程序,但是很多都是一些新的api,低版本上面没有这些api,我们没办法使用。但是不用气馁,google官方,以及一些大牛,给我们提供了一些程序,让我们在低版本上面可以实现Material风格的程序,这里就给大家介绍一下。
妹子图截屏
使用support library
使用support library最新的版本,appcomt21,可以在较低版本上面实现部分风格,在之前的文章我已经说过了,这里在系统的说一下。
####应用主题
这部分的话之前的文章说过,链接在这里: http://blog.isming.me/2014/10/18/creating-android-app-with-material-design-one-theme/
使用gralde进行构建的话,在依赖中添加v7包:
1 2 3 4 5 | dependencies { compile 'com.android.support:appcompat-v7:21.0.+' compile 'com.android.support:cardview-v7:21.0.+' compile 'com.android.support:recyclerview-v7:21.0.+' } |
使用eclipse构建的话,加入最新的appcompat包即可。
另外在style文件中加入:
1 2 3 4 5 6 7 | <!-- extend one of the Theme.AppCompat themes --> <style name="Theme.MyTheme" parent="Theme.AppCompat.Light"> <!-- customize the color palette --> <item name="colorPrimary">@color/material_blue_500</item> <item name="colorPrimaryDark">@color/material_blue_700</item> <item name="colorAccent">@color/material_green_A200</item> </style> |
在appliaction中使用我们的这个Theme.MyTheme,上一次的文章中有个错误,这种情况下不需要在valus-v21中创建一个同名的继承自Material的theme,否则会报错。这样我们就可以使用Material风格了。不过低版本上面还是有很多地方不可以实现这种效果的。
使用Toolbar代替ActionBar。
android 5.0增加了ToolBar,可以用其代替ActionBar,在更低版本中,推荐使用,这样,动画特效更方便实现。
在布局文件中增加Toolbar:
1 2 3 4 5 6 | <android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimaryDark"/>
|
在代码中,使用Toolbar代替ActionBar(Activity必须是继承自ActionBarActivity的):
1 2 3 4 5 6 7 8 9 | @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(getLayoutResource()); Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); if (toolbar != null) { setSupportActionBar(toolbar); } } |
使用CardView
不详说了,参看我之前的博客吧http://blog.isming.me/2014/10/21/creating-app-with-material-design-two-list/。
使用动画
对于低版本,在support v7包中,提供了一些兼容,可以使用activity过渡动画(不过效果没有5.0的好)。
首先声明主题的时候,创建一个AppTheme.Base用来声明主题,在其上增加动画属性:
以下放在values/themes.xml中,用于适配低版本:
1 2 3 4 5 6 7 8 9 10 11 | <?xml version="1.0" encoding="utf-8"?> <resources> <style name="AppTheme" parent="AppTheme.Base"/> <style name="AppTheme.Base" parent="Theme.AppCompat"> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimary</item> <item name="android:windowNoTitle">true</item> <item name="windowActionBar">false</item> </style> </resources> |
以下放在values-v21/themes.xml中
1 2 3 4 5 6 7 8 9 10 | <?xml version="1.0" encoding="utf-8"?> <resources> <style name="AppTheme" parent="AppTheme.Base"> <item name="android:windowContentTransitions">true</item> <item name="android:windowAllowEnterTransitionOverlap">true</item> <item name="android:windowAllowReturnTransitionOverlap">true</item> <item name="android:windowSharedElementEnterTransition">@android:transition/move</item> <item name="android:windowSharedElementExitTransition">@android:transition/move</item> </style> </resources> |
在代码中启动新Activity的时候,使用v7包中的方法,具体过渡方法跟5.0一样,可以看我之前的博客:
1 2 3 4 | ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation( activity, transitionView, DetailActivity.EXTRA_IMAGE); ActivityCompat.startActivity(activity, new Intent(activity, DetailActivity.class), options.toBundle()); |
使用开源控件
对于很多的控件样式,动画,对话框等,使用兼容包无法完成,我们可以使用一些大神开发的第三方包来实现.
组件: https://github.com/navasmdc/MaterialDesignLibrary
https://github.com/keithellis/MaterialWidget
上面两个主要是一些实现了Material的组件
Material Design的对话框: https://github.com/afollestad/material-dialogs
这个github仓库收集了很多的开源实现,大家可以过来看看。https://github.com/lightSky/MaterialDesignCenter
其他
根据提供的规范,自己来实现相应的ui界面以及动画效果等等。
这里提供一下谷歌的规范地址:
谷歌设计规范:http://www.google.com/design/spec/material-design/introduction.html需要翻墙、http://design.1sters.com(中文)
图标素材:https://github.com/google/material-design-icons、https://github.com/Templarian/MaterialDesign
谷歌IO2014,Material Design的诠释:https://github.com/google/iosched
其他人写的应用:https://github.com/afollestad/cabinet
我写的一个应用,从之前的版本改过来,还没完成,大家随便看看就行了,也是Material Design:https://github.com/sangmingming/Meizitu
转自:http://blog.isming.me/2014/11/17/material-design-for-pre-lollipop-android/