Pixel scaling drawn shapes

[alexo]

Thanks so much for the suggestions. After some additional research I did try these settings along with various other options. Below is the code I have that illustrates what I have tried and a screenshot of the result. As I noted I would hope to only see crisp single line pixels without any aliasing. Additionally I assume this isn’t the most optimal way to do this, especially if I need to do this multiple times per second.

I have tried various combinations of adding 0.5 at various points but it only seems to work sporadically depending on the positions of the line and rect. My issues might also be related to the post I saw yesterday.

Fuzzy lines drawn in Cairo

A 1 pixel thick line drawn by Cairo with integer coordinates, instead of appearing crisp and solid, appears 2 pixels thick and blurry. I found an old blog post explaining the problem here: Why are all my lines fuzzy in cairo? It suggests adding 0.5 to all coordinates drawn by Cairo, but this is not ideal. I tried this with a basic program that draws a grid of lines, I added 0.5 to the coordinates and the lines appeared solid and 1 pixel thick, but with dynamic scaling you get a really bad sid…

        this.stage.scaleMode = NO_SCALE;
        this.stage.align = TOP_LEFT;
        this.scaleX = 3;
        this.scaleY = 3;

        var s1 = new Sprite();
        s1.cacheAsBitmap = true;
        s1.scaleX = 3;
        s1.scaleY = 3;

        s1.graphics.lineStyle(1, 0x990000, true, NONE, NONE);
        s1.graphics.moveTo(ray0.start.x + 0.5, ray0.start.y + 0.5);
        s1.graphics.lineTo(ray0.end.x, ray0.end.y);

        s1.graphics.lineStyle(1, 0x3b00a9, true, NONE, NONE);
        s1.graphics.drawRect(box.x, box.y, box.w, box.h);

        var bd1 = new BitmapData(100, 100);
        bd1.draw(s1);

        var b1 = new Bitmap(bd1);
        b1.smoothing = false;
        b1.pixelSnapping = ALWAYS;
        this.addChild(b1);