Why does the yellow border not set to grid.column 1?

simsenVejle

Well-known member
Joined
Feb 14, 2021
Messages
46
Programming Experience
Beginner
I have this UserControl.

The Green border is what it should be 1000 px widht.

But now I want that Green area to be divided in 2 - a red area witch is half the size (in column) and the yellow should be the other half.

But when running the code, I only see the red border on the right side of the ListView. And I see the yellow border on top of the ListView.

I have tried with only grids - with dockPanel and with Stackpanels

The list view is where it should be - row 0 and column 0

But the yellow (with the 3 buttons) should be on row 0 and column 1 but is on the column 0. And I don't understand why?

I hope you can see,where I do my mistake.

Best regards
Simsen :)

My Usercontrol:

C#:
<UserControl x:Class="Views.Account.AccountObsoleteView"
             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:local="clr-namespace:Views.Account"
             xmlns:viewModel = "clr-namespace:ViewModel.Account;assembly=ViewModel"
             mc:Ignorable="d"
             d:DesignHeight="700" d:DesignWidth="1000">
    <Grid>
        <TabControl Style="{StaticResource tabControlSmall}">
            <TabItem Header="Aktive" Style="{StaticResource tabItemSmall}" >
                <Border BorderBrush="Green" BorderThickness="3">
                    <Grid Width="1000">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="525" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="500" />
                            <ColumnDefinition Width="500" />
                        </Grid.ColumnDefinitions>
                        
                            <DockPanel HorizontalAlignment="Left" Grid.Row="0" Grid.Column="0" >
                            <Border BorderBrush="Red" BorderThickness="3">
                                <Grid>
                                    <ListView ItemsSource="{Binding Categories_GetAll}" ScrollViewer.VerticalScrollBarVisibility="Visible">
                                        <ListView.View>
                                            <GridView>
                                                <GridViewColumn Header="Id" Width="50"  DisplayMemberBinding="{Binding CategoryId}"/>
                                                <GridViewColumn Header="Navn" Width="310"  DisplayMemberBinding="{Binding CategoryName}"/>
                                                <GridViewColumn Header="Global" Width="50"  DisplayMemberBinding="{Binding CategoryIsGlobal}"/>
                                            </GridView>
                                        </ListView.View>
                                    </ListView>
                                </Grid>
                            </Border>
                        </DockPanel>                           
                        
                        <Border BorderBrush="Yellow" BorderThickness="3">
                        <DockPanel Margin="10" VerticalAlignment="Top" HorizontalAlignment="Right" Grid.Row="0" Grid.Column="1">
                                <Button x:Name="BtnEdit" Content="Ret" Width="75" Grid.Column="0" Grid.Row="1" HorizontalAlignment="Right" />
                                <Button Margin="5 0 5 0" x:Name="BtnDelete" Content="Slet" Width="75" Grid.Column="1" Grid.Row="1" HorizontalAlignment="Right" />
                                <Button x:Name="BtnNew" Content="Ny" Width="75" Grid.Column="2" Grid.Row="1" HorizontalAlignment="Right" />
                            </DockPanel>
                        </Border>
                    </Grid>
                </Border>
            </TabItem>
            <TabItem Header="Inaktive" Style="{StaticResource tabItemSmall}">
            </TabItem>
        </TabControl>
    </Grid>
</UserControl>

App.xaml styles:
<Application
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:AnsiBug"
             xmlns:syncfusion="http://schemas.syncfusion.com/wpf" x:Class="AnsiBug.App"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <!--#region Label -->
        <Style TargetType="{x:Type Label}">
            <Setter Property="Foreground" Value="Black" />
            <Setter Property="FontFamily" Value="Verdana" />
            <Setter Property="FontSize" Value="12" />
            <Setter Property="FontWeight" Value="Normal" />
            <Setter Property="Height" Value="25" />
        </Style>
        <!--#endregion-->
        <!--#region ListViewHeader -->
        <Style TargetType="{x:Type GridViewColumnHeader}">
            <Setter Property="HorizontalContentAlignment" Value="Left" />
        </Style>
        <!--#endregion-->
        
        <!--#region Textblock -->
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="FontFamily" Value="Verdana" />
        </Style>
        <Style TargetType="{x:Type TextBlock}" x:Key="TextBlock">
            <Setter Property="FontFamily" Value="Verdana" />
            <Setter Property="Foreground" Value="Black" />
            <Setter Property="FontFamily" Value="Verdana" />
            <Setter Property="FontSize" Value="12" />
            <Setter Property="FontWeight" Value="Normal" />
        </Style>
        <!--#endregion-->

        <!--#region Listbox -->
        <Style TargetType="{x:Type ListBox}">
            <Setter Property="Height" Value="503" />
        </Style>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="Width" Value="450" />
            <Setter Property="Height" Value="20" />
            <Setter Property="VerticalAlignment" Value="Top" />
            <Setter Property="HorizontalAlignment" Value="Left" />
            <Setter Property="FontFamily" Value="Verdana" />
            <Setter Property="FontSize" Value="12" />
            <Setter Property="BorderThickness" Value="0" />
            <Setter Property="BorderBrush" Value="Black" />
        </Style>
        <!--#endregion-->

        <!--#region Textbox -->
        <Style TargetType="{x:Type TextBox}">
            <Setter Property="Foreground" Value="Black"/>
            <Setter Property="FontFamily" Value="Verdana" />
            <Setter Property="FontSize" Value="10" />
        </Style>
        <!--#endregion-->

        <!--#region Buttons -->

        <Style TargetType="{x:Type Button}">
            <Setter Property="Foreground" Value="White" />
            <Setter Property="FontFamily" Value="Verdana" />
            <Setter Property="FontSize" Value="12" />
            <Setter Property="Width" Value="122" />
            <Setter Property="HorizontalAlignment" Value="Center" />
            <Setter Property="HorizontalContentAlignment" Value="Center" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="BorderBrush" Value="White" />
            <Setter Property="Height" Value="30" />
            <Setter Property="Padding" Value="15 15 15 15" />
            <Setter Property="Background" Value="#005b7f" />

            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                            <ContentPresenter x:Name="PART_Content"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          TextElement.Foreground="{TemplateBinding Foreground}"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="FontWeight" Value="Bold" />
                    <Setter Property="Background" Value="#5c99b1" />
                    <Setter Property="Foreground" Value="White" />
                    <Setter Property="BorderBrush" Value="#92bccc" />
                    <Setter Property="BorderThickness" Value="1,1,3,3" />
                </Trigger>
                <Trigger Property="IsMouseOver" Value="False">
                    <Setter Property="Foreground" Value="White" />
                    <Setter Property="BorderBrush" Value="#92bccc" />
                    <Setter Property="BorderThickness" Value="0,0,3,3" />
                </Trigger>
            </Style.Triggers>
        </Style>
        <!--#endregion-->
        
        <!--#region Top Menu knapper-->
        <Style TargetType="{x:Type Button}" x:Key="TopMenuButton">           
            <!--<Setter Property="Background" Value="White"/>-->
            <Setter Property="Foreground" Value="Black" />
            <Setter Property="FontFamily" Value="Verdana" />
            <Setter Property="FontSize" Value="12" />
            <Setter Property="Width" Value="122" />
            <Setter Property="HorizontalAlignment" Value="Left" />
            <Setter Property="HorizontalContentAlignment" Value="Left" />
            <Setter Property="VerticalContentAlignment" Value="Top" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="BorderBrush" Value="#005b7f" />
            <Setter Property="Height" Value="30" />
            <Setter Property="Padding" Value="15 15 15 15" />
            <Setter Property="ContextMenuService.IsEnabled" Value="False" />
            <Setter Property="ContextMenuService.Placement" Value="Bottom" />
            <Setter Property="ContextMenuService.PlacementTarget" Value="{Binding ElementName=BtnReports}" />
            <Setter Property="ContextMenuService.ShowOnDisabled" Value="False" />
            <Setter Property="Background">
                <Setter.Value>
                    <!--Øverste knap on mouse over-->
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="White" Offset="0.465"/>
                        <GradientStop Color="White" Offset="0.526"/>
                        <GradientStop Color="#005b7f" Offset="0.991"/>
                        <GradientStop Color="#005b7f" Offset="1"/>
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
            
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                            <ContentPresenter x:Name="PART_Content"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          TextElement.Foreground="{TemplateBinding Foreground}"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="White" />
                    <Setter Property="FontWeight" Value="Bold" />
                    <Setter Property="Padding" Value="15 15 15 15" />
                    <Setter Property="Background">
                        <Setter.Value>
                            <!--Øverste knap on mouse over-->
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="White" Offset="0.465"/>
                                <GradientStop Color="White" Offset="0.526"/>
                                <GradientStop Color="#005b7f" Offset="0.991"/>
                                <GradientStop Color="#005b7f" Offset="1"/>
                            </LinearGradientBrush>
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </Style.Triggers>
        </Style>
        
        <!--#endregion-->

        <!--#region ContextMenu -->
        <Style TargetType="{x:Type ContextMenu}">
            <Setter Property="OverridesDefaultStyle" Value="True" />
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="Foreground" Value="White" />
            <Setter Property="Width" Value="122" />
            <Setter Property="Placement" Value="Bottom" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ContextMenu}">
                        <Border BorderThickness="1" CornerRadius="4" BorderBrush="Black" x:Name="Border" Background="#005b7f">
                            <StackPanel ClipToBounds="True" Orientation="Vertical" IsItemsHost="True" Background="#005b7f" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter TargetName="Border" Property="Background" Value="White" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!---Top menu underpunkter-->
        <Style TargetType="{x:Type MenuItem}">
            <Setter Property="Foreground" Value="White" />
            <Setter Property="Margin" Value="-5,0,0,0" />
            <Setter Property="Height" Value="30" />
            <Setter Property="FontSize" Value="12" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type MenuItem}">
                        <Border x:Name="Border" Padding="10,5,10,5" BorderThickness="0" Margin="0">
                            <ContentPresenter ContentSource="Header" x:Name="HeaderHost" RecognizesAccessKey="True" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsHighlighted" Value="true">
                                <Setter Property="Background" TargetName="Border" Value="#5c99b1"/>
                                <Setter Property="Foreground" Value="White" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>           
        </Style>
        <!--#endregion-->

        <!--#region TabControl i venstre side ved Ret konto hovedmenu punktet -->
        <Style TargetType="{x:Type TabControl}" x:Key="tabControlLarge">
            <Setter Property="TabStripPlacement" Value="Left"/>
            <Setter Property="Width" Value="1110"/>
            <Setter Property="Height" Value="590"/>
            <Setter Property="HorizontalAlignment" Value="Left"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="FontFamily" Value="Verdana"/>
            <Setter Property="FontSize" Value="12"/>
            <Setter Property="BorderBrush" Value="Black"/>
            <Setter Property="BorderThickness" Value="1" />
        </Style>
        <Style TargetType="{x:Type TabItem}" x:Key="tabItemLarge">
            <Setter Property="Background" Value="Black" />
            <Setter Property="FontFamily" Value="Verdana"/>
            <Setter Property="FontSize" Value="12"/>
            <Setter Property="Width" Value="115"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabItem}">
                        <Grid>
                            <Border Name="Border"
                                    BorderThickness="1,1,1,1"
                                    CornerRadius="0,0,0,0"
                                    Height="40" BorderBrush="Black">
                                <ContentPresenter x:Name="ContentSite"
                                                  VerticalAlignment="Center"
                                                  HorizontalAlignment="Left"
                                                  ContentSource="Header"
                                                  Margin="12,2,12,2"
                                                  RecognizesAccessKey="True" />
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter TargetName="Border" Property="Background" Value="#5c99b1" />
                                <Setter Property="Foreground" Value="White" />
                                <Setter Property="FontWeight" Value="ExtraBold" />
                            </Trigger>
                            <Trigger Property="IsSelected" Value="False">
                                <Setter TargetName="Border" Property="Background">
                                    <Setter.Value>
                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                            <GradientStop Color="White" Offset="0.465"/>
                                            <GradientStop Color="White" Offset="0.526"/>
                                            <GradientStop Color="#005b7f" Offset="0.991"/>
                                            <GradientStop Color="#005b7f" Offset="1"/>
                                        </LinearGradientBrush>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" TargetName="Border" Value="#5c99b1"/>
                                <Setter Property="Foreground" Value="White"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!--Obsolete menupunkterne-->
        <Style TargetType="{x:Type TabControl}" x:Key="tabControlSmall">
            <Setter Property="TabStripPlacement" Value="Top"/>
            <Setter Property="Height" Value="580"/>
            <Setter Property="HorizontalAlignment" Value="Left"/>
            <Setter Property="FontFamily" Value="Verdana"/>
            <Setter Property="BorderBrush" Value="Black"/>
            <Setter Property="BorderThickness" Value="1" />
        </Style>
        <Style TargetType="{x:Type TabItem}" x:Key="tabItemSmall">
            <Setter Property="Background" Value="Black" />
            <Setter Property="FontFamily" Value="Verdana"/>
            <Setter Property="FontSize" Value="10" />
            <Setter Property="Height" Value="35" />
            <Setter Property="FontSize" Value="9"/>
            <Setter Property="Width" Value="70"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabItem}">
                        <Grid>
                            <Border Name="Border"
                                    BorderThickness="1,1,1,1"
                                    CornerRadius="0,0,0,0"
                                    Height="40" BorderBrush="Black">
                                <ContentPresenter x:Name="ContentSite"
                                                  VerticalAlignment="Center"
                                                  HorizontalAlignment="Left"
                                                  ContentSource="Header"
                                                  Margin="12,2,12,2"
                                                  RecognizesAccessKey="True" />
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter TargetName="Border" Property="Background" Value="#5c99b1" />
                                <Setter Property="Foreground" Value="White" />
                                <Setter Property="FontWeight" Value="ExtraBold" />
                            </Trigger>
                            <Trigger Property="IsSelected" Value="False">
                                <Setter TargetName="Border" Property="Background">
                                    <Setter.Value>
                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                            <GradientStop Color="#005b7f" Offset="1"/>
                                        </LinearGradientBrush>
                                    </Setter.Value>                                   
                                </Setter>
                                <Setter Property="Foreground" Value="White"/>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" TargetName="Border" Value="#5c99b1"/>
                                <Setter Property="Foreground" Value="White"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <!--#endregion-->
    </Application.Resources>
</Application>
 
I forgot to attached the image
 

Attachments

  • Column.jpg
    Column.jpg
    115.5 KB · Views: 22
Last edited by a moderator:
I found it out by myself. It was the borders that f..... the propertions up. I started over - whitout the borders, and I think I got it now
 
The yellow border doesn't have row/column set so it should be default 0/0.
 
Solution
Back
Top Bottom