Unwanted Space and Margins are surrounding the control in designer when Integrating WPF User-Control into Form using ElementHost

Question

When integrating the WPF user-control (For Example: The UserControl contains the button) into a form using ElementHost, there are unwanted spaces and margins surrounding the control in the designer. It works fine in runtime; reported issue is reproduced only in design time. How can I remove the space and margins surrounding the control in the form's designer.

It works fine in runtime; reported issue is reproduced only in design time.

private void InitializeComponent()         
{             
this.elementHost1 = new System.Windows.Forms.Integration.ElementHost();             this.userControl11 = new WindowsFormsApp1.UserControl1();             this.SuspendLayout();             
this.elementHost1.Location = new System.Drawing.Point(146, 95);             this.elementHost1.Name = "elementHost1";             this.elementHost1.Size = new System.Drawing.Size(200, 100);             this.elementHost1.TabIndex = 0;             
this.elementHost1.Text = "elementHost1";             this.elementHost1.Child = this.userControl11;             this.AutoScaleDimensions = new System.Drawing.SizeF(9F, 20F);             this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;             this.ClientSize = new System.Drawing.Size(800, 450);             this.Controls.Add(this.elementHost1);             
this.Name = "Form1";             
this.Text = "Form1";             
this.ResumeLayout(false);          
} 

Answer 1

Hi,@ bagavathi basker.Welcome Microsoft Q&A.

You could add controls ElementHost and UserControl1 in Form.cs.

 public partial class Form1 : Form
    {
        ElementHost elementHost1;
        UserControl1 userControl11;
        public Form1()
        {
            InitializeComponent();

            this.elementHost1 = new System.Windows.Forms.Integration.ElementHost();
            this.userControl11 = new UserControl1();
            this.SuspendLayout();
            this.elementHost1.Location = new System.Drawing.Point(146, 95);
            this.elementHost1.Name = "elementHost1";
            this.elementHost1.Size = new System.Drawing.Size(200, 100);
            this.elementHost1.TabIndex = 0;
            this.elementHost1.Text = "elementHost1";
            this.elementHost1.Child = this.userControl11;
            this.AutoScaleDimensions = new System.Drawing.SizeF(9F, 20F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.ClientSize = new System.Drawing.Size(800, 450);
            this.Controls.Add(this.elementHost1);
            this.Name = "Form1";
            this.Text = "Form1";
            this.ResumeLayout(false);
        }
    }

UserControl1:

<StackPanel>
        <TextBlock Text="hello" Width="100" Height="40" Background="AliceBlue"/>
        <Button Content="hello" Width="100" Height="40" Background="AliceBlue"/>
    </StackPanel>

The result:

---

If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.