We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Rating Bar stars size varies on different solutions(i.e Android,IOS,windows)

HI,

 First i wanna thank you for this rating control.. Its very good. But when i deploy in xamarin forms i found the size of the stars are varying and also in android the stars were very small and blurred . when i click on the stars in android the background of the stars also changing . here is my xaml code:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
              xmlns:rating="clr-namespace:Syncfusion.SfRating.XForms;assembly=Syncfusion.SfRating.XForms"
              xmlns:syncfusion="clr-namespace:Syncfusion.SfRotator.XForms;assembly=Syncfusion.SfRotator.XForms"
             x:Class="Factail.Views.Page3">
  <StackLayout>
    <rating:SfRating x:Name="rating"  BackgroundColor="White" Precision="Half" TooltipPlacement="TopLeft" TooltipPrecision="2"  TooltipBackgroundColor="Blue" TooltipTextColor="Red"></rating:SfRating>
  </StackLayout>
</ContentPage>


Can anyone suggest me how to overcome this and make my rating bar look clean in android and also adjust the rating stars in all platforms??

8 Replies

HM Hemalatha Marikumar Syncfusion Team May 27, 2016 09:48 AM UTC

Hi Uday, 

Thanks for contacting Syncfusion Support.

Query: Size of the stars are varying and also in android the stars were very small

The size of the control may not be the same across all (Android,iOS,Windows) platforms which is due to the variation in device and screen specifications. In this case, please check for the platform type and vary the Rating items size by using ItemSize, ItemSpacing properties and code example for the same as follows.


 

            if (Device.OS == TargetPlatform.Android)
            { 
  
               rating.ItemSize = 30;   
               rating.ItemSpacing = 20;  
          }  
  
    


Query
Size of the stars are varying and also in android the stars were very blurred

We are unable to reproduce the reported issue at our end in android platform. So please provide the details of your device or emulator (like model, resolution, density, tab or phone) to validate the issue.

Query: when i click on the stars in android the background of the stars also changing

We are unable to reproduce the reported issue “Background of the star changes while clicking on star”. We have prepared a sample with the provided code example which has been attached in the below link.

Link: http://www.syncfusion.com/downloads/support/forum/124245/ze/Rating_Sample1230852099

If the issue still persists even with the above sample, please share more information like screen shot or video along with the device details to validate the issue at our end.

Regards,
Hemalatha M.R.   
  
  
  
  



UK uday kumar May 27, 2016 10:25 AM UTC

Thank you for the reply!! :) 
 I am sending u my android output in emulator(screenshot)... you can observe the colors and blurring effect.. plz suggest me to overcome this.. iam deploying on VS emulator 5 inch kitkat(4.4) XXHDPI phone(Android 4.4- API 19) resolution 1080*1920  similar to Xperia Z,memory 2gb ram,.  Please check the screen shots of the output for ur sample application in the attathed file below

Attachment: Screenshots_bdb830c4.zip


HM Hemalatha Marikumar Syncfusion Team May 30, 2016 12:43 PM UTC

Hi Uday,

Thanks for your update.

We were able to reproduce the issue " Rating control is not rendered correctly in high resolution device"and have logged defect report regarding this. A support incident to track the status of this defect has been created under your account. Please log on to our support website to check for further updates.

https://www.syncfusion.com/account/login?ReturnUrl=%2fsupport%2fdirecttrac%2fincidents/


Regards,
Hemalatha M.R


EM Emil March 11, 2018 02:17 AM UTC

is it not possible to do it in xaml?
i tried below but it doesnt work 

 <rating:SfRating.ItemSize>
                                                <OnPlatform x:TypeArguments="x:Double">
                                                    <OnPlatform.Android>
                                                        <OnIdiom x:TypeArguments="x:Double" Phone="15" Tablet="20" />
                                                    </OnPlatform.Android>
                                                    <OnPlatform.iOS>
                                                        <OnIdiom x:TypeArguments="x:Double" Phone="15" Tablet="20" />
                                                    </OnPlatform.iOS>
                                                    <OnPlatform.WinPhone>
                                                        <OnIdiom x:TypeArguments="x:Double" Phone="15" Tablet="20" Desktop="25" />
                                                    </OnPlatform.WinPhone>
                                                </OnPlatform>
                                            </rating:SfRating.ItemSize>


EM Emil March 11, 2018 02:02 PM UTC

ItemSize appears to be integer but I cant figure out how to do it as style dynamically like above. Please always consider a binding instead of direct casting when you give examples. because direct casting might be not possible always when using in ListView datatemplate for example.

Regarding problem with stars appearing blurry, please consider using svg items as default instead of png. so we wont have this problem if already not. it will help us to keep size of the SfRating as minimum as well. 


VA Vinnalan Aravazhi Syncfusion Team March 12, 2018 12:19 PM UTC

Hi Emil,

Thanks for the update.

Query 1:Is it not possible to change ItemSize using OnPlatform in xaml?

We have checked your requirement from our side and we have modified your code sample and provide the Int instead of Double TypeArguments. Please find the sample from the below link.  

Query 2: Please consider using svg items as default instead of png

In our current implementation we have drawn the rating starts using Paint and we have not used any Png images. So can you please explain in details the difficulties faced in SfRating control so that we can help you in achieving that.

Please let us know if you have any other queries.

Regards,
Vinnalan K A.
 



PH phanichand June 6, 2018 04:52 AM UTC

Hi,
I have recently used this plugin. It really good because you guys are providing for free access. Here i'm using my mobile instead emulator, so when I render in android v6.0.1 stars are changing its colors like a disco ball. Immediate reply is highly appreciable. Please solve this. 

I have customized a little bit.

 <rating:SfRating Value="{Binding Rating}" ItemCount="5" ItemSize="14" ReadOnly="True">
                                                    <rating:SfRating.RatingSettings>
                                                        <rating:SfRatingSettings RatedFill="#f1b500" UnRatedFill="Gray" RatedStrokeWidth="0" UnRatedStrokeWidth="0" />
                                                    </rating:SfRating.RatingSettings>
                                                </rating:SfRating>



Attachment: Screenshot_20180606_101627_dde31f9d.rar


RB Rabhia Beham Kathar Mideenar Syncfusion Team June 7, 2018 10:59 AM UTC

Hi Phanichand,

Thanks for contacting Syncfusion Support.

We have prepared a simple sample using SfRating Control and have checked the reported issue. We could not able to reproduce the issue. Please have the sample from the below link.

Sample Link: http://www.syncfusion.com/downloads/support/forum/124245/ze/Rating_Sample481842653 

Please check with the sample and if the issue still persists from your side, please modify the sample provided with the issue reproducing steps which will helpful for us to analyse and provide an appropriate solution.

Regards,
Rabhia Beham K. 


Loader.
Live Chat Icon For mobile
Up arrow icon