Sprite scaling problems. - GameCreators Forum

Author

Message

Bloodwire

8

Years of Service

User Offline

Joined: 26th Dec 2015

Location:

Posted: 21st Apr 2019 11:09

Link

I think the problem with AppGameKit is that they've made it so easy, that it becomes hard. Example, I want to create a sprite, and I want to create an app/program that works both on my computer and my android devices. All of the devices have of course different screen formats, but AppGameKit scales automatically, so everything should be fine?

My problem is that the appearance changes depending on which device I am using. I have written a piece of code to illustrate this (below) - the program creates a display, 1280x720 and then it creates a sprite and scales it down so that it covers 1/4 of the screen (square, top corner) I then draw a cross, for references. On my PC this shows up as I intended, the square is withit the cross, but when I broadcast the same app to my phone the square is shrinked and drawn inside the 1/4 part of the cross.

How do you guys deal with this? I am constantly running into this problem with sprites, they are scaled differently depending on which device you are working on. It's a mess. One of the prime reasons I need to get this to work is that I want to draw (DrawLine) on the screen and there is no way to draw in the background, you are basically forced to use sprites to draw background images, which is kind of backward, in my opinion. Sprites used to be used small hardware accelerated objects which you could move around the screen quickly and independently (Commodore 64 came up with this.)

So, how do you guys deal with this?

+ Code Snippet

aw=1280
ah=720

// set window properties
SetWindowTitle( "scaletest" )
SetWindowSize( aw, ah, 0 )
SetVirtualResolution( aw, ah )
SetOrientationAllowed( 1, 1, 1, 1 )
SetScissor( 0,0,0,0 )

// create a sprite that is aw/2,ah/2
csquare=MakeColor(140,26,15)
ccross=MakeColor(217,211,137)
img=CreateRenderImage(aw,ah,0,0)
SetRenderToImage(img,0)
DrawBox(0,0,aw,ah,csquare,csquare,csquare,csquare,1)
SetRenderToScreen()
	
spr=CreateSprite(img)
SetSpriteScale(spr,0.5,0.5)
SetClearColor(20,30,38)

do
	DrawLine(aw/2,0,aw/2,ah,ccross,ccross) // draw a cross for reference
	DrawLine(0,ah/2,aw,ah/2,ccross,ccross)
    Sync()
loop

Back to top

Profile PM Website

Golelorn

8

Years of Service

User Offline

Joined: 20th Nov 2016

Location:

Posted: 21st Apr 2019 18:11 Edited at: 21st Apr 2019 18:59

Link

This post has been marked by the post author as the answer.

I find it best to use the percentage system.

Instead of using SetVirtualResolution() you would use SetDisplayAspect().

This makes everything to scale using a base 100X100 area(the backbuffer area).

Keep in mind that drawing to the backbuffer is going to be a different resolution than the rendered resolution, so we have to adjust for that.

Example:

aw=1280
ah=720

SetDisplayAspect(aw/ah)
left# = GetScreenBoundsLeft()  // 0 may not be the leftmost coordinate. in fact in this example my left was -17
right# = GetScreenBoundsRight() // again, 100 may not be the rightmost coordinate
top# = GetScreenBoundsTop() //see above
bottom# = GetScreenBoundsBottom() //see above
width# = 100 // backbuffer width
height# = 100 //backbuffer height
actualw# = right#-left# // actualwidth to figure out scaling
actualh# = bottom#-top# //see above

// set window properties
SetWindowTitle( "scaletest" )
SetWindowSize( aw, ah, 0 )
SetOrientationAllowed( 1, 1, 1, 1 )
SetScissor( 0,0,0,0 )
 
// create a sprite that is aw/2,ah/2
csquare=MakeColor(140,26,15)
ccross=MakeColor(217,211,137)
img=CreateRenderImage(width#,height#,0,0)
SetRenderToImage(img,0)
DrawBox(left#,top#,right#,bottom#,csquare,csquare,csquare,csquare,1)
SetRenderToScreen()
     
spr=CreateSprite(img)
SetSpriteSize(spr,actualw#/2,actualh#/2) // set size base off actual size of the screen. 
SetSpritePosition( spr, left#, top# ) //set sprite based on actual position of screen. for my screen this was not 0,0
SetClearColor(20,30,38)
 
do
    DrawLine(width#/2,top#,width#/2,bottom#,ccross,ccross) // draw a cross for reference
    DrawLine(left#,height#/2,right#,height#/2,ccross,ccross)
    Sync()
loop

+ Code Snippet

aw=1280
ah=720

SetDisplayAspect(aw/ah)
left# = GetScreenBoundsLeft()  // 0 may not be the leftmost coordinate. in fact in this example my left was -17
right# = GetScreenBoundsRight() // again, 100 may not be the rightmost coordinate
top# = GetScreenBoundsTop() //see above
bottom# = GetScreenBoundsBottom() //see above
width# = 100 // backbuffer width
height# = 100 //backbuffer height
actualw# = right#-left# // actualwidth to figure out scaling
actualh# = bottom#-top# //see above

// set window properties
SetWindowTitle( "scaletest" )
SetWindowSize( aw, ah, 0 )
SetOrientationAllowed( 1, 1, 1, 1 )
SetScissor( 0,0,0,0 )
 
// create a sprite that is aw/2,ah/2
csquare=MakeColor(140,26,15)
ccross=MakeColor(217,211,137)
img=CreateRenderImage(width#,height#,0,0)
SetRenderToImage(img,0)
DrawBox(left#,top#,right#,bottom#,csquare,csquare,csquare,csquare,1)
SetRenderToScreen()
     
spr=CreateSprite(img)
SetSpriteSize(spr,actualw#/2,actualh#/2) // set size base off actual size of the screen. 
SetSpritePosition( spr, left#, top# ) //set sprite based on actual position of screen. for my screen this was not 0,0
SetClearColor(20,30,38)
 
do
    DrawLine(width#/2,top#,width#/2,bottom#,ccross,ccross) // draw a cross for reference
    DrawLine(left#,height#/2,right#,height#/2,ccross,ccross)
    Sync()
loop

Back to top

Profile PM

Bloodwire

8

Years of Service

User Offline

Joined: 26th Dec 2015

Location:

Posted: 21st Apr 2019 21:50

Link

Thanks, this helps a lot. I think the commands I have been looking for are the GetScreenBounds commands. I haven't seen them before.

Back to top

Profile PM Website

Sorry your browser is not supported!

AppGameKit Classic Chat / [SOLVED] Sprite scaling problems.