Android沉浸式状态栏实践

原创 2016年08月29日 16:43:06

今天专门做了一下沉浸式状态栏的实践,主要测试API 19,API 23,布局针对CoordinatorLayout,Toolbar,ImageView等控件来实现。

配置

这里写图片描述

注意点:用到ToolBar的时候要隐藏ActionBar效果,有两种方式:

1:使得Activity的主题继承Theme.AppCompat.NoActionBar
2:在styles中添加

 <item name="windowActionBar">false</item>
 <item name="windowNoTitle">true</item>

实现:
1:values-v19文件夹下声明 style的AppTheme为透明状态栏

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- 声明AppTheme为透明状态栏-->
        <item name="android:windowTranslucentStatus">true</item>
    </style>
</resources>

2:创建values-v21文件夹下声明 的style

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>
</resources>

3:默认values的style

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>
</resources>

4:toolbar设置

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
   >

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="256dp"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:contentScrim="@color/colorPrimary"
            app:statusBarScrim="@android:color/transparent"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <ImageView
                android:id="@+id/back_drop"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fitsSystemWindows="true"
                android:scaleType="centerCrop"
                android:src="@drawable/icon_default"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.7" />

            <android.support.v7.widget.Toolbar
                android:id="@+id/tool_bar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin" />

        </android.support.design.widget.CollapsingToolbarLayout>

    </android.support.design.widget.AppBarLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">
    <TextView
        android:id="@+id/tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        />
    </LinearLayout>
</android.support.design.widget.CoordinatorLayout>

5,代码设置:

private TextView textView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
        }
        textView = (TextView) findViewById(R.id.tv);
        int osVersion = Integer.valueOf(android.os.Build.VERSION.SDK);
        textView.setText("SDK:" + osVersion);
        CollapsingToolbarLayout collapsingToolbar =(CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
        collapsingToolbar.setTitle("Status Bar");
        collapsingToolbar.setExpandedTitleColor(Color.WHITE);//设置还没收缩时状态下字体颜色
        collapsingToolbar.setCollapsedTitleTextColor(Color.WHITE);//设置收缩后Toolbar上字体的颜色
    }

效果1:
这时候背景是图片延伸的背景色
这里写图片描述

滑动后的效果

这里写图片描述

滑动后背景颜色设置

app:contentScrim="@color/colorPrimary"//内容颜色
app:statusBarScrim="@android:color/transparent"//状态栏设置为透明

当仅仅是针对ToolBar的简单布局时:

Toolbar的布局

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="@dimen/toolbar_padding_top"
    android:background="@color/colorPrimary"
    android:minHeight="?attr/actionBarSize"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

这里paddingTop在19时设置dimen为25dp,大于19设置为0dp。

代码中设置:

    setContentView(R.layout.toolbar);
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
        }
        Toolbar toolbar= (Toolbar) findViewById(R.id.toolbar);
        toolbar.setTitle("Status Bar");
        setSupportActionBar(toolbar);
        toolbar.setNavigationIcon(R.mipmap.ic_launcher);

效果:

这里写图片描述

代码:
http://pan.baidu.com/s/1o8QxLvc

版权声明:本文为博主原创文章,码字不易,转载请注明原文地址,谢谢。

相关文章推荐

Android透明化/沉浸式状态栏实践及源码分析

何为透明状态栏?有人说透明状态栏就是沉浸式状态栏,这里不多解释,详见为什么在国内会有很多用户把「透明栏」(Translucent Bars)称作 「沉浸式顶栏」?。本文将对于透明状态栏设置方法做一个讲...

Android开发 -- Translucent System Bar 的最佳实践(沉浸式状态栏)

Translucent System Bar 的最佳实践 近几天准备抽空总结Android一些系统UI的实践使用,于是开始动手建了一个库 AndroidSystemUiTraining ,边撸代码边...

转-android沉浸式状态栏:Translucent System Bar 的最佳实践

android Translucent System Bar ,沉浸式状态栏

沉浸式状态栏实践总结

沉浸式状态栏: 首先需要先把状态栏变透明,变透明后,布局会自动的占据状态栏。 沉浸纯颜色可以采取a, b 2种方式, a方法:给根布局加 android:fitsSystemWindows="...

Android沉浸式状态栏

  • 2017-08-25 11:31
  • 1.60MB
  • 下载

Android延时启动效果+轮播图+点击进入+沉浸式状态栏+按钮点击颜色渐变效果+好看的UI框架

最近发现Android产品要想拿得出手,除了稳定实用的功能,好看的UI必不可少。 废话不都说,为大家介绍几种常见的Android显示效果。 首先是延时启动效果,主要表现就是点击进去之后...

Android沉浸式状态栏

  • 2016-02-25 19:53
  • 6.82MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)