@dave1707 - another attempt, stripped out duplication, modified project to use WIDTH and HEIGHT better and tried to strip out rectangle touches on the panel. Probably still needs more work but hoping this is a little better now.
New approach to Elite Galaxies
@Bri_G Still a problem. If I tap a planet in the lower left of the screen, it’s almost centered in the circle. If I tap a planet in the upper right, the circle is way to the upper right of the planet. The text in the panel looks Ok, but tapping in the G to go to the numbered circle is off to the right.
This is on my iPad Air 3 at 1112x834.
Looks like the width coordinates are out. Do you think this could be down to relative pixel sizes?
Also, if I don’t scale the panel that may give a more accurate touch response.
Any error in the factors would be exaggerated the further right and up you go.
Thanks again
@dave1707 - just looking at the math round your iPad Air 3 looks like the factoring may be affecting the scaling. The resolution has gone up in the same ratio but by an odd offset 88 and 66.
Tried a totally different approach now - I have saved images of the star systems so the scaling should be correct. I have removesd scaling from most of the code and have kept the size of the panels the same for each resolution. Which means huge on an iPhone.
Try this for size EGStarPics - no pun intended.
@Bri_G I was playing around with simulating different screen sizes to see how to scale things and using the aspect ratios. That’s when I realized you don’t have to do any of that. Depending on what device screen size your going to run on, all the scaling and stuff is done by that devices screen. All you need to do is draw stuff on the screen based on its relative position of the screen. If you want something drawn in the center of the screen, draw it at WIDTH*.5 and HEIGHT*.5 . No matter what device it runs on, it will be in the center of that devices screen. Always do stuff based on a percentage of the size.
For the touched() function, it’s the same thing. If you want to tap on something in the center of the screen, it will be + or - some value from WIDTH*.5 and HEIGHT*.5.
If you draw a panel that’s a size of 80x50 at screen position WIDTH*.5, HEIGHT*.3, it will be that size at that position on every device. No reason to scale anything.
Doing that, it doesn’t matter what device your running on. That devices screen is doing all the scaling based on it’s pixels per inch.
@Bri_G Referring to my above post, everything that’s done on the screen has to be a percentage of the screen size. That would mean all your planet positions would be a percentages instead of actual x,y values.
@dave1707 - just what I tried on that last post. But, if the pixels are the same size on each device the panels will be the same size. But, if the pixels are smaller then the the panel will reduce accordingly. Even so, I used the same panel size in the last post so on a larger screen it will look smaller. Hopefully that last post will be close - thanks again.
@dave1707 - puzzled now. The positions are actually percentages, but they are percentages on the basis of x and y coordinates. That’s the only way you can precisely coordinate features. It’s like a map.
In the last post Example I effectively posted a screen capture of the galaxy images. So when you scale to different screen sizes the image is scaled accordingly. Unless part of the scaled image is off screen the relative coordinates should be the same - so the relative x and y values should be the same.
Did the last posted version still show problems?
@dave1707 - aaaah, maybe it’s dawning on me now. Do you mean I have to convert all the original coordinates to percentages ? That’s a major work, but it may be worth a try. I’ll give it a go on one galaxy and see if that works.
@Bri_G Here’s the screen sizes of my devices.
iPad Air 3 1112x834
iPad Pro 1 1366x1024
iPhone 8 SE 667x375
You can see if you have hard coded positions, they’ll exceed the screen size on one device, but won’t fill the screen on another device. If all the positions are based of a percent, then it doesn’t matter what device it’s on.
Of course that’s just for positions. If you have an image, you’ll have to scale the sprite so it appears the same size on the different screens. If you do touch positions based on a sprite, you’ll also have to vary the touch values.
@dave1707 - the calculations I do are percentages. The figures are calculated by dividing the screen width and height by 256. The original data is from a matrix of 256 x 256. Having done that for my iPad res of 1024 x 768 I initially tried to using a scaling factor for screen width and screen height using my iPad res as default. The last version I posted on October 12 was based on scaling direct with the system resolution (in this case posting an image of the populated system on my iPad but scaling to WIDTH and HEIGHT) So they should be no errors involved unless there is also a touch factor.
I also didn’t scale the panel sizes so their relative sizes will be larger or smaller dependent on system resolution.
Did that last version perform any better ?
@Bri_G I loaded your latest version on my 3 devices. It worked pretty good on the iPad Air 3, but on the other 2 it wasn’t even close. The circles weren’t close to the planets being tapped. Trying to tap on the G wasn’t close either.
@Bri_G It used to work OK on my iPad Air 3, but your version 1.03 is messed up. The circles are close to the planets I tap on the left side of the screen, not centered, but way off to the left for planets on the right side of the screen. The text is not all within the panel image either. It seems like whatever you’re doing is making it worse.
What device are you writing this on.
@dave1707 - figured out how to emulate scale change and how to ensure the ellipse is placed correctly. Small demo attached.
Note: I haven’t scaled the size of the ellipse or added the text. Also messed up the printout of the resolution (simple to resolve). Also note the shape of the panel with resolution just scaled on axis dimensions. Think I need to keep that constant.
Update:
Just replace the panel sprite lines with the following lines to keep the panel consistent based on screen height. Now I need to mess with the fontSize.
pscale = kitRes[screen*2]/1024
sprite(asset.documents.Planetarium3,cW,cH,240*pscale,400*pscale)
@Bri_G What shows on my iPad Air 3 and iPhone 8 are totally different. On my iPhone there just some lines on each side of the display.
This is on my iPhone at level 7
@dave1707 - sorry a bit fixated with my own iPad so used 1024 instead of WIDTH and needed to add spriteMode(CENTER). Also scaled panel size on WIDTH.
Latest main code here:
function setup()
--
sW,sH = WIDTH,HEIGHT
cW,cH = sW/2,sH/2
krX = 2048
check = 0
parameter.integer("screen",1,#kitRes/2,1)
end
function draw()
-- This sets a dark background color
background(1)
krX,krY = kitRes[screen*2-1],kitRes[screen*2]
if krX ~= check then
printOut()
end
noFill()
strokeWidth(5)
stroke(125, 125, 0)
rectMode(CENTER)
rect(cW,cH,sW,sH)
for lp = 1,9,2 do
stroke(125+10*lp,125+10*lp,0)
rect(cW,cH,kitRes[lp],kitRes[lp+1])
end
panAspect = 240/400
kR1,kR2 = kitRes[screen*2-1], kitRes[screen*2]
-- spriteMode(CENTER)
sprite(asset.documents.galaxy01p,cW,cH,kR1,kR2)
-- sprite(asset.documents.Planetarium3,cW,cH,240*kR1/WIDTH,400*kR2/HEIGHT)
pscale = kR1/WIDTH
sprite(asset.documents.Planetarium3,cW,cH,240*pscale,400*pscale)
pushStyle()
stroke(255, 249, 0)
noFill()
strokeWidth(2)
ellipseMode(CENTER)
elX = (WIDTH-kR1)/2+20*kR1/256
elY = (HEIGHT-kR2)/2+(256-173)*kR2/256
ellipse(elX,elY,80*pscale,80*pscale)
popStyle()
check = krX
end
function printOut()
--
output.clear()
print(krX.."/"..krY)
end
@Bri_G Here’s an example that I tried. Tap on the 4 planets or the G. A circle will appear around the planets and the panel will disappear when you press the G. Move the slider to change the screen size. Simulates different screen sizes. Run in landscape.
I’ll try your code next.
function setup()
parameter.number("sc",.1,1,1,scaling)
scaling()
img=readImage(asset.documents.Dropbox.Planetarium3)
iw=img.width
ih=img.height
stroke(255)
strokeWidth(2)
tab={vec2(200,100),vec2(900,100),vec2(200,600),vec2(900,600)}
end
function scaling()
ww=WIDTH*sc
hh=HEIGHT*sc
sxRatio=ww/WIDTH
syRatio=hh/HEIGHT
pl=nil
end
function draw()
background(0)
if WIDTH<HEIGHT then
text("Rotate device to lanscape, then restart",WIDTH/2,HEIGHT/2)
return
end
noFill()
rect(0,0,ww,hh)
drawSprite()
drawText()
for a,b in pairs(tab) do
ellipse(b.x*sxRatio,b.y*syRatio,5)
end
if pl~=nil then
noFill()
ellipse(pl.x,pl.y,40*sxRatio,40*syRatio)
end
end
function drawSprite() -- draw sprite
if not hit then
sprite(img,ww/2,hh/2,sxRatio*iw,syRatio*ih)
end
end
function drawText()
fill(255)
fontSize(20*sxRatio)
text("qwertyuiop",ww/2,hh/2+300*syRatio)
text("asdfghjkl",ww/2,hh/2+240*syRatio)
text("zxcvbnm",ww/2,hh/2)
end
function touched(t)
if t.state==BEGAN then
hit=false
pl=nil
distX=58*sxRatio
distY=58*syRatio
if t.x>ww/2-distX and t.x<ww/2+distX and t.y>hh/2-distY-280*syRatio and t.y<hh/2+distY-280*syRatio then
hit=true
end
for a,b in pairs(tab) do
if t.x>b.x*sxRatio-30 and t.x<b.x*sxRatio+30 and t.y>b.y*syRatio-30 and t.y<b.y*syRatio+30 then
pl=vec2(b.x*sxRatio,b.y*syRatio)
end
end
end
if t.state==ENDED then
hit=false
end
end
@Bri_G I get an error.
Main:7: attempt to get length of a nil value (global ‘kitRes’)
stack traceback:
Main:7: in function ‘setup’