Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

AppGameKit Classic Chat / Run the game on all resolution

Author
Message
Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 4th May 2014 16:15 Edited at: 4th May 2014 16:16
Hi.

I want Begin Make a game for android. But really I don't know how can set VirtualResolution for run maximize in all Platforms with different Resolution like other android games.
Please Guide Me.

Thanks A Lot
Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 4th May 2014 21:32
There's some discussion on it right here:
http://forum.thegamecreators.com/?m=forum_view&t=210941&b=41

I personally prefer the percentage system. What I do is I design mockups of the screens in Adobe Illustrator (you could use Inkscape for free) or Photoshop (you could use GIMP for free). I design at my optimal resolution (1200x800 is my preferred because it is 3:2 and typically the widest/shortest aspect ratio). I size my sprites like this: w# = 100.0 * GetImageWidth() / 800.0 which converts the native width of the image at 800px wide layout to a percentage. I use 2 separate pixel dimensions. When I want a true single pixel I use 100.0 / GetDeviceWidth() and 100.0 / GetDeviceHeight(). If I want a pixel dimension at the native width (ie 1200x800) then I simply do n_pxW# = 100.0 / 800.0 and n_pxH# = 100.0 / 1200.0.
Then when you set up your screens all you have to do is either distribute sprites evenly or go back to your mockup in GIMP/Photoshop/Illustrator/Inkscape and change the rulers to percentage and input the coordinates to the code. Your game will always fill all screens, be sized very well, and you won't be stuck to a single aspect ratio like you are with virtual resolution. You should also make sure to test your game at the 3 popular aspect ratios: 3:2 , 4:3 , and 16:9. Following my method you'll find very very little alterations that need to be made and the game will look great on all devices. The only thing that is disappointing, but common to both virtual res and percentage, is that you cannot determine the pixel density of a device, so you cannot make it so that fonts are sized perfectly. For example a 10% font on a iPhone is physically much smaller than 10% on an iPad. So you have to come up with a happy medium.

Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 5th May 2014 08:47 Edited at: 5th May 2014 09:13
Thanks Naphier for good explanation.
but what is your sprite size when design in Adobe Illustrator or Photoshop or ...? because this sprite should resize in all devices without decrease quality.
you create sprites according to Resolution (1200 * 800)? and resize it according to Height and width device? Right?
Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 5th May 2014 10:57
Yes I create the sprites with a base resolution of 1200x800 and resize it properly according to device. It looks good on all but the lowest resolution displays (iPhone 3GS is 480x320). I'm not all too worried about really low resolution devices because they are uncommon.
Also the 1200x800 base resolution makes it so that sprites need little resizing on other resolutions.
http://en.wikipedia.org/wiki/List_of_displays_by_pixel_density

Scaling the sprites up is usually not much of a problem. Also, openGL that AppGameKit uses is limited to a 1024x1024 max texture size on iOS so making stuff bigger isn't usually much of an option.

However, if you want to scale your images it is easy to do so if you design with a vector graphics program. Just determine what atlases/image files you want to use for different resolutions. Most of the time I go with a happy medium, though. For example, in Wordspionage I went with 128x128 for the icons. This was a good intermediate for the device sizes. They might look slightly pixelated on the newer iPads, but that's the extreme of the resolutions. I also use mipmapping so they tend to look pretty good. I can't really tell unless I look very closely. However, I do notice mistakes I've made in image optimization.

For instance, in Wordspionage's loading animation I made the mistake of resizing an image file with photoshop instead of using a rendered vector from illustrator. So you can see some crappy edge artifacts. I also just recently found texture packer. Which has seriously impressed me with it's abilities in not only making atlas images, but it's scaling is superior to photoshop. I think the main reason is it has the ability to "reduce border artifacts". I plan on updating the Wordspionage graphics using this tool as well as packing them all into atlases. I also plan to use it to optimize a smaller version of my font image because it is very ugly on low resolution devices (iPhone 3GS). Another reason is that recently I found out that Kindles have issues with AppGameKit and non-power of 2 texture images, so I'm shifting my process to ALWAYS use atlas images. I may also make some alternate atlases for higher resolution devices as they are becoming more and more popular. It's important to realize, though, that an image that is double the native size on a physically small device with a high DPI (like a Nexus 5 - 1920x1080 at a 4.95" diagonal) still looks very sharp.

I also design a lot of my images with Blender which allows you to output various sizes very easily plus it has very good anti-aliasing.

So basically, find a happy medium for image sizes. If you are concerned about decrease in quality when scaled then utilize alternate atlas images.

Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 10th May 2014 13:03
Thanks you very much Naphier.
if there is any Problem I say to you.
Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 21st May 2014 10:49
Your mean is this:

Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 21st May 2014 12:18
Close! Just remove that call to setVirtualResolution and replace it with SetDisplayAspect(1) for landscape, -1 for portrait. Don't crossm your width and height values. Make sure setup.AGC is right. And I'd suggest using # on your w and h variable names to ensure they are floats!

Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 21st May 2014 13:13 Edited at: 21st May 2014 13:20
Thanks. I set Resolution in Setup.AGC to (width=1280,height=800). my sprite size is 512 x 512 but when compile code, don't show my sprite.
I Use
is correct?



Thanks
JohnnyMeek
11
Years of Service
User Offline
Joined: 23rd Apr 2013
Location: Slovenia
Posted: 21st May 2014 13:46
Are you sure about the SetDisplayAspect setting?

I always set it to -1, as per the help. And just set device orientation separately.

Quote: "Use an aspect ratio of -1 to use the device aspect ratio (fills the whole screen without black borders, but will look different on every device)"
SoftMotion3D
AGK Developer
19
Years of Service
User Offline
Joined: 24th Aug 2005
Location: Calgary,Alberta
Posted: 21st May 2014 18:47
humm... i actualy like to use virtual resolution over percentage system.

the problem with the percentage system is how do you draw a .01 % dot on an unknown resolution. the fact that it uses floats really messes up the way your drawings a scaled and fit on the screen. If you pick a virtual resolution at least your working with whole numbers. let agk handle the messy floats and calculations. agk will scale your virtual resolution to any res size on its own.

i personaly think its easier....

Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 21st May 2014 18:48
All apologies, yes always use SetDisplayAspect(-1) that fills the screen. That's what you want. (I shouldn't have answered so late)

Behdad - you need to think through your calculations a bit more.

If GetDeviceWidth = 800 then you divide by 800 you get 1, multiply that by 100 and you get... 100... so your W# = 100 percent of the screen... Also your saying you want a width of 1200 but then trying to use 800 in your calculation. Also I'd suggest always operating on floats with floats. So W# = 100.0 * GetDeviceWidth() / 1200.0. But I'm not sure what you're trying to accomplish with these.
If you want a single pixel width and pixel height then you'd use something like this:
pixel_W# = 100.0 * 1.0 / GetDeviceWidth()
pixel_H# = 100.0 * 1.0 / GetDeviceHeight()
Those read 1 pixel out of the total width times 100 to convert to a percentage.
Those may be useful to you.

Here's what it should be:




You need to think percentages. They're really easy, 100% is the right/bottom, 50% is the center, etc.
If you make a layout mockup in Photoshop of a 1200x800 image to position your images to see what they will look like you can also set Photoshop's rulers to percent and simply ready the coordinates.

Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 21st May 2014 18:52
@SoftMotion if you want to draw a pixel then just calculate it.
I almost always have a
pixel_W# = 100.0 * 1.0 / GetDeviceWidth()
pixel_H# = 100.0 * 1.0 / GetDeviceHeight()
calculation as a global

If you want to stick your game in a box with a faked background then virtual resolution is the way to go! If you want to actually, really make use of the screen percentage is the way to go. Nothing like setting virtual res to 1200x800 then having a 1600x900 screen and wanting your sprite to enter at the left edge, which means ~100 pixels in... Sure you have a background, but it doesn't look right.

SoftMotion3D
AGK Developer
19
Years of Service
User Offline
Joined: 24th Aug 2005
Location: Calgary,Alberta
Posted: 21st May 2014 19:01 Edited at: 21st May 2014 19:06
humm... im pritty sure agk scales your graphics on a virtaul resolution the same that it would with a percentage system.

i think the end result would be close at least and look better with virtual resolution dealing with whole numbers. also now using alpha 3 agk2 the agk player will actualy attempt to change the resolution of your device to the desired size if possible.

eg. if i set a virtual resolution of 1280,720... agk will change the resolution of the android device to 1280x720 if it supports it.

on pc... my monitor supports many resolutions... would be a simular effect.


edit: i could be wrong.... just having a friendly discussion and am curous myself

oh and interesting enough... 3d ends up getting some cuttoff on different devices with the same virtual resolution... does a percentage system work with 3d and would that fix it to look the same across multiple devices?

Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 21st May 2014 19:16 Edited at: 21st May 2014 19:24
Quote: "if i set a virtual resolution of 1280,720... agk will change the resolution of the android device to 1280x720 if it supports it."

No that's wrong. It boxes it in.
You can use the SetSpriteScissors(0,0,0,0) (I think) to show beyond the virtual resolution bounds, but then you still have to deal with your edges for floors/ceilings/walls being offset from the device edge.

Here's a quick mockup:


This is a great discussion. I see everyone here falling on to virtual resolution because it feels easier, but percentage is so easy, you just have to change your thinking a little.

I'm 99% sure that percentage works with 3D. It's been a while since I played with 3D, but when I did I'm certain it was using percentage / world coordinates. I just can't stand the letter boxing even if it is filled with a background image. I've played quite a few AppGameKit games that implement this method and they always look just a little wrong. They can still look pretty good, but you can tell they are off. I've also seen some that set a really high virtual resolution and the device will be a lower resolution which means that all the sprites get very small because you're trying to fit, say, 2048 width on a 1024 screen... that means all your sprites are half the size you want them to be!

Attachments

Login to view attachments
SoftMotion3D
AGK Developer
19
Years of Service
User Offline
Joined: 24th Aug 2005
Location: Calgary,Alberta
Posted: 22nd May 2014 02:01
humm...interesting...

thanks for the info!

Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 23rd May 2014 15:32 Edited at: 23rd May 2014 18:29
Thanks Naphier.

according to your script I can make easy Android games for all device with different resolution without any Problem? and automatic resize resolution for all devices?


Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 23rd May 2014 18:33

Yes. Also iOS. As you make the game it is important to test on the different aspect ratios. I usually just test 2:3 (800x1200), 3:4 (960x1280), and 9:16 (900x1600). You can do that just by changing the values in setup.agc

Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 23rd May 2014 21:17 Edited at: 23rd May 2014 21:20
Thanks for ios is good idead.

last question for good understand:
for change sprite width size is other device should use this code? or no?

Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 24th May 2014 00:57 Edited at: 24th May 2014 00:57
Let me try to explain with another illustration:



What you see here is how the calculations map out. Basically you design your images for a screen size of your choice. Mine is 800x1200. You then always use that width as your ratio for all images. So in the above illustration I made a box that is 200 pixels wide when I designed it in for an 800x1200 screen. So we know that it is always 25% of the screen's width. Now, when it shows on a 768x1024 screen it is also 25% of that screen's width, which means it is actually 192 pixels wide.

So how do we always do this easily? Simply design all the images on a screen mockup of 800x1200 or whatever you want as long as it is constant.
Put a constant, BASE_W = 800.0, in your code.
Now you simply load the sprite up like this:
img = LoadImage("my_image.png")
sprite = LoadSprite(img)
w# = 100.0 * GetImageWidth(img) / BASE_W
SetSpriteSize(sprite , w# , -1)

Tada! Always 25% of the screen width! No need to record values into the code, just use AppGameKit commands to pull the numbers and make sure to design images for all the same screen size.

Attachments

Login to view attachments
Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 24th May 2014 08:05 Edited at: 24th May 2014 09:23
Thank you very much Naphier.
I good Understand.

I want make a game for PC and Android And I think make Maquette for pc and that run on the windows and android devices with different resolution. This idea is Right?
Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 24th May 2014 09:50
Yup, no matter the screen size this will work and fill it up appropriately.
Feel free to shout if you get stuck or once you get in to it more things can get more advanced. Like using UI elements as "anchors" and forcing things to fit inside the screen for really odd resolutions.

Basically I just test lots of resolutions, wikipedia has a good list of resolutions for devices http://en.wikipedia.org/wiki/List_of_displays_by_pixel_density
. You just need to test the most narrow resolution and the most wide resolution to be sure everything fits well sometimes.
Basically if you test aspect ratios 4:3, 5:4, 16:9, and 16:10 you'll be completely safe with 99% of the market.

Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 24th May 2014 12:45
Thanks Naphier,You really helped me.
Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 28th May 2014 13:13
Resolution (1200 x 800) is the best Preferred for fit to all divices with all resolution?
Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 28th May 2014 21:25
It's really up to your own preference and doesn't matter as long as you design your images at a consistent resolution. That just happens to be the one I gravitate to because that's the resolution of my Nexus 7.

Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 29th May 2014 09:43
I want make commercial game for all devices. but I don't know what is big Resolution for Android Devices.
Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 29th May 2014 10:44
There's a Wikipedia link I gave a couple posts back. It lists ever major android device resolution.

JimHawkins
15
Years of Service
User Offline
Joined: 26th Jul 2009
Location: Hull - UK
Posted: 29th May 2014 10:50
They can be 320x240 up to 2560x1600

In actual fact the pixel density is just as important. Developer notes suggest having three sets of assets designed for low-ppi, medium-ppi and high-ppi. (An even higher definition exists!)

So - unless you change the size of your display - it's probably best to use 1200x800

-- Jim - When is there going to be a release?
Behdadsoft
15
Years of Service
User Offline
Joined: 7th Apr 2009
Location: Tehran-Iran
Posted: 29th May 2014 19:52
Thanks.
OK, I use 1200x800 for big Resolution.
Naphier
14
Years of Service
User Offline
Joined: 2nd Oct 2010
Location: St Petersburg, Florida
Posted: 29th May 2014 20:01
Yes, unfortunately since we have no commands to determine DPI we can't really anticipate the use of different image sizes. We could just make different sized sheets for varying resolutions, but that would be tough to really know when to use.

Login to post a reply

Server time is: 2024-11-25 05:20:54
Your offset time is: 2024-11-25 05:20:54