Question

I have the an existing WPF xaml layout to which I added a stackview with a label and button. However, after adding it, the “columns” and “Layout columns” treeviews disappear when running the application. Here is the xaml for the form:

<UserControl xmlns:my="clr-namespace:MyNamespace.Controls.LayoutEditors.OrderableList"  x:Class="MyNamespace.Controls.LayoutEditors.LayoutColumnsEditor"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         mc:Ignorable="d" 
         d:DesignHeight="832" d:DesignWidth="595"
         >
<Grid Name="Grid">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="110" />
            <RowDefinition Height="5" />                
        </Grid.RowDefinitions>
        <Grid Name="gridLabels">
            <StackPanel Orientation="Vertical">
                <Label Style="{StaticResource SubHeaderLabel}" Content="Properties" HorizontalAlignment="Stretch" HorizontalContentAlignment="Left" />
                <StackPanel Margin="0 5"  Orientation="Horizontal">
                    <Label Content="Layout Name:" HorizontalContentAlignment="Right" Width="120"  />
                    <TextBox Width="488" HorizontalAlignment="Left" VerticalAlignment="Top" Name="EditLayoutName" LostKeyboardFocus="TextBoxLayoutNameLostFocus" MaxLength="50" />
                </StackPanel>
                <StackPanel Orientation="Horizontal">
                    <Label Content="Description:" HorizontalContentAlignment="Right" Width="120" />
                    <TextBox Height="50" Name="EditDescription" VerticalScrollBarVisibility="Auto"  Width="483" TextWrapping="WrapWithOverflow" HorizontalScrollBarVisibility="Auto" />
                </StackPanel>
                <StackPanel Orientation="Horizontal" >
                    <Label Content="Search for Columns:" HorizontalContentAlignment="Right" Width="120"></Label>
                    <TextBox Height="50" Name="txtColumnName" Width="200" TextWrapping="NoWrap" HorizontalScrollBarVisibility="Hidden" TextChanged="txtColumnName_TextChanged"></TextBox>
                </StackPanel>
            </StackPanel>
        </Grid>
    </Grid>
    <Grid Grid.Row="2" Name="gridColumns">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="300" MinWidth="40" />
            <ColumnDefinition Width="7" />
            <ColumnDefinition MinWidth="40" />
        </Grid.ColumnDefinitions>
        <Grid Background="White">
            <Grid.RowDefinitions>
                <RowDefinition Height="20" />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Label Grid.Row="0" Content="Columns:" Height="21" HorizontalAlignment="Stretch" HorizontalContentAlignment="Left" Name="labelColumns" VerticalAlignment="Top" Style="{StaticResource SubHeaderLabel}" />
            <telerik:RadTreeView Background="White" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.HorizontalScrollBarVisibility="Auto" FontSize="11" Grid.Row="1" Name="TreeColumns" HorizontalAlignment="Stretch" IsDragDropEnabled="False" IsTextSearchEnabled="True" ItemDoubleClick="TreeColumnsItemDoubleClick" IsEditable="True" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" />
        </Grid>
        <GridSplitter Grid.Column="1" HorizontalAlignment="Left" Name="gridSpiliter" Width="7" Background="#FF4D6798" VerticalAlignment="Stretch" ResizeDirection="Columns" BorderBrush="#FF021E4B" BorderThickness="1" />
        <Grid Grid.Column="2" Name="TileViewGrid" MinWidth="40">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="174*" />
                <ColumnDefinition Width="114*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="20" />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Label Content="Layout Columns:" Height="21" Name="labelLauoutColumns" VerticalAlignment="Top" HorizontalContentAlignment="Left" HorizontalAlignment="Stretch" Style="{StaticResource SubHeaderLabel}" Grid.RowSpan="2" Grid.ColumnSpan="2" />
            <ScrollViewer Grid.Row="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" VerticalScrollBarVisibility="Auto" Grid.ColumnSpan="2">
                <my:OrderableList x:Name="ListLayoutColumns" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="White" />
            </ScrollViewer>
        </Grid>
    </Grid>
</Grid>
 </UserControl>

Answer 1

For the elements add the Grid.Column and Grid.Row values. For instance:

<Label Content="Layout Columns:" Height="21" Name="labelLauoutColumns" 
    VerticalAlignment="Top" HorizontalContentAlignment="Left" 
    HorizontalAlignment="Stretch" Style="{StaticResource SubHeaderLabel}" 
    Grid.RowSpan="2" Grid.ColumnSpan="2" 
    Grid.Column="0" Grid.Row="0"
/>

In fact, make sure that you do this for each UI element that will be contained in the grid. This way you can be sure that the controls are exactly where you want them.

HTH!