Position of controls on different computers - vb.net

Question

I have a form with a tab control. Above it, there are lables, combo boxes and text boxes.
On the development machine, it works fine but on other machines, where resolution is different, the position of the controls is changed. Somewhere combo box overlaps the tab control, somewhere text boxes and lables are not aligned with each other.
How to set it so that my application maintains the shape no matter what resolution it is.
I tried AutoScaleMode to dpi, inherit etc. but nothing worked.
Thanks

Answer 1

I always use layout panels, particularly the TableLayoutPanel. For any row that contains a ComboBox or TextBox, I set the row's height to AutoSize. Similarly, a Label goes in an AutoSize column. Your TabPanel can span across several columns. In columns with set sizes (Absolute or Percent), set the child control's Anchor to Left & Right to fill the entire column.
Not only does the screen resolution change things, but the DPI. DPI is a Windows setting that enlarges all controls, useful on monitors with fine pixels rather than chunky pixels. With AutoSize, the controls can automatically enlarge, then
Copy and paste this code into Form1.Designer.vb for an example. Take note of the Anchor property of each control, and the size settings for each row and column.
<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _
Partial Class Form1
Inherits System.Windows.Forms.Form
'Form overrides dispose to clean up the component list.
<System.Diagnostics.DebuggerNonUserCode()> _
Protected Overrides Sub Dispose(ByVal disposing As Boolean)
Try
If disposing AndAlso components IsNot Nothing Then
components.Dispose()
End If
Finally
MyBase.Dispose(disposing)
End Try
End Sub
'Required by the Windows Form Designer
Private components As System.ComponentModel.IContainer
'NOTE: The following procedure is required by the Windows Form Designer
'It can be modified using the Windows Form Designer.
'Do not modify it using the code editor.
<System.Diagnostics.DebuggerStepThrough()> _
Private Sub InitializeComponent()
Me.TableLayoutPanel1 = New System.Windows.Forms.TableLayoutPanel()
Me.Label1 = New System.Windows.Forms.Label()
Me.ComboBox1 = New System.Windows.Forms.ComboBox()
Me.Label2 = New System.Windows.Forms.Label()
Me.TextBox1 = New System.Windows.Forms.TextBox()
Me.TabControl1 = New System.Windows.Forms.TabControl()
Me.TabPage1 = New System.Windows.Forms.TabPage()
Me.TabPage2 = New System.Windows.Forms.TabPage()
Me.TableLayoutPanel1.SuspendLayout()
Me.TabControl1.SuspendLayout()
Me.SuspendLayout()
'
'TableLayoutPanel1
'
Me.TableLayoutPanel1.ColumnCount = 4
Me.TableLayoutPanel1.ColumnStyles.Add(New System.Windows.Forms.ColumnStyle())
Me.TableLayoutPanel1.ColumnStyles.Add(New System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Percent, 50.0!))
Me.TableLayoutPanel1.ColumnStyles.Add(New System.Windows.Forms.ColumnStyle())
Me.TableLayoutPanel1.ColumnStyles.Add(New System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Percent, 50.0!))
Me.TableLayoutPanel1.Controls.Add(Me.Label1, 0, 0)
Me.TableLayoutPanel1.Controls.Add(Me.ComboBox1, 1, 0)
Me.TableLayoutPanel1.Controls.Add(Me.Label2, 2, 0)
Me.TableLayoutPanel1.Controls.Add(Me.TextBox1, 3, 0)
Me.TableLayoutPanel1.Controls.Add(Me.TabControl1, 0, 1)
Me.TableLayoutPanel1.Location = New System.Drawing.Point(12, 12)
Me.TableLayoutPanel1.Name = "TableLayoutPanel1"
Me.TableLayoutPanel1.RowCount = 2
Me.TableLayoutPanel1.RowStyles.Add(New System.Windows.Forms.RowStyle())
Me.TableLayoutPanel1.RowStyles.Add(New System.Windows.Forms.RowStyle(System.Windows.Forms.SizeType.Percent, 100.0!))
Me.TableLayoutPanel1.Size = New System.Drawing.Size(260, 238)
Me.TableLayoutPanel1.TabIndex = 0
'
'Label1
'
Me.Label1.Anchor = System.Windows.Forms.AnchorStyles.Right
Me.Label1.AutoSize = True
Me.Label1.Name = "Label1"
Me.Label1.TabIndex = 0
Me.Label1.Text = "Label1"
'
'ComboBox1
'
Me.ComboBox1.Anchor = CType((System.Windows.Forms.AnchorStyles.Left Or System.Windows.Forms.AnchorStyles.Right), System.Windows.Forms.AnchorStyles)
Me.ComboBox1.FormattingEnabled = True
Me.ComboBox1.Name = "ComboBox1"
Me.ComboBox1.TabIndex = 1
'
'Label2
'
Me.Label2.Anchor = System.Windows.Forms.AnchorStyles.Right
Me.Label2.AutoSize = True
Me.Label2.Name = "Label2"
Me.Label2.TabIndex = 2
Me.Label2.Text = "Label2"
'
'TextBox1
'
Me.TextBox1.Anchor = CType((System.Windows.Forms.AnchorStyles.Left Or System.Windows.Forms.AnchorStyles.Right), System.Windows.Forms.AnchorStyles)
Me.TextBox1.Name = "TextBox1"
Me.TextBox1.TabIndex = 3
'
'TabControl1
'
Me.TabControl1.Anchor = CType((((System.Windows.Forms.AnchorStyles.Top Or System.Windows.Forms.AnchorStyles.Bottom) _
Or System.Windows.Forms.AnchorStyles.Left) _
Or System.Windows.Forms.AnchorStyles.Right), System.Windows.Forms.AnchorStyles)
Me.TableLayoutPanel1.SetColumnSpan(Me.TabControl1, 4)
Me.TabControl1.Controls.Add(Me.TabPage1)
Me.TabControl1.Controls.Add(Me.TabPage2)
Me.TabControl1.Name = "TabControl1"
Me.TabControl1.TabIndex = 4
'
'TabPage1
'
Me.TabPage1.Name = "TabPage1"
Me.TabPage1.Padding = New System.Windows.Forms.Padding(3)
Me.TabPage1.TabIndex = 0
Me.TabPage1.Text = "TabPage1"
Me.TabPage1.UseVisualStyleBackColor = True
'
'TabPage2
'
Me.TabPage2.Name = "TabPage2"
Me.TabPage2.Padding = New System.Windows.Forms.Padding(3)
Me.TabPage2.TabIndex = 1
Me.TabPage2.Text = "TabPage2"
Me.TabPage2.UseVisualStyleBackColor = True
'
'Form1
'
Me.AutoScaleDimensions = New System.Drawing.SizeF(6.0!, 13.0!)
Me.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font
Me.ClientSize = New System.Drawing.Size(284, 262)
Me.Controls.Add(Me.TableLayoutPanel1)
Me.Name = "Form1"
Me.Text = "Form1"
Me.TableLayoutPanel1.ResumeLayout(False)
Me.TableLayoutPanel1.PerformLayout()
Me.TabControl1.ResumeLayout(False)
Me.ResumeLayout(False)
End Sub
Friend WithEvents TableLayoutPanel1 As System.Windows.Forms.TableLayoutPanel
Friend WithEvents Label1 As System.Windows.Forms.Label
Friend WithEvents ComboBox1 As System.Windows.Forms.ComboBox
Friend WithEvents Label2 As System.Windows.Forms.Label
Friend WithEvents TextBox1 As System.Windows.Forms.TextBox
Friend WithEvents TabControl1 As System.Windows.Forms.TabControl
Friend WithEvents TabPage1 As System.Windows.Forms.TabPage
Friend WithEvents TabPage2 As System.Windows.Forms.TabPage
End Class