Android自定义RatingBar图片工件

我在我的ListView项目的应用程序中实现了一个自定义的RatingBar 。 自定义样式ratingbar_red.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_off" /> <item android:id="@android:id/secondaryProgress" android:drawable="@drawable/star_on" /> <item android:id="@android:id/progress" android:drawable="@drawable/star_on" /> </layer-list> 

这是ListItem布局的一部分:

 <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:paddingLeft="15dp" > <RatingBar android:id="@+id/li_company_rating" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="15dp" android:layout_marginBottom="1dp" android:isIndicator="true" android:numStars="5" android:progressDrawable="@drawable/ratingbar_red" android:stepSize="1" /> <Button android:id="@+id/li_company_callbtn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginBottom="0dp" android:layout_marginLeft="40dp" android:contentDescription="@string/ContentDescription" android:drawableLeft="@drawable/phone_icon" android:drawablePadding="5dp" android:onClick="callbtn_Click" android:text="@string/CallButton" android:focusable="false" android:focusableInTouchMode="false" > </Button> </LinearLayout> 

它的工作原理,但是当评分设置,我得到一些奇怪的图像文物; 在我看来,粉红色星星下面的两条垂直线出现:

在这里输入图像说明

这是star_on.png

链接

star_off.png看起来不错,如果rating == 0,那么这行就不会出现。

我是Android初学者,不能理解问题是什么。

Solutions Collecting From Web of "Android自定义RatingBar图片工件"

尝试给这个xml布局的RatingBar高度像这样:

 android:layout_height="30dp" 

30dp或任何适合你..

看看为什么会这样?

每个人都在暗示着什么,但没有一个人正试图解释为什么会发生这种事情 我现在要试着解释一下。 当然,这只会在您尝试自定义评分栏图像时才会发生。

想象一下,我们有自定义图像的大小72×72像素,这是我们的资源XXXHDPI – (它是4倍)。

  1. 同样的图像也需要在XXHDPI,XHDPI,HDPI,MDPI和LDPI内拷贝。 我现在会错过最后一个资源目录。
  2. 在不同的目录里,这个图像需要如下:
    • 对于XXHDPI大小的复制图像需要是54×54(这是3x)
    • 对于XHDPI大小复制图像需要36×36(这是2倍)
    • 对于HDPI大小复制图像需要是27×27(这是1.5x)
    • 对于MDPI大小的复制图像需要18×18(这是1x)
  3. 所以现在在这种情况下,如果你的评级栏的高度大于18dp ,例如30dp,那么你会在每个星形图像下面看到这个不好的图像,因为明显的是RatingBar试图用其他东西来填充它的高度(你的图像是18 dp,但是酒吧的高度是30dp),所以剩下的12dp将会被这个文物填满。

这就是为什么如果您将评分栏高度设置为固定的大小,一切都可以,但也可以不行。 这一切取决于您的自定义图像大小。

我认为有一个解决scheme可以在所有可能的情况下工作,这是:

  1. 为您的应用将支持XXXHDPI,XXHDPI或任何您想要的所有设备屏幕创build图像资产。
  2. 确保如果你的(MDPI是1x)图像的高度是20像素,你的RatingBar高度不会大于20dp,一切都会好的。

注意:在整个对话中,我们讨论的不是px中的dp(密度像素),因为如果我们在每个res文件夹中提供所有这些图像资源,我们将有机会使用dp而不是px。 我希望最后一句话是清楚明白的。

编辑:另一种可能的方法是留下一些小的填充(空白),也许1px或2px在您的自定义图像的底部。 在这种情况下,RatingBar视图将不会显示这些假象像素,因为它们将从自定义图像的填充部分取得,实际上这只是空的(透明)像素。 我个人认为,这不是最好的方法,因为图像填充将在RatingBar和布局中的其余Views之间创build一些空格(填充)。 在这种情况下,您将不会完全控制视图空间,因为一些小部分已被硬编码在自定义图像(那些2 px填充)。

我有这个问题,看起来像自定义星形图像被拉伸的底部边缘。 您不必设置评分栏标签的layout_height。 您可以在评级栏上设置最小/最大高度(与图像高度相同)。

来自我的样式xml的示例。

 <style name="GoldRatingBar" parent="@android:style/Widget.RatingBar"> <item name="android:minHeight">@dimen/rating_bar_height</item> <item name="android:maxHeight">@dimen/rating_bar_height</item> </style> 

Dimens.xml

 <dimen name="rating_bar_height">11dp</dimen> 

该值应与所用drawable的值相匹配。 11像素高的图像,所以rating_bar_height被设置为11dp。

另一个简单的解决scheme是使用像Photoshop这样的图像编辑器在星形图像中留下一排空像素。 然后,等级栏中的重复或拉伸的像素行将是空的。 这个问题解决了我的问题。

我以另一种方式解决了这个问题。 我把我的自定义星形PNG,并在图像编辑器添加到图像底部的透明线。 垂直线的问题在所有屏幕上消失了!

它是一个图标devise问题。 这里的问题是图标周围的填充。 如果您正在创build自定义星形图标,请确保在星形和它所在的页面边界之间留有一些填充空间。

如果您不确定如何执行此操作,请尝试Android Asset Studio 。 你可以看到像“光学图标周围的填充”不要让它保持0倾angular。

只有2像素填充图像明星在Photoshop中。 在XML填充不工作,只是在Photoshop中填充星形图像。 这是非常好的工作。

我通过减less“layout_height”来解决同样的问题,因为我的图像的高度小于layout_height中的高度。

同样的问题。 在我的情况下把自定义星形图像/可绘制的文件夹,并设置"android:layout_height="30dip"

工作好!