web-dev-qa-db-de.com

Gestaltung des Popup-Menüs in Android 5.0

Ich bereite meine App für Android 5.0 vor. Ich verwende die neueste Kompatibilitätsbibliothek. So sieht mein Stil aus.

<resources>
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="colorPrimary">@color/theme_accent</item>
        <item name="colorAccent">@color/theme_accent_secondary</item>
    </style>

    <style name="AppThemeDark" parent="Theme.AppCompat">
        <item name="colorPrimary">@color/theme_accent</item>
        <item name="colorAccent">@color/theme_accent_secondary</item>
    </style>
</resources>

(Die ActionBar-Farbe wird programmgesteuert festgelegt.)

Jetzt möchte ich, dass das Überlauf-/Popup-Menü den dunklen Hintergrund wie in der Holo-Implementierung hat, aber ich kann es nicht zum Laufen bringen. enter image description here

Ich habe versucht, popupMenuStyle einzustellen, aber es hat nicht funktioniert.

Wie kann ich das Popup-Menü dunkler machen?

13
animaonline

Mein Problem wurde mit diesem Stil gelöst:

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/theme_accent</item>
    <item name="colorAccent">@color/theme_accent_secondary</item>
    <item name="actionBarStyle">@style/AbStyle</item>
    <item name="actionModeBackground">@color/actionmode_bg</item>
</style>

<style name="AbStyle" parent="Widget.AppCompat.Toolbar">
    <item name="elevation">2dp</item>
    <item name="displayOptions">homeAsUp|showTitle</item>
    <!--showHome-->
</style>

<style name="AppThemeDark" parent="Theme.AppCompat">
    <item name="colorAccent">@color/theme_accent_secondary</item>
    <item name="actionBarStyle">@style/AbStyle</item>
</style>

Ich musste Widget.AppCompat.Toolbar als übergeordnetes actionBarStyle verwenden

7
animaonline

Stoppen Sie die Verwendung von ActionBar. Wenn Sie möchten, dass ToolBar wie ActionBar eingerichtet wird, befolgen Sie diese Anleitung im Android-Entwickler-Blog.

Es erwähnt Ihren Anwendungsfall tatsächlich unter Dark Action Bar und stellt diesen Code bereit:

<Android.support.v7.widget.Toolbar
    Android:layout_height=”wrap_content”
    Android:layout_width=”match_parent”
    Android:minHeight=”@dimen/triple_height_toolbar”
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
20
Derk-Jan

Keine vollständige Antwort, aber was ich bisher gefunden habe:

In früheren Versionen mussten Sie einen Drawable angeben (Check https://github.com/StylingAndroid/StylingActionBar Code und Tutorials).

Anscheinend ist das jetzt eine Farbe. Um es zu ändern, müssen Sie das folgende Thema angeben:

<resources xmlns:Android="http://schemas.Android.com/apk/res/Android">

    <style name="AppTheme" parent="Android:Theme.Material.Light.DarkActionBar">
        <item name="Android:actionBarPopupTheme">@style/popupNew</item>
    </style>

    <style name="popupNew" parent="Android:ThemeOverlay.Material.Light">
        <item name="Android:colorBackground">@color/red</item>
    </style>

</resources>

Dies funktioniert korrekt, wenn das auf die App angewendete Design nur Folgendes ist: Wenn ich Android:actionBarPopupTheme zu meinem vorhandenen Design hinzufüge, funktioniert es nicht. Ich versuche herauszufinden warum.

10
Macarse

Fügen Sie die Eigenschaft popupTheme zu Ihrer Symbolleiste hinzu:

<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:background="@color/color_primary"
  app:theme="@style/Theme.AppCompat.Light"
  app:popupTheme="@style/Theme.AppCompat" />

Oder definieren Sie einen neuen Stil für Ihre Symbolleiste:

<style name="MyToolBarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="Android:background">@color/green</item>
    <item name="popupTheme">@style/Theme.AppCompat.Light</item>
    <item name="theme">@style/Theme.AppCompat</item>
</style>
6
Lukas

Diese Frage wurde bereits beim XML-Styling beantwortet, aber ich füge hier eine Erläuterung hinzu, wie Sie die Lösung für diese und ähnliche Styling-Fragen selbst erarbeiten können. 

Erstens ist dies die Lösung bei der Verwendung von AppCompat. Fügen Sie der Style.xml Ihrer App actionBarPopupTheme zu Ihrem Design hinzu:

<style name="Theme.MyTheme" parent="@style/Base.Theme.AppCompat.Light.DarkActionBar">
    ...other stuff here

    <item name="actionBarPopupTheme">@style/Theme.MyTheme.ActionBarPopupTheme</item>
</style>

<style name="Theme.MyTheme.ActionBarPopupTheme" parent="@style/ThemeOverlay.AppCompat.Light">
    <item name="Android:textColor">@Android:color/white</item>
    <item name="Android:background">@Android:color/black</item>
</style>

Hier sind die Schritte, die ich unternommen habe, um zu dieser Lösung zu gelangen (es erfordert etwas Detektivarbeit, da die Android-Dokumentation schlecht ist):

  • Öffnen Sie die style.xml Ihrer App in Android Studio
  • Setzen Sie in der Zeile, in der Ihr App-Design definiert ist, Ihren Bildschirmcursor in das übergeordnete Design (z. B. in @ style/Base.Theme.AppCompat.Light.DarkActionBar), und drücken Sie F4. Dies sollte Sie zum Quellcode für den Stil in der Appcompat-Bibliothek führen.
  • In diesem Stil sah ich diese Zeile:

    <item name = "actionBarPopupTheme"> @ style/ThemeOverlay.AppCompat.Light </ item>

    Dies sah nach einem möglichen Ort aus, um das Thema des Popups zu ändern. Ich suchte in den Armen nach "actionBarPopupTheme" Android-Entwicklerdokumentation und gefunden "Verweis auf ein Design, das verwendet werden soll, um Popup-Fenster aufzurufen, die von Widgets in der Aktionsleiste angezeigt werden". Das war es also wert mit zu spielen.

  • Ich habe die appcompat-Zeile, die "actionBarPopupTheme" enthielt, in meine style.xml-Datei kopiert und dann in dieser Zeile die Themenreferenz des Elements (das oben in Fettdruck dargestellte) durch Theme.MyTheme.ActionBarPopupTheme ersetzt.

  • In meiner style.xml habe ich meinen neuen Stil namens Theme.MyTheme.ActionBarPopupTheme erstellt. Ich habe dasselbe übergeordnete Element verwendet, das in dem von der Appcompat-Quelle kopierten Stil verwendet wurde (das oben in Fettdruck dargestellte Bit).
  • Um sicherzustellen, dass mein neuer Popup-Stil funktioniert, habe ich den übergeordneten Stil in ThemeOverlay.AppCompat.Dark geändert und dann den Code auf einem Gerät ausgeführt und getestet. Der Popup-Stil hat sich geändert. Jetzt wusste ich, dass das Überschreiben von actionBarPopupTheme das Richtige war. Dann habe ich wieder zu ThemeOverlay.AppCompat.Light gewechselt. 
  • Die nächste Herausforderung besteht darin, herauszufinden, welche Elementnamen in Theme.MyTheme.ActionBarPopupTheme überschrieben werden sollen. Ich habe die Text- und Hintergrundfarben geändert. Die richtigen Objektnamen zu finden, die den Stil von etwas verändern, kann in manchen Fällen schwierig sein. Um weniger offensichtliche Stilelementnamen zu finden, können Sie die Style-Definitionen in der appcompat-XML-Datei (die Sie beim Drücken von F4 im zweiten Schritt oben geöffnet haben) durchgehen und so lange in übergeordnete Styles (F4) übergehen, bis Sie etwas finden das kann tun, was Sie wollen. Google-Suchanfragen helfen auch hier. 
1
pbm