Rows of circles using while loop and if statement (processing.py)

Processing.py
1

Hello there! Absolute beginner here.

I’ve started to learn about processing.py but I’m struggling with iteration and modulo operator.
Using a while loop, I have to recreate this arrangement :

rows-of-circles
rows-of-circles1224×1268 29.4 KB

I’ve followed some indicated steps before I get stucked:

1- Create a while structure that loops twelve times.
2- Place the circles in one long row extending past the right edge of the display window.
3 - Use if statement within the loop to detect when the second row begin.

size(500,500)
background('#004477')
noFill()
stroke('#FFFFFF')
strokeWeight(3)


i = 0
x = 100
y = 100

while i < 12:
    
    i += 1
    
    if x * i == x * i % width:
        ellipse(x * i, y , 80,80)
        print('first row')
        
    else:
        #start a new row
        print('the rest')

At this point, it seems I can detect when the first row have to end depending of the width of the display window but can’t figure out how to draw the rest of the circles.

Thanks for the help!

2

Hi RoddyPiperVision,

Here below a revised sketch with simple annotated explanations

W, H = 500, 500                    # Dimensions of canvas
SW = 3                             # Strokeweight
D = 80                             # Diameter
N = 4                              # Number of rows/cols
G = (W - D*(N+1) + SW*N*2) / N     # Gap between cicles (total width - diameter*4 (circles) - diameter*1 (borders) + strokeweight*8) / 4

def setup():
    size(W, H)
    background('#004477')
    stroke('#FFFFFF')
    translate(D, D) # Translate by 80 (diameter) both on the X and Y directions
    strokeWeight(3)
    noFill()
    
    i = 0

    while i < 16:
        x = (i%N) * (D+G) # When i reaches 4 (max number of cols) -> modulo starts from 0 (0,1,2,3,0,1,2,3,0...). Multiply by diameter + gap
        y = (i//N) * (D+G) # y = how far we are (proportionally) to the max number of rows. Multiply by diameter + gap
        ellipse(x, y, D, D)
        
        i += 1 # Increment at the end of the loop

EDIT: Just realized I omitted the 3rd requirement regarding the use of an if statement within the loop.

i = 0 # Index of current circle
y = 0 # Height of the center of the circles

while i < 16:
    x = (i%N) * (D+G) # When 'i' reaches 4 (max number of cols) -> modulo starts from 0 (0,1,2,3,0,1,2,3,0...). Multiply by diameter + gap
        
    # If modulo == 0 (back to column 0) and we have at least 4 circles displayed (1rst row drawn) -> increment 'y' by appropriate height (diameter+gap)
    if i%N == 0 and i>=N:
        y += (D+G)
            
    ellipse(x, y, D, D)
        
    i += 1 # Increment at the end of the loop
3 Likes
3

Thank you solub!
(The EDIT part is the icing on the cake :clap:)

EDIT: After digging into your code and explanations (and after a little more practice), I think I figured out what it was intented for me to do. Don’t know if posted this rookie version of your code can bring someone some extra help but who knows.

size(500,500)
background('#004477')
noFill()
stroke('#FFFFFF')
strokeWeight(3)

i = 0
x = 0
y = 0
col = 0
row = 0
P = 100
translate (0, 100)

while i < 16:
    
    i += 1
    col += P
    
    ellipse(x+col, y+row , 80,80)
    print('first row')
        
    if i%4 == 0:
        row += 100
        col = 0
        print('the rest')
1 Like