Search code examples
c#.netwpfuser-interface.net-3.5

WPF - Manage UI


I want to make something like this type of UI:

UI

There will be two or three buttons always on top with a textbox (no change after window resize).

How can I do this in WPF, actually am new to WPF and I want to do this strictly in .Net & WPF 3.5.


Solution

  • I remember when I started to learn WPF. It was a steep learning curve. You need to look into XAML files to get the UI. For your requirement, the code would look like this...assume you have some background in VS, start new WPF project ect. What you want is some grid and then you can either drag and drop from Toolbox, or you can just type code for your UI elements.

    <Window x:Class="WpfApp1.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"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="5*"/>
            <ColumnDefinition Width="90*"/>
            <ColumnDefinition Width="5*"/>
            <ColumnDefinition Width="90*"/>
            <ColumnDefinition Width="5*"/>
            <ColumnDefinition Width="200*"/>
            <ColumnDefinition Width="5*"/>
            <ColumnDefinition Width="90*"/>
            <ColumnDefinition Width="5*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="3*"/>
            <RowDefinition Height="50*"/>
            <RowDefinition Height="3*"/>
            <RowDefinition Height="100*"/>
            <RowDefinition Height="3*"/>
        </Grid.RowDefinitions>
        <Button Content="Button" Grid.Column="1" Grid.Row="1" Margin="0,0,0,0"/>
        <Button Content="Button" Grid.Column="3" Grid.Row="1" Margin="0,0,0,0"/>
        <TextBox Text="Textbox" Grid.Column="5" Grid.Row="1" Margin="0,0,0,0"/>
        <Button Content="Button" Grid.Column="7" Grid.Row="1" Margin="0,0,0,0"/>
        <Border BorderBrush="Black" BorderThickness="1" Grid.ColumnSpan="7" Grid.Column="1" Height="100" Grid.Row="1" VerticalAlignment="Top">            
        </Border>
    
    </Grid>