How to configure the CardLayout control?
WinForms Card Layout is Layout container type of control that helps to arrange controls in stack order and one control will be visible at the time. These below two ways are used to configure the controls added in CardLayout.
- Through Designer
- Through Code
Through Designer
Step 1: Add the CardLayout Control on Form.
Drag and drop the CardLayout Control on Form. Please refer the below Screenshot.
Screenshot
Step 2: Add Controls on Form
Drag and drop the required controls in Form. If Form contains CardLayout Manager, dragged control will be directly added as Card.
Please refer the below Screenshot
Screenshot
Figure 1: Radial Gauge is added as Card1
Step 3: Set the CardName.
Need to set the Card Name based on requirement. Please refer the below Screenshot.
Screenshot
Through Code
Need to follow the below step for CardLayout configuration Through Code.
Step 1: Need to add required Controls on Form.
Please make use of the below Code snippet.
C#
//Initialize the TreeNavigator control Syncfusion.Windows.Forms.Tools.TreeNavigator.HeaderCollection headerCollection1 = new Syncfusion.Windows.Forms.Tools.TreeNavigator.HeaderCollection(); this.treeNavigator1 = new Syncfusion.Windows.Forms.Tools.TreeNavigator(); this.Controls.Add(this.treeNavigator1); //Initialize the TreeViewAdv control Syncfusion.Windows.Forms.Tools.TreeNodeAdvStyleInfo treeNodeAdvStyleInfo1 = new Syncfusion.Windows.Forms.Tools.TreeNodeAdvStyleInfo(); this.treeViewAdv1 = new Syncfusion.Windows.Forms.Tools.TreeViewAdv(); this.Controls.Add(this.treeViewAdv1); //Initialize the XPTaskBar Control this.xpTaskBar1 = new Syncfusion.Windows.Forms.Tools.XPTaskBar(); ((System.ComponentModel.ISupportInitialize)(this.xpTaskBar1)).BeginInit(); this.Controls.Add(this.xpTaskBar1); //Initialize the GroupBar Control this.groupBar1 = new Syncfusion.Windows.Forms.Tools.GroupBar(); ((System.ComponentModel.ISupportInitialize)(this.groupBar1)).BeginInit(); this.Controls.Add(this.groupBar1);
VB
''' <summary> ''' Initialize the TreeNavigator Control ''' </summary> Dim headerCollection2 As New Syncfusion.Windows.Forms.Tools.TreeNavigator.HeaderCollection() Me.treeNavigator1 = New Syncfusion.Windows.Forms.Tools.TreeNavigator() Me.Controls.Add(Me.treeNavigator1) ''' <summary> ''' Initialize the TreeViewAdv Control ''' </summary> Dim treeNodeAdvStyleInfo2 As New Syncfusion.Windows.Forms.Tools.TreeNodeAdvStyleInfo() Me.treeViewAdv1 = New Syncfusion.Windows.Forms.Tools.TreeViewAdv() DirectCast(Me.treeViewAdv1, System.ComponentModel.ISupportInitialize).BeginInit() Me.Controls.Add(Me.treeViewAdv1) ''' <summary> ''' Initialize the XPTaskBar Control ''' </summary> Me.xpTaskBar1 = New Syncfusion.Windows.Forms.Tools.XPTaskBar() DirectCast(Me.xpTaskBar1, System.ComponentModel.ISupportInitialize).BeginInit() Me.Controls.Add(Me.xpTaskBar1) ''' <summary> ''' Initialize the GroupBar Control ''' </summary> Me.groupBar1 = New Syncfusion.Windows.Forms.Tools.GroupBar() DirectCast(Me.groupBar1, System.ComponentModel.ISupportInitialize).BeginInit() Me.Controls.Add(Me.groupBar1)
Step 2: Integrate into CardLayout control by assigning Card name.
Need to set the Card Name based on requirement. Please refer the below Code snippet.
C#
//Add the TreeNavigator Control to CardLayout. this.cardLayout1.SetCardName(this.treeNavigator1, "TreeNavigator"); //Add the TreeViewAdv Control to CardLayout. this.cardLayout1.SetCardName(this.treeViewAdv1, "TreeView"); //Add the XPTaskBar Control to CardLayout. this.cardLayout1.SetCardName(this.xpTaskBar1, "XPTaskBar"); //Add the GroupBar Control to CardLayout. this.cardLayout1.SetCardName(this.groupBar1, "GroupBar");
VB
‘Add the TreeNavigator Control to CardLayout Me.cardLayout1.SetCardName(Me.treeNavigator1, "TreeNavigator") ‘Add the TreeViewAdv Control to CardLayout Me.cardLayout1.SetCardName(Me.treeViewAdv1, "TreeView") ‘Add the XPTaskBar Control to CardLayout Me.cardLayout1.SetCardName(Me.xpTaskBar1, "XPTaskBar") ‘Add the GroupBar Control to CardLayout Me.cardLayout1.SetCardName(Me.groupBar1, "GroupBar")
Sample:
