Wie behebe ich visuelle Artefakte in einem zoombaren UserControl mit abgerundeten Ecken und einem farbigen Rand?

So vermeiden Sie visuelle Artefakte. Rand eines zoombaren Benutzersteuerelements mit abgerundeten Ecken

Problem:

Beim Verkleinern eines Benutzersteuerelements mit abgerundeten Ecken und einem farbigen Rand Rand, die rechte Seite des Randes wird unsichtbar. Außerdem erscheinen beim Vergrößern auf der rechten Seite mehrere gelbe Ränder.

Anfangscode Auszüge:

Form1.Designer.cs

trackBar1.Value = 100;
BackColor = Color.Gray;

Form1.cs

private void trackBar1_Scroll(object sender, EventArgs e)
{
    UserControl11.SetZoomFactor(trackBar1.Value / 100F);
}

UserControl1.cs

// Properties, constructors, and event handlers omitted for brevity

internal GraphicsPath GraphicsPathWithBorder;

internal void SetZoomFactor(float z)
{
    Width = (int)(MyBaseWidth * z);

    GraphicsPathWithBorder = RoundedCornerRectangle(ClientRectangle);
    Region = new Region(GraphicsPathWithBorder);
}

Lösung:

An Wenn Sie sich mit den Artefakten befassen, werden die folgenden Empfehlungen ausgesprochen:

1. Verwenden Sie einen Bereich für das Steuerelement: Definieren Sie einen Bereich, der bestimmt, welcher Teil des Steuerelements gezeichnet werden soll. Dieser Bereich sollte etwas kleiner als die Grenzen des Steuerelements sein, um Anti-Aliasing beizubehalten.
2. Wenden Sie eine Skalierungs- und Übersetzungsmatrix an: Implementieren Sie eine Skalierungsmatrix und eine Übersetzungsmatrix, um die Grenzen des Bereichs zu skalieren und zu verschieben das Innere der Kontrollregion. Es wird entsprechend der Stiftgröße skaliert und übersetzt.
3. Legen Sie einen transparenten Hintergrund fest:Stellen Sie die Hintergrundfarbe des Steuerelements auf „Transparent“, sodass die Farbe des umgebenden Bereichs durchscheinen kann.

Aktualisierter Code:

public partial class RoundControl : UserControl
{
    // Properties, constructors, and event handlers omitted for brevity

    protected override void OnPaint(PaintEventArgs e)
    {
        e.Graphics.SmoothingMode = SmoothingMode.AntiAlias;
        RectangleF rect = GraphicsPathWithBorder.GetBounds();
        float scaleX = 1 - ((m_PenSize + 1) / rect.Width);
        float scaleY = 1 - ((m_PenSize + 1) / rect.Height);
        using (Pen pen = new Pen(m_BorderColor, m_PenSize))
        using (Brush brush = new SolidBrush(m_FillColor))
        using (Matrix mx = new Matrix(scaleX, 0, 0, scaleY, pen.Width / 2, pen.Width / 2))
        {
            e.Graphics.Transform = mx;
            e.Graphics.FillPath(brush, GraphicsPathWithBorder);
            e.Graphics.DrawPath(pen, GraphicsPathWithBorder);
        }
        base.OnPaint(e);
    }
}

Ergebnisse:

Der aktualisierte Code Snippet verhindert erfolgreich die visuellen Artefakte, die durch den farbigen Rand des zoombaren UserControl mit abgerundeten Ecken verursacht werden. Der modifizierte Bereich mit angewendeter Skalierungs- und Übersetzungsmatrix gewährleistet Anti-Aliasing-Ränder bei allen Zoomstufen.

Das obige ist der detaillierte Inhalt vonWie behebe ich visuelle Artefakte in einem zoombaren UserControl mit abgerundeten Ecken und einem farbigen Rand?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!