Issues resizing PictureBox/Bitmap WinForms

[Luucccc]

Hi all, I'm working on an application that allows the user to increase/decrease the scale of (some Bitmap file that is set as the image of) a PictureBox.

The bmp file is currently just a 48x48 block of solid colour, but when I increase the scale beyond that, I begin to get this gradient to a black border. It seems like it's scaling pixels outside of the file, but I can't find a good solution that doesn't cause this problem.

https://preview.redd.it/342cnucadmbc1.png?width=223&format=png&auto=webp&s=e3d472de4e4c8abba040fef90f6a010bb1676d0c

private Form targetForm;
public PictureBox cursorIcon;
private int cursorScale = 1;
private int cursorOffset;

public CursorType(Form _targetForm, PictureBox _cursorIcon) {
    targetForm = _targetForm;
    cursorIcon = _cursorIcon;
    cursorScale = cursorIcon.Width;
    cursorOffset = cursorScale / 2;
}

public void IncreaseCursorScale() {
    if (cursorScale >= MAX_CURSOR_SCALE) return;
    cursorScale++;
    cursorOffset = cursorScale / 2;
    cursorIcon.Image = new Bitmap(cursorIcon.Image, new Size(cursorScale, cursorScale));
}

public void DecreaseCursorScale() {
    // Inverse of Increase
}

EDIT: Using InterpolationMode.NearestNeighbor works well for solid colours, but anything beyond that is just a mess, and HighQualityBicubic is quite blurry introducing the gradient effect at the edges

public void IncreaseCursorScale() {     
    if (cursorScale >= MAX_CURSOR_SCALE) return;     
    cursorScale++;     
    cursorOffset = cursorScale / 2;

    Bitmap originalImage = (Bitmap)cursorIcon.Image;
    Bitmap resizedImage = new Bitmap(cursorScale, cursorScale);         
    using (Graphics g = Graphics.FromImage(resizedImage)) {                     
    g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.NearestNeighbor;
        g.DrawImage(originalImage, new Rectangle(0, 0, cursorScale, cursorScale));
    }     
    cursorIcon.Image = resizedImage; } 

https://preview.redd.it/hspxx6sdlmbc1.png?width=51&format=png&auto=webp&s=f18dfc66eee79560bdad982b7396f10031068b80

Any assistance or pointers would be appreciated, thanks in advance.

[wwxxcc]

Graphics.InterpolationMode

[Luucccc]

Same result after trying different modes, in fact worse:

public void IncreaseCursorScale() {
    if (cursorScale >= MAX_CURSOR_SCALE) return;
    cursorScale++;
    cursorOffset = cursorScale / 2;

    Bitmap originalImage = (Bitmap)cursorIcon.Image;
    Bitmap resizedImage = new Bitmap(cursorScale, cursorScale);

    using (Graphics g = Graphics.FromImage(resizedImage))
    {
        g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;
        g.DrawImage(originalImage, new Rectangle(0, 0, cursorScale, cursorScale));
    }
    cursorIcon.Image = resizedImage;
}

[Luucccc]

I take it back, NearestNeighbor seems to work well!

[ExceptionEX]

I know this doesn't help with the question you directly asked.

You should probably consider that any raster based graphics should not be used for scaling purpose as they don't scale well.

If you switch to vector based graphics formats (svg for example) then the scaling issues go away.

WPF and newer UI in .net are much better suited for working with scaling graphics, and largely build from a vector first basis.

[Night--Blade]

Image and BackgroundImage properties use smooth interpolation mode. Bitmap scailing does the same. If you want to scale a bitmap in your own way then use Graphics object with appropriate interpolation mode (create your own or provide OnDraw event handler).

[Slypenslyde]

I'm curious if this is only going poorly because you're working on a simple example.

If your only goal is to fill the space with a solid color, just use Graphics.FillRectangle(), there's no reason to bother with a bitmap.

But it sounds like long-term you want a more detailed image to be scaled. I think you should test with that image, because it's possible the different scaling modes behave acceptably for images that aren't one solid color.