indeterminate - progress bar styles android

Android cambia el color de la barra de progreso Horizonal

Question

Establecí la barra de progreso horizontal.

Me gustaría cambiar el color de progreso de amarillo.

<ProgressBar
android:id="@+id/progressbar"
android:layout_width="80dip"
android:layout_height="20dip"
android:focusable="false"
style="?android:attr/progressBarStyleHorizontal" />

El problema es que el color de progreso es diferente en diferentes dispositivos. Entonces, quiero que arregle el color del progreso.

Answer 1

Copié esto de una de mis aplicaciones, por lo que hay algunos atributos adicionales, pero debería darle la idea. Esto es del diseño que tiene la barra de progreso:

<ProgressBar
android:id="@+id/ProgressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:indeterminate="false"
android:maxHeight="10dip"
android:minHeight="10dip"
android:progress="50"
android:progressDrawable="@drawable/greenprogress" />

A continuación, cree un nuevo dibujable con algo similar a lo siguiente (en este caso, greenprogress.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">
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#ff9d9e9d"
android:centerColor="#ff5a5d5a"
android:centerY="0.75"
android:endColor="#ff747674"
android:angle="270"
/>
</shape>
</item>
<item android:id="@android:id/secondaryProgress">
<clip>
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#80ffd300"
android:centerColor="#80ffb600"
android:centerY="0.75"
android:endColor="#a0ffcb00"
android:angle="270"
/>
</shape>
</clip>
</item>
<item
android:id="@android:id/progress"
>
<clip>
<shape>
<corners
android:radius="5dip" />
<gradient
android:startColor="#33FF33"
android:endColor="#008000"
android:angle="270" />
</shape>
</clip>
</item>
</layer-list>

Puede cambiar los colores según sea necesario, esto le dará una barra de progreso verde.

Answer 2

El color de ProgressBar se puede cambiar de la siguiente manera:

/res/values/colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="colorAccent">#FF4081</color>
</resources>

/res/values/styles.xml

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

onCreate:

progressBar = (ProgressBar) findViewById(R.id.progressBar);
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
Drawable drawable = progressBar.getIndeterminateDrawable().mutate();
drawable.setColorFilter(ContextCompat.getColor(this, R.color.colorAccent), PorterDuff.Mode.SRC_IN);
progressBar.setIndeterminateDrawable(drawable);
}

Answer 3

Hay 3 formas de resolver esta pregunta:

1. Cómo ajustar el color de la barra de progreso declarativamente
2. Cómo ajustar el color de la barra de progreso mediante programación, pero elija el color de varios colores predeterminados declarados antes del tiempo de compilación
3. Cómo ajustar el color de la barra de progreso programáticamente y también crear el color programáticamente.

En particular, existe una gran confusión en torno a los números 2 y 3, como se ve en los comentarios a la respuesta de amfcosta. Esa respuesta arrojará resultados de color impredecibles cada vez que desee establecer la barra de progreso en cualquier cosa excepto los colores primarios, ya que solo modifica el color de fondo, y el área de "clip" de la barra de progreso real seguirá siendo una superposición amarilla con opacidad reducida. Por ejemplo, el uso de ese método para establecer el fondo en color morado oscuro dará como resultado un color de "barra" de barra de progreso de algún color rosado oscuro resultante de la mezcla de color púrpura oscuro y amarillo a través de alfa reducido.

De todos modos, Ryan # responde perfectamente # 1 y Štarke responde la mayoría # 3, pero para aquellos que buscan una solución completa para # 2 y # 3:

Cómo ajustar el color de la barra de progreso mediante programación, pero elija el color de un color predeterminado declarado en XML

res / drawable / my_progressbar.xml :

Crea este archivo pero cambia los colores en my_progress y my_secondsProgress:

(NOTA: Esta es solo una copia del archivo XML real que define el SDK ProgressBar predeterminado de Android, pero he cambiado las ID y los colores. El original se llama progress_horizontal)

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+id/my_progress_background">
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#ff9d9e9d"
android:centerColor="#ff5a5d5a"
android:centerY="0.75"
android:endColor="#ff747674"
android:angle="270"
/>
</shape>
</item>
<item android:id="@+id/my_secondaryProgress">
<clip>
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#80ff171d"
android:centerColor="#80ff1315"
android:centerY="0.75"
android:endColor="#a0ff0208"
android:angle="270"
/>
</shape>
</clip>
</item>
<item android:id="@+id/my_progress">
<clip>
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#7d2afdff"
android:centerColor="#ff2afdff"
android:centerY="0.75"
android:endColor="#ff22b9ba"
android:angle="270"
/>
</shape>
</clip>
</item>

En tu Java :

final Drawable drawable;
int sdk = android.os.Build.VERSION.SDK_INT;
if(sdk < 16) {
drawable = ctx.getResources().getDrawable(R.drawable.my_progressbar);
} else {
drawable = ContextCompat.getDrawable(ctx, R.drawable.my_progressbar);
}
progressBar.setProgressDrawable(drawable)

Cómo ajustar el color de la barra de progreso programáticamente y también crear el color programáticamente

EDIT: encontré el tiempo para resolver esto correctamente. Mi respuesta anterior dejó esto un poco ambiguo.

Un ProgressBar se compone como 3 Drawables en un LayerDrawable.

1. Layer 1 es el fondo
2. La capa 2 es el color de progreso secundario
3. Layer 3 es el color principal de la barra de progreso

En el siguiente ejemplo, cambiaré el color de la barra de progreso principal a cian.

//Create new ClipDrawable to replace the old one
float pxCornerRadius = viewUtils.convertDpToPixel(5);
final float[] roundedCorners = new float[] { pxCornerRadius, pxCornerRadius, pxCornerRadius, pxCornerRadius, pxCornerRadius, pxCornerRadius, pxCornerRadius, pxCornerRadius };
ShapeDrawable shpDrawable = new ShapeDrawable(new RoundRectShape(roundedCorners, null, null));
shpDrawable.getPaint().setColor(Color.CYAN);
final ClipDrawable newProgressClip = new ClipDrawable(shpDrawable, Gravity.LEFT, ClipDrawable.HORIZONTAL);
//Replace the existing ClipDrawable with this new one
final LayerDrawable layers = (LayerDrawable) progressBar.getProgressDrawable();
layers.setDrawableByLayerId(R.id.my_progress, newProgressClip);

Ese ejemplo lo estableció en un color sólido. Puede establecerlo en un degradado de color reemplazando

shpDrawable.getPaint().setColor(Color.CYAN);

con

Shader shader = new LinearGradient(0, 0, 0, progressBar.getHeight(), Color.WHITE, Color.BLACK, Shader.TileMode.CLAMP);
shpDrawable.getPaint().setShader(shader);

Aclamaciones.

-Lanza

Answer 4

La solución más simple que descubrí es algo como esto:

<item name="colorAccent">@color/white_or_any_color</item>

Coloque lo anterior en el archivo styles.xml en la carpeta res > values .

NOTA: Si usa cualquier otro color de acento, entonces las soluciones anteriores deberían ser buenas.

API 21 o SUPERIOR

Answer 5

Para cualquiera que esté buscando cómo hacerlo programáticamente:

 Drawable bckgrndDr = new ColorDrawable(Color.RED);
Drawable secProgressDr = new ColorDrawable(Color.GRAY);
Drawable progressDr = new ScaleDrawable(new ColorDrawable(Color.BLUE), Gravity.LEFT, 1, -1);
LayerDrawable resultDr = new LayerDrawable(new Drawable[] { bckgrndDr, secProgressDr, progressDr });
//setting ids is important
resultDr.setId(0, android.R.id.background);
resultDr.setId(1, android.R.id.secondaryProgress);
resultDr.setId(2, android.R.id.progress);

Establecer identificadores en los documentos deslizables es crucial y se ocupa de preservar los límites y el estado real de la barra de progreso.

Answer 6

Si solo desea cambiar el color de la barra de progreso, simplemente puede usar un filtro de color en el método onCreate () de su actividad:

ProgressBar progressbar = (ProgressBar) findViewById(R.id.progressbar);
int color = 0xFF00FF00;
progressbar.getIndeterminateDrawable().setColorFilter(color, PorterDuff.Mode.SRC_IN);
progressbar.getProgressDrawable().setColorFilter(color, PorterDuff.Mode.SRC_IN);

Idea de here

Solo necesita hacer esto para las versiones previas a la piruleta. En Lollipop puede usar el atributo de estilo colorAccent.

Answer 7

Solo crea un estilo en values/styles.xml .

<style name="ProgressBarStyle">
<item name="colorAccent">@color/greenLight</item>
</style>

Luego configure este estilo como su tema ProgressBar .

<ProgressBar
android:theme="@style/ProgressBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

y no importa su barra de progreso es horizontal o circular. Eso es todo.

Answer 8

Una solución más simple:

progess_drawable_blue

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background">
<shape>
<solid
android:color="@color/disabled" />
</shape>
</item>
<item
android:id="@android:id/progress">
<clip>
<shape>
<solid
android:color="@color/blue" />
</shape>
</clip>
</item>
</layer-list>

Answer 9

Ustedes realmente me están dando un dolor de cabeza. Lo que puede hacer es hacer su lista de capas dibujable vía xml primero (es decir, un fondo como la primera capa, un dibujable que representa el progreso secundario como la segunda capa y otro dibujable que representa el progreso primario como la última capa), luego cambie el color en el código haciendo lo siguiente:

public void setPrimaryProgressColor(int colorInstance) {
if (progressBar.getProgressDrawable() instanceof LayerDrawable) {
Log.d(mLogTag, "Drawable is a layer drawable");
LayerDrawable layered = (LayerDrawable) progressBar.getProgressDrawable();
Drawable circleDrawableExample = layered.getDrawable(<whichever is your index of android.R.id.progress>);
circleDrawableExample.setColorFilter(colorInstance, PorterDuff.Mode.SRC_IN);
progressBar.setProgressDrawable(layered);
} else {
Log.d(mLogTag, "Fallback in case it''s not a LayerDrawable");
progressBar.getProgressDrawable().setColorFilter(color, PorterDuff.Mode.SRC_IN);
}
}

Este método le dará la mejor flexibilidad para declarar la medida de su dibujo original en el xml, SIN MODIFICACIÓN DE SU ESTRUCTURA POSTERIORMENTE, especialmente si necesita tener la carpeta de la pantalla de archivo xml específica, luego simplemente modificando SOLAMENTE EL COLOR a través del código. No volver a crear una instancia nueva de ShapeDrawable desde cero.

Answer 10

capas finales LayerDrawable = (LayerDrawable) progressBar.getProgressDrawable (); layers.getDrawable (2) .setColorFilter (color, PorterDuff.Mode.SRC_IN);

Answer 11

las respuestas anteriores cambian todo el color de fondo y sus ambigios cambian la altura de la barra de progreso a muy máx.que no se puede cambiar en xml. La mejor manera de cambiar solo el estado de la barra de progreso que se completa es un 20% de color rojo, un 50% de color amarillo y un 70% de color verde. puedes hacerlo programáticamente en java.

comparte tu respuesta si tienes otra solución.

Answer 12

para el nivel API 21 o superior solo use

android:progressBackgroundTint="@color/yourBackgroundColor"
android:progressTint="@color/yourColor"