2012-02-20 16 views
19

मैंने अपने 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> 

यह काम करता है, लेकिन जब रेटिंग सेट किया गया है, मैं कुछ अजीब छवि कलाकृतियों मिल; गुलाबी सितारों नीचे 2 खड़ी लाइनों के मेरे विचार पर प्रकट:

enter image description here

यहाँ star_on.png है

link

star_off.png ठीक लग रहा है, और अगर रेटिंग == 0, रेखाएं प्रकट नहीं होती हैं।

मैं एंड्रॉइड शुरुआती हूं, और समझ नहीं पा रहा हूं कि समस्या क्या है।

+0

लिंक के लिए खेद है, लेकिन मैं अभी तक छवियों को जोड़ नहीं सकता – Sash0k

उत्तर

16

इस तरह XML लेआउट में RatingBar को ऊंचाई देने का प्रयास करें:

android:layout_height="30dp" 

30dp या जो भी आप सूट ..

Check out why is this happening ??

+0

यह सुनिश्चित नहीं है कि यह क्यों काम करेगा लेकिन ऐसा हुआ! – StackOverflowed

+1

यह हर मोबाइल स्क्रीन के लिए काम नहीं करता है .. इसलिए निश्चित ऊंचाई उचित समाधान नहीं है! –

+0

फिक्स्ड ऊंचाई उल्लेख की गई सभी स्क्रीन को ठीक नहीं करेगी। उचित और बेहतर समाधान यह है कि कई लोगों ने फोटो संपादक में छवि के नीचे पारदर्शी पिक्सेल जोड़ने का सुझाव दिया। एंड्रॉइड बस अंतिम पिक्सेल लेता है और इसे विस्तारित करता है। ऐसा लगता है कि यह नए एपीआई स्तर पर तय किया गया है। – velval

3

मैं इस मुद्दे पर था, के निचले किनारे की तरह दिखाई देता कस्टम स्टार छवि फैलाया जा रहा है। आपको रेटिंग बार टैग का 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 पिक्सेल उच्च छवि, इसलिए रेटिंग_बार_हेइट 11 डीपी पर सेट किया गया था।

2

फ़ोटोशॉप जैसे छवि संपादक का उपयोग करके स्टार छवि में खाली पिक्सल की एक पंक्ति छोड़ने के लिए एक और आसान समाधान चौड़ा होना चाहिए। फिर रेटिंगबार में पिक्सल की बार-बार या विस्तारित पंक्ति खाली होगी। इस अपमान ने मेरी समस्या हल की।

+0

हाय @ user1928244, पृष्ठभूमि और प्रगति के लिए रेटिंगबार छवियों में मुझे एक अलग समस्या है क्योंकि वे विभिन्न आकारों के हैं। वे संरेखित नहीं करेंगे। मैं आपके उत्तर का उपयोग करने में सक्षम नहीं था लेकिन आपने मुझे फ़ोटोशॉप का उपयोग करने का विचार दिया। और इसलिए मैंने छोटी छवि में कैनवास आकार जोड़ा। धन्यवाद। :) – KarenAnne

2

मैंने इस समस्या को किसी अन्य तरीके से हल किया। मैं अपना कस्टम स्टार पीएनजी लेता हूं, और छवि संपादक में छवि के नीचे पारदर्शी रेखा जोड़ता हूं। लंबवत रेखाओं के साथ समस्या सभी स्क्रीन पर गायब हो गई!

2

यह एक आइकन डिजाइन मुद्दा है। यहां समस्या आइकन के चारों ओर पैडिंग है। यदि आप कस्टम स्टार आइकन बना रहे हैं तो सुनिश्चित करें कि आप स्टार और पेज सीमा के बीच कुछ पैडिंग स्पेस छोड़ दें, जिस पर यह झूठ है।

यदि आप सुनिश्चित नहीं हैं कि इसे कैसे करें Android Asset Studio को आजमाएं। आप "ऑप्टिकल आइकन के आसपास पैडिंग" जैसे कुछ देख सकते हैं, इसे 0 डुबकी पर न रखें।

+0

सही उत्तर। –

0

मैंने "layout_height" को कम करके अपनी समस्या को ठीक किया क्योंकि मेरी छवि की ऊंचाई लेआउट_हेइट में ऊंचाई की तुलना में कम थी।

0

वही समस्या। मेरे मामले में कस्टम स्टार छवियों को/ड्रायबल फ़ोल्डर पर सेट करें और "android:layout_height="30dip"

ठीक काम करें !!

1

फ़ोटोशॉप में छवि स्टार में बस 2 पिक्सेल पैडिंग। एक्सएमएल में पैडिंग काम नहीं करता है, बस फ़ोटोशॉप में पैडिंग स्टार छवि। यह बहुत अच्छा काम है।

2

प्रत्येक शरीर कुछ सुझाव दे रहा है लेकिन कोई भी शरीर यह बताने की कोशिश नहीं कर रहा है कि ऐसा क्यों होता है। मैं अब इसे समझाने की कोशिश करूंगा। बेशक यह तभी होगा जब आप रेटिंग बार छवियों को कस्टमाइज़ करने का प्रयास कर रहे हों।

कल्पना कीजिए कि हमारे पास आकार 72x72 पिक्सल के साथ कस्टम छवि है और यह XXXHDPI के लिए हमारा संसाधन है - (यह 4x है)।

  1. उसी छवि को XXHDPI, XHDPI, HDPI, MDPI और LDPI के अंदर भी कॉपी करने की आवश्यकता है। मैं अभी के लिए आखिरी एक संसाधन निर्देशिका याद करूँगा।
  2. अलग निर्देशिका के अंदर इस छवि के रूप में पालन किया जाना चाहिए:
      XXHDPI आकार प्रति छवि के लिए
    • 54x54 होने के लिए (इस 3x है)
    • XHDPI आकार प्रति छवि के लिए
    • जरूरत 36x36 होने चाहिए (इस 2x है)
    • HDPI आकार प्रति छवि के लिए
  3. तो अब
  4. इस परिदृश्य में यदि आपके रेटिंग बार
  5. MDPI आकार प्रति छवि के लिए
  6. 18x18 होने चाहिए 27x27 होने के लिए (इस 1.5x है) की जरूरत है (इस 1x है) ऊंचाई है 18 डीपी उदाहरण के लिए 30 डीपी, आप प्रत्येक स्टार छवि के नीचे इस खराब छवि कलाकृतियों को देखेंगे, क्योंकि जाहिर है रेटिंगबैर अपनी बाकी की ऊंचाई को कुछ के साथ भरने की कोशिश कर रहा है (आपकी छवि 18 डीपी है लेकिन बार की ऊंचाई है 30 डीपी), तो बाकी 12tep इस कलाकृतियों से भरा होगा।

यही कारण है कि यदि आप रेटिंग बार ऊंचाई को निश्चित आकार के लिए सेट करते हैं तो सबकुछ ठीक हो सकता है लेकिन यह भी ठीक नहीं हो सकता है। यह सब आपके कस्टम छवि आकार के बारे में निर्भर करता है।

मैं वहाँ एक समाधान है जो सभी संभव परिदृश्यों में काम करेंगे है लगता है और यह है:

  1. सभी उपकरणों स्क्रीन है कि आपका ऐप XXXHDPI, XXHDPI या जो भी आप चाहते हैं का समर्थन करेंगे के लिए छवि संपत्ति बनाएं।
  2. सुनिश्चित करें कि यदि आपकी (एमडीपीआई जो 1x है) छवि उदाहरण के लिए 20 पिक्सेल ऊंचाई है, तो आपकी रेटिंगबार ऊंचाई 20 डीपी जितनी बड़ी नहीं होगी और सबकुछ ठीक होगा।

नोट: इस पूरे वार्तालाप हम डी पी के बारे में बात में (घनत्व पिक्सल) नहीं पिक्सल में अगर हम हर एक रेस फ़ोल्डर में उन सभी छवि संसाधन उपलब्ध कराते हैं हम पिक्सल के साथ डी पी के साथ काम नहीं मौका होगा क्योंकि। मुझे उम्मीद है कि अंतिम वाक्य स्पष्ट है और समझ में आता है।

संपादित करें: दूसरा संभावित तरीका कुछ कस्टम पैडिंग (खाली स्थान), शायद आपकी कस्टम छवि के नीचे 1px या 2px छोड़ना है।उस स्थिति में रेटिंगबार दृश्य उन कलाकृतियों पिक्सेल को प्रदर्शित नहीं करेगा, क्योंकि उन्हें आपकी कस्टम छवि के पैडिंग भाग से लिया जाएगा, जो वास्तव में केवल खाली (पारदर्शी) पिक्सेल है। मैं व्यक्तिगत रूप से सोचता हूं कि यह सबसे अच्छा तरीका नहीं है, क्योंकि छवि पैडिंग रेटिंगबार और लेआउट के अंदर बाकी दृश्यों के बीच कुछ जगह (पैडिंग) बनाएगी। उस स्थिति में आपके पास दृश्य स्थान का पूर्ण नियंत्रण नहीं होगा, क्योंकि कुछ छोटे हिस्से को कस्टम छवि (उन 2 पीएक्स पैडिंग) के अंदर हार्ड कोड किया गया है।

संबंधित मुद्दे