22

所以我创建了一个带有新图标的评分栏,但是,当我实施它时,星星看起来像是在流血,见附件:

评分栏

以下是样式、评级 xml 以及它们在布局中的实现方式:

风格:

<style name="GoldRatingBar" parent="@android:style/Widget.RatingBar">
    <item name="android:indeterminateOnly">false</item>
    <item name="android:progressDrawable">@drawable/gold_ratingbar</item>
    <item name="android:indeterminateDrawable">@drawable/gold_ratingbar</item>
    <item name="android:thumb">@null</item>
    <item name="android:isIndicator">true</item>
</style>

评级 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/rating_star_icon_off" />
    <item android:id="@+android:id/secondaryProgress" android:drawable="@drawable/rating_star_icon_half" />
    <item android:id="@+android:id/progress" android:drawable="@drawable/rating_star_icon" />
</layer-list>

布局:

<TextView

    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:text="Overall rating"
    android:textSize="16sp"
    android:textStyle="bold" />

<RatingBar
    android:id="@+id/review_overall_rating"
    style="@style/GoldRatingBar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginRight="6dp"
    android:layout_marginLeft="6dp"
    android:rating="3" />

<TextView
    android:id="@+id/review_rating_text"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:text=""
    android:textStyle="bold" />

谁能看到我哪里出错了?

4

4 回答 4

24

我有一个类似的情况,接受的答案不会在所有屏幕尺寸上解决它实际上解决方案非常简单,您只需向您使用的 .png 图像添加填充“每侧 2 个透明像素”

出血是因为 android 正在重复你的星图的最后一行,所以只需让这一行透明

于 2015-02-07T00:20:06.480 回答
7

我遇到了同样的问题。

在我的情况下blank_star.png,高度是 17dp,所以我穿上android:layout_height="17dp"RatingBar我的问题得到了解决。试试下面的代码:-

<RatingBar
    android:id="@+id/rating"
    style="@style/rating_bar"
    android:layout_width="wrap_content"
    android:layout_height="17dp"
    android:layout_marginRight="5dp"
    android:isIndicator="true"
    android:numStars="5"
    android:stepSize="1.0" />

样式/rating_bar.xml

<style name="rating_bar" parent="@android:style/Widget.RatingBar">
    <item name="android:progressDrawable">@drawable/rating_bar_full</item>
    <item name="android:minHeight">18dip</item>
    <item name="android:maxHeight">18dip</item>
</style>

可绘制/rating_bar_full

<?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/ratingbar_full_empty"/>
    <item
        android:id="@+android:id/secondaryProgress"
        android:drawable="@drawable/ratingbar_full_empty"/>
    <item
        android:id="@+android:id/progress"
        android:drawable="@drawable/ratingbar_full_filled"/>

</layer-list>

可绘制/ratingbar_full_empty

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/blank_star" android:state_pressed="true" android:state_window_focused="true"/>
    <item android:drawable="@drawable/blank_star" android:state_focused="true" android:state_window_focused="true"/>
    <item android:drawable="@drawable/blank_star" android:state_selected="true" android:state_window_focused="true"/>
    <item android:drawable="@drawable/blank_star"/>

</selector>

可绘制/ratingbar_full_filled.xml

<item android:drawable="@drawable/filled_star" android:state_pressed="true" android:state_window_focused="true"/>
<item android:drawable="@drawable/filled_star" android:state_focused="true" android:state_window_focused="true"/>
<item android:drawable="@drawable/filled_star" android:state_selected="true" android:state_window_focused="true"/>
<item android:drawable="@drawable/filled_star"/>

于 2014-04-30T11:42:01.870 回答
7

对于所有仍在寻找答案并且不想裁剪图像的人:android:minHeight="0dp"帮助我

更新。为什么它有效?好吧,大多数视图组件都有一个默认的最小尺寸,以遵循可访问性/可用性谷歌指南。如前所述,似乎RatingBar试图通过重复最后 1-2 个像素来填充空白空间(您自己的资源和 之间的差异minHeight)(我个人不明白这种决定的原因)。因此,通过设置android:minHeight="0dp",RatingBar将按资源的高度包装内容。

于 2018-08-27T13:41:14.227 回答
1

出现出血是因为您的星图的最后一行正在重复。您可以通过将 RatingBar 的大小设置为与底层可绘制对象完美匹配来解决此问题。

RatingBar 从不检查底层可绘制对象的大小。所以你必须自己做这件事。使用 xml 可能很难做到这一点,因为对于不同的屏幕密度,您的资产可能具有不同的大小。另外,您的 UX 人员可能会在不更新 xml 维度的情况下更改资产。

解决方案:创建一个 RatingBar 来检查其可绘制对象的大小。见下文

public class RatingBar extends android.widget.RatingBar {
    private Drawable starDrawable;

    public RatingBar(Context context) {
        this(context, null);
    }

    public RatingBar(Context context, AttributeSet attrs) {
        super(context, attrs);
        starDrawable = getResources().getDrawable(
            R.drawable.your_drawable, context.getTheme());
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        // Make sure to account for padding and margin, if you care.
        // I only cared about left padding.
        setMeasuredDimension(starDrawable.getIntrinsicWidth() * 5 
            + getPaddingLeft(), starDrawable.getIntrinsicHeight());
    }
}
于 2015-06-14T05:13:07.570 回答