web-dev-qa-db-fra.com

Comment faire un RatingBar plus petit?

J'ai ajouté un RatingBar dans une mise en page:

<RatingBar 
    Android:id="@+id/ratingbar"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:numStars="5"
    Android:stepSize="1.0"
    />

Mais le style par défaut de la barre d’évaluation est trop volumineux.
J'ai essayé de le changer en ajoutant le style Android: style="?android:attr/ratingBarStyleSmall"

Mais le résultat est trop petit et il est impossible de définir un taux avec cette propriété.

Comment pourrais-je faire?

androidandroid-widgetandroid-styles
123
Clem

Le widget par défaut RatingBar est sorta 'boiteux.

La source fait référence au style "?android:attr/ratingBarStyleIndicator" en plus du "?android:attr/ratingBarStyleSmall" que vous connaissez déjà. ratingBarStyleIndicator est légèrement plus petit mais reste assez moche et les commentaires notent que ces styles "ne supportent pas l'interaction".

Vous êtes probablement mieux rouler le vôtre. Il existe un guide de bonne mine sur http://kozyr.zydako.net/2010/05/23/pretty-ratingbar/ qui montre comment procéder. (Je ne l'ai pas encore fait moi-même, mais j'essaierai dans un jour ou deux.)

Bonne chance!

p.s. Désolé, j'allais poster un lien vers la source pour que vous puissiez vous y intéresser, mais je suis un nouvel utilisateur et je ne peux pas publier plus d'une URL. Si vous naviguez dans l’arborescence des sources, elle se trouve dans: frameworks/base/core/Java/Android/widget/RatingBar.Java.

102
Farray

Comment coller le code donné ici ...

Étape 1. Vous avez besoin de vos propres étoiles de notation dans res/drawable ...

A full star

Empty star

Étape 2 Dans res/drawable vous avez besoin de ratingstars.xml comme suit ...

<?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" />
</layer-list>

Étape 3 Dans res/values vous avez besoin de styles.xml comme suit ...

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="foodRatingBar" parent="@Android:style/Widget.RatingBar">
        <item name="Android:progressDrawable">@drawable/ratingstars</item>
        <item name="Android:minHeight">22dip</item>
        <item name="Android:maxHeight">22dip</item>
    </style>
</resources>

Étape 4 Dans votre mise en page ...

<RatingBar 
      Android:id="@+id/rtbProductRating"
      Android:layout_height="wrap_content"
      Android:layout_width="wrap_content"
      Android:numStars="5"
      Android:rating="3.5"
      Android:isIndicator="false"
      style="@style/foodRatingBar"    
/>
193
Vaibhav Jani

Il suffit d'utiliser:

Android:scaleX="0.5"
Android:scaleY="0.5"

Changez le facteur d'échelle en fonction de vos besoins.

Pour pouvoir redimensionner sans créer de remplissage à gauche, ajoutez également

Android:transformPivotX="0dp"
66
Loolooii

Il n'est pas nécessaire d'ajouter un écouteur au ?android:attr/ratingBarStyleSmall. Ajoutez simplement Android:isIndicator=false et il capturera les événements liés aux clics, par exemple.

<RatingBar
  Android:id="@+id/myRatingBar"
  style="?android:attr/ratingBarStyleSmall"
  Android:layout_width="wrap_content"
  Android:layout_height="wrap_content"
  Android:numStars="5"
  Android:isIndicator="false" />
40
zyamys

le petit mettre en œuvre par le système d'exploitation

<RatingBar
    Android:id="@+id/ratingBar"
    style="?android:attr/ratingBarStyleSmall"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content" 
    />
19
Bouchehboun Saad

J'ai trouvé une solution plus facile que je ne le pense, donnée par celles ci-dessus et plus facile que de rouler la vôtre. J'ai simplement créé une petite barre de classement, puis un onTouchListener. À partir de là, je calcule la largeur du clic et détermine le nombre d'étoiles à partir de cela. Après avoir utilisé cela plusieurs fois, le seul problème que j'ai constaté est que dessiner une petite barre de classement ne fonctionne pas toujours correctement dans un tableau, sauf si je le place dans un LinearLayout (l'apparence exacte dans l'éditeur, mais pas dans le périphérique) . Quoi qu'il en soit, dans ma mise en page:

            <LinearLayout
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content" >
                <RatingBar
                    Android:id="@+id/myRatingBar"
                    style="?android:attr/ratingBarStyleSmall"
                    Android:layout_width="wrap_content"
                    Android:layout_height="wrap_content"
                    Android:numStars="5" />
            </LinearLayout>

et dans mon activité:

    final RatingBar minimumRating = (RatingBar)findViewById(R.id.myRatingBar);
    minimumRating.setOnTouchListener(new OnTouchListener()
    { 
        public boolean onTouch(View view, MotionEvent event)
        { 
            float touchPositionX = event.getX();
            float width = minimumRating.getWidth();
            float starsf = (touchPositionX / width) * 5.0f;
            int stars = (int)starsf + 1;
            minimumRating.setRating(stars);
            return true; 
        } 
    });

J'espère que ça aidera quelqu'un d'autre. Certainement plus facile que de dessiner soi-même (même si j’ai trouvé que cela fonctionnait aussi, mais je voulais simplement utiliser facilement les étoiles).

15
user1676075

appliquer ceci.

<RatingBar Android:id="@+id/indicator_ratingbar"
    style="?android:attr/ratingBarStyleIndicator"
    Android:layout_marginLeft="5dip"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_gravity="center_vertical" />
14
Azhar Shaikh
<RatingBar
    Android:id="@+id/rating_bar"
    style="@style/Widget.AppCompat.RatingBar.Small"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content" />
5
chry

La meilleure réponse pour la petite barre de notation

<RatingBar
                    Android:layout_width="wrap_content"
                    style = "?android:attr/ratingBarStyleSmall"
                    Android:layout_height="wrap_content" />
2
Arun Prajapati

Utilisez ce code 

<RatingBar
    Android:id="@+id/ratingBarSmalloverall"
    style="?android:attr/ratingBarStyleSmall"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_alignParentRight="true"
    Android:layout_centerVertical="true"
    Android:layout_marginRight="30dp"
    Android:isIndicator="false"
    Android:numStars="5" />
2
Dharmendra Mishra
<RatingBar
    Android:id="@+id/ratingBar1"
    Android:numStars="5"
    Android:stepSize=".5"
    Android:rating="3.5"
    style="@Android:style/Widget.DeviceDefault.RatingBar.Small"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content" />
2
M D P

bien que la réponse de Farry fonctionne, pour les appareils Samsung, RatingBar a pris une couleur bleue aléatoire au lieu de celle définie par moi. Donc utiliser

style="?attr/ratingBarStyleSmall"

au lieu.

Code complet comment l'utiliser:

<Android.support.v7.widget.AppCompatRatingBar
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                style="?attr/ratingBarStyleSmall" // use smaller version of icons
                Android:theme="@style/RatingBar"
                Android:rating="0"
                tools:rating="5"/>

<style name="RatingBar" parent="Theme.AppCompat">
        <item name="colorControlNormal">@color/grey</item>
        <item name="colorControlActivated">@color/yellow</item>
        <item name="Android:numStars">5</item>
        <item name="Android:stepSize">1</item>
    </style>
2
murt

utilisez le code suivant pour une petite barre de notation avec l'événement onTouch

enter code here


<RatingBar
            Android:id="@+id/ratingBar"
            style="?android:ratingBarStyleSmall"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:isIndicator="false"
            Android:rating="4"
            Android:stepSize="0.5" />
1
arunkrishna

Après de nombreuses recherches, j'ai trouvé que la meilleure solution pour réduire la taille des barres d'évaluation personnalisées est d'obtenir la taille des progrès pouvant être dessinée dans certaines tailles, comme indiqué ci-dessous:

xxhdpi - 48 * 48 px

xhdpi - 36 * 36 px

hdpi - 24 * 24 px

Et dans le style de mettre la minheight et maxheight que 16 dp pour toute résolution.

Faites-moi savoir si cela ne vous aide pas à obtenir les meilleures barres de notation de petite taille car ces tailles sont très compatibles et équivalentes à l'attribut style ratingbar.small. 

0
praveen dewangan
 <RatingBar
                    Android:rating="3.5"
                    Android:stepSize="0.5"
                    Android:numStars="5"
                    style = "?android:attr/ratingBarStyleSmall"
                    Android:theme="@style/RatingBar"
                    Android:layout_width="wrap_content"
                    Android:layout_height="wrap_content"/>

// if you want to style 

 <style name="RatingBar" parent="Theme.AppCompat">
        <item name="colorControlNormal">@color/colorPrimary</item>
        <item name="colorControlActivated">@color/colorAccent</item>
    </style>

// ajoute ces lignes pour une petite barre de notation

style = "?android:attr/ratingBarStyleSmall"
0
indrajeet jyoti

Son travail pour moi dans Barre de notation xml style = "? Android: attr/ratingBarStyleSmall" ajouter this.it fonctionnera.

0
S HemaNandhini

La meilleure réponse que j'ai 

  <style name="MyRatingBar" parent="@Android:style/Widget.RatingBar">
    <item name="Android:minHeight">15dp</item>
    <item name="Android:maxHeight">15dp</item>
    <item name="colorControlNormal">@color/white</item>
    <item name="colorControlActivated">@color/home_add</item>
</style>

utilisateur comme ça

<RatingBar
                style="?android:attr/ratingBarStyleIndicator"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:isIndicator="false"
                Android:max="5"
                Android:rating="3"
                Android:scaleX=".8"
                Android:scaleY=".8"
                Android:theme="@style/MyRatingBar" />

Augmenter/diminuer les tailles en utilisant scaleX et scaleY value

0
AMAN SINGH