How do I fix this graphics issue?

Get help using Construct 2

Post » Sun Jul 26, 2015 9:58 am

Hello everyone, I'm new here. Been using Construct 2 Business for the last few months and I love it.

Up until now I've mostly been doing layout tests and programming things, and only recently started implementing graphics. I noticed though that I'm experiencing some problems with the borders of the PNGs inside the program. Nothing I've looked up so far has helped me solve the problem. Please have a look at the image below.

Image

Almost every graphic I implement as a sprite gets a little transparent border around the edge which makes it look like the images are torn. Also, every time I create a tiled background there's a little 1 pixel border that appears on the top or the side looping the other side of the graphic.

I've been trying to solve this for the last day and I'm getting a bit frustrated. If anyone can help it would be very appreciated! Thank you.
B
5
Posts: 7
Reputation: 235

Post » Sun Jul 26, 2015 10:03 am

A few simple questions to help with answering yours:

When is this happening?
Are the sprites scaled in preview?
What program are you using to create your sprites?
Is the transparent border present within the image editor?
I told my dentist I had trouble with my teeth and asked her to fix it without looking in my mouth..
B
54
S
16
G
8
Posts: 6,160
Reputation: 19,775

Post » Sun Jul 26, 2015 10:20 am

I'm using Adobe Photoshop CS5.

This happens inside both the Construct 2 layout editor and when I play the game. It does not happen inside Photoshop or inside the edit image window in Construct 2. The transparent border does not appear in either of those.
B
5
Posts: 7
Reputation: 235

Post » Sun Jul 26, 2015 10:34 am

One thing I can think of is that your sprites might not be at precise pixel-location (or scaled to cover less than a pixel)..

If the sprite is at x=201.5 instead of 201 half a pixel would be covered by and as such a semi-transparent line would be created..

You could avoid this by either placing the sprites on their exact locations or changing the sampling to point instead of linear and or turning pixelrounding on in the project properties..

If this is not the case I guess seeing your capx/sprites would be the only option to see what's going on..
BTW - is your tiled background a power of 2?
I told my dentist I had trouble with my teeth and asked her to fix it without looking in my mouth..
B
54
S
16
G
8
Posts: 6,160
Reputation: 19,775

Post » Sun Jul 26, 2015 10:41 am

The positions are exact and not at 0.5.

There are tiled backgrounds with both a power of 2 and those that don't follow that and this happens to both of them. I have the grid set up that each tile is 32 x 32 and placing/dragging objects is snapped at 16, and all tiled graphics are divisible by 32.

I think this might be a problem with how the images are saved. PNGs often have this sort of problem and I think I encountered it one time a long time ago in RPG Maker and I forget how I fixed it. The odd thing about it though is that in the image editors there is no such border.
B
5
Posts: 7
Reputation: 235

Post » Sun Jul 26, 2015 10:48 am

You might want to try using the crop tool inside the image editor, I just remembered some people saying it helps..
I told my dentist I had trouble with my teeth and asked her to fix it without looking in my mouth..
B
54
S
16
G
8
Posts: 6,160
Reputation: 19,775

Post » Sun Jul 26, 2015 11:10 am

Here's a quick .capx I created to show what I'm talking about. The corner sprite does not connect completely with the tiled bg to the left of it due to a semi transparent pixel edge.

The spikes on the bottom have a really tiny line on the top where the bottom loops around. Although that image is not a power of 2, the exact same thing happens to power of 2 tiles.

Edit: It's not letting me post a URL to the download????

Edit 2: Won't let me send PMs either. Great...

Well here you can enter the URL stuff into the address bar I guess. dropbox.com/s/3zbhlwtulwjfhbx/spriteproblem.capx?dl=0
B
5
Posts: 7
Reputation: 235

Post » Sun Jul 26, 2015 11:44 am

And yeah I also tried using the crop tool and it didn't do anything. Try taking a look at the download above and see if you can figure out what I mean.
B
5
Posts: 7
Reputation: 235

Post » Sat Aug 01, 2015 2:56 am

I have the same issue at the moment when using tiled backgrounds, in my case I move the tiled backgrounds with 64pix/sec and it flash a ugly border.

When I use the same image but then lay them one by one at a grid you wont see a flashy border when moving.

Image don't have any transparency in the image editor either.

Think the issue has to do with how the tiled background is rendered in construct.

Hope that Ashley want to take a look at this problem.
B
46
S
9
G
5
Posts: 110
Reputation: 3,782


Return to How do I....?

Who is online

Users browsing this forum: lukewasthefish and 14 guests