How to remove the white background around the star

[vikalpjain]

I'm using star rating and my app has a different background color than white. The white square around the star looks very odd. Is there any way of removing that?

[andydev404]

Solution: https://github.com/Monte9/react-native-ratings/issues/26#issuecomment-401279355

[WrathChaos]

@andydev404 Actually this is not a solution. When I set it to "transparent" whole star thing is just gone. tintColor does not work for the removal of the background.

[Sanan4li]

facing same issue? anyone found solution?

[vieiraricardo]

@Sanan4li change the tintColor prop as the background of the parent view

[blueberry6401]

@Sanan4li change the tintColor prop as the background of the parent view

What if I want it to be transparent? Is there a solution, even a workaround?

[Vahradrim]

I had the same issue. It's actually because your image should not be a star with a transparent background. It should be a background with a transparent star. Then you can change the background of your image directly. But it's pretty annoying if you have gradient on your page for example. It's currently not a very satisfying solution For those interested I made a template of an image to use :

[maciass2008]

Hi, To change the white square around the star you have to add the "tintColor" property to your Rating tag and make the color of your choice :

              <Rating showRating 
               fractions={1} 
               ratingCount={5}
               startingValue={3.3} 
               imageSize={20}
               type='star'
               tintColor='#E6E6E6'
              />

[gilad7]

@maciass2008 Thanks for the answer. However, if I want to set it to be transparent I just get one square that shows the rating. please see what happens when I set it to transparent

[flora8984461]

@maciass2008 Thanks for the answer. However, if I want to set it to be transparent I just get one square that shows the rating. please see what happens when I set it to transparent

Same issue here

[pati-rosa]

@maciass2008 Thanks for the answer. However, if I want to set it to be transparent I just get one square that shows the rating. please see what happens when I set it to transparent

Same issuue here

[Raden-Hor]

You can't change background color because this use actual background image. You can custom image star to fit with your background screen And this is my custom image