Артефакты изображений RatingBar для Android

Question

Я реализовал пользовательский RatingBar в приложении на своих ListView элементах.Пользовательский стиль 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>

Это работает, но когда рейтинг установлен, я получаю некоторые странныеартефакты изображения;2 вертикальные линии под розовыми звездами появляются на моем видении:

Вот star_on.png

star_off.png выглядит нормально, и если рейтинг == 0, строки не появляются.

Я новичок в Android и не могу понять, в чем проблема.

Answer 1

Попробуйте указать высоту RatingBar в xml-макете, например:

android:layout_height="30dp" 

30dp или как вам удобнее ..

Узнайте, почему это происходит ??1008 *

Answer 2

У меня была эта проблема, выглядела как растянутый нижний край пользовательского изображения звезды. Вам не нужно устанавливать 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>

Значение должно совпадать со значением используемого рисунка. Изображение высотой 11 пикселей, поэтому для rating_bar_height было установлено значение 11dp.

Answer 3

Каждое тело предлагает что-то, но никто не пытается объяснить, почему это происходит.Я попытаюсь объяснить это сейчас.Конечно, это произойдет только тогда, когда вы пытаетесь настроить изображения в строке рейтинга.

Представьте, что у нас есть пользовательское изображение размером 72x72 пикселей, и это наш ресурс для XXXHDPI - (это 4x).

1. То же изображение должно иметь копию внутри XXHDPI, XHDPI, HDPI, MDPI и LDPI.Я пока пропущу последний каталог ресурсов.
2. Внутри разных каталогов это изображение должно быть следующим:
   • для размера копии в формате XXHDPI должно быть 54x54 (это 3x)
   • для изображения размера копии XHDPI должно быть 36x36 (это 2x)
   • для изображения копии размера HDPI должно быть 27x27 (это 1,5x)
   • для изображения изображения размера MDPI необходимобыть 18x18 (это 1x)
3. Так что теперь в этом сценарии, если высота вашего Рейтинга выше, чем 18 dp , например, 30 dp, вы увидите этоПлохие артефакты изображения под каждым изображением звезды, ПОТОМУ ЧТО очевидно, что RatingBar пытается заполнить остальную часть его высоты чем-либо (ваше изображение - 18 dp, но высота бара - 30 dp), поэтому остальные 12 dp будут заполнены этими артефактами.

Вот почему, если вы установите фиксированную высоту строки рейтинга, все МОЖЕТ быть в порядке, но также НЕ МОЖЕТ быть в порядке.Все это зависит от вашего нестандартного размера изображения.

Я думаю, что есть одно решение, которое будет работать во всех возможных сценариях, а именно:

1. Создание ресурса изображения для всех экранов устройств, которые вашиПриложение будет поддерживать XXXHDPI, XXHDPI или все, что вам нужно.
2. Убедитесь, что если ваше (MDPI 1x) изображение имеет, например, высоту 20 пикселей, ваша высота RatingBar не будет больше 20 dp, и все будетбудьте в порядке.

ПРИМЕЧАНИЕ. Во всем этом разговоре мы говорим о dp (пикселях плотности), а не в px, потому что, если мы предоставим все эти ресурсы изображения в каждой отдельной папке res, у нас будет возможность работать с dpне с пикс.Я надеюсь, что последнее предложение понятно и имеет смысл.

РЕДАКТИРОВАТЬ: Другой возможный способ - оставить небольшой отступ (пустое пространство), возможно, 1px или 2px внизу вашего пользовательского изображения.В этом случае представление RatingBar НЕ будет отображать эти пиксели артефактов, поскольку они будут взяты из отступа вашего пользовательского изображения, который на самом деле является просто пустыми (прозрачными) пикселями.Я лично считаю, что это не лучший способ, потому что заполнение изображения создаст некоторое пространство (заполнение) между RatingBar и остальными представлениями внутри макета.В этом случае у вас не будет абсолютно полного контроля над пространством видов, поскольку некоторая небольшая часть была жестко запрограммирована внутри пользовательского изображения (эти 2 пикселя отступа).

Answer 4

Это проблема дизайна иконок.Проблема здесь заключается в заполнении иконки.Если вы создаете пользовательский значок звездочки, убедитесь, что между звездой и границей страницы, на которой она лежит, оставлено некоторое пространство для заполнения.

Если вы не уверены, как это сделать, попробуйте Android Asset Studio .Вы можете увидеть что-то вроде «Прокладка вокруг оптического значка», но не держите его на уровне 0.

Answer 5

Я решил эту проблему по-другому. Я беру свои пользовательские звезды PNG и в графическом редакторе добавляю прозрачную линию внизу изображения. Проблема с вертикальными линиями исчезла на всех экранах!

Answer 6

Еще одним простым решением было бы оставить ряд пустых пикселей на изображении звезды, используя графический редактор, такой как фотошоп. Тогда повторяющийся или растянутый ряд пикселей в строке рейтинга будет пустым. Этот подход решил мою проблему.

Answer 7

Всего 2 пиксельных отступа в изображении звезды в фотошопе.заполнение в xml не работает, просто добавление изображения звезды в фотошопе.это очень хорошая работа.

Answer 8

Я наблюдал проблему из-за векторной прорисовки. Как только я добавил соответствующие изображения в формате png, он начал работать. Добавил это как ответ, так как это может быть полезно для тех, кто сталкивается с той же проблемой.

Answer 9

Та же проблема. В моем случае Поместите пользовательские изображения звезд в папку / Drawable и установите "android:layout_height="30dip"

отлично работает !!

Answer 10

Я исправил ту же проблему, уменьшив layout_height, поскольку высота моего изображения была меньше высоты, которая была у меня в layout_height