GridSplitter resize in WPF - wpf

I've a grid with 3 rows.When I drag down to grid splitter,the grid splitter disappeared.But I need to do "auto" height of the first row.How can I fix this problem?
Here is code:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="20"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackPanel>
<Border Background="BlueViolet" Height="20" Margin="3"/>
<Border Background="BlueViolet" Height="20" Margin="3"/>
<Border Background="BlueViolet" Height="20" Margin="3"/>
<Border Background="BlueViolet" Height="20" Margin="3"/>
<Border Background="BlueViolet" Height="20" Margin="3"/>
</StackPanel>
<GridSplitter Background="White" HorizontalAlignment="Stretch" Grid.Row="1" Height="5"/>
<TextBlock IsHitTestVisible="False" Text="GridSplitter here.." Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center"/>
<Border Background="CornflowerBlue" Grid.Row="2" Margin="3"/>
</Grid>
Thanks for your help.

Related

Remove lines between rows in WPF grid

I have the following XAML in a WPF application. There are white horizontal lines between the rows. Is there anything that can be done to remove them?
<Grid>
<Grid.RowDefinitions>
<RowDefinition x:Name="Header" Height="Auto"/>
<RowDefinition x:Name="Body" Height="1*"/>
<RowDefinition x:Name="Footer" Height=".5*"/>
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width=".4*"/>
<ColumnDefinition />
<ColumnDefinition Width=".4*"/>
</Grid.ColumnDefinitions>
<Border Grid.Column="1" Background="#454d52"/>
<TextBlock Grid.Row="0" Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White" FontSize="54" Text="" Padding="200,30,200,30"/>
</Grid>
<Grid Grid.Row="1">
<Border BorderThickness="0" Background="#FF454D52"/>
<TextBlock HorizontalAlignment="Left" VerticalAlignment="Center" FontSize="24" Foreground="White" Padding="50,0,0,0"/>
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="24" Foreground="White"/>
<Label HorizontalAlignment="Right" VerticalAlignment="Center" FontSize="24" Foreground="White" Padding="0,0,50,0"></Label>
</Grid>
</Grid>
</Grid>
Set SnapsToDevicePixels on your top-most Grid:
<Grid SnapsToDevicePixels="True">

Xaml intellisense not working

I have a problem with the intellisense. It works in code behind but not in xaml code (wpf).
1st image: Intelissense not working
2nd image: I comment on the 1st usercontrol and the intellisense works.
Here the code is in the usercontrol "cuAccessoiresAutres":
<UserControl x:Class="MicroSecu.ControleUtilisateur.cuAccessoiresAutres"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:ControleUtilisateur="clr-namespace:MicroSecu.ControleUtilisateur"
mc:Ignorable="d"
d:DesignHeight="251" d:DesignWidth="672">
<UserControl.Resources>
<SolidColorBrush x:Key="controlBorderBrush" Color="LightGray" />
</UserControl.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<!--En tête-->
<Border Grid.Row="0" Grid.Column="0" BorderThickness="0,0,1,1" BorderBrush="{StaticResource controlBorderBrush}"></Border>
<Border Grid.Row="0" Grid.Column="1" BorderThickness="1,2,1,1" BorderBrush="{StaticResource controlBorderBrush}">
<TextBlock Text="Gauche" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="16" FontWeight="Bold"></TextBlock>
</Border>
<Border Grid.Row="0" Grid.Column="2" BorderThickness="1,2,2,1" BorderBrush="{StaticResource controlBorderBrush}">
<TextBlock Text="Droit" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="16" FontWeight="Bold"></TextBlock>
</Border>
<!--Profil porteur-->
<Border Grid.Row="1" Grid.Column="0" BorderThickness="2,1,1,1" BorderBrush="{StaticResource controlBorderBrush}">
<TextBlock Text="Profil porteur" VerticalAlignment="Center" HorizontalAlignment="Left" FontSize="12" TextWrapping="Wrap"></TextBlock>
</Border>
<Border Grid.Row="1" Grid.Column="1" BorderThickness="1,1,1,1" BorderBrush="{StaticResource controlBorderBrush}">
<CheckBox VerticalAlignment="Center" HorizontalAlignment="Center" IsChecked="{Binding MaConsole.ProfilPorteurGauche}" IsEnabled="{Binding MaConsole.ProfilPorteurGaucheEstDispo}"></CheckBox>
</Border>
<Border Grid.Row="1" Grid.Column="2" BorderThickness="1,1,2,1" BorderBrush="{StaticResource controlBorderBrush}">
<CheckBox VerticalAlignment="Center" HorizontalAlignment="Center" IsChecked="{Binding MaConsole.ProfilPorteurDroit}" IsEnabled="{Binding MaConsole.ProfilPorteurDroitEstDispo}"></CheckBox>
</Border>
<!--Anneau décalé-->
<Border Grid.Row="2" Grid.Column="0" BorderThickness="2,1,1,1" BorderBrush="{StaticResource controlBorderBrush}">
<TextBlock Text="Anneau décalé" VerticalAlignment="Center" HorizontalAlignment="Left" FontSize="12" TextWrapping="Wrap"></TextBlock>
</Border>
<Border Grid.Row="2" Grid.Column="1" BorderThickness="1,1,1,1" BorderBrush="{StaticResource controlBorderBrush}">
<CheckBox VerticalAlignment="Center" HorizontalAlignment="Center" IsChecked="{Binding MaConsole.AnneauDécaléGauche}" IsEnabled="{Binding MaConsole.AnneauDécaléGaucheEstDispo}"></CheckBox>
</Border>
<Border Grid.Row="2" Grid.Column="2" BorderThickness="1,1,2,1" BorderBrush="{StaticResource controlBorderBrush}">
<CheckBox VerticalAlignment="Center" HorizontalAlignment="Center" IsChecked="{Binding MaConsole.AnneauDécaléDroit}" IsEnabled="{Binding MaConsole.AnneauDécaléDroitEstDispo}"></CheckBox>
</Border>
<!--Glissière de reprise-->
<Border Grid.Row="3" Grid.Column="0" BorderThickness="2,1,1,1" BorderBrush="{StaticResource controlBorderBrush}">
<TextBlock Text="Glissière de reprise" VerticalAlignment="Center" HorizontalAlignment="Left" TextWrapping="Wrap"></TextBlock>
</Border>
<Border Grid.Row="3" Grid.Column="1" Grid.ColumnSpan="2" BorderThickness="1,1,2,1" BorderBrush="{StaticResource controlBorderBrush}">
<CheckBox VerticalAlignment="Center" HorizontalAlignment="Center" IsChecked="{Binding MaConsole.GlissièreDeReprise}" IsEnabled="{Binding MaConsole.GlissièreDeRepriseEstDispo}"></CheckBox>
</Border>
<!--Glissière de reprise plateau arrière-->
<Border Grid.Row="4" Grid.Column="0" BorderThickness="2,1,1,1" BorderBrush="{StaticResource controlBorderBrush}">
<TextBlock Text="Glissière de reprise plateau arrière" VerticalAlignment="Center" HorizontalAlignment="Left" TextWrapping="Wrap"></TextBlock>
</Border>
<Border Grid.Row="4" Grid.Column="1" Grid.ColumnSpan="2" BorderThickness="1,1,2,1" BorderBrush="{StaticResource controlBorderBrush}">
<CheckBox VerticalAlignment="Center" HorizontalAlignment="Center" IsChecked="{Binding MaConsole.GlissièreDeReprisePlateauArrière}" IsEnabled="{Binding MaConsole.GlissièreDeReprisePlateauArrièreEstDispo}"></CheckBox>
</Border>
<!--Tôle sur extensible-->
<Border Grid.Row="5" Grid.Column="0" BorderThickness="2,1,1,1" BorderBrush="{StaticResource controlBorderBrush}">
<TextBlock Text="Tôle sur extensible" VerticalAlignment="Center" HorizontalAlignment="Left" TextWrapping="Wrap"></TextBlock>
</Border>
<Border Grid.Row="5" Grid.Column="1" Grid.ColumnSpan="2" BorderThickness="1,1,2,1" BorderBrush="{StaticResource controlBorderBrush}">
<CheckBox VerticalAlignment="Center" HorizontalAlignment="Center" IsChecked="{Binding MaConsole.TôleSurExtensible}" IsEnabled="{Binding MaConsole.TôleSurExtensibleEstDispo}"></CheckBox>
</Border>
<!--Plaque verte RMTCE-->
<Border Grid.Row="6" Grid.Column="0" BorderThickness="2,1,1,1" BorderBrush="{StaticResource controlBorderBrush}">
<TextBlock Text="Plaque verte RMTCE" VerticalAlignment="Center" HorizontalAlignment="Left" TextWrapping="Wrap"></TextBlock>
</Border>
<Border Grid.Row="6" Grid.Column="1" Grid.ColumnSpan="2" BorderThickness="1,1,2,1" BorderBrush="{StaticResource controlBorderBrush}">
<CheckBox VerticalAlignment="Center" HorizontalAlignment="Center" IsChecked="{Binding MaConsole.PlaqueVerteRMTCE}" IsEnabled="{Binding MaConsole.PlaqueVerteRMTCEEstDispo}"></CheckBox>
</Border>
<!--Plaque jaune benne 1000L-->
<Border Grid.Row="7" Grid.Column="0" BorderThickness="2,1,1,1" BorderBrush="{StaticResource controlBorderBrush}">
<TextBlock Text="Plaque jaune benne 1000L" VerticalAlignment="Center" HorizontalAlignment="Left" TextWrapping="Wrap"></TextBlock>
</Border>
<Border Grid.Row="7" Grid.Column="1" Grid.ColumnSpan="2" BorderThickness="1,1,2,2" BorderBrush="{StaticResource controlBorderBrush}">
<CheckBox VerticalAlignment="Center" HorizontalAlignment="Center" IsChecked="{Binding MaConsole.PlaqueJaune1000L}" IsEnabled="{Binding MaConsole.PlaqueJaune1000LEstDispo}"></CheckBox>
</Border>
</Grid>

How to change insert direction to ItemsControl

I have a control - ItemsControl that was binding to ObservableCollection of a simple model,
I want that it's itemscontrol will have a capability to insert dircetion from bottom to top, How to i can implement that?
Currently, Every insertion to itemscontrol starts from the top to bottom, but i want to change that..
<Window >
<Window.Resources>
<DataTemplate x:Key="ModelTemplate" DataType="Model:Model">
<Grid
Tag="{Binding Path=Id}"
Background="Transparent">
<Border
Name="border"
Background="#2a3345"
BorderThickness="0"
CornerRadius="10"
Margin="10">
<Border.Effect>
<DropShadowEffect
ShadowDepth="0"
Opacity="0.8"
BlurRadius="10"/>
</Border.Effect>
<Grid
Height="100"
Width="280"
Margin="6">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock
Grid.Column="1"
Text="{Binding Path=Title}"
TextOptions.TextRenderingMode="ClearType"
TextOptions.TextFormattingMode="Display"
Foreground="White"
FontFamily="Arial"
FontSize="14"
FontWeight="Bold"
VerticalAlignment="Center"
Margin="2,4,4,2"
TextWrapping="Wrap"
TextTrimming="CharacterEllipsis" />
<TextBlock
Grid.Row="1"
Grid.Column="1"
Text="{Binding Path=Message}"
TextOptions.TextRenderingMode="ClearType"
TextOptions.TextFormattingMode="Display"
Foreground="White"
FontFamily="Arial"
VerticalAlignment="Center"
Margin="2,2,4,4"
TextWrapping="Wrap"
TextTrimming="CharacterEllipsis"/>
</Grid>
</Border>
</Grid>
</DataTemplate>
</Window.Resources>
<Grid>
<ItemsControl
FocusVisualStyle="{x:Null}"
ItemsSource="{Binding SimpleCollection}"
ItemTemplate="{StaticResource ModelTemplate}" >
</ItemsControl>
</Grid>
The solution is override ItemsControl's ItemsPanel as follows:
<Window >
<Window.Resources>
<ScaleTransform ScaleY="-1" x:Key="Transform"/>
<DataTemplate x:Key="ModelTemplate" DataType="Model:Model">
<Grid
LayoutTransform="{StaticResource Transform}"
Tag="{Binding Path=Id}"
Background="Transparent">
<Border
Name="border"
Background="#2a3345"
BorderThickness="0"
CornerRadius="10"
Margin="10">
<Border.Effect>
<DropShadowEffect
ShadowDepth="0"
Opacity="0.8"
BlurRadius="10"/>
</Border.Effect>
<Grid
Height="100"
Width="280"
Margin="6">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock
Grid.Column="1"
Text="{Binding Path=Title}"
TextOptions.TextRenderingMode="ClearType"
TextOptions.TextFormattingMode="Display"
Foreground="White"
FontFamily="Arial"
FontSize="14"
FontWeight="Bold"
VerticalAlignment="Center"
Margin="2,4,4,2"
TextWrapping="Wrap"
TextTrimming="CharacterEllipsis" />
<TextBlock
Grid.Row="1"
Grid.Column="1"
Text="{Binding Path=Message}"
TextOptions.TextRenderingMode="ClearType"
TextOptions.TextFormattingMode="Display"
Foreground="White"
FontFamily="Arial"
VerticalAlignment="Center"
Margin="2,2,4,4"
TextWrapping="Wrap"
TextTrimming="CharacterEllipsis"/>
</Grid>
</Border>
</Grid>
</DataTemplate>
<ItemsPanelTemplate x:Key="ItemsPanelTemplateVerticalAlignment">
<StackPanel VerticalAlignment="Bottom" LayoutTransform="{StaticResource Transform}"/>
</ItemsPanelTemplate>
</Window.Resources>
<Grid>
<ItemsControl
FocusVisualStyle="{x:Null}"
ItemsSource="{Binding SimpleCollection}"
ItemTemplate="{StaticResource ModelTemplate}"
ItemsPanel="{StaticResource ItemsPanelTemplateVerticalAlignment}"/>
</Grid>
</Window>
The order of items in ItemsControl is the same as in ObservableCollection. Thus, if you do Collection.Insert(0, item), new item in ItemsControl will appear on the top.

Listbox ItemTemplate not rendering correctly

I have a listbox as defined below. Any idea what I need to do to get the border to display? Currently it looks like:
When it should look like:
<ListBox
Grid.Row="1"
ItemsSource="{Binding Path=ProfessionalsView}"
Style="{x:Null}">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate>
<Border BorderThickness="4">
<HeaderedContentControl>
<HeaderedContentControl.Header>
<Grid>
<TextBlock Margin="9,5,29,5" Text="{Binding Path=FormattedName}"></TextBlock>
<Image Margin="0,2.5,9,2.5" HorizontalAlignment="Right" Source="/BluBrik.Workflow;component\Images/FlagComplete_16.png" Width="16" Height="16"></Image>
</Grid>
</HeaderedContentControl.Header>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Margin="9,5,5,2.5" Text="Surname"></TextBlock>
<TextBlock Grid.Row="1" Text="Forename"></TextBlock>
<TextBlock Grid.Row="2" Text="Work Phone"></TextBlock>
<TextBlock Grid.Row="3" Text="Mobile Phone"></TextBlock>
<TextBlock Grid.Row="4" Text="Email"></TextBlock>
<TextBlock Grid.Column="1" Grid.Row="0" Margin="9,5,9,2.5" Text="{Binding Path=Surname}"></TextBlock>
<TextBlock Grid.Column="1" Grid.Row="1" Text="{Binding Path=Forenames}"></TextBlock>
<TextBlock Grid.Column="1" Grid.Row="2" Text="{Binding Path=WorkPhone}"></TextBlock>
<TextBlock Grid.Column="1" Grid.Row="3" Text="{Binding Path=MobilePhone}"></TextBlock>
<TextBlock Grid.Column="1" Grid.Row="4" Text="{Binding Path=EmailAddress}"></TextBlock>
</Grid>
</HeaderedContentControl>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Your border:
<Border BorderThickness="4">
Has no BorderBrush defined. Therefore there's nothing to paint the outlines with. Try
<Border BorderThickness="4" BorderBrush="Black">
You need to set the background Linear Gradiant color for Header. and a Border for you Contents. try below one.
<ListBox
Grid.Row="1"
ItemsSource="{Binding Path=ProfessionalsView}"
Style="{x:Null}">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate>
<Border BorderThickness="4">
<HeaderedContentControl>
<HeaderedContentControl.Header>
<Grid>
<Grid.Background>
<LinearGradientBrush EndPoint="0.5,1" MappingMode="RelativeToBoundingBox" StartPoint="0.5,0">
<GradientStop Color="#FFD1D0D0" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Grid.Background>
<TextBlock Margin="9,5,29,5" Text="{Binding Path=FormattedName}"></TextBlock>
<Image Margin="0,2.5,9,2.5" HorizontalAlignment="Right" Source="/BluBrik.Workflow;component\Images/FlagComplete_16.png" Width="16" Height="16"></Image>
</Grid>
</HeaderedContentControl.Header>
<Border BorderBrush="DarkGray" BorderThickness="3">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Margin="9,5,5,2.5" Text="Surname"></TextBlock>
<TextBlock Grid.Row="1" Text="Forename"></TextBlock>
<TextBlock Grid.Row="2" Text="Work Phone"></TextBlock>
<TextBlock Grid.Row="3" Text="Mobile Phone"></TextBlock>
<TextBlock Grid.Row="4" Text="Email"></TextBlock>
<TextBlock Grid.Column="1" Grid.Row="0" Margin="9,5,9,2.5" Text="{Binding Path=Surname}"></TextBlock>
<TextBlock Grid.Column="1" Grid.Row="1" Text="{Binding Path=Forenames}"></TextBlock>
<TextBlock Grid.Column="1" Grid.Row="2" Text="{Binding Path=WorkPhone}"></TextBlock>
<TextBlock Grid.Column="1" Grid.Row="3" Text="{Binding Path=MobilePhone}"></TextBlock>
<TextBlock Grid.Column="1" Grid.Row="4" Text="{Binding Path=EmailAddress}"></TextBlock>
</Grid>
</Border>
</HeaderedContentControl>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

Decorating UserControl WPF

I want to decorate some controls in groups like:
<UserControl x:Class="Infrastructure.UI.ItemsGroup" ... >
<Border BorderBrush="Black" BorderThickness="1" CornerRadius="5" Background="Red">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="25" />
</Grid.RowDefinitions>
<ContentPresenter Grid.Row="0" />
<TextBlock x:Name="ctrlGroupText" Grid.Row="1" HorizontalAlignment="Center" />
</Grid>
</Border>
</UserControl>
And use it in other XAML-files like:
<Grid Grid.Column="0">
<UI:ItemsGroup GroupText="Hello World">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Button>1111</Button>
<Button>1111</Button>
</Grid>
</UI:ItemsGroup>
</Grid>
But it doesn't work. What did I wrong? :)
Thanks
You need to edit the Template for the UserControl instead of adding the Border as the Child
<UserControl x:Class="Infrastructure.UI.ItemsGroup" ... >
<UserControl.Template>
<ControlTemplate TargetType="{x:Type UserControl}">
<Border BorderBrush="Black" BorderThickness="1" CornerRadius="5" Background="Red">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="25" />
</Grid.RowDefinitions>
<ContentPresenter Grid.Row="0" />
<TextBlock x:Name="ctrlGroupText" Grid.Row="1" HorizontalAlignment="Center" />
</Grid>
</Border>
</ControlTemplate>
</UserControl.Template>
</UserControl>
Update
To set the Text for the TextBlock to GroupText you can use a Binding
<TextBlock x:Name="ctrlGroupText"
Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type local:ItemsGroup}},
Path=GroupText}"
Grid.Row="1"
HorizontalAlignment="Center" />

Resources