Android,如何正确制作透明状态栏

时间:2014-05-25 20:09:11

标签: android android-layout user-experience

我正在尝试在Android 4.4+上制作透明状态栏 我知道如何通过定义自己的风格使其透明:

<style name="Theme.MyTheme" parent="Theme.MyTheme.Base">
    <item name="android:windowTranslucentStatus">true</item>
    <item name="android:windowTranslucentNavigation">true</item> </style>

我在这里找到: https://stackoverflow.com/a/20573595/2633630

问题是,当状态栏是透明的时,它与操作栏的颜色不匹配,并且可以看到后台的活动: transparent status bar error

所以我发现我可以在我的布局中使用android:fitsSystemWindows =“true”和android:clipToPadding =“false”http://mindofaandroiddev.wordpress.com/2013/12/28/making-the-status-bar-and-navigation-bar-transparent-with-a-listview-on-android-4-4-kitkat/

<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:background="@color/background_darkRed"
android:fitsSystemWindows="true"
android:clipToPadding="false"    
tools:context="com.sandak.......">

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"> 
....

这解决了透明状态栏的最大问题,看起来还不错..不幸的是,“导航栏”底部有系统按钮问题,系统按钮是红色的,不是我想要的透明: enter image description here

我正在尝试所有可能的变种来实现工作效果,但我无法弄清楚如何解决它。我唯一可行的解​​决方案是将根元素的顶部填充大约60dp。但是这个解决方案很丑陋,在不同的设备上可能看起来不同,可能无法正常工作。

我在Google Play上发现了一些在透明背景下工作正常的应用程序,所以我很好奇他们是如何使用的。

例如: https://play.google.com/store/apps/details?id=com.trello和其他几个人

1 个答案:

答案 0 :(得分:12)

//更新:
好的,这是一个很老的答案。现在您可以使用Material主题来处理这个问题,这非常简单。只需将目标api设置为21+,如果需要,可以使用支持库并创建具有材料主题的主题,您可以直接指定状态栏颜色

<style name="AppTheme"
        parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- colorPrimary is used for the default action bar background -->
        <item name="colorPrimary">@color/color_primary</item>

        <!-- colorPrimaryDark is used for the status bar -->
        <item name="colorPrimaryDark">@color/color_primary_dark</item>

        <!-- colorAccent is used as the default value for colorControlActivated
             which is used to tint widgets -->
        <item name="colorAccent">@color/accent_orange</item>
    </style>

=============================================== ========================

OLD ANSWER:

好的,好像我解决了我的问题。它不是最好和最清晰的解决方案,但它是有效的解决方案。 如果将来有人会找到更好,更清晰的解决方案,请告诉我,我会更新我的答案/或将答案标记为正确答案。但就目前而言,我没有比这个小黑客更好的解决方案:

布局的根元素必须是RelativeLayout。应该遵循您的主要布局,如ScrollView或任何其他类型的布局,它并不重要。在关闭相对布局标记之前的末尾跟随空的LinearLayout,其设置与操作栏相同的背景和固定高度(状态栏的高度)。

<RelativeLayout 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"
tools:context="com.sandak....">
<ScrollView
    android:fitsSystemWindows="true"
    android:clipToPadding="false"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
.... all your main views etc..
</ScrollView>
<LinearLayout
        android:id="@+id/statusBarBackgroundLinearLayout"
        android:layout_width="match_parent"
        android:orientation="horizontal"
        android:layout_height="30dp"
        android:background="@color/background_darkRed"
        android:clickable="false"
        android:focusable="false">
     </LinearLayout>
</RelativeLayout>

好的,你必须在代码中设置与状态栏相同的线性布局高度:

private void setStatusBarBackground(View rootView) {
        setStatusBarLayout(rootView);
        statusBarHeight = getStatusBarHeight();
        setStatusBarLayoutHeight(statusBarHeight);
    }

    private void setStatusBarLayout(View rootView){
        statusBarBackgroundLinearLayout = (LinearLayout) rootView.findViewById(R.id.statusBarBackgroundLinearLayout);
        if (isPreKitkatDevice()) {
            hideStatusBarLayout();
        }
    }

    private int getStatusBarHeight() {
        int statusBarHeight = 0;
        int resourceId = getResources().getIdentifier("status_bar_height", "dimen", "android");
        if (resourceId > 0) {
            statusBarHeight = getResources().getDimensionPixelSize(resourceId);
        }
        return statusBarHeight;
    }

    private boolean isPreKitkatDevice(){
        return Build.VERSION.SDK_INT < Build.VERSION_CODES.KITKAT;
    }

    private void hideStatusBarLayout(){
        statusBarBackgroundLinearLayout.setVisibility(View.INVISIBLE);
    }        

    private void setStatusBarLayoutHeight(int height){
        RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) statusBarBackgroundLinearLayout.getLayoutParams();
        layoutParams.height = height;
    }

然后在onCreate()方法中调用setStatusBarBackground。这是适用于所有不同类型设备的工作解决方案。对于不允许透明背景的前KitKat设备,您必须隐藏线性布局。