Flickering Issue with Custom Rounded Control in a FlowLayoutPanel in Winformapp

Question

I'm working on a WinForms application that dynamically loads multiple instances of a custom Component, PicturePanel, into a FlowLayoutPanel (PicCompContainer). Each PicturePanel consists of several nested custom controls, including a RoundedControl and standard controls like PictureBox and Label, arranged to display puzzle pieces (this application is a project for middle school). The application experiences significant flickering when scrolling through the FlowLayoutPanel, especially when it contains a substantial number of PicturePanel instances (e.g., 18 or more). It is like it can't load the picturepanels that fast, because if I scroll slowly, it is not that visible, but when I go fast there are "lines" in it:

While scrolling Normal

Main Form Initialization (Simplified):

public PuzzleSelectorForm(FormRouter formRouter)
{
    InitializeComponent();
    // Set double buffering for flowLayoutPanel2 to reduce flickering
    SetDoubleBuffer(flowLayoutPanel2, true);
    // Dynamically add PicturePanels based on image selection logic
    foreach (var item in SelectImagesFromFile())
    {
        PicturePanelCreator pcc = new PicturePanelCreator(formRouter,item);
        PicCompContainer.Controls.Add(pcc.CreatePP());
    }
}

Custom Control Initialization (Simplified):

public PicturePanel(...) { InitializeComponent(); ApplySettings(); // Setup control based on PuzzleInfo // Attempt to reduce flickering this.DoubleBuffered = true; SetStyle(ControlStyles.OptimizedDoubleBuffer, true); } Despite setting DoubleBuffered to true and using ControlStyles.OptimizedDoubleBuffer, the flickering persists. I have also attempted to enable double buffering on the FlowLayoutPanel itself and within the custom controls, but the issue remains unresolved.

What are effective strategies to minimize or eliminate flickering for a FlowLayoutPanel that contains a large number of complex custom controls in WinForms? Are there any common pitfalls or considerations specific to nested custom controls that might exacerbate the flickering problem? Is there a more optimized way to structure or render these custom controls to improve performance and reduce flickering? Any insights, code examples, or references to best practices for managing complex UIs in WinForms would be greatly appreciated.

Double Buffering: I enabled double buffering on the FlowLayoutPanel and the custom PicturePanel control by setting the DoubleBuffered property to true and applying ControlStyles.OptimizedDoubleBuffer.

Expected: I expected this to significantly reduce or eliminate flickering when scrolling through the FlowLayoutPanel filled with custom controls.

Result: The flickering persisted, especially noticeable when the FlowLayoutPanel contained a large number of PicturePanel instances.

Optimizing Custom Control Rendering: In my custom PicturePanel control, I attempted to minimize operations in the OnPaint method to streamline drawing and reduce overhead.

Expected: By simplifying and optimizing the rendering logic, I hoped to lessen the flicker during repaints triggered by scrolling.

Result: While performance may have slightly improved, the flickering issue remained largely unaddressed.

Nested Controls and Layout Suspend/Resume: For the dynamic addition of PicturePanel instances to the FlowLayoutPanel, I tried surrounding the loop that adds the controls with SuspendLayout() and ResumeLayout(false) calls.

Expected: This approach was supposed to minimize layout recalculations and thus reduce flickering during the initial display.

Result: Initial loading seemed smoother, but scrolling through the loaded controls still resulted in noticeable flickering.