WPF TabControl Example

WPF -> Controls -> TabControl 

WPF TabControl elements display content on discrete pages accessed by selecting the appropriate tab.

Example

<Window x:Class="Agenda.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

        mc:Ignorable="d"

        Title="MainWindow" Height="450" Width="800">

    <Grid>

        <TabControl>

            <TabItem Header="Agenda">

            </TabItem>

            <TabItem Header="Cards">

            </TabItem>

        </TabControl>

    </Grid>

</Window>

Slider WPF Example

WPF > Controls > Slider 

    <Grid>

        <TextBox

            Text="{Binding ElementName=Slider, Path=Value,             UpdateSourceTrigger=PropertyChanged}"

            Margin="33,112,288,172"/>

        <Slider

            Maximum="100"  

            Name="Slider"

            Margin="33,48,288,213"

            IsSnapToTickEnabled="True"

            TickFrequency="1" />

    </Grid>

Binding ComboBox to Enum and use Tag as SelectedValuePath

WPF > Controls > ItemsControl > ComboBox > Bind ComboBox to Enum

XAML

<Window x:Class="ComboBoxTag.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="MainWindow" Height="350" Width="525">

    <Grid>

        <ComboBox

                  SelectedValue="{Binding Rate, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"

                  SelectedValuePath="Tag" Margin="0,0,306,295">

            <!-- Tag is values of Rate enum -->

            <ComboBoxItem Tag="Bad">Bad</ComboBoxItem>

            <ComboBoxItem Tag="Low">Low</ComboBoxItem>

        </ComboBox>

    </Grid>

</Window>

C#

namespace ComboBoxTag

{

    public enum Rate

    {

        Bad = 0,

        Good = 1

    }

}

GridSplitter WPF Example

WPF > Controls  > GridSplitter 

<Window x:Class="GridSplitter.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="MainWindow" Height="350" Width="525">

    <Grid>

        <Grid.ColumnDefinitions>

            <ColumnDefinition Width="*" />

            <ColumnDefinition Width="2" />

            <ColumnDefinition Width="*" />

        </Grid.ColumnDefinitions>

        <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="TextBlock1" VerticalAlignment="Top" Grid.Column="0"/>

        <GridSplitter Grid.Column="1" Width="2" HorizontalAlignment="Stretch" />

        <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="TextBlock2" VerticalAlignment="Top" Grid.Column="2"/>

    </Grid>

</Window>

TextBlock WPF Example

WPF > Controls  > TextBlock 

A TextBlock can contain a string in its Text property.

TextBlock is designed to be lightweight and is optimized for single-line display.

Example

<Window x:Class="TextBlock.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="MainWindow" Height="350" Width="525">

    <Grid>

        <TextBlock Name="textBlock1" TextWrapping="Wrap">

            Simple text <Bold>Bold text</Bold> <Italic>Italic text</Italic>

        </TextBlock>

    </Grid>

</Window>

PasswordBox WPF Example

WPF > Controls  > PasswordBox 

Represents a control designed for entering and handling passwords.

Example

<Window x:Class="WpfApplication3.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="MainWindow" Height="221" Width="372">

    <Grid Margin="0,0,101,23">

        <PasswordBox x:Name="txtPwd" HorizontalAlignment="Left" Margin="110,75,0,0" VerticalAlignment="Top" Width="120" />

        <TextBlock HorizontalAlignment="Left" Margin="55,47,0,0" TextWrapping="Wrap" Text="User" VerticalAlignment="Top"/>

        <TextBox HorizontalAlignment="Left" Height="23" Margin="110,47,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Width="120"/>

        <TextBlock HorizontalAlignment="Left" Margin="55,75,0,0" TextWrapping="Wrap" Text="Password" VerticalAlignment="Top" RenderTransformOrigin="0.75,2.312"/>

        <Button Content="Login" HorizontalAlignment="Left" Margin="155,116,0,0" VerticalAlignment="Top" Width="75" Click="Button_Click"/>

    </Grid>

</Window>

private void Button_Click(object sender, RoutedEventArgs e)

{

   if (txtPwd.Password == "pwd")

     MessageBox.Show("Login Ok");

}

Add a Border to a TextBlock WPF

WPF > Windows > Controls > Border

If you want to display a border around your content, you must place the elements within a parent Border element.

Example: Add a Border to a TextBlock

<Border BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Left"                     VerticalAlignment="Top">

            <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap"  Text="TextBlock"  VerticalAlignment="Top"/>

 </Border>

Menu WPF Example

WPF > Controls > Menu

Menu presents a list of items that specify commands or options for an application. Typically, clicking an item on a menu opens a submenu or causes an application execute a command.


Example

<Window x:Class="MapDecision.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="MainWindow" Height="350" Width="525">

    <DockPanel>

        <Menu DockPanel.Dock="Top">

            <MenuItem Header="_File">

                <MenuItem Header="_New"/>

                <MenuItem Header="_Open"/>

                <MenuItem Header="_Close"/>

                <MenuItem Header="_Save"/>

            </MenuItem>

        </Menu>

        <StackPanel></StackPanel>

    </DockPanel>

</Window>

Example: Load and save content of WPF RichTextBox to a file

WPF > Controls  > ContentControl > RichTextBox

RichTextBox operates on FlowDocument objects.

Note: Pasting HTML content into a RichTextBox might result in unexpected behavior because RichTextBox uses RTF format rather than directly using HTML format.

Examples

• Table in RichTextBox

Example

Load and save content of WPF RichTextBox to a file

XAML:

<Window

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:src="clr-namespace:WpfApplication2"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" x:Class="WpfApplication2.MainWindow"
        Title="MainWindow"
       d:DesignWidth="300" d:DesignHeight="320"
        >
    <Grid HorizontalAlignment="Left" Height="295" VerticalAlignment="Top" Width="300">
        <Button x:Name="btnSave" Content="Save" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Click="btnSave_Click"/>
        <Button x:Name="btnLoad" Content="Load" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="80,0,0,0" Click="btnLoad_Click"/>
        <RichTextBox x:Name="rtb" HorizontalAlignment="Left" Height="267" Margin="0,27,0,0" VerticalAlignment="Top" Width="300">
            <FlowDocument>
                <Paragraph>
                    <Run Text=""/>
                </Paragraph>
            </FlowDocument>
        </RichTextBox>
    </Grid>
</Window>

C# Code

using System;

using System.Collections.Generic;
using System.Globalization;
using System.IO;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace WpfApplication2

{
     /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    ///

    public partial class MainWindow : Window

    {
        public MainWindow()
        {
            InitializeComponent();
        }
        private void btnSave_Click(object sender, RoutedEventArgs e)
        {
            TextRange t = new TextRange(rtb.Document.ContentStart,rtb.Document.ContentEnd);
            FileStream file = new FileStream("c:\\rtb.xaml", FileMode.Create);
            t.Save(file, System.Windows.DataFormats.XamlPackage);
             file.Close();
        }
        private void btnLoad_Click(object sender, RoutedEventArgs e)
        {
            TextRange t = new TextRange(rtb.Document.ContentStart, rtb.Document.ContentEnd);
            FileStream file = new FileStream("c:\\rtb.xaml", FileMode.Open);
            t.Load(file, System.Windows.DataFormats.XamlPackage);
            file.Close();
        }
    }
}