960x640 image to edges

Graybay

I made a 960x640 image and dropped it in gamesalad. I placed it perfectly centered in the gameplay area, GS sizes it to 480x320 to accommodate retina. However it leaves slight gaps at the right and top edges of screen where you can see anything behind the image.

If I make an actor with no image, and place it in the exact same spot it fits the screen perfectly.

Is there a quick fix for this?

Thanks!

ozboybrian

Maybe you have a slight bit of transparency in your main image?

Note: You can nudge objects around with your arrow keys. (Which you probably know already)

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Support Fabled Apps!

Please LIKE Fabled Apps on Facebook.

Please Subscribe to Fabled Apps on YouTube.

aario

I get this too sometimes. What I do is just offset the camera by -1 and that fixes it. I've also found that sometimes it just stops happening randomly in which case you readjust the camera and pretend nothing ever happened

Graybay

Thanks for replying ozboybrian, There is no transparency in the image.

I made a test scene to show you what I mean, just hit preview and you will notice the red background showing through. It gives the same result in the creator and the viewer.

http://www.mediafire.com/?grh3yvphe2xe8gd

@aario: I tried offsetting the camera origin x and y by -1, but some red still shows through. Thanks for the tip though, it is a little better when the camera is not following anything.

aario

@Graybay The -1 number was arbitrary. I usually adjust it until it fits perfectly, both horizontally and vertically. Play around with it a little, its way safer to move the camera origin then to start moving all your actors around.

EDIT: I just tested the file you uploaded, an offset of -1 for both x and y corrected the issue on both the creator and the device. Hope that helps

Graybay

No luck with that, it worked on my test scene but that was likely because the camera wasn't following anything or moving. It didn't work on my actual project so it seems situational for me.

Thanks for testing it out aario!

EDIT: I've decided to go with 968x648 images. If anyone has any other suggestions I would still love to hear them though.

aario

No problem. Goodluck with your game!

gyroscope

Hi Graybay, just a thought: if you use Photoshop, maybe you're not using Save to Web, or Save to Web and Devices? (Depending on your PS version). Save a PNG rather than psd or jpeg and check the resolution is exactly 72ppi: sometimes (though I'm not exactly sure when the following happens) the dpi is 72.025 or something. Might help out...


----------------------------------------------
http://davidgriffinapps.co.uk/

T8TRG8TR

This happened to me and I moved it .5 over towards the direction where the gap was. It worked for me!

gyroscope

Hi T8... the only thing about that is that if your image is properly on even numbers for x and y, moving it over by .5 could cause blurring... but hey, if it's worked for you...!

Clouds

Did you work in Photoshop at a higher resolution . . . . With layers . . . . And then scale down to the final size ?

tutyses

I have the same problem and i do scale down my images on photoshop from a higher resolution image, whats the problen with that?

Clouds

@tutyses

"I have the same problem and i do scale down my images on photoshop from a higher resolution image, whats the problen with that?"

In theory if you have a Photoshop document . . . and it is a layer (rather than a flattened 'background') and you scale it down, then you are effectively interpolating the documents actual edge pixels against 'nothing' (the 'area' off the document) so (depending on the maths) in the overwhelming majority of cases the edge pixels 'must' be at least partially transparent . . . not sure if I have explained that very clearly . . . . in fact before I make an idiot of myself and get this totally wrong let me find a computer with Photoshop on and try it out . . . . .

Clouds

Yep, make a Photoshop image . . . make sure it's solid right up to the edges . . . make sure it's a layer, scale it down - then zoom in on one of the edges, you should be able to see that the edge is now at least partially transparent - as it has taken half of it's interpolation value from a non-existant part of the image.

Cure: flatten image before scaling down.
Remedy for images already scaled: cut and paste the whole image onto itself two or three times - then flatten - this will get rid of the transparency.

This issue certainly exists, but that's not to say it is the issue Graybay is experiencing (although it might be).

921creative

Another solution is to make your image about 5 or so pixels wider and taller than it needs to be, then just center it in the screen.

Clouds

@921Creative
Another solution is to make your image about 5 or so pixels wider and taller than it needs to be, then just center it in the screen.

Nooooooo !

: )

Make sure it is an extra 4 pixels or 6 pixels, but never 5 (odd numbers = soft images)

Graybay

I believe 4 or 8 are good, but 6 will not work since it will result in a number that can't be divided in half into an even number. Which will also result in a fuzzy image also.

I went with 8 and everything is running nicely now.

Clouds

@Graybay

"I believe 4 or 8 are good, but 6 will not work since it will result in a number that can't be divided in half into an even number."

140 pixel wide image would become a 146 pixel wide image . . . . . a 200 pixel wide image would become a 206 pixel wide image . . . . . a 42 pixel wide image would become a 48 pixel wide image . . . . etc.

ie: 6 is fine !

An image doesn't have to divide into an even number to avoid the 'soft image' issue, it only needs to be an even number. If it did need to be an even number and be able to be divided in half into two even numbers - then exactly 75% of all numbers would be off limits !

Graybay

Are you certain? 146/2 = 73 pixels (nogood) 206/2 = 103 pixels (nogood). Anyways that's what I understood from the art optimization video. Is this only if you are working with retina graphics?

Ferin

@Graybay, i'm not an expert but maybe it's only issue that Creator has with displaying certain images, since when i've tried 'web preview' and then 'launch in safari/chrome/firefox' the red bit is not there.

Graybay

@Ferin Thanks for the info, unfortunately the issue shows in the viewer also.

LumpApps

Select the image. Press on right arrow once, then on up arrow once.
That will work fine.

Cheers!

Clouds

@Graybay

"Are you certain? 146/2 = 73 pixels (nogood) 206/2 = 103 pixels (nogood). Anyways that's what I understood from the art optimization video. Is this only if you are working with retina graphics?"

I don't know about about Retina to be honest, but the general rule is to make images divisible by two (rather than needing to be divisible by two the resultant parts to be divisible by two as well).
This issue is not exclusive to Gamesalad, it is true of all sorts of applications from Dreamweaver to After Effects - and for as long as I can remember.