How are you doing your camera positioning? I've set up a system that works pretty well for me. The camera, or CamFocus object, will scroll smoothly to a position ahead of the Player object (Character). When it's moved within a certain range of the destination (between 39 and 41) I just snap it into the integer position "round( Character.X + 40 )". The player sprite itself is separate from the Character object and is always drawn at round(Character.X/Y) positions.
For a camera that's fixed to the player's position at all times, it should be enough to just set camera.x/y to round(player.x/y) and set sprite.x/y to round(player.x/y). If you need a catch-up camera like I do, there's an extra trick you can do that I'll describe below.
Couple of cave-ats with this tho'.
One:
I'm modifying C2's layout.js to make it render to a point-sampled texture. This way I get sharp pixels on integer positions, and interpolated pixels on float positions, even though I've got sampling set to linear in project settings. Only use if you don't mind modifying layout.js every time you update C2. As far as hacking into the official code goes, it's discouraged by Ashley for obvious reasons but this change is entirely cosmetic so I'm pretty much 100% sure it's not gonna break anything.
Two:
For a pixel-art game it's not perfect. Like I said, if you just fix the camera position to the player's movement you shouldn't even need to use it. But with a catch-up camera both the player sprite and other moving graphics will get blurred by interpolation until the camera has moved into position. I found that this doesn't look so bad; it's a temporary blur and everything's moving pretty fast so it's not all that noticable.
Three:
You need to use low-quality scaling with layout scale = 1 (default) for it to work. But since you're doing a pixel-art game that shouldn't be a problem.
If you want to try it out, back up layout.js in exporters/html5 and replace these lines:
Line 540 (inside Layout.prototype.draw = function (ctx)):
[quote:jiim5lbr]
if (ctx_changed)
{
layout_ctx["webkitImageSmoothingEnabled"] = this.runtime.linearSampling;
layout_ctx["mozImageSmoothingEnabled"] = this.runtime.linearSampling;
layout_ctx["msImageSmoothingEnabled"] = this.runtime.linearSampling;
layout_ctx["imageSmoothingEnabled"] = this.runtime.linearSampling;
}
... with these:
[quote:jiim5lbr]
if (ctx_changed)
{
// ErekT mod:
layout_ctx["webkitImageSmoothingEnabled"] = this.runtime.pointSampling;
layout_ctx["mozImageSmoothingEnabled"] = this.runtime.pointSampling;
layout_ctx["msImageSmoothingEnabled"] = this.runtime.pointSampling;
layout_ctx["imageSmoothingEnabled"] = this.runtime.pointSampling;
}
And these lines:
Line 584 (inside Layout.prototype.drawGL = function (glw))
[quote:jiim5lbr]
if (render_to_texture)
{
// Need another canvas to render to. Ensure it is created.
if (!this.runtime.layout_tex)
{
this.runtime.layout_tex = glw.createEmptyTexture(this.runtime.draw_width, this.runtime.draw_height, this.runtime.linearSampling);
}
// Window size has changed (browser fullscreen mode)
if (this.runtime.layout_tex.c2width !== this.runtime.draw_width || this.runtime.layout_tex.c2height !== this.runtime.draw_height)
{
glw.deleteTexture(this.runtime.layout_tex);
this.runtime.layout_tex = glw.createEmptyTexture(this.runtime.draw_width, this.runtime.draw_height, this.runtime.linearSampling);
}
... with these:
[quote:jiim5lbr]
if (render_to_texture)
{
// Need another canvas to render to. Ensure it is created.
if (!this.runtime.layout_tex)
{
// ErekT mod
this.runtime.layout_tex = glw.createEmptyTexture(this.runtime.draw_width, this.runtime.draw_height, this.runtime.pointSampling);
}
// Window size has changed (browser fullscreen mode)
if (this.runtime.layout_tex.c2width !== this.runtime.draw_width || this.runtime.layout_tex.c2height !== this.runtime.draw_height)
{
glw.deleteTexture(this.runtime.layout_tex);
// ErekT mod
this.runtime.layout_tex = glw.createEmptyTexture(this.runtime.draw_width, this.runtime.draw_height, this.runtime.pointSampling);
}
Then restart C2. Good to go.
A bonus you get with this is the ability to turn point-sampling on/off during runtime. Just increase layout scale or turn on high-quality scaling to enable linear sampling. It looks exactly the same as with vanilla C2 as far as I can tell.