Navigation tiroir semi- transparent sur la barre d'état ne fonctionne pas

? Boardy @ | Original: StackOverFlow

Je travaille sur le projet Android et je suis mise en œuvre du tiroir de navigation . Je lis à travers la nouvelle http://www.google.com/design/spec/patterns/navigation-drawer.html et http://android-developers.blogspot.co.uk/2014/10/material-design -on- android- checklist.html . La spécification dit que le volet coulissant devrait flotter au-dessus de tout le reste, y compris la barre d'état et être semi- transparent sur la barre d'état .

Mon panneau de navigation est sur ​​la barre d'état, mais ce ne est pas obtenu toute transparence. Je ai suivi le code de cet OS poste comme le suggère le blog de développeurs place, lien Google ci-dessus http://stackoverflow.com/questions/26440879/how-do-i-use-drawerlayout-to-display-over-the-actionbar-toolbar-and-under-the-st/26440880 .

Voici ma mise en page XML

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/my_drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <android.support.v7.widget.Toolbar
            android:id="@+id/my_awesome_toolbar"
            android:layout_height="wrap_content"
            android:layout_width="match_parent"
            android:minHeight="?attr/actionBarSize"
            android:background="@color/appPrimaryColour" />
    </LinearLayout>
    <LinearLayout android:id="@+id/linearLayout"
        android:layout_width="304dp"
        android:layout_height="match_parent"
        android:layout_gravity="left|start"
        android:fitsSystemWindows="true"
        android:background="#ffffff">
        <ListView android:id="@+id/left_drawer"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:choiceMode="singleChoice"></ListView>
    </LinearLayout>
</android.support.v4.widget.DrawerLayout>

Ci-dessous mon applications thème

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/appPrimaryColour</item>
        <item name="colorPrimaryDark">@color/appPrimaryColourDark</item>
        <item name="colorAccent">@color/appPrimaryColour</item>
        <item name="windowActionBar">false</item>
        <item name="windowActionModeOverlay">true</item>

    </style>

Ci-dessous est mon thème applications de v21

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/appPrimaryColour</item>
    <item name="colorPrimaryDark">@color/appPrimaryColourDark</item>
    <item name="colorAccent">@color/appPrimaryColour</item>
    <item name="windowActionBar">false</item>
    <item name="windowActionModeOverlay">true</item>
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>

Ci-dessous est ma méthode onCreate

protected void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    Toolbar toolbar = (Toolbar) findViewById(R.id.my_awesome_toolbar);
    setSupportActionBar(toolbar);

    mDrawerLayout = (DrawerLayout)findViewById(R.id.my_drawer_layout);
    mDrawerList = (ListView)findViewById(R.id.left_drawer);

    mDrawerLayout.setStatusBarBackgroundColor(
        getResources().getColor(R.color.appPrimaryColourDark));

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)
    {
        LinearLayout linearLayout = 
            (LinearLayout)findViewById(R.id.linearLayout);
        linearLayout.setElevation(30);
    }

Voici une capture d'écran de mon tiroir navigation montrant le haut ne est pas semi-transparente

Navigation tiroir semi- transparent sur la barre d'état ne fonctionne pas



Top 5 Respuesta

1mroczis @

Tout ce que vous devez faire est d'utiliser une couleur semi- transparente pour barre d'état . Ajoutez ces lignes à votre thème de v21 :

<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">@color/desired_color</item>

Ne oubliez pas que color ( ressources ) doit être au format #AARRGGBB . Cela signifie que la couleur comprendra également la valeur alpha .



2Michele La Ferla @

Pourquoi ne pas utiliser quelque chose de semblable à cela?

<android.support.v4.widget.DrawerLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >

    <FrameLayout
            android:id="@+id/content_frame"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

    <ListView
            android:id="@+id/left_drawer"
            android:layout_width="240dp"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:choiceMode="singleChoice"
            android:divider="@android:color/transparent"
            android:dividerHeight="0dp"
            android:background="#80111111"/>
</android.support.v4.widget.DrawerLayout>
3markus-hi @

Vous devez envelopper votre navigation tiroir mise en page dans un ScrimLayout .

Un ScrimLayout attire essentiellement un rectangle semi- transparent sur votre mise en page de tiroir de navigation . Pour récupérer la taille de l'encart simplement outrepasser fitSystemWindows dans votre ScrimLayout .

@Override
protected boolean fitSystemWindows(Rect insets) {
    mInsets = new Rect(insets);
    return true;
}

Override tard onDraw pour dessiner un rectangle semi-transparent .

une https://github.com/google/iosched/blob/master/android/src/main/java/com/google/samples/apps/iosched/ui/widget/ScrimInsetsFrameLayout.java la mise en œuvre peut être trouvée dans la source Google IO App .  https://github.com/google/iosched/blob/master/android/src/main/res/layout/navdrawer.xml vous pouvez voir comment il est utilisé dans le xml de mise en page .

4fdsilva @

Je ai eu une fonctionnalité similaire à mettre en œuvre dans mon projet . Et pour rendre mon tiroir transparent i suffit d'utiliser les http://stackoverflow.com/questions/5445085/understanding-colors-in-android-6-characters/11019879#11019879 . En utilisant six chiffres hexadécimaux, vous avez deux chiffres hexadécimaux pour chaque valeur de rouge, vert et bleu respectivement . mais si vous mettez deux chiffres supplémentaires (8 chiffres hexadécimaux ), de sorte que vous avez ARVB ( deux chiffres pour valeur alpha ) ( http://stackoverflow.com/questions/5445085/understanding-colors-in-android-6-characters/11019879#11019879 ) .

Voici les valeurs Hex Opacité : pour les deux chiffres supplémentaires

100% — FF

95% — F2

90% — E6

85% — D9

80% — CC

75% — BF

70% — B3

65% — A6

60% — 99

55% — 8C

50% — 80

45% — 73

40% — 66

35% — 59

30% — 4D

25% — 40

20% — 33

15% — 26

10% — 1A

5% — 0D

0% — 00

Pour exemple : si vous avez la couleur hexadécimal de ( # 111111 ) vient de mettre une des valeurs d'opacité pour obtenir la transparence . comme ceci: ( # 11111100 )

Mon tiroir ne couvre pas la barre d'action ( comme la vôtre ), mais la transparence peut être appliquée également dans ces cas . Voici mon code :

     <ListView
          android:id="@+id/left_drawer"
          android:layout_width="240dp"
          android:layout_height="match_parent"
          android:layout_gravity="start"
          android:background="#11111100"
          android:choiceMode="singleChoice"
          android:divider="@android:color/transparent"
          android:dividerHeight="0dp" />
</android.support.v4.widget.DrawerLayout>

Et voici un autre http://stackoverflow.com/questions/15852122/hex-transparency-in-colors qui peuvent vous aider à comprendre les codes alpha dans des couleurs hexagonales .

5xip @

Votre barre d'état fond est blanc, le fond de votre tiroir LinearLayout . Pourquoi ? Vous êtes paramètres fitsSystemWindows = "true" pour votre DrawerLayout et LinearLayout intérieur. Cela entraîne votre LinearLayout d'étendre derrière la barre d'état ( qui est transparent ) . Ainsi, ce qui rend l'arrière-plan pour la partie de tiroir de la barre d'état blanc.

" __rsm__ " Si vous ne voulez pas que votre tiroir pour se étendre derrière la barre d'état ( voulez avoir un fond semi-transparent pour l'ensemble de barre d'état ), vous pouvez faire deux choses :

1 ) Vous pouvez simplement supprimer toute valeur de fond de votre LinearLayout et la couleur de l'arrière-plan de votre contenu à l'intérieur. ou

2 ) Vous pouvez supprimer fitsSystemWindows="true" de votre LinearLayout . Je pense que ce est une approche plus logique et plus propre. Vous éviterez aussi d'avoir une ombre étant coulé dans la barre d'état, où le tiroir de votre navigation ne se étend pas .

" __rsm__ " Si vous voulez que votre tiroir pour se étendre derrière la barre d'état et ont un, barre d'état superposition semi- transparente de taille, vous pouvez utiliser un https://github.com/google/iosched/blob/master/android/src/main/java/com/google/samples/apps/iosched/ui/widget/ScrimInsetsFrameLayout.java comme un conteneur pour le contenu de votre tiroir ( ListView ) et régler l'arrière-plan de la barre d' état ​​à l'aide «____» . Bien sûr, vous pouvez changer app:insetForeground="#4000" pour tout ce que vous voulez . Ne oubliez pas de garder #4000 ici!

Ou si vous ne voulez pas de superposer votre contenu et seulement afficher une couleur unie, vous pouvez simplement mettre le fond de votre LinearLayout à ce que vous voulez . Ne oubliez pas de régler le fond de votre contenu séparément si !

Navigation tiroir semi- transparent sur la barre d'état ne fonctionne pas