Forum Discussion
Shape on layer is off-centered
Hello.
I want to create a progress bar where the first circle "blinks" for a few seconds. I drew a circle shape on the base layer and added a slightly larger circle around it on the first layer. When I preview the slide, the outer circle is off-center from the base layer circle.
How does this happen and how can I fix this?
Attached is an example file.
Thank you
Actually, I found them off center in the work space in the project you posted. Use Drawing tools -> Format, and you can see their X and Y position. Set them the same, and their origins will be in the same place. Then, since the oval is 10 bigger than the Circle, you need to move the circle right 5 and down 5.
See the attached video.
Thank you. That was a good tip.
It is still tricky, though to find the correct position. I have something that is "close enough" so maybe stick with that now.
the circles in your video are much better, but not exactly centered in browser
screenshot from your video:
on top: playback in browser (1px/1px wrong) <- modern player is scaling the output
on bottom: in storyline authoring (exact centered)I would build this with circles without border - only with stacked circles
and test it with different sizes -> odd/even and different positions odd/even
Jürgen
As Jurgen states remove the border as this always sits 50:50 on the border. Also there is often rendering issues and these display different in different browsers, I would build them as svgs
Sent from my iPhone
i have tested some variations - here are the results (with Chrome - Screen 1920x1200 Pixel)
https://360.articulate.com/review/content/d45543f6-697a-43ea-a9cc-86e6a353c347/review
but all solutions with more than one element for a graphic are zoom dependent
(-> modern player)'1 svg complete' is identical for all screen resolutions
Jürgen
Thank you! That looks great.
Unfortunately, I am not very familiar with svg files.... So, will have to try the other adjustments. It is tricky, though..... :(
Thanks again for taking the time....
try png images - the quality is not bad
