WPF Web Based

R4R^®

WPF with C#

WPF Web Based Tutorials

WPF Examples

WPF

WPF Projects

WPF Project

WPF Interview Materials

WPF subjective question

WPF Interview question

WPF Objective question

WPF FAQS

TabControl in WPF WEB BASED

Home

Each TabControl can contain Multiple collection of TabItem elements. TabItem has two specific attributes. Header is the string value that you see on top of each tab and IsSelected is a Boolean value that specifies if a tab is selected. Bassically only one tab can be selected at a time otherwise the first tab in list will be selected.

Two elements play main roles in Creating a tab control: TabControl and TabItem. TabControl is the container of one or more TabItem elements.

Syntax of TabControl:

<TabControl Margin="41,46,0,0" Name="tabControl1"Height="100"
VerticalAlignment="Top" HorizontalAlignment="Left" Width="200" />

In the following tag I create the TabControl in which Height is height of the TabControl, Name is the name of the TabControl, The Background and Foreground properties represent the background and foreground colors of a TabControl.

The following code sets the name, height, and width of a RadioButton control. The code also sets horizontal alignment to left and vertical alignment to top

<TabControl>
    <TabItem Header="Tab 1">Home</TabItem>
    <TabItem Header="Tab 2">Services</TabItem>

    <TabItem Header="Tab 3">Help</TabItem>
    <TabItem Header="Tab 4">Contact Us</TabItem>
</TabControl>

Example:

.XAML CODE:

<Page x:Class="WpfBrowserApplication5.Page6"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Page6" Height="493" Width="345" Loaded="Page_Loaded">
<Grid>
<TabControl Margin="19,21,0,0" Name="tabControl1" Height="267" 
VerticalAlignment="Top" HorizontalAlignment="Left" 
Width="256" IsTabStop="True">
<TabItem Header="Home" IsSelected="True" IsTabStop="False">
<Image Source="images.jpeg" ImageFailed="Image_ImageFailed"></Image>
</TabItem>
<TabItem Header="Courses" IsSelected="True" Background="Goldenrod">
<TextBlock Background="Gray">
<Image Source="11.jpg" ></Image><LineBreak></LineBreak>
<Label Name="label1" Content=" Username" FontSize="15"></Label>
<TextBox Name="textbox1" Text="" Height="35" Width="120" >
</TextBox><LineBreak></LineBreak>
<RadioButton GroupName="a" FontSize="16" Name="radiobutton1">MCA</RadioButton>
<LineBreak></LineBreak>
<RadioButton GroupName="a" FontSize="16" Name="radiobutton2">B.Tech.
</RadioButton>
<LineBreak></LineBreak>
<RadioButton GroupName="a" FontSize="16" Name="radiobutton3">M.Tech.
</RadioButton>
<LineBreak></LineBreak>
<RadioButton GroupName="a" FontSize="16" Name="radiobutton4">BCA
</RadioButton>
<LineBreak></LineBreak>
<Button Name="button1"    Click="button1_Click" > submit </Button>
</TextBlock>
</TabItem>
<TabItem Header="Contact Us" IsSelected="True">
<Image Source="user-admin.png"    />
</TabItem>
</TabControl>
</Grid>
</Page>

.XAML.CS CODE:

private void button1_Click(object sender, RoutedEventArgs e)
{
if (radiobutton1.IsChecked == true)
{
MessageBox.Show("Hi!!!! " + textbox1.Text + " " + "You Selected " + 
radiobutton1.Content);
}
else if(radiobutton2.IsChecked == true)
{
MessageBox.Show("Hi:: " + textbox1.Text + "" + "Your Selected Course is:::" +
radiobutton2.Content);
}
else if (radiobutton3.IsChecked == true)
{
MessageBox.Show("Hi:: " + textbox1.Text + "" + "Your Selected Course is->" +
radiobutton3.Content);
}
else if (radiobutton4.IsChecked == true)
{
MessageBox.Show("Hi:: " + textbox1.Text + "" + "Your Selected Course is->" + 
radiobutton4.Content);
}
}