Navigation Tiroirs semi-transparentes sur la barre de statut ne fonctionne pas
Je suis en train de travailler sur un projet Android et je me suis mise en œuvre de la Navigation d'un Tiroir. Je suis de la lecture à travers la nouvelle La Conception De Matériel Spec et la La Conception De Matériel Liste De Contrôle.
La spécification dit que le coulissant volet devrait flotter au-dessus de tout le reste, y compris la barre de statut et d'être semi-transparent sur la barre d'état.
Mon panneau de navigation est sur la barre d'état, mais n'est pas eu toute transparence. J'ai suivi le code de cette DONC post comme le suggère le les développeurs de Google blog spot, lien ci-dessus Comment puis-je utiliser DrawerLayout à afficher dans l'ActionBar/Barre d'outils et en vertu de la barre d'état?.
Ci-dessous est mon XML de mise en page
<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 est mon apps 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 apps v21 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>
<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);
}
Ci-dessous est un capture d'écran de ma navigation tiroir montrant le haut n'est pas semi-transparent
- Poster une capture d'écran de vos résultats.
- J'ai mis à jour ma question d'inclure une capture d'écran
- avez-vous réussi à le faire fonctionner?
- Cette question a résolu mon problème 🙂
- Impossible de définir l'effet Transparent dans le statut de bar.Pl se débarrasser d'elle.
Vous devez vous connecter pour publier un commentaire.
Votre barre d'état, le fond est blanc, le fond de votre tiroir
LinearLayout
. Pourquoi? Vous êtes paramètresfitsSystemWindows="true"
pour votreDrawerLayout
et laLinearLayout
à l'intérieur. Cela provoque votreLinearLayout
pour développer derrière la barre d'état (qui est transparente). Donc, ce qui rend l'arrière-plan pour le tiroir de la partie de la barre d'état blanc.Si vous ne voulez pas que votre tiroir à étendre derrière la barre d'état (voulez avoir un fond semi-transparent pour l'ensemble de la barre d'état), vous pouvez faire deux choses:
1), Vous pouvez simplement supprimer l'arrière-plan de la valeur de votre
LinearLayout
et la couleur de l'arrière-plan de votre contenu à l'intérieur. Ou2) Vous pouvez supprimer
fitsSystemWindows="true"
de votreLinearLayout
. Je pense que c'est plus logique et plus propre approche. Vous aurez également éviter d'avoir une ombre de vote en vertu de la barre d'état, où votre navigation tiroir ne s'étend pas.Si vous voulez que votre tiroir à étendre derrière la barre d'état et un semi-transparente, la barre d'état de la taille de superposition, vous pouvez utiliser un
ScrimInsetFrameLayout
comme un conteneur pour votre tiroir de contenu (ListView
) et de définir l'état du fond de la barre à l'aide deapp:insetForeground="#4000"
. Bien sûr, vous pouvez modifier#4000
pour tout ce que vous voulez. N'oubliez pas de garderfitsSystemWindows="true"
ici!Ou si vous ne voulez pas ajouter votre contenu et de n'afficher qu'une couleur unie, vous pouvez simplement définir l'arrière-plan de votre
LinearLayout
pour tout ce que vous voulez. N'oubliez pas de définir l'arrière-plan de votre contenu séparément!EDIT: Vous n'avez plus besoin pour faire face à tout cela. Veuillez voir Aide À La Conception De La Bibliothèque pour un temps plus facile la Navigation de Tiroir/Vue de la mise en œuvre.
Tout ce que vous devez faire est d'utiliser un semi-transparente de couleur pour la barre d'état. Ajoutez ces lignes à votre v21 thème:
N'oubliez pas que le
color
(ressources) doit toujours être dans le format de#AARRGGBB
. Cela signifie que la couleur va aussi inclure la valeur alpha.Pourquoi ne pas utiliser quelque chose de similaire à cela?
Le code ci-dessus utilise l'alpha de la ressource dans la
android:background
pour être en mesure de faire preuve de transparence au sein de l'actionbar.Il y a d'autres façons de le faire par le biais de code, comme d'autres réponses spectacle. Ma réponse ci-dessus, fait le nécessaire dans le fichier xml du fichier de mise en page, qui à mon avis est facilement éditées.
Vous avez besoin d'envelopper votre navigation tiroir de mise en page à l'intérieur d'un
ScrimLayout
.Un
ScrimLayout
fondamentalement dessine un semi-transparente rectangle au-dessus de votre navigation tiroir de mise en page.Pour récupérer la taille de l'encart simplement les remplacer
fitSystemWindows
dans votreScrimLayout
.Remplacent
onDraw
pour dessiner un semi-transparente rectangle.Un exemple mise en œuvre peut être trouvé dans Google IO Application source.
Ici vous pouvez voir comment il est utilisé dans la mise en page xml.
Toutes les réponses mentionnées ici sont trop vieux et trop longue.
Le meilleur et le court de solution que les travaux les plus récentes de la fenêtre des éléments est
cela va changer votre barre d'état la couleur transparente lorsque vous ouvrez le tiroir
Maintenant, quand vous la fermez le tiroir vous avez besoin de changer le statut de la barre de couleur foncé.De sorte que vous pouvez le faire de cette façon.
et ensuite dans la page principale d'ajouter une seule ligne, je.e
et votre tiroir de mise en page va ressembler
et votre mode de navigation ressembler
Je l'ai testé et sa fonctionne pleinement.Espérons que cela aide quelqu'un.Cela peut ne pas être la meilleure approche, mais il fonctionne bien et est simple à mettre en œuvre.
Marque, si cela aide.Amusez-vous bien 🙂
Si vous voulez panneau de navigation est sur la barre d'état et d'être semi-transparent sur la barre d'état. Google I/O De L'Application Pour Android Source offre une bonne solution (APK dans le Play Store ne sont pas mis à jour a duré version)
D'abord vous avez besoin d'un ScrimInsetFrameLayout
Puis, dans votre XML changement de présentation dans cette partie
Changement LinearLayout à votre ScrimInsetFrameLayout comme ce
ScrimInsetsView_insetForeground
attribut .android.support.design.internal.ScrimInsetsFrameLayout
de soutien de la bibliothèqueJ'ai eu une fonctionnalité similaire à mettre en œuvre dans mon projet. Et de faire de mon tiroir transparent je viens d'utiliser le la transparence pour hex de couleurs. À l'aide de 6 chiffres hexadécimaux, vous disposez de 2 chiffres hexadécimaux pour chaque valeur de rouge, vert et bleu respectivement. mais si vous mettez deux chiffres supplémentaires (8 chiffres hexadécimaux), si vous avez ARGB ( deux chiffres pour la valeur alpha)(Regardez ici).
Voici les Hex Valeurs d'Opacité: pour les 2 chiffres supplémentaires
Par exemple: si vous avez de hex couleur (#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 le vôtre), mais la transparence peut être appliqué dans ces cas également. Voici mon code:
Et voici un autre l'article qui peuvent vous aider à comprendre les codes alpha en hexadécimal des couleurs.