Hmm, okay I guess I misunderstood how this works. Thanks for the heads-up. Is there any way to control this so that switching produces a consistent fullscreen stretch size for the integer scale setting? For instance using events to query device resolution and adjust canvas/layout size according to that?

Link to .capx file (required!):

dl.dropboxusercontent.com/u/70562654/CanvasSizeBugRep.capx

Steps to reproduce:

1. Set your screen resolution to any of these:

1024x768

1152x864

1280x1024

1366x768

1600x900

1920x1200

2. Press keyboard key '6' to switch between mode 1: canvas size 340x236/layout scale 1.0 high quality scale, mode 2: 680x472/layout scale 2.0 low quality scale, and mode 3: 340x236/layout scale 1.0 low quality scale

Observed result:

Mode 2: Canvas size 680x472/layout scale 2.0 doesn't stretch to fill the screen, instead it stretches one increment lower (2x instead of 3x). Doesn't happen with all screen resolutions. 1600x1024 and 1600x1200 for instance, will stretch correctly.

Expected result:

Mode 2 should stretch to fill the screen the same way mode 1 and mode 3 do.

Browsers affected:

Chrome: yes/no

Firefox: yes/no

Internet Explorer: yes/no

Operating system & service pack:

Windows 7 64-bit Home Premium Service pack 1

Construct 2 version:

    R156

I've encountered a problem with the new 'Set Canvas Size' and low quality fullscreen scaling functionality in r156. I'm assuming that it works by setting the pre-stretch render scale with the layout scale expression? This works fine for regular letterbox scale but I get inconsistent results when I try to use it with letterbox integer scale.

For instance, multiplying game resolution 340x236 with 3 gives 1020x708 which is a close match to a target screen resolution of 1024x768. So for screenres 1024x768 the Letterbox Integer Scale will multiply the game resolution with 3. All good. But for some reason, it won't do the same if I set canvas size to 680x472 and layout scale to 2.0, or anything above 552x384 really. In that case, it'll stretch everything up to 2x size instead of 3x. However if I run a higher screen resolution like 1600x1200 both settings get scaled up to 4x.

Is this a bug? It doesn't happen at all with regular Letterbox Scale.

Screen resolutions that stretch canvas size 340x236/680x472 with layout scale 1.0/2.0 to the same size:

1600x1024

1600x1200

1920x1080

Screen resolutions that stretch canvas size 680x472 with layout scale 2.0 one increment less than they should (for instance 3x when it should be 4x):

1024x768

1152x864

1280x1024

1366x768

1600x900

1920x1200

Hope my explanation is clear here :P

mean, if Ashley told the paid license holders "you need to pay a yearly fee of ?20 or ?30 for the personal license upgrades", but this would allow Scirra to employ additional programmer (s) - how many of you would say "we'll be more than happy to do it"? I would.

I might. But overall I think it would hurt revenue more than it would help. Just a gut feeling. Lots of hobbyists that are attracted to C2 as-is would run away.

Hmm, isn't hqx under the GPL license? That could make it tough to include. But there are other interpolation filters around that are (imo) better than hqx. Here's one:

wayofthepixel.net/index.php

I think the source is in there somewhere? Best ask permission to use it of course..

Very cool! I'd maybe ditch the red gloves to differentiate him more from the Streets of Rage-series? Regardless, look forward to seeing more :)

Unfortunately 1X scale doesn't always cut it. For instance, objects can look very blurry when they get rendered at non-integer coordinates. While pixel rounding fixes that, it also introduces (comparably) choppy background scrolling as well as jittery sprite movement in some cases. Higher resolution settings would reduce the blur and still boost performance compared to maximum render scale.

Thanks, I've managed to implement it in a separate plugin for canvas2d and (sorta) for webgl. Only the last renderpass seems to be affected by the way I'm doing it, which is actually perfect for low quality scaling.

Alright then. So is any of this achievable through a custom plugin?

Okay, this kinda flies right in the face of the 'Please don't adjust official plugins' sticky Ashley has posted here, so apologies for that. I'd love to be able to add this stuff into a separate plugin somehow but since my changes rely on bypassing some official code I don't think it's possible. So if anyone wants to use this for their own projects you're completely welcome to of course, just know you'll be hacking into official code and you'll need to edit layout.js and preview.js whenever you update C2. Not ideal but a working solution at least for those who really need it.

I've been wanting a couple of graphics settings for C2 for some time, and one of them is the ability to toggle bilinear filtering on and off during runtime. I got this working now for both canvas2d and webgl. The toggle is tied to the high/low-quality fullscreen scaling setting, and for webgl it will only go into effect if no webgl effects are active. This shouldn't be hard to fix, tho I'm not so sure how good non-filtered rendering effects would end up looking. It also pretty much necessitates that pixel rounding is turned on, otherwise objects might draw at non-integer positions and look blurry/bad.

Here are the changes I made for those interested.

In 'layout.js' at line 537 change this:

// 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);

}

... to this:

// 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.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);

     this.runtime.layout_tex = glw.createEmptyTexture(this.runtime.draw_width, this.runtime.draw_height, this.runtime.pointSampling);

}

And in 'preview.js' at line 728 change this:

// Re-apply the image smoothing property, since resizing the canvas resets its state

this.ctx["webkitImageSmoothingEnabled"] = this.linearSampling;

this.ctx["mozImageSmoothingEnabled"] = this.linearSampling;

this.ctx["msImageSmoothingEnabled"] = this.linearSampling;

this.ctx["imageSmoothingEnabled"] = this.linearSampling;

... to this:

// Re-apply the image smoothing property, since resizing the canvas resets its state

if (!this.fullscreenScalingQuality)

{

     this.ctx["webkitImageSmoothingEnabled"] = this.pointSampling;

     this.ctx["mozImageSmoothingEnabled"] = this.pointSampling;

     this.ctx["msImageSmoothingEnabled"] = this.pointSampling;

     this.ctx["imageSmoothingEnabled"] = this.pointSampling;

}

else

{

     this.ctx["webkitImageSmoothingEnabled"] = this.linearSampling;

     this.ctx["mozImageSmoothingEnabled"] = this.linearSampling;

     this.ctx["msImageSmoothingEnabled"] = this.linearSampling;

     this.ctx["imageSmoothingEnabled"] = this.linearSampling;

}

The other thing I want to do is much harder, and I'm not sure I have the brains for it :P I'd like to force the low-quality fullscreen scaling to draw everything at 2X scale before stretching to fullscreen instead of the 1X scale it uses now. But just changing this.runtime.draw_width/height to this.runtime.original_width/height * 2 in preview.js' Runtime.prototype["setSize"] function doesn't work. First off, it only seems to change the render scale after all the post-processing effects have already been applied. Second, draw_width/height don't behave like I expected them to. To scale up, I need to divide them by a number larger than 1 and there doesn't seem to be a 1:1 relationship between draw_width/height and pixel resolution either. Setting draw_width to original_width / 2 gets me 3X scale for instance. I guess I'll need to poke around inside the renderEffectChain function and the whatnot at some point. But it would be much easier to experiment if I knew exactly what kind of values draw_width/height represent. So, does anyone know how these values work? I'd really appreciate the help :o)

Hello.

I'd like to get into writing plugins for C2 and I wonder if there's an extensive documentation or list of commands specific to C2? The SDK reference seems pretty bare-bones at the moment and I'm unable to find a description for things like QuadTex or QuadTexUV for instance. Maybe I'm just looking in the wrong place though?

DrewMelton

Unfortunately no. You can't get pixel-perfect upscaling without scaling to integer values. That's just the way LCD screen technology and C2 works. Sucks for pixel art because it tends to look cack with any distortion/interpolation going on.