How to fill rectangles in my PowerApps project?

Question

I'm working on a project in PowerApps and I need help with one functionality. On one screen, I have a container containing 8 rectangles, below which there is a button. I want the rectangle to be colored after clicking the button. On the previous screen, I have an input where the user enters a number (number of produced products). On the screen with rectangles, I have this data "stored", and it counts the number of produced products after each button click. This part is already functional. My problem is that the rectangle is only colored up to the count of 8, and then it doesn't continue. For example: the user enters the number 10, and each produced item is clicked with the button, gradually coloring the rectangles, but only up to 8... I want it to start coloring again from the beginning for numbers higher than 8 (since there are only 8 graphical rectangles in the container).

this is my code in button:

Set(OrderNumber, Value(orderNumbertxt.Text)); 
If(indexRectangle < Value(OrderNumber), 
Set(indexRectangle, indexRectangle + 1)
);
Set(rest, Mod(indexRectangle + 1, 9));
Set(farbaVyplne, rest <= Value(OrderNumber));`

this is my code in fill property for rectangles:
If(indexRectangle = 1 && farbaVyplne, Color.Blue, Color.White)
If(indexRectangle = 2 && farbaVyplne, Color.Blue, Color.White)

Answer 1

After you increase indexRectangle by 1, check if it is greater than 8, and if so, subtract 8.

That means, when indexRectangle is set to 9, the next step reduces it back to 1 and you're back at your desired number for the fill color selection.

If(indexRectangle < Value(OrderNumber), 
   Set(indexRectangle, indexRectangle + 1);
   If(indexRectangle > 8, indexRectangle - 8, indexRectangle)
);

If your logic only ever increases indexRectangle by 1, you can also just use

If(indexRectangle > 8, 1,indexRectangle)

If, however, the indexRectangle value can already be far higher than 8 when it arrives in your formula, you can use the Mod() function to determine the correct corresponding value from 1 to 8

    If(indexRectangle < Value(OrderNumber), 
       Set(indexRectangle, Mod(indexRectangle,8); 
// the previous row will return 0 for a number divisible by 8, 
// so we now set it back to 8
       If(indexRectangle = 0, set(indexRectangle,8,indexRectangle); 
       Set(indexRectangle, indexRectangle + 1);
       If(indexRectangle > 8,1,indexRectangle)
    );

Edit: If you use this code to set the fill for each rectangle, they all reference the same variable, so you may want to set the fill color to be for rectangle 1

If(indexRectangle >= 1 && farbaVyplne, Color.Blue, Color.White)

and for rectangle 2

If(indexRectangle >= 2 && farbaVyplne, Color.Blue, Color.White)

and so on. This way, the colours persist when the value of indexRectangle increases.