style studio progressbar color change cambiar bar android android-progressbar

android - studio - change color to progress bar



Cómo cambiar el color de progreso de la barra de progreso en Android (30)

Esto es lo que hice. Trabajó.

Barra de progreso:

<ProgressBar android:id="@+id/progressBar" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="4" android:indeterminateDrawable="@drawable/progressdrawable" />

progressdrawable.xml:
Aquí usa gradiente para cambiar el color a tu gusto. Y android: toDegrees = "X" aumenta el valor de X y la barra de progreso gira rápidamente. Disminuya y rote lentamente. Personalice de acuerdo a sus necesidades.

<?xml version="1.0" encoding="utf-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="4000" android:fromDegrees="0" android:pivotX="50%" android:pivotY="50%" android:toDegrees="360" > <shape android:innerRadius="20dp" android:shape="ring" android:thickness="4dp" android:useLevel="false" > <size android:height="48dp" android:width="48dp" /> <gradient android:centerColor="#80ec7e2a" android:centerY="0.5" android:endColor="#ffec7e2a" android:startColor="#00ec7e2a" android:type="sweep" android:useLevel="false" /> </shape> </rotate>

muestra:

Estoy usando una barra de progreso horizontal en mi aplicación de Android, y quiero cambiar su color de progreso (que es amarillo de forma predeterminada). ¿Cómo puedo hacerlo usando code (no XML)?


Aplicar este estilo personalizado a la barra de progreso.

<style name="customProgress" parent="@android:style/Widget.ProgressBar.Small"> <item name="android:indeterminateDrawable">@drawable/progress</item> <item name="android:duration">40</item> <item name="android:animationCache">true</item> <item name="android:drawingCacheQuality">low</item> <item name="android:persistentDrawingCache">animation</item> </style>

@ drawable / progress.xml -

<?xml version="1.0" encoding="utf-8"?> <animated-rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/spinner_white" android:pivotX="50%" android:pivotY="50%" />

Utilice este tipo de imagen para la barra de progreso.

Para un mejor resultado puede utilizar múltiples imágenes de progreso. Y, por favor, no dude en usar imágenes, porque la propia plataforma Android usa imágenes para la barra de progreso. El código se extrae de SDK :)


Aquí está el código para cambiar el color de ProgressBar mediante programación.

ProgressBar progressBar = (ProgressBar) findViewById(R.id.pb_listProgressBar); int colorCodeDark = Color.parseColor("#F44336"); progressBar.setIndeterminateTintList(ColorStateList.valueOf(colorCodeDark));


Como lo hice en ProgressBar horizontal:

LayerDrawable layerDrawable = (LayerDrawable) progressBar.getProgressDrawable(); Drawable progressDrawable = layerDrawable.findDrawableByLayerId(android.R.id.progress); progressDrawable.setColorFilter(color, PorterDuff.Mode.SRC_IN);


De acuerdo con algunas de las sugerencias, PUEDE especificar una forma y un clip extraíble con un color y luego establecerla. Tengo este trabajo programáticamente. Así es como lo hago ..

Primero asegúrese de importar la biblioteca dibujable ..

import android.graphics.drawable.*;

Luego use el código similar al siguiente;

ProgressBar pg = (ProgressBar)row.findViewById(R.id.progress); final float[] roundedCorners = new float[] { 5, 5, 5, 5, 5, 5, 5, 5 }; pgDrawable = new ShapeDrawable(new RoundRectShape(roundedCorners, null,null)); String MyColor = "#FF00FF"; pgDrawable.getPaint().setColor(Color.parseColor(MyColor)); ClipDrawable progress = new ClipDrawable(pgDrawable, Gravity.LEFT, ClipDrawable.HORIZONTAL); pg.setProgressDrawable(progress); pg.setBackgroundDrawable(getResources().getDrawable(android.R.drawable.progress_horizontal)); pg.setProgress(45);


Es muy sencillo usar attr, si se trata de aplicaciones multiestilo:

prueba de esta manera

Declara debajo del atributo attrs.xml

<attr name="circularProgressTheme" format="reference"></attr>

Pegue debajo del código en styles.xml

<style name="ProgressThemeWhite" parent="ThemeOverlay.AppCompat.Light"> <item name="colorAccent">#FF0000</item> </style> <style name="circularProgressThemeWhite"> <item name="android:theme">@style/ProgressThemeWhite</item> </style> <style name="AppTheme" parent="Theme.AppCompat.NoActionBar"> <item name="circularProgressTheme">@style/circularProgressThemeWhite</item> </style>

usa la barra de progreso como abajo

<ProgressBar style="?attr/circularProgressTheme" android:id="@+id/commonProgress" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:visibility="visible"/>


Esta es una pregunta antigua, pero el tema de uso no se menciona aquí. Si su tema predeterminado utiliza AppCompat , el color de su ProgressBar será el colorAccent que haya definido.

Cambiar colorAccent también cambiará el color de tu ProgressBar , pero los cambios también se reflejan en múltiples lugares. Por lo tanto, si desea un color diferente solo para una PregressBar específica, puede hacerlo aplicando el tema a esa PregressBar ProgressBar :

  • Amplíe su tema predeterminado y anule colorAccent

    <style name="AppTheme.WhiteAccent"> <item name="colorAccent">@color/white</item> <!-- Whatever color you want--> </style>

  • Y en ProgressBar agrega el atributo android:theme :

    android:theme="@style/AppTheme.WhiteAccent"

Así se verá algo como esto:

<ProgressBar android:id="@+id/loading" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:padding="10dp" android:theme="@style/AppTheme.WhiteAccent" />

Así que solo estás cambiando un colorAccent para tu colorAccent de ProgressBar particular.

Nota : Usar style no funcionará. Necesitas usar android:theme solo android:theme . Puede encontrar más uso del tema aquí: https://plus.google.com/u/0/+AndroidDevelopers/posts/JXHKyhsWHAH


Esta solución funcionó para mí:

<style name="Progressbar.White" parent="AppTheme"> <item name="colorControlActivated">@color/white</item> </style> <ProgressBar android:layout_width="@dimen/d_40" android:layout_height="@dimen/d_40" android:indeterminate="true" android:theme="@style/Progressbar.White"/>


Esto funcionó para mí:

<ProgressBar android:indeterminateTint="#d60909" ... />


Esto no es programático, pero creo que podría ayudar a mucha gente de todos modos. Intenté mucho y la forma más eficiente fue agregar estas líneas a mi Barra de progreso en el archivo .xml:

android:indeterminate="true" android:indeterminateTintMode="src_atop" android:indeterminateTint="@color/secondary"

Así que al final este código lo hizo por mí:

<ProgressBar android:id="@+id/progressBar" style="?android:attr/progressBarStyleLarge" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:layout_marginTop="50dp" android:layout_marginBottom="50dp" android:visibility="visible" android:indeterminate="true" android:indeterminateTintMode="src_atop" android:indeterminateTint="@color/secondary">

Esta solución funciona para API 21+


Haga clic en el mismo problema mientras trabaja para modificar la apariencia de la barra de progreso predeterminada. Aquí hay más información que esperamos ayude a la gente :)

  • El nombre del archivo xml solo debe contener caracteres: a-z0-9_. (es decir, sin mayúsculas)
  • Para hacer referencia a su "dibujable" es R.drawable.filename
  • Para anular el aspecto predeterminado, usa myProgressBar.setProgressDrawable(...) , sin embargo, no es necesario que solo puedas referirte a tu diseño personalizado como R.drawable.filename , necesitas recuperarlo como Drawable :

    Resources res = getResources(); myProgressBar.setProgressDrawable(res.getDrawable(R.drawable.filename);

  • Debe establecer el estilo antes de configurar el progreso / el progreso secundario / máx .

Hoy en día, en 2016, encontré que algunos dispositivos pre-Lollipop no colorAccent configuración de colorAccent , por lo que mi solución final para todas las API es ahora la siguiente:

// fixes pre-Lollipop progressBar indeterminateDrawable tinting if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) { Drawable wrapDrawable = DrawableCompat.wrap(mProgressBar.getIndeterminateDrawable()); DrawableCompat.setTint(wrapDrawable, ContextCompat.getColor(getContext(), android.R.color.holo_green_light)); mProgressBar.setIndeterminateDrawable(DrawableCompat.unwrap(wrapDrawable)); } else { mProgressBar.getIndeterminateDrawable().setColorFilter(ContextCompat.getColor(getContext(), android.R.color.holo_green_light), PorterDuff.Mode.SRC_IN); }

Para los puntos de bonificación, no utiliza ningún código en desuso. ¡Intentalo!


La solución más simple si desea cambiar el color en el archivo xml de diseño, use el siguiente código y use la propiedad indeterminateTint para el color deseado.

<ProgressBar android:id="@+id/progressBar" style="?android:attr/progressBarStyle" android:layout_width="wrap_content" android:indeterminate="true" android:indeterminateTintMode="src_atop" android:indeterminateTint="#ddbd4e" android:layout_height="wrap_content" android:layout_marginBottom="20dp" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" />


Lamento que no sea la respuesta, pero ¿qué determina el requisito de establecerlo desde el código? Y .setProgressDrawable debería funcionar si está definido correctamente

<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="@color/progress_start" android:endColor="@color/progress_end" android:angle="270" /> </shape> </clip> </item> </layer-list>


Para mi barra de progreso (giro) indeterminado, acabo de configurar un filtro de color en el dibujo. Funciona muy bien y solo una linea.

Ejemplo donde se configura el color a rojo:

ProgressBar spinner = new android.widget.ProgressBar( context, null, android.R.attr.progressBarStyle); spinner.getIndeterminateDrawable().setColorFilter(0xFFFF0000, android.graphics.PorterDuff.Mode.MULTIPLY);


Para un estilo horizontal ProgressBar utilizo:

import android.widget.ProgressBar; import android.graphics.drawable.GradientDrawable; import android.graphics.drawable.ClipDrawable; import android.view.Gravity; import android.graphics.drawable.Drawable; import android.graphics.drawable.LayerDrawable; public void setColours(ProgressBar progressBar, int bgCol1, int bgCol2, int fg1Col1, int fg1Col2, int value1, int fg2Col1, int fg2Col2, int value2) { //If solid colours are required for an element, then set //that elements Col1 param s the same as its Col2 param //(eg fg1Col1 == fg1Col2). //fgGradDirection and/or bgGradDirection could be parameters //if you require other gradient directions eg LEFT_RIGHT. GradientDrawable.Orientation fgGradDirection = GradientDrawable.Orientation.TOP_BOTTOM; GradientDrawable.Orientation bgGradDirection = GradientDrawable.Orientation.TOP_BOTTOM; //Background GradientDrawable bgGradDrawable = new GradientDrawable( bgGradDirection, new int[]{bgCol1, bgCol2}); bgGradDrawable.setShape(GradientDrawable.RECTANGLE); bgGradDrawable.setCornerRadius(5); ClipDrawable bgclip = new ClipDrawable( bgGradDrawable, Gravity.LEFT, ClipDrawable.HORIZONTAL); bgclip.setLevel(10000); //SecondaryProgress GradientDrawable fg2GradDrawable = new GradientDrawable( fgGradDirection, new int[]{fg2Col1, fg2Col2}); fg2GradDrawable.setShape(GradientDrawable.RECTANGLE); fg2GradDrawable.setCornerRadius(5); ClipDrawable fg2clip = new ClipDrawable( fg2GradDrawable, Gravity.LEFT, ClipDrawable.HORIZONTAL); //Progress GradientDrawable fg1GradDrawable = new GradientDrawable( fgGradDirection, new int[]{fg1Col1, fg1Col2}); fg1GradDrawable.setShape(GradientDrawable.RECTANGLE); fg1GradDrawable.setCornerRadius(5); ClipDrawable fg1clip = new ClipDrawable( fg1GradDrawable, Gravity.LEFT, ClipDrawable.HORIZONTAL); //Setup LayerDrawable and assign to progressBar Drawable[] progressDrawables = {bgclip, fg2clip, fg1clip}; LayerDrawable progressLayerDrawable = new LayerDrawable(progressDrawables); progressLayerDrawable.setId(0, android.R.id.background); progressLayerDrawable.setId(1, android.R.id.secondaryProgress); progressLayerDrawable.setId(2, android.R.id.progress); //Copy the existing ProgressDrawable bounds to the new one. Rect bounds = progressBar.getProgressDrawable().getBounds(); progressBar.setProgressDrawable(progressLayerDrawable); progressBar.getProgressDrawable().setBounds(bounds); // setProgress() ignores a change to the same value, so: if (value1 == 0) progressBar.setProgress(1); else progressBar.setProgress(0); progressBar.setProgress(value1); // setSecondaryProgress() ignores a change to the same value, so: if (value2 == 0) progressBar.setSecondaryProgress(1); else progressBar.setSecondaryProgress(0); progressBar.setSecondaryProgress(value2); //now force a redraw progressBar.invalidate(); }

Un ejemplo de llamada sería:

setColours(myProgressBar, 0xff303030, //bgCol1 grey 0xff909090, //bgCol2 lighter grey 0xff0000FF, //fg1Col1 blue 0xffFFFFFF, //fg1Col2 white 50, //value1 0xffFF0000, //fg2Col1 red 0xffFFFFFF, //fg2Col2 white 75); //value2

Si no necesita el ''progreso secundario'' simplemente configure value2 a value1.


Para una ColorFilter progreso horizontal, también puede usar un ColorFilter , como este:

progressBar.getProgressDrawable().setColorFilter( Color.RED, android.graphics.PorterDuff.Mode.SRC_IN);

Nota: Esto modifica la apariencia de todas las barras de progreso en su aplicación. Para modificar solo una barra de progreso específica, haga esto:

Drawable progressDrawable = progressBar.getProgressDrawable().mutate(); progressDrawable.setColorFilter(Color.RED, android.graphics.PorterDuff.Mode.SRC_IN); progressBar.setProgressDrawable(progressDrawable);

Si progressBar es indeterminado, use getIndeterminateDrawable() lugar de getProgressDrawable() .

Desde Lollipop (API 21) puede establecer un tinte de progreso:

progressBar.setProgressTintList(ColorStateList.valueOf(Color.RED));


Probablemente hay una cosa que no se ha mencionado en esta respuesta:

Si su tema se hereda de Theme.AppCompat , ProgressBar asumirá el color que definió como "colorAccent" en su tema.

Entonces, usando ...

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

..wint teñirá automáticamente el color de la Barra de progreso en @color/custom_color .


Publicado para agregar información sobre la respuesta de PaulieG , ya que ateiob me pidió que explicara algo ...

Desafortunadamente, cuando propuse una edición a la solución, fue hace mucho tiempo y no puedo recordar todos los detalles.

Puedo decir que hay (o al menos hubo, al momento de escribir cuando miré la versión actual del código fuente de Android) un error / problema / optimización en el código de la barra de ProgressBar que ignora el intento de establecer el progreso en un valor ya está en

  • es decir, si progress = 45, e intenta establecerlo en 45, el código no hará nada y no volverá a dibujar el progreso .

Después de llamar a ProgressBar.setProgressDrawable() , su barra de progreso estará en blanco (porque cambió la parte dibujable).

Esto significa que necesita establecer el progreso y volver a dibujarlo. Pero si solo establece el progreso en un valor preservado, no hará nada.

Primero debe establecerlo en 0, luego nuevamente en el valor "antiguo", y la barra se volverá a dibujar.

Para resumir:

  • preservar el valor de progreso "antiguo"
  • actualizar el dibujo / color (deja la barra en blanco)
  • restablecer el progreso a 0 (de lo contrario la siguiente línea no hace nada)
  • restablecer el progreso al valor "antiguo" (barra de arreglos)
  • invalidar

A continuación hay un método que tengo que hace esto, espero que sea útil. No estoy 100% seguro de por qué lo llamé desde onResume() ; esto podría ser importante o no relacionado:

protected void onResume() { super.onResume(); progBar = (ProgressBar) findViewById(R.id.progress_base); int oldProgress = progBar.getProgress(); // define new drawable/colour final float[] roundedCorners = new float[] { 5, 5, 5, 5, 5, 5, 5, 5 }; ShapeDrawable shape = new ShapeDrawable(new RoundRectShape( roundedCorners, null, null)); String MyColor = "#FF00FF"; shape.getPaint().setColor(Color.parseColor(MyColor)); ClipDrawable clip = new ClipDrawable(shape, Gravity.LEFT, ClipDrawable.HORIZONTAL); progBar.setProgressDrawable(clip); progBar.setBackgroundDrawable(getResources().getDrawable( android.R.drawable.progress_horizontal)); // work around: setProgress() ignores a change to the same value progBar.setProgress(0); progBar.setProgress(oldProgress); progBar.invalidate(); }

En cuanto a la solución de HappyEngineer, creo que fue una solución similar, establecer manualmente el desplazamiento de "progreso" (no recuerdo exactamente). En cualquier caso, el código anterior debería funcionar para usted.

Lo siento si no puedo recordar todos los detalles, es por eso que intenté editar la respuesta. Espero que esto ayude...


Puede intentar cambiar sus estilos, temas o usar android: indeterminateTint = "@ color / yourColor" en cualquier lugar que desee, pero solo hay una forma de hacerlo que funciona en cualquier versión de Android SKD:

Si la barra de progreso no es indeterminada, use:

progressBar.getProgressDrawable().setColorFilter(ContextCompat.getColor(context, R.color.yourColor), PorterDuff.Mode.SRC_IN );

Si la barra de progreso es indeterminada, use:

progressBar.getIndeterminateDrawable().setColorFilter(ContextCompat.getColor(getContext(), R.color.yourColor), PorterDuff.Mode.SRC_IN );

¡Es triste que Android sea un desastre!


Según muhammad-adil sugerido para SDK versión 21 y superior

android:indeterminateTint="@color/orange"

En XML Works para mí, es bastante fácil.


Una pequeña cosa más, la solución del tema funciona si heredas un tema base, por lo que para la aplicación compacta tu tema debería ser:

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

Y luego establezca esto en el tema de la barra de progreso

<ProgressBar android:id="@+id/progressCircle_progressBar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:theme="@style/AppTheme.Custom" android:indeterminate="true"/>


Utilice android.support.v4.graphics.drawable.DrawableCompat :

Drawable progressDrawable = progressBar.getIndeterminateDrawable(); if (progressDrawable != null) { Drawable mutateDrawable = progressDrawable.mutate(); DrawableCompat.setTint(mutateDrawable, primaryColor); progressBar.setProgressDrawable(mutateDrawable); }


si es indeterminado:

((ProgressBar)findViewById(R.id.progressBar)) .getIndeterminateDrawable() .setColorFilter(Color.RED, PorterDuff.Mode.SRC_IN);


Horizontal ProgressBar utiliza la rectangle shape ClipDrawable para el fondo, ClipDrawable construido a partir de la rectangle shape para los progresos (primaria y secundaria). Tintado cambia los colores a un cierto tinte. Si desea colores específicos para los tres por separado, puede usar ProgressBar.setProgressDrawable() siguiente manera:

LayerDrawable progressBarDrawable = new LayerDrawable( new Drawable[]{ new GradientDrawable(GradientDrawable.Orientation.TOP_BOTTOM, new int[]{Color.parseColor("#ff0000ff"),Color.parseColor("#ff0000ff")}), new ClipDrawable( new GradientDrawable(GradientDrawable.Orientation.TOP_BOTTOM, new int[]{Color.parseColor("#ff00ff00"),Color.parseColor("#ff00ff00")}), Gravity.START, ClipDrawable.HORIZONTAL), new ClipDrawable( new GradientDrawable(GradientDrawable.Orientation.TOP_BOTTOM, new int[]{Color.parseColor("#ffff0000"),Color.parseColor("#ffff0000")}), Gravity.START, ClipDrawable.HORIZONTAL) }); progressBarDrawable.setId(0,android.R.id.background); progressBarDrawable.setId(1,android.R.id.secondaryProgress); progressBarDrawable.setId(2,android.R.id.progress); ((ProgressBar)findViewById(R.id.progressBar)).setProgressDrawable(progressBarDrawable);

Tenga en cuenta que el orden de las capas LayerDrawable es importante al inicializar LayerDrawable . El primer dibujo debe ser para el fondo. Según mi experimento, el cambio de ID no funciona. Si configura el relleno en la barra de progressbar , este enfoque no funcionará. Si necesita relleno, puede usar un contenedor para la LinearLayout progreso, como un LinearLayout .


Barra de progreso horizontal estilo de material personalizado:

Para cambiar el color de fondo y el progreso de la barra de progreso horizontal.

<style name="MyProgressBar" parent="@style/Widget.AppCompat.ProgressBar.Horizontal"> <item name="android:progressBackgroundTint">#69f0ae</item> <item name="android:progressTint">#b71c1c</item> <item name="android:minWidth">200dp</item> </style>

Aplíquelo a la barra de progreso configurando el atributo de estilo, para los estilos de material personalizados y la barra de progreso personalizada.


Todas las API

Si usas todas las API solo crea el tema con estilo

style.xml

<resources> //... <style name="progressBarBlue" parent="@style/Theme.AppCompat"> <item name="colorAccent">@color/blue</item> </style> </resources>

y uso en progreso

<ProgressBar ... android:theme="@style/progressBarBlue" />

Nivel API 21 y superior

Si se usa en el nivel de API 21 y superior solo usa este código:

<ProgressBar //... android:indeterminate="true" android:indeterminateTintMode="src_atop" android:indeterminateTint="@color/secondary"/>


android:progressTint="#ffffff"


ProgressBar bar; private Handler progressBarHandler = new Handler(); GradientDrawable progressGradientDrawable = new GradientDrawable( GradientDrawable.Orientation.LEFT_RIGHT, new int[]{ 0xff1e90ff,0xff006ab6,0xff367ba8}); ClipDrawable progressClipDrawable = new ClipDrawable( progressGradientDrawable, Gravity.LEFT, ClipDrawable.HORIZONTAL); Drawable[] progressDrawables = { new ColorDrawable(0xffffffff), progressClipDrawable, progressClipDrawable}; LayerDrawable progressLayerDrawable = new LayerDrawable(progressDrawables); int status = 0; /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // TODO Auto-generated method stub setContentView(R.layout.startup); bar = (ProgressBar) findViewById(R.id.start_page_progressBar); bar.setProgress(0); bar.setMax(100); progressLayerDrawable.setId(0, android.R.id.background); progressLayerDrawable.setId(1, android.R.id.secondaryProgress); progressLayerDrawable.setId(2, android.R.id.progress); bar.setProgressDrawable(progressLayerDrawable); }

Esto me ayudó a establecer un color personalizado para la barra de progreso a través del código. Espero eso ayude


ProgressBar freeRamPb = findViewById(R.id.free_ram_progress_bar); freeRamPb.getProgressDrawable().setColorFilter( Color.BLUE, android.graphics.PorterDuff.Mode.SRC_IN);