java - paquete - package id android

¿Cómo puedo configurar el color del trazo de la barra de calificación de Android?(No es el color de las estrellas sino la FRONTERA)

Question

Soy un principiante de Android y quiero hacer mi ratingBar personalizado.

Descargo de responsabilidad: no es un duplicado. porque todas las publicaciones que he leído preguntan cómo cambiar los colores de la estrella y cómo eliminar el trazo. Eso no es lo que quiero. Quiero tener el trazo y poder cambiar el color del borde.

Con un trazo transparente y amarillo mientras está vacío, y un fondo y trazo amarillo para la mitad y relleno.

NO quiero usar pngs. Ya tengo el mío pero son demasiado pequeños. Simplemente no quiero pedirle al diseñador que haga nuevos si puedo hacer estrellas usando solo atributos XML y dibujables.

<RatingBar
          android:id="@+id/thread_rating"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:isIndicator="true"
          android:numStars="5"
          android:progressBackgroundTint="@color/gray"
          android:progressTint="@color/gold"
          android:rating="2.5"
          android:secondaryProgressTint="@color/gray"
          android:stepSize="0.5"
          style="?android:attr/ratingBarStyleSmall"
          />

Trabajo en esto con otro ingeniero. También escribió código en un archivo java.

private void setRatingBarStart(RatingBar rating_bar) {
LayerDrawable stars = (LayerDrawable) rating_bar.getProgressDrawable();
stars.getDrawable(2)
    .setColorFilter(getResources().getColor(R.color.gold),
        PorterDuff.Mode.SRC_ATOP); // for filled stars
stars.getDrawable(1)
    .setColorFilter(getResources().getColor(R.color.light_gray),
        PorterDuff.Mode.SRC_ATOP); // for half filled stars
stars.getDrawable(0)
    .setColorFilter(getResources().getColor(R.color.light_gray),
        PorterDuff.Mode.SRC_ATOP); // for empty stars

[Así que ahora tiene un fondo gris, amarillo para rellenar, y NO hay trazo ahora.

Y quiero que tenga fondo transparente, trazo amarillo y amarillo para rellenar. Se ve como esto

Ya sé cómo configurar el fondo transparente y hacerlo amarillo. Simplemente no sé cómo configurar el color del trazo. ¡¡¡¡Muchas gracias!!!!

Answer 1

Creo que en realidad encontré lo que necesitas. Tendrá que crear un RatingBar personalizado como se explica en esta answer PERO tendrá que usar vectores dibujables y no estándares.

Puede descargar los 3 elementos dibujables (completo, medio y vacío) en este sitio web:

https://materialdesignicons.com/

O haciendo un clic derecho en su carpeta de res : -> Nuevo -> Vector activo en Android Studio.

Aquí están los 3 XML dibujables en caso de que no los encuentres:

Estrella llena

<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="24dp"
android:width="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path android:fillColor="#000" android:pathData="M12,17.27L18.18,21L16.54,13.97L22,9.24L14.81,8.62L12,2L9.19,8.62L2,9.24L7.45,13.97L5.82,21L12,17.27Z" />

Media estrella

<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="24dp"
android:width="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path android:fillColor="#000" android:pathData="M12,15.89V6.59L13.71,10.63L18.09,11L14.77,13.88L15.76,18.16M22,9.74L14.81,9.13L12,2.5L9.19,9.13L2,9.74L7.45,14.47L5.82,21.5L12,17.77L18.18,21.5L16.54,14.47L22,9.74Z" />

Estrella vacia

<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="24dp"
android:width="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path android:fillColor="#000" android:pathData="M12,15.39L8.24,17.66L9.23,13.38L5.91,10.5L10.29,10.13L12,6.09L13.71,10.13L18.09,10.5L14.77,13.38L15.76,17.66M22,9.24L14.81,8.63L12,2L9.19,8.63L2,9.24L7.45,13.97L5.82,21L12,17.27L18.18,21L16.54,13.97L22,9.24Z" />

Para cambiar su tamaño, simplemente actualice los atributos height y width .

Para cambiar su color, simplemente actualice el atributo fillColor y configure su color amarillo.

Answer 2

No uses ninguna biblioteca o estilo para eso. Utilice el siguiente paso para obtener el resultado.

crear un archivo en la carpeta dibujable como custom_ratingbar.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/star_empty" />
 <item android:id="@android:id/secondaryProgress"
android:drawable="@drawable/star_empty" />
 <item android:id="@android:id/progress"
android:drawable="@drawable/star_full" />
</layer-list>

A continuación, utilice lo siguiente en su RatingBar:

  <RatingBar
    android:id="@+id/ratingBarChef"
    style="?android:attr/ratingBarStyleSmall"
    android:numStars="5"
    android:stepSize="0.2"
    android:rating="3.0"
    android:progressDrawable="@drawable/custom_ratingbar"
    android:isIndicator="false"
    />

Answer 3

Otra forma es crear una barra de clasificación personalizada si no tiene ninguna imagen, siga los pasos a continuación. Todo este archivo creado en la carpeta dibujable.

emptystar.xml

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="24dp"
android:width="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path android:fillColor="#F1C332" android:pathData="M12,15.39L8.24,17.66L9.23,13.38L5.91,10.5L10.29,10.13L12,6.09L13.71,10.13L18.09,10.5L14.77,13.38L15.76,17.66M22,9.24L14.81,8.63L12,2L9.19,8.63L2,9.24L7.45,13.97L5.82,21L12,17.27L18.18,21L16.54,13.97L22,9.24Z" />
</vector>

full_star.xml

<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="24dp"
android:width="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path android:fillColor="#F1C332" android:pathData="M12,17.27L18.18,21L16.54,13.97L22,9.24L14.81,8.62L12,2L9.19,8.62L2,9.24L7.45,13.97L5.82,21L12,17.27Z" />
</vector>

half_star.xml

<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="24dp"
android:width="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path android:fillColor="#000" android:pathData="M12,15.89V6.59L13.71,10.63L18.09,11L14.77,13.88L15.76,18.16M22,9.74L14.81,9.13L12,2.5L9.19,9.13L2,9.74L7.45,14.47L5.82,21.5L12,17.77L18.18,21.5L16.54,14.47L22,9.74Z" >
</path>
</vector>

food_ratingbar_full_empty.xml

<?xml version="1.0" encoding="utf-8"?>

<item android:state_pressed="true"
    android:state_window_focused="true"
    android:drawable="@drawable/empty_star" />

<item android:state_focused="true"
    android:state_window_focused="true"
    android:drawable="@drawable/empty_star" />

<item android:state_selected="true"
    android:state_window_focused="true"
    android:drawable="@drawable/empty_star" />

<item android:drawable="@drawable/empty_star" />

food_ratingbar_full_filled.xml

<?xml version="1.0" encoding="utf-8"?>

<item android:state_pressed="true"
    android:state_window_focused="true"
    android:drawable="@drawable/full_star" />

<item android:state_focused="true"
    android:state_window_focused="true"
    android:drawable="@drawable/full_star" />

<item android:state_selected="true"
    android:state_window_focused="true"
    android:drawable="@drawable/full_star" />

<item android:drawable="@drawable/full_star" />

food_rating_bar.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background"
    android:drawable="@drawable/food_ratingbar_full_empty" />

<item android:id="@android:id/secondaryProgress"
    android:drawable="@drawable/food_ratingbar_full_empty" />
<item android:id="@android:id/progress"
    android:drawable="@drawable/food_ratingbar_full_filled" />

style.xml

   <style name="foodRatingBar" parent="@android:style/Widget.RatingBar">
    <item name="android:progressDrawable">@drawable/food_rating_bar_full</item>
    <item name="android:minHeight">23dip</item>
    <item name="android:maxHeight">25dip</item>
   </style>

En su diseño

<RatingBar
android:id="@+id/ratingBarDish"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/dp10"
android:layout_marginStart="@dimen/dp10"
style="@style/foodRatingBar"
android:isIndicator="true" />

Answer 4

Ponga todos los colores getResources().getColor(R.color.gold) en Amarillo ( en su caso, getResources().getColor(R.color.gold) para todos ) para establecer los trazos y el fondo. (para antecedentes, progreso secundario y progreso)

RatingBar ratingBar = (RatingBar) findViewById(R.id.ratingBar);
        LayerDrawable stars = (LayerDrawable) ratingBar.getProgressDrawable();
        stars.getDrawable(2).setColorFilter(Color.YELLOW, PorterDuff.Mode.SRC_ATOP);
        stars.getDrawable(0).setColorFilter(Color.YELLOW, PorterDuff.Mode.SRC_ATOP);
        stars.getDrawable(1).setColorFilter(Color.YELLOW, PorterDuff.Mode.SRC_ATOP); 

elimine secondaryProgressTint atributos progressBackgroundTint , progressTint , secondaryProgressTint de RatingBar sin necesidad de hacerlo.

<RatingBar
        android:id="@+id/ratingBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:numStars="5"
        android:rating="2.5"/>

y el resultado es:

Espero que esto ayude (el color rosa es solo el color de fondo)

después de establecer 1 y 0 dibujable a rojo:

RatingBar ratingBar = (RatingBar) findViewById(R.id.ratingBar);
        LayerDrawable stars = (LayerDrawable) ratingBar.getProgressDrawable();
        stars.getDrawable(2).setColorFilter(Color.YELLOW, PorterDuff.Mode.SRC_ATOP);
        stars.getDrawable(0).setColorFilter(Color.Red, PorterDuff.Mode.SRC_ATOP);
        stars.getDrawable(1).setColorFilter(Color.Red, PorterDuff.Mode.SRC_ATOP);