rate stars in rating bar | kotlin

Question

i'm new in kotlin and i need help!! i have list of 5 stars on the line(like rating bar) and want, for example when you clicked 3d star previous two change color. how can i write it with loop pragmaticaly? with if/else? i hope you help me! thanks!!

task:

    // Input - get elements or number or other data

    //     list of stars (items and index of items)
    //     rating number (x/5) (number of clicked star)
    //
    // Loops - FOR - iterate over elements
    // Conditions - IF/ELSE - what to do with element

    // Action:
    //    loop over stars (star & indexOfStar)
    //    set color: (yellow for start behind chosen one including chosen one (rating number))

have this code:

 val star1: ImageView = binding.star1
        binding.star1.setOnClickListener {
            Log.d("Star 1","Rate 1")
            star1.setImageDrawable(ContextCompat.getDrawable(star1.context, com.example.godelreviews.R.drawable.star2))}

        val star2: ImageView = binding.star2
        binding.star2.setOnClickListener {
            Log.d("Star 2","Rate 2")
            star2.setImageDrawable(ContextCompat.getDrawable(star1.context, com.example.godelreviews.R.drawable.star2))}

        val star3: ImageView = binding.star3
        binding.star3.setOnClickListener {
            Log.d("Star 3","Rate 3")
            star3.setImageDrawable(ContextCompat.getDrawable(star1.context, com.example.godelreviews.R.drawable.star2))}

        val star4: ImageView = binding.star4
        binding.star4.setOnClickListener {
            Log.d("Star 4","Rate 4")
            star4.setImageDrawable(ContextCompat.getDrawable(star1.context, com.example.godelreviews.R.drawable.star2))}

        val star5: ImageView = binding.star5
        binding.star5.setOnClickListener {
            Log.d("Star 5","Rate 5")
            star5.setImageDrawable(ContextCompat.getDrawable(star1.context, com.example.godelreviews.R.drawable.star2))}

        return binding.root
    }

    private fun onRatingChanged(rating: Int){
        Log.d("AddPage", "onRatingChanged: $rating/5")
    }

    private fun getStarRating(): Int{
        TODO("Implement")
    }
}

now it looks like this:

but i want mark others stars like this:

Answer 1

Modify your code like this, It may work for you -

    binding.star1.setOnClickListener {
        Log.d("Star 2","Rate 2")
        binding.star1.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))} 
  
    binding.star2.setOnClickListener {
        Log.d("Star 2","Rate 2")
        binding.star1.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))
        binding.star2.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))}
    
    binding.star3.setOnClickListener {
        Log.d("Star 3","Rate 3")
        binding.star1.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))
        binding.star2.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))
        binding.star3.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))}
    
    binding.star4.setOnClickListener {
        Log.d("Star 4","Rate 4")
        binding.star1.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))
        binding.star2.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))
        binding.star3.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))
        binding.star4.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))}


    binding.star5.setOnClickListener {
        Log.d("Star 5","Rate 5")
        binding.star1.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))
        binding.star2.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))
        binding.star3.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))
        binding.star4.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))
        binding.star5.setImageDrawable(ContextCompat.getDrawable(binding.star1.context, com.example.godelreviews.R.drawable.star2))}

    return binding.root
}

Answer 2

Since this looks like homework I'm not going to tell you how to do it, but the instructions you posted are really helpful!

Action:

• loop over stars (star & indexOfStar)
• set color: (yellow for start behind chosen one including chosen one (rating number))

It's saying you need to loop over all the stars. If the current star is the chosen one, or it's before the chosen one, you need to set it to yellow. Otherwise you need to set it to grey or whatever.

You need to do this whenever the currently selected star changes - so it makes sense to put this loop in a function you can call whenever that happens. That way, all your click listeners have to do is set the current star rating, and call the function that updates the display.

You already have a function declared that looks a lot like this:

private fun onRatingChanged(rating: Int){
    ...
}

It's called onRatingChanged and takes a rating value. How about you make that store the rating (if necessary), and then loop over your star ImageViews, updating each to display the appropriate star? Then your click listeners can just call that with the appropriate rating value.