B4A Library [B4X] [XUI] AS RatingBar

Hey,
the performance and handling of this view is very nice.

I spend a lot of time in creating views, like this and to create a high quality view cost a lot of time. If you want to support me and further views, then you can do it here by Paypal.

Features

• cross-platform compatible
• responsible
• events
• easy to use

Spoiler: Dependencies/Libraries you need for this view

B4j: jXUI
B4a: XUi,Reflection
B4i: iXUI

ASRatingBar
Author: Alexander Stolte
Version: 1.03

• ASRatingBar
  • Events:
    • RatingChange (rating As Int)
    • RatingChanged (rating As Int)
  • Functions:
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • FontToBitmap (text As String, IsMaterialIcons As Boolean, FontSize As Float, color As Int) As B4XBitmap
      

      FontAwesome To Bitmap

      Unlike an older "TextToBitmap" sub that you can find in the forum, this code vertically centers the icon. It can also be used in B4J and B4i (only need to change the font line). Sub Activity_Create(FirstTime As Boolean) 'usage example Activity.AddMenuItem3("Android", "Test"...

      www.b4x.com
    • getCurrentRating As Int
    • getImage As B4XBitmap
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • setCurrentRating (rating As Int) As String
    • SetImages (active_image As B4XBitmap, inactive_image As B4XBitmap) As String
  • Properties:
    • CurrentRating As Int
    • Image As B4XBitmap [read only]

Changelog

• 1.00
  • Release
• 1.01
  • Add getBase
  • Add public variable Tag
• 1.02
  • B4X Example
  • Custom Props explained
• 1.03
  • Add set Enabled - enabled or disabled the touch gesture
    • ASRatingBar1.Enabled = False
• 1.04
  • Fix names in designer
  • Add set MaximumRating
• 1.05
  • Add TouchStateChanged
• 1.06
  • Better click handling

Have Fun

 

[MarcoRome]

+10

 

[Sandman]

Hi @Alexander Stolte

I haven't looked at the source, but judging from the animated pics you're doing this in a way that leaves graphical artifacts. I'd say you first draw the grey icon and then, on top of it, the coloured icon. When you do it like that, you get too dark edges. (This is a result of the icon edges being partially translucent, and thus they combine when placing one on top of another.) This can be seen around all edges, more or less, but I've marked two places where it's visible:

There are two solutions for this, one is simple and one is more involved. Both will produce perfect results in the ratingbar:

1. Simple solution: When an icon is filled, don't draw the gray beneath.

2. Involved solution: Make all icons range all the way to black and treat them as masks instead.

 

[Alexander Stolte]

I haven't looked at the source, but judging from the animated pics you're doing this in a way that leaves graphical artifacts. I'd say you first draw the grey icon and then, on top of it, the coloured icon. When you do it like that, you get too dark edges. (This is a result of the icon edges being partially translucent, and thus they combine when placing one on top of another.) This can be seen around all edges, more or less, but I've marked two places where it's visible:

Thanks but, the view is simpler than that, you need to add 2 Images the active image and the inactive image, i think it comes from the function where i make the font awesome icons into an image. Try it with an image you'll see that the problems won't arise. I only resize the images to fit the screen.

Like I said the view is simple.

On my phone i can't see this.

 

[Alexander Stolte]

Hoi can i use that with the i.e. the Google Play- Voting ?

make a new thread, thanks.

 

[GMan]

How to use AS RatingBar with Google Playstore App-Rating

How can i use the AS RatingBar Lib with Google Playstore App-Rating ? The sample works fine, but how to submit the result to the Playstore ?

www.b4x.com

 

[Marvel]

This is nice

 

[layman]

Hi @Alexander Stolte

I haven't looked at the source, but judging from the animated pics you're doing this in a way that leaves graphical artifacts. I'd say you first draw the grey icon and then, on top of it, the coloured icon. When you do it like that, you get too dark edges. (This is a result of the icon edges being partially translucent, and thus they combine when placing one on top of another.) This can be seen around all edges, more or less, but I've marked two places where it's visible:

View attachment 93711


There are two solutions for this, one is simple and one is more involved. Both will produce perfect results in the ratingbar:

1. Simple solution: When an icon is filled, don't draw the gray beneath.

2. Involved solution: Make all icons range all the way to black and treat them as masks instead.

Hey,
the performance and handling of this view is very nice.

I spend a lot of time in creating views, like this and to create a high quality view cost a lot of time. If you want to support me and further views, then you can do it here by Paypal.

Features

• cross-platform compatible
• responsible
• events
• easy to use

Spoiler: Dependencies/Libraries you need for this view

B4j: jXUI
B4a: XUi,Reflection
B4i: iXUI

View attachment 93695View attachment 93696
View attachment 93697

ASRatingBar
Author: Alexander Stolte
Version: 1.00

• ASRatingBar
  • Events:
    • RatingChange (rating As Int)
    • RatingChanged (rating As Int)
  • Functions:
    • Class_Globals As String
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • FontToBitmap (text As String, IsMaterialIcons As Boolean, FontSize As Float, color As Int) As B4XBitmap
      

      FontAwesome To Bitmap

      Unlike an older "TextToBitmap" sub that you can find in the forum, this code vertically centers the icon. It can also be used in B4J and B4i (only need to change the font line). Sub Activity_Create(FirstTime As Boolean) 'usage example Activity.AddMenuItem3("Android", "Test"...

      www.b4x.com
    • getCurrentRating As Int
    • getImage As B4XBitmap
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • setCurrentRating (rating As Int) As String
    • SetImages (active_image As B4XBitmap, inactive_image As B4XBitmap) As String
  • Properties:
    • CurrentRating As Int
    • Image As B4XBitmap [read only]

Changelog

• 1.00
  • Release

Have Fun

Hi
I had queried about exactly such a library a few days ago but wanted partial coloring of fontawesome fonts for rating fractions - like 4.5, 3.6 etc. Could you look into modifying to show fraction rating? Thank you

 

[Alexander Stolte]

Update
1.01

• Add getBase
• Add public variable Tag

 

[MarcoRome]

Very Good Work. Very flexible, you got my donation. Thank's for your job

 

[MarcoRome]

Hi @Alexander Stolte
it is possible to make sure that the object is disabled, so that after setting a vote via code, even if the user clicks on it, he does not perform any operation.
I tried to disable ASRatingTest.mBase.Enabled = False
but it has no effect.
Any solution ?
Thank you for your response.
Have a nice day

 

[Alexander Stolte]

Update

• 1.03
  • Add set Enabled - enabled or disabled the touch gesture
    • ASRatingBar1.Enabled = False

it is possible to make sure that the object is disabled, so that after setting a vote via code, even if the user clicks on it, he does not perform any operation.

ASRatingBar1.Enabled = False

 

[MarcoRome]

Update

• 1.03
  • Add set Enabled - enabled or disabled the touch gesture
    • ASRatingBar1.Enabled = False

ASRatingBar1.Enabled = False

Great work alex

 

[Informatix]

Hello,
I modified your lib to fix the property names in designer and add a setMaxRating function.
I didn't have the time for this but it would be nice if the size could be changed when the max rating value is changed.

 

[Alexander Stolte]

Update

• 1.04
  • Fix names in designer
  • Add set MaximumRating

it would be nice if the size could be changed when the max rating value is changed.

this should now work.

 

[Alexander Stolte]

Update

• 1.05
  • Add TouchStateChanged

 

[Alexander Stolte]

Update

• 1.06
  • Better click handling