Ich wollte eine Suchleiste gestalten, die wie im Bild unten aussieht.
Wenn ich die Standard-Suchleiste verwende, erhalte ich ungefähr Folgendes:
Ich muss also nur die Farbe ändern. Ich brauche keine zusätzlichen Stile. Gibt es einen einfachen Ansatz, um dies zu tun, oder sollte ich mein benutzerdefiniertes Zeichenobjekt erstellen?
Ich habe versucht, eine benutzerdefinierte zu erstellen, aber ich konnte nicht die genaue wie oben gezeigt erhalten. Nach der Verwendung von benutzerdefinierten Zeichenobjekten erhalte ich Folgendes:
Wenn ich die benutzerdefinierte erstellen muss, schlagen Sie bitte vor, wie Sie die Breite der Fortschrittslinie und auch die Form reduzieren können.
meine benutzerdefinierte Implementierung:
background_fill.xml:
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<gradient
android:angle="90"
android:centerColor="#FF555555"
android:endColor="#FF555555"
android:startColor="#FF555555" />
<corners android:radius="1dp" />
<stroke
android:width="1dp"
android:color="#50999999" />
<stroke
android:width="1dp"
android:color="#70555555" />
</shape>
progress_fill.xml
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<gradient
android:angle="90"
android:centerColor="#FFB80000"
android:endColor="#FFFF4400"
android:startColor="#FF470000" />
<corners android:radius="1dp" />
<stroke
android:width="1dp"
android:color="#50999999" />
<stroke
android:width="1dp"
android:color="#70555555" />
</shape>
progress.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="@android:id/background"
android:drawable="@drawable/background_fill"/>
<item android:id="@android:id/progress">
<clip android:drawable="@drawable/progress_fill" />
</item>
</layer-list>
thumb.xml
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<gradient
android:angle="270"
android:endColor="#E5492A"
android:startColor="#E5492A" />
<size
android:height="20dp"
android:width="20dp" />
</shape>
Suchleiste:
<SeekBar
android:id="@+id/seekBarDistance"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="88dp"
android:progressDrawable="@drawable/progress"
android:thumb="@drawable/thumb" >
</SeekBar>
quelle
Antworten:
Ich würde Drawables und XML aus dem Android-Quellcode extrahieren und seine Farbe in Rot ändern. Hier ist ein Beispiel, wie ich dies für mdpi-Drawables abgeschlossen habe:
Benutzerdefiniert
red_scrubber_control.xml
(zu res / drawable hinzufügen):Benutzerdefiniert:
red_scrubber_progress.xml
Dann kopiere die erforderlichen Drawables aus dem Android-Quellcode, den ich von diesem Link genommen habe
Es ist gut, diese Zeichen für jedes hdpi, mdpi, xhdpi zu kopieren. Zum Beispiel benutze ich nur mdpi:
Ändern Sie dann mit Photoshop die Farbe von blau nach rot:
red_scrubber_control_disabled_holo.png:
red_scrubber_control_focused_holo.png:
red_scrubber_control_normal_holo.png:
red_scrubber_control_pressed_holo.png:
red_scrubber_primary_holo.9.png:
red_scrubber_secondary_holo.9.png:
red_scrubber_track_holo_light.9.png:
Fügen Sie SeekBar zum Layout hinzu:
Ergebnis:
quelle
red_scrubber_control
ich das Zeichen für den Daumen benutze, stoße ich auf einen Absturz. Wenn alle Drawables im Selector gleich sind, funktioniert es gut, aber wenn ich eines davon ändere, bekomme ichResources$NotFoundException: File .../red_scrubber_control.xml from drawaable resource ID...
irgendwelche Gedanken?@dimen
, die Größe des Daumens basierend auf dem Bildschirm einzustellen?Meine Antwort ist inspiriert von Andras Balázs Lajthas Antwort, die es erlaubt, ohne XML-Datei zu arbeiten
quelle
android:progressTint="@color/my_color" android:thumbTint="@color/another_color"
Wenn Sie genau den gleichen Balken in Rot wünschen, können Sie programmgesteuert einen PorterDuff-Farbfilter hinzufügen. Sie können jedes Zeichenelement, das Sie einfärben möchten, mit den Methoden der ProgressBar- Basisklasse abrufen . Stellen Sie dann einen Farbfilter dafür ein.
Wenn die gewünschte Farbanpassung nicht über einen Porter Duff-Filter vorgenommen werden kann, können Sie Ihren eigenen Farbfilter angeben .
quelle
Benutzerdefinierter Materialstil für Android-Suchleisten für andere Suchleistenanpassungen http://www.zoftino.com/android-seekbar-and-custom-seekbar-examples
quelle
colorControlActivated
der richtige Parameter für den Daumen ist? Es sollte seinthumbTint
.Ersetzen Sie einfach Farbatributtes durch Ihre Farbe
background.xml
progress.xml
style.xml
thumb.xml
quelle
Google hat dies in SDK 21 vereinfacht. Jetzt haben wir Attribute zum Festlegen der Daumenfarben:
http://developer.android.com/reference/android/widget/AbsSeekBar.html#attr_android:thumbTint http://developer.android.com/reference/android/widget/AbsSeekBar.html#attr_android:thumbTintMode
quelle
Alle diese Antworten sind veraltet.
Im Jahr 2019 ist es einfacher , Ihre seekbar auf Ihre bevorzugte Farbe , Stil , indem Sie Ihre Wechsel
ProgressBar
zu diesemVersuchen Sie den folgenden Code, um Ihre Suchleistenfarbe programmgesteuert zu gestalten
quelle
Wie oben erwähnt (@andrew), ist das Erstellen einer benutzerdefinierten SeekBar mit dieser Website - http://android-holo-colors.com/ - sehr einfach.
Aktivieren Sie dort einfach SeekBar, wählen Sie Farbe und erhalten Sie alle Ressourcen und kopieren Sie sie in das Projekt. Wenden Sie sie dann in XML an, zum Beispiel:
quelle
Ausgabe:
in der Layoutdatei:
drawable / progress.xml
drawable / background_fill.xml
drawable / progress_fill.xml
drawable / custom_thumb.xml
Farben.xml
quelle
Einfach einstellen
Das ist alles
quelle
funktioniert wie gleich die gewählte Antwort. Keine Notwendigkeit, eine zeichnbare Datei zu erstellen oder sonst. (nur IN 5.0) Grüße
quelle
Standardmäßig passt Android die Fortschrittsfarbe Ihres Schiebereglers an
Wert in Ihrer styles.xml . Um ein benutzerdefiniertes Schieberegler- Daumenbild festzulegen , verwenden Sie einfach diesen Code im Block Ihres SeekBar- XML-Layouts:
quelle
quelle
Für APIs <21 (und> = 21) können Sie die Antwort von @Ahamadullah Saikat oder https://www.lvguowei.me/post/customize-android-seekbar-color/ verwenden .
drawable / seek_bar_ruler.xml:
drawable / seek_bar_slider.xml:
quelle
Wenn Sie die von Android Sdk bereitgestellte Standard-SeekBar verwenden, können Sie auf einfache Weise die Farbe ändern. Gehen Sie einfach zu color.xml in /res/values/colors.xml und ändern Sie den colorAccent.
quelle
Ich ändere das
background_fill.xml
und das
progress_fill.xml
um den Hintergrund und die Fortschrittshöhe zu
1dp
bestimmen.quelle
Einfache Möglichkeit, die Farbe der Suchleiste zu ändern ...
Stil: Progress_color
Java-Klassenänderung ProgressDrawable ()
quelle
Wenn Sie sich die Android-Ressourcen ansehen, werden in der Suchleiste tatsächlich Bilder verwendet.
Sie müssen eine Zeichenfläche erstellen, die oben und unten transparent ist, z. B. 10 Pixel, und die mittlere 5 Pixel-Linie ist sichtbar.
Siehe beigefügtes Bild. Sie müssen es in ein NinePatch konvertieren.
quelle
Für diejenigen, die Datenbindung verwenden:
Fügen Sie jeder Klasse die folgende statische Methode hinzu
Fügen Sie
app:thumbTintCompat
Ihrer SeekBar ein Attribut hinzuDas ist es. Jetzt können Sie
app:thumbTintCompat
mit jedem verwendenSeekBar
. Die Fortschrittsfarbe kann auf die gleiche Weise konfiguriert werden.Hinweis: Diese Methode ist auch mit Pre-Lollipop-Geräten kompatibel.
quelle
Kleine Korrektur der Antwort von @ arnav-rao:
Verwenden Sie Folgendes, um sicherzustellen, dass der Daumen richtig gefärbt ist:
hier android: thumbTint färbt tatsächlich den "Daumen"
quelle
Überprüfen Sie dieses Tutorial sehr gut
https://www.lvguowei.me/post/customize-android-seekbar-color/
einfach:
dann eine Style-Datei:
quelle
Ich wollte einen Stil für die Suchleiste erstellen und den Stil dann einem Thema hinzufügen, damit er auf ein ganzes Thema angewendet werden kann, während ein Unterstil ihn überschreiben kann. Folgendes habe ich getan:
Das Obige setzt den Suchleistenstil des Themas für alle Geräte 21+ einschließlich Samsung auf blau (für die zusätzlich zu android: seekBarStyle auch seekBarStyle angewendet werden muss; nicht sicher warum, aber ich habe dieses Problem aus erster Hand gesehen). Wenn Sie möchten, dass alle Suchleisten den Designstil beibehalten und den grünen Suchleistenstil nur auf einige Widgets anwenden, fügen Sie dem gewünschten Widget Folgendes hinzu:
quelle
Mit der Material Component Library Version 1.2.0 können Sie die neue
Slider
Komponente verwenden.Sie können die Standardfarbe wie folgt überschreiben:
Andernfalls können Sie diese Attribute im Layout verwenden, um eine Farbe oder einen Farbwähler zu definieren:
oder Sie können einen benutzerdefinierten Stil verwenden:
quelle
Sie können es auch so machen:
Hoffe es wird helfen!
quelle