Hello @frederik, thanks so much for your input.
Wow, works just as I described. The problem is I failed to mention I will want to use those rect() as a clipMask() for text, creating a sort of a parallax effect – something like https://dailydrawbot.tumblr.com/post/135907707375/how-now-brown-cow-references-in-this-thread-on.
Thus I need rect() to maintaint its order/index. Here‘s my (faulty) code that I made initially but gave up and thought I will try to fix the endless move across X axis first:
The "optical" effect is more of less how I want it, but the loop breaks as before.
import math
Variable([
dict(name="progress", ui="Slider",
args=dict(
value=0,
minValue=0,
maxValue=1,
)),
], globals())
pageW, pageH = 500, 500
steps = 5
stepW = int(pageW/steps)
# Canvas with one step more
extendedW = pageW + stepW
textString = "O"
oneside = math.floor(steps/2)
fs = 300
pushX = progress * pageW
newPage(pageW, pageH)
text(str(pushX), (5, 5))
# Draw one extra step
for i, stepStartX in enumerate(range(0, extendedW, stepW)):
elapsed = (stepStartX+pushX)//(pageW+stepW)
if elapsed:
stepStartX -= (elapsed * pageW) + stepW
x1 = stepStartX + pushX
x2 = x1 + stepW
mask = BezierPath()
mask.moveTo((x1, 0))
mask.lineTo((x2, 0))
mask.lineTo((x2, pageH))
mask.lineTo((x1, pageH))
mask.closePath()
stroke(None)
fill(0)
fontSize(fs)
textW, textH = textSize(textString)
stepCenter = x1+(stepW-textW)/2
offset = (x1-(oneside*stepW))*-0.5
# Draw mask
with savedState():
fill(None)
stroke(random())
drawPath(mask)
with savedState():
fontSize(8)
text(f'{i}\nStepStartX: {stepStartX}\nx1: {x1}\nelapsed: {elapsed}', (x1, pageH-10))
with savedState():
clipPath(mask)
translate(offset, 0)
textBox(textString, (stepCenter, (pageH-textH)/2, textW, textH))
Any chance you could tell me what I am doing wrong please?
Thanks for your time :—)
