web-dev-qa-db-fra.com

Barre d'action transparente de conception matérielle

J'aimerais savoir si quelqu'un sait comment créer une activité avec une barre d'action transparente, comme celle que vous avez dans le nouveau Google Play Store lorsque vous accédez à la page d'une application.

Je me moque du défilement et du passage de transparent à un arrière-plan de couleur unie. J'ai juste besoin de la barre d’action transparente.

Merci.

androidandroid-actionbarandroid-5.0-lollipop
36
user3184899
<item name="colorPrimary">@Android:color/transparent</item>

Ce qui précède entraînera une exception sur les appareils Lollipop. colorPrimary doit être opaque.

Stylisez votre barre d’action en utilisant le style:

<style name="ThemeActionBar"
        parent="Widget.AppCompat.Light.ActionBar.Solid">
        <item name="Android:background">@null</item>
        <!-- Support library compatibility -->
        <item name="background">@null</item>
</style>

Et dans votre thème, incluez simplement:

<item name="Android:actionBarStyle">@style/ThemeActionBar</item>
<item name="Android:windowActionBarOverlay">true</item>
<!-- Support library compatibility -->
<item name="actionBarStyle">@style/ThemeActionBar</item>
<item name="windowActionBarOverlay">true</item>
40
Thiago

Vous avez juste besoin de mettre <item name="colorPrimary">@Android:color/transparent</item> et définissez windowActionBarOverlay sur true sur le thème de votre application, comme suit:

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light">
        <item name="Android:textColorPrimary">@color/my_text_color</item>
        <item name="colorPrimary">@Android:color/transparent</item>
        <item name="windowActionBarOverlay">true</item>
    </style>

</resources>

Le résultat final devrait ressembler à ceci:

final result of code

24
Cristian Gomez

1) Définissez la propriété AppBarLayout elevation sur 0dp.

app: elevation = "0dp"

2) Définissez Toolbar couleur d'arrière-plan sur transparent.

Android: background = "@ Android: couleur/transparent"

Whole xml ressemblera à ci-dessous:

<Android.support.design.widget.AppBarLayout
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:theme="@style/AppTheme.AppBarOverlay"
    app:elevation="0dp">

    <Android.support.v7.widget.Toolbar
        Android:id="@+id/toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="?attr/actionBarSize"
        Android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay">

        ......

    </Android.support.v7.widget.Toolbar>
</Android.support.design.widget.AppBarLayout>

enter image description here

8
Mohit Charadva

barre d'action transparente

values ​​/ styles.xml: 

    <style name="AppTheme" parent="Theme.AppCompat.Light">
...
</style>

<style name="AppTheme.ActionBar.Transparent" parent="AppTheme">
    <item name="Android:windowContentOverlay">@null</item>
    <item name="windowActionBarOverlay">true</item>
    <item name="colorPrimary">@Android:color/transparent</item>
</style>

<style name="AppTheme.ActionBar" parent="AppTheme">
    <item name="windowActionBarOverlay">false</item>
    <item name="colorPrimary">@color/default_yellow</item>
</style>

values-v21/styles.xml: 

    <style name="AppTheme" parent="Theme.AppCompat.Light">
    ...
</style>

<style name="AppTheme.ActionBar.Transparent" parent="AppTheme">
    <item name="colorPrimary">@Android:color/transparent</item>
</style>

<style name="AppTheme.ActionBar" parent="AppTheme">
    <item name="colorPrimaryDark">@color/bg_colorPrimaryDark</item>
    <item name="colorPrimary">@color/default_yellow</item>
</style>

utilisez ces thèmes dans votre AndroidManifest.xml pour spécifier les activités qui auront un ActionBar transparent ou coloré 

<activity
            Android:name=".MyTransparentActionbarActivity"
            Android:theme="@style/AppTheme.ActionBar.Transparent"/>

    <activity
            Android:name=".MyColoredActionbarActivity"
            Android:theme="@style/AppTheme.ActionBar"/>
6
Maksudul Hasan Raju

enter image description here

<style name="AppTheme" parent="Theme.MaterialComponents">
    <item name="Android:navigationBarColor" tools:targetApi="Lollipop">@color/color_primary
    </item>
    <item name="Android:statusBarColor" tools:targetApi="Lollipop">@color/color_primary</item>
    <item name="colorPrimary">@color/color_primary</item>
    <item name="colorPrimaryDark">@color/color_primary_dark</item>
    <item name="colorAccent">@color/color_accent</item>
</style>

<style name="MainTheme" parent="AppTheme">
    <item name="actionBarStyle">@style/MyTheme.ActionBar</item>
    <item name="Android:windowTranslucentStatus">true</item>
    <item name="Android:windowTranslucentNavigation">true</item>
</style>

<style name="MyTheme.ActionBar" parent="Widget.AppCompat.ActionBar">
    <item name="elevation" tools:targetApi="Lollipop">0dp</item>
    <item name="background">@color/semi_transparent</item>
</style>
</resources>


<resources>
<color name="color_primary">#212121</color>
<color name="color_primary_dark">@Android:color/black</color>
<color name="color_accent">#4285F4</color>
<color name="semi_transparent">#66000000</color>
</resources>
4
kreker

Il y a aussi moyen de le faire de manière pragmatique.

getWindow().requestFeature(Window.FEATURE_ACTION_BAR_OVERLAY);
mActionBar.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
mActionBar.setElevation(0);
3
Lemberg

Cela a fonctionné pour moi

getWindow().setFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION, WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);   
getSupportActionBar().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
1
John Joe