How to reproduce the UI control from mock-up using wpf?

Question

How to reproduce the UI control from mock-up using wpf?

Gcobani Mkontwana 60

Hi Team

I have a mock-up and want to reproduce it using wpf controls given by Microsoft forms in windows. Below is my current code and need some adjustment, as well screen shot of the mock-up want to produce using wpf ui controls.

``

Hongrui Yu-MSFT 5,255 Reputation points Microsoft External Staff

2024-05-29T07:17:17.3466667+00:00

Hi,@Gcobani Mkontwana. Welcome to Microsoft Q&A.

I have responded to your latest case(Using User Control in WPF, How to create good UI grid? - Microsoft Q&A), please confirm

Accepted answer

0 additional answers

Your answer

Hongrui Yu-MSFT 5,255 Reputation points Microsoft External Staff

2024-05-29T07:17:17.3466667+00:00

Hi,@Gcobani Mkontwana. Welcome to Microsoft Q&A.

I have responded to your latest case(Using User Control in WPF, How to create good UI grid? - Microsoft Q&A), please confirm

Answer 1

Hi,@Gcobani Mkontwana.

I have completed the following code to achieve the effect of your image. You could check it out. If you still have problems, please provide more details.

If your question is more complete and clear, you might get a more accurate solution.

UserControl


  <Grid Background="White">

      <Grid.DataContext>

          <vm:UserControl2ViewModel x:Name="MyData"></vm:UserControl2ViewModel>

      </Grid.DataContext>

      <Grid.Resources>

          <vm:MyConvert x:Key="MyConvert"></vm:MyConvert>

      </Grid.Resources>

      <Grid.RowDefinitions>

          <RowDefinition Height="*"/>

          <RowDefinition Height="*"/>

          <RowDefinition Height="3*"/>

          <RowDefinition Height="10*"/>

          <RowDefinition Height="*"/>

          <RowDefinition Height="*"/>

          <RowDefinition Height="*"/>

          <RowDefinition Height="2*"/>

      </Grid.RowDefinitions>

      <TextBlock Text="{Binding Path=Title}" HorizontalAlignment="Center"></TextBlock>

      <Border Grid.Row="1" Background="Black" Width="1" Margin="300,0,0,0"></Border>

      <StackPanel Grid.Row="2" Orientation="Horizontal">

          <Grid Background="DarkGray"  Margin="200,0,0,0">

              <Grid.RowDefinitions>

                  <RowDefinition></RowDefinition>

                  <RowDefinition></RowDefinition>

              </Grid.RowDefinitions>

              <Grid.ColumnDefinitions>

                  <ColumnDefinition></ColumnDefinition>

                  <ColumnDefinition></ColumnDefinition>

              </Grid.ColumnDefinitions>

              <TextBlock Text="Product code"  HorizontalAlignment="Right" VerticalAlignment="Top"></TextBlock>

              <TextBlock Grid.Row="1" Text="Product Description"  HorizontalAlignment="Right" VerticalAlignment="Bottom"></TextBlock >

              <TextBlock Grid.Column="1" Text="{Binding Path=ProductCode}" Margin="20,0,0,0"></TextBlock>

              <TextBlock Grid.Row="1" Grid.Column="1" Text="{Binding Path=ProductDescription}" Margin="20,0,0,0" VerticalAlignment="Bottom"></TextBlock>

          </Grid>

          <Border BorderBrush="Black" BorderThickness="1" Margin="150,0,0,0" >

              <Grid Width="200">

                  <Grid.RowDefinitions>

                      <RowDefinition/>

                      <RowDefinition/>

                  </Grid.RowDefinitions>

                  <Grid.ColumnDefinitions>

                      <ColumnDefinition Width="*"/>

                      <ColumnDefinition Width="*"/>

                      <ColumnDefinition Width="*"/>

                  </Grid.ColumnDefinitions>

                  <TextBox Text="Data" IsReadOnly="True"></TextBox>

                  <TextBox Grid.Row="1" Text="Batch Number" TextWrapping="Wrap" IsReadOnly="True"></TextBox>

                  <TextBox   Grid.Column="1" Grid.ColumnSpan="2"></TextBox>

                  <TextBox   Grid.Row="1"    Grid.Column="1"></TextBox>

                  <TextBox   Grid.Row="1"    Grid.Column="2"></TextBox>

              </Grid>

          </Border>

      </StackPanel>

      <DataGrid Grid.Row="3" ItemsSource="{Binding ExcelDatas}" AutoGenerateColumns="False" CanUserAddRows="False" ColumnHeaderHeight="60" Margin="0,20,0,0">

          <DataGrid.Resources>

              <Style x:Key="Head1" TargetType="DataGridColumnHeader">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <DockPanel LastChildFill="False">

                                  <TextBlock Text="BatchSize" DockPanel.Dock="Top"></TextBlock>

                                  <TextBlock Text="RM Code" DockPanel.Dock="Bottom"></TextBlock>

                              </DockPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

              <Style x:Key="Head2" TargetType="DataGridColumnHeader">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <DockPanel LastChildFill="False">

                                  <TextBlock Text="(tons)" DockPanel.Dock="Top"></TextBlock>

                                  <TextBlock Text="Stockcode" DockPanel.Dock="Bottom"></TextBlock>

                              </DockPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

              <Style x:Key="Head3" TargetType="DataGridColumnHeader">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <DockPanel LastChildFill="False">

                                  <TextBlock Text="{Binding Path=DataContext.BatchSize,RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Grid},AncestorLevel=2}}" FontWeight="Black" DockPanel.Dock="Top"></TextBlock>

                              </DockPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

              <Style x:Key="Head4" TargetType="DataGridColumnHeader">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <StackPanel>

                                  <Border BorderThickness="1" BorderBrush="Black" Height="40">

                                      <TextBlock Text="Bag Weight" VerticalAlignment="Center" HorizontalAlignment="Center" TextWrapping="WrapWithOverflow"></TextBlock>

                                  </Border>

                              </StackPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

              <Style x:Key="Head5" TargetType="DataGridColumnHeader">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <StackPanel>

                                  <Border BorderThickness="1" BorderBrush="Black" Height="40">

                                      <TextBlock Text="Full Bags Used" VerticalAlignment="Center" HorizontalAlignment="Center"  TextWrapping="WrapWithOverflow"></TextBlock>

                                  </Border>

                              </StackPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

              <Style x:Key="Head6" TargetType="DataGridColumnHeader">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <StackPanel>

                                  <Border BorderThickness="1" BorderBrush="Black" Height="40">

                                      <TextBlock Text="Kg of Part bag used" VerticalAlignment="Center" HorizontalAlignment="Center" TextWrapping="WrapWithOverflow"></TextBlock>

                                  </Border>

                                  <DockPanel LastChildFill="False">

                                      <Border BorderBrush="Black" Width="1" Height="20" BorderThickness="1" DockPanel.Dock="Left"></Border>

                                      <Border BorderBrush="Black" Width="1" Height="20" BorderThickness="1" DockPanel.Dock="Right"></Border>

                                  </DockPanel>

                              </StackPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

              <Style x:Key="Head7" TargetType="DataGridColumnHeader">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <StackPanel>

                                  <Border BorderThickness="1" BorderBrush="Black" Height="40">

                                      <TextBlock Text="Total Kg Used" VerticalAlignment="Center" HorizontalAlignment="Center" TextWrapping="WrapWithOverflow"></TextBlock>

                                  </Border>

                              </StackPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

              <Style x:Key="Head8" TargetType="DataGridColumnHeader">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <StackPanel Orientation="Vertical" VerticalAlignment="Bottom" >

                                  <TextBlock Text="Bom" FontWeight="Black"  HorizontalAlignment="Left"></TextBlock>

                              </StackPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

              <Style x:Key="Head9" TargetType="DataGridColumnHeader">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <StackPanel VerticalAlignment="Bottom">

                                  <TextBlock Text="Recipe %|"  HorizontalAlignment="Right"></TextBlock>

                              </StackPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

              <Style x:Key="Head10" TargetType="DataGridColumnHeader">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <StackPanel VerticalAlignment="Bottom">

                                  <TextBlock Text="No Packs" VerticalAlignment="Top" HorizontalAlignment="Center"></TextBlock>

                                  <Border Width="80" Background="Gray">

                                      <TextBlock Text="{Binding Path=DataContext.NoPacks,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type Grid},AncestorLevel=2}}" VerticalAlignment="Center" HorizontalAlignment="Right" Background="Gray" ></TextBlock>

                                  </Border>

                                  <TextBlock Text="Tons" VerticalAlignment="Bottom" HorizontalAlignment="Right"></TextBlock>

                              </StackPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

              <Style x:Key="Row1" TargetType="DataGridCell">

                  <Setter Property="Template">

                      <Setter.Value>

                          <ControlTemplate>

                              <StackPanel>

                                  <TextBlock>

                                      <DataGridCellsPresenter/>

                                  </TextBlock>

                              </StackPanel>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

          </DataGrid.Resources>

          <DataGrid.Columns>

              <DataGridTextColumn Header="RM_Code" HeaderStyle="{StaticResource Head1}" Binding="{Binding RM_Code}" Width="30"></DataGridTextColumn>

              <DataGridTextColumn Header="StockCode" HeaderStyle="{StaticResource Head2}" Binding="{Binding StockCode}" Width="50"></DataGridTextColumn>

              <DataGridTextColumn Header="Name" HeaderStyle="{StaticResource Head3}" Binding="{Binding Name}" Width="100"></DataGridTextColumn>

              <DataGridTextColumn Header="BagWeight" HeaderStyle="{StaticResource Head4}" Binding="{Binding BagWeight}" Width="80"></DataGridTextColumn>

              <DataGridTextColumn Header="FullBagsUsed" HeaderStyle="{StaticResource Head5}" Binding="{Binding FullBagsUsed,Converter={StaticResource MyConvert}}" Width="80"></DataGridTextColumn>

              <DataGridTextColumn Header="KgOfPartBagUsed" HeaderStyle="{StaticResource Head6}" Binding="{Binding KgOfPartBagUsed,StringFormat={}{0:F3}}" Width="80"></DataGridTextColumn>

              <DataGridTextColumn Header="TotalKgUsed" HeaderStyle="{StaticResource Head7}" Binding="{Binding TotalKgUsed,StringFormat={}{0:F3}}" Width="80"></DataGridTextColumn>

              <DataGridTextColumn Header="Bom" HeaderStyle="{StaticResource Head8}" Binding="{Binding Bom,StringFormat={}{0:F3}}" Width="80"></DataGridTextColumn>

              <DataGridTextColumn Header="Recipe %|" HeaderStyle="{StaticResource Head9}" Binding="{Binding Recipe,StringFormat={}{0:F3}}" Width="80"></DataGridTextColumn>

              <DataGridTextColumn Header="Tons" HeaderStyle="{StaticResource Head10}" Binding="{Binding Tons,StringFormat={}{0:F1}}" Width="80"></DataGridTextColumn>

          </DataGrid.Columns>

      </DataGrid>

      <StackPanel Grid.Row="4" Orientation="Horizontal">

          <StackPanel.Resources>

              <Style x:Name="MyStyle" TargetType="TextBlock">

                  <Setter Property="Width" Value="80"></Setter>

                  <Setter Property="Height" Value="16"></Setter>

                  <Setter Property="VerticalAlignment" Value="Top"></Setter>

              </Style>

          </StackPanel.Resources>

          <TextBlock Text="Total Pack"  Background="Gray"  Margin="85,0,0,0"  Width="180" ></TextBlock>

          <TextBlock Text="{Binding FullBagsUsed_Total_Pack}"></TextBlock>

          <TextBlock Text="{Binding KgOfPartBagUsed_Total_Pack}"></TextBlock>

          <TextBlock Text="{Binding TotalKgUsed_Total_Pack}"></TextBlock>

          <TextBlock Text="{Binding Bom_Total_Pack}"></TextBlock>

      </StackPanel>

      <StackPanel Grid.Row="5">

          <TextBlock Text="{Binding Recipe_Total_Pack}" TextAlignment="Right" Width="80" HorizontalAlignment="Right" Margin="0,0,139,0"></TextBlock>

      </StackPanel>

      <StackPanel Grid.Row="6" Orientation="Horizontal">

          <TextBlock Text="NO.OF PREMIX PACKS MADE:"></TextBlock>

          <TextBox Width="80" Height="20" VerticalAlignment="Top" Margin="95,0,0,0" Text="{Binding No_OF_PREMIX_PACKS_MADE}" IsReadOnly="True"></TextBox>

      </StackPanel>

      <StackPanel Grid.Row="7">

          <StackPanel Orientation="Horizontal">

              <TextBlock>Weight per pack 1</TextBlock>

              <TextBox Width="80" Background="Gray" Margin="80,0,0,0" Text="{Binding Weight_per_pack_1}" IsReadOnly="True"></TextBox>

              <TextBlock>Kg</TextBlock>

          </StackPanel>

          <StackPanel Orientation="Horizontal">

              <TextBlock>Total premix weight</TextBlock>

              <TextBox Width="80" Background="Gray" Margin="71,0,0,0" Text="{Binding Total_premix_weight}" IsReadOnly="True"></TextBox>

              <TextBlock>Kg</TextBlock>

          </StackPanel>

      </StackPanel> 

  </Grid>

Model


public class ExcelData:INotifyPropertyChanged

{

    private string rm_Code;

 

    public string RM_Code { get { return rm_Code; } set { rm_Code = value;OnPropertyChanged("RM_Code"); } }

 

    private string stockCode;

 

    public string StockCode { get { return stockCode; } set { stockCode = value;OnPropertyChanged("StockCode"); } }

 

    private string name;

 

    public string Name { get { return name; } set { name = value;OnPropertyChanged("Name"); } }

 

    private int bagWeight;

 

    public int BagWeight { get { return bagWeight; } set { bagWeight = value;OnPropertyChanged("BagWeight"); } }

 

    private int fullBagsUsed;

 

    public int FullBagsUsed { get { return fullBagsUsed; } set { fullBagsUsed = value;OnPropertyChanged("FullBagsUsed"); } }

 

    private double kgOfPartBagUsed;

 

    public double KgOfPartBagUsed { get { return kgOfPartBagUsed; } set { kgOfPartBagUsed = value; OnPropertyChanged("KgOfPartBagUsed"); }  }

 

    public double TotalKgUsed { get { return BagWeight*FullBagsUsed+KgOfPartBagUsed ; } }

 

    private double bom;

 

    public double Bom { get { return bom; } set { bom = value; OnPropertyChanged("Bom"); } }

 

    private double recipe;

 

    public double Recipe { get { return recipe; } set { recipe = value; OnPropertyChanged("Recipe"); } }

 

    public double Tons { get { return Math.Round(TotalKgUsed,1); } }

 

    public event PropertyChangedEventHandler PropertyChanged;

 

    public void OnPropertyChanged(string propertyName)

    {

        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));

    }

}

Convert


    [ValueConversion(typeof(int),typeof(String))]

    internal class MyConvert : IValueConverter

    {

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)

        {

            if((int)value==0)

            {

                return "_";

            }

            return value.ToString();

        }

 

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)

        {

            throw new NotImplementedException();

        }

    }

ViewModel


    internal class UserControl2ViewModel : INotifyPropertyChanged

    {

        private string title;

 

        public string Title { get { return title; } set { title = value; OnPropertyChanged("Title"); } }

 

        private string productCode;

 

        public string ProductCode { get { return productCode; } set { productCode = value; OnPropertyChanged("ProductCode"); } }

 

        private string productDescription;

 

        public string ProductDescription { get { return productDescription; } set { productDescription = value;OnPropertyChanged("ProductDescription"); } }

 

        private int batchSize;

 

        public int BatchSize { get { return batchSize; } set { batchSize = value; OnPropertyChanged("BatchSize"); } }

 

        private int noPacks;

 

        public int NoPacks { get { return noPacks; } set { noPacks = value; OnPropertyChanged("NoPacks"); } }

 

        private int no_OF_PREMIX_PACKS_MADE;

 

        public int No_OF_PREMIX_PACKS_MADE { get { return no_OF_PREMIX_PACKS_MADE;} set { no_OF_PREMIX_PACKS_MADE = value;OnPropertyChanged("No_OF_PREMIX_PACKS_MADE"); } }

 

        private int weight_per_pack_1;

 

        public int Weight_per_pack_1 { get { return weight_per_pack_1; } set { weight_per_pack_1 = value; OnPropertyChanged("Weight_per_pack_1"); } }

 

        private int total_premix_weight;

 

        public int Total_premix_weight { get { return total_premix_weight; } set { total_premix_weight = value; OnPropertyChanged("Total_premix_weight"); } }

 

        private int fullBagsUsed_Total_Pack;

 

        public int FullBagsUsed_Total_Pack { get { return fullBagsUsed_Total_Pack; } set { fullBagsUsed_Total_Pack = value;OnPropertyChanged("FullBagsUsed_Total_Pack");  } }

 

        private double kgOfPartBagUsed_Total_Pack;

 

        public double KgOfPartBagUsed_Total_Pack { get { return kgOfPartBagUsed_Total_Pack; } set { kgOfPartBagUsed_Total_Pack = value; OnPropertyChanged("KgOfPartBagUsed_Total_Pack"); } }

 

        private double totalKgUsed_Total_Pack;

 

        public double TotalKgUsed_Total_Pack { get { return totalKgUsed_Total_Pack; } set { totalKgUsed_Total_Pack = value;OnPropertyChanged("TotalKgUsed_Total_Pack"); } }

 

        private double bom_Total_Pack;

 

        public double Bom_Total_Pack { get { return bom_Total_Pack; } set { bom_Total_Pack = value;OnPropertyChanged("Bom_Total_Pack"); } }

 

        private double recipe_Total_Pack;

 

        public double Recipe_Total_Pack { get { return recipe_Total_Pack; } set { recipe_Total_Pack = value;OnPropertyChanged("Recipe_Total_Pack"); } }

 

        private ObservableCollection<ExcelData> excelDatas;

 

        public ObservableCollection<ExcelData> ExcelDatas { get { return excelDatas; } set { excelDatas = value;OnPropertyChanged("ExcelDatas"); } }

        public UserControl2ViewModel() {

            Title = "AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA";

            ProductCode = "BBBBBB";

            ProductDescription = "CCCCCCC CCCC";

            batchSize = 2;

            NoPacks = 20;

            No_OF_PREMIX_PACKS_MADE = 20;

            Weight_per_pack_1 = 25;

            Total_premix_weight = 25;

            ExcelDatas = new ObservableCollection<ExcelData>()

            {

                new ExcelData(){RM_Code="AA",StockCode="KK",Name="UU",BagWeight=25,FullBagsUsed=4,KgOfPartBagUsed=10.000,Bom=2.000,Recipe=0.151},

                new ExcelData(){RM_Code="BB",StockCode="LL",Name="VV",BagWeight=20,FullBagsUsed=3,KgOfPartBagUsed=20.000,Bom=3.000,Recipe=0.234},

                new ExcelData(){RM_Code="CC",StockCode="MM",Name="WW",BagWeight=25,FullBagsUsed=0,KgOfPartBagUsed=10.000,Bom=1.000,Recipe=0.171},

                new ExcelData(){RM_Code="DD",StockCode="NN",Name="XX",BagWeight=20,FullBagsUsed=1,KgOfPartBagUsed=30.000,Bom=2.000,Recipe=0.054},

                new ExcelData(){RM_Code="EE",StockCode="OO",Name="YY",BagWeight=25,FullBagsUsed=2,KgOfPartBagUsed=5.000,Bom=3.000,Recipe=0.264},

                new ExcelData(){RM_Code="FF",StockCode="PP",Name="ZZ",BagWeight=20,FullBagsUsed=0,KgOfPartBagUsed=7.000,Bom=1.000,Recipe=0.674},

                new ExcelData(){RM_Code="GG",StockCode="QQ",Name="AAA",BagWeight=25,FullBagsUsed=3,KgOfPartBagUsed=4.000,Bom=1.000,Recipe=0.451},

                new ExcelData(){RM_Code="HH",StockCode="RR",Name="BBB",BagWeight=20,FullBagsUsed=1,KgOfPartBagUsed=10.000,Bom=4.000,Recipe=0.345},

                new ExcelData(){RM_Code="II",StockCode="FF",Name="CCC",BagWeight=25,FullBagsUsed=5,KgOfPartBagUsed=20.000,Bom=2.000,Recipe=0.761},

                new ExcelData(){RM_Code="JJ",StockCode="NN",Name="DDD",BagWeight=20,FullBagsUsed=1,KgOfPartBagUsed=10.000,Bom=5.000,Recipe=0.223}

            };

            FullBagsUsed_Total_Pack = ExcelDatas.Sum(p => p.FullBagsUsed);

            kgOfPartBagUsed_Total_Pack = ExcelDatas.Sum(p=>p.KgOfPartBagUsed);

            TotalKgUsed_Total_Pack = ExcelDatas.Sum(p => p.TotalKgUsed);

            Bom_Total_Pack = ExcelDatas.Sum(p => p.Bom);

            Recipe_Total_Pack = ExcelDatas.Sum(p => p.Recipe);         

        }

 

        public event PropertyChangedEventHandler PropertyChanged;

 

        public void OnPropertyChanged(string propertyName)

        {

            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));

        }

    }

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Gcobani Mkontwana 60 Reputation points

2024-06-04T06:17:55.4066667+00:00

I will work on it and test it, let you know thanks
Hongrui Yu-MSFT 5,255 Reputation points Microsoft External Staff

2024-06-04T09:51:30.3266667+00:00

Hi,@Gcobani Mkontwana.

Thanks for your reply, if you have any questions please feel free to come back
Gcobani Mkontwana 60 Reputation points

2024-06-04T13:57:42.1433333+00:00

@Hongrui Yu-MSFT, the only thing i find it difficult is column names on my side are not displaying. is it because of StringFormat method, i only see RM Code as only one.
Hongrui Yu-MSFT 5,255 Reputation points Microsoft External Staff

2024-06-05T02:24:40.88+00:00

Hi,@Gcobani Mkontwana.

If you need to modify the column name, you need to modify it in DataGrid.Resources.

Since the column name style is different for each column, I defined 10 Styles in DataGrid.Resources, one for each column.The column names are also written directly in the Style.

<DataGridTextColumn Header="RM_Code" HeaderStyle="{StaticResource Head1}" Binding="{Binding RM_Code}" Width="30"></DataGridTextColumn

Header="RM_Code" has no actual meaning. The column name is actually displayed by its bound HeaderStyle="{StaticResource Head1}".

StringFormat affects the data in each row of this column, and its purpose is to retain the corresponding number of decimal places.

Share via

How to reproduce the UI control from mock-up using wpf?

0 additional answers

Your answer