具有自定义样式的评级栏显示不良图像

Question

我在我的自定义评级栏下方使用以下图标：

并使用以下代码：

我的自定义绘图：

    <?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/ic_list_item_wstar" />
    <item android:id="@+android:id/secondaryProgress"
          android:drawable="@drawable/ic_list_item_wstar" />
    <item android:id="@+android:id/progress"
          android:drawable="@drawable/ic_list_item_ystar" />
</layer-list>

我的自定义风格：

   <style name="YellowRatingBar" parent="@android:style/Widget.RatingBar">
    <item name="android:progressDrawable">@drawable/ic_ratingbar_yellow</item>
    <item name="android:minHeight">22dip</item>
    <item name="android:maxHeight">22dip</item>
</style>

我的评分条形码：

    <RatingBar
    android:id="@+id/ratingBar1"
    style="@style/YellowRatingBar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
        android:isIndicator="false"
    android:rating="3.7" />

但效果不理想，结果如下：

修改

图标的大小是17X17pixel。我将最小和最大尺寸设置为17dp，黑线变小，最后当我将其设置为11dp时，黑线消失。

为什么我需要将最小和最大尺寸设置为小于图标实际尺寸?? !!

Answer 1

在评级栏中使用自定义星形图片时，我遇到了拖动线条的问题。

一个简单的解决方案是 keep a padding of 1px to the star image

例如，考虑下面的两张图片;

- Image1

- Image2

Image1是 32x32px 的原始图像，它提供了拖动效果，而

Image2是相同的图像，但填充为1px，使图像大小 36x36px 并消除拖动效果。

  

为什么我需要将最小和最大尺寸设置为小于图标实际尺寸？

那是因为您已将（17x17px）图像放在drawable-hdpi文件夹中，而hdpi，17px = 11.33dp。

您可以做的是将图片放在drawable文件夹中，然后设置 minheight and maxheight to 17dp 将完成这项工作。 但是，将图像放在drawable文件夹中并不是正确的方法。

最佳做法是在每个 drawable-mdpi ， drawable-hdpi ， drawable-xhdpi 中放置不同像素大小的图像， drawable-xxhdpi 文件夹。

因此，17x17px图像应放在drawable-mdpi文件夹中。 因此（在您的情况下），要放置在文件夹中的相应图像大小为

drawable-mdpi - 17x17px
drawable-hdpi - 25x25px
drawable-xhdpi - 34x34px
drawable-xxhdpi - 51x51px

和

<item name="android:minHeight">17dp</item>
<item name="android:maxHeight">17dp</item>

要计算不同文件夹中的图像尺寸，您可以使用dp to px conversion method

Answer 2

Android Studio中评分栏的基础

Simple Rating Bar without Material Design

如何添加？

予。在build.gradle中添加最新的appcompat库。

dependencies {  
    compile 'com.android.support:appcompat-v7:X.X.X' // where X.X.X version
}

II。让你的活动扩展android.support.v7.app.AppCompatActivity。

public class MainActivity extends AppCompatActivity {  
    ...
}

III。在任何layout.xml文件中声明您的RatingBar。

<RatingBar  
    android:rating="3.5"
    android:rating="3.5"
    android:stepSize="0.5"
    android:numStars="5"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>

**

如何设计风格？

**

予。在styles.xml文件中声明自定义样式。

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

II。通过android：theme属性将此样式应用于RatingBar。

<RatingBar  
    android:theme="@style/RatingBar"
    android:rating="3"
    android:stepSize="0.5"
    android:numStars="5"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>

如果你喜欢这个并想要更多材料设计用品 http://exandroidstudio.blogspot.in/2015/11/rating-bar-material-design-tips.html

Answer 3

fastes的想法是在图像中添加额外的1dp填充。 在PhotoShop或任何图像编辑器中进行操作。 在拥有了多余的空间之后，所有东西都应该工作了。