ItemsControl In Windows Phone 8.1 project

Question

It is necessary to arrange elements in certain cells, but they all fall into the upper-left cell. Thought does not work due to the dynamic creation of rows and columns, but in static ad, nothing has changed.

Please help.

XAML

<ItemsControl x:Name="ItControl" ItemTemplate="{StaticResource DefaultGridItemTemplate}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
           <Grid >
              <Grid.RowDefinitions>
                 <RowDefinition />
                 <RowDefinition />
                 <RowDefinition/>
              </Grid.RowDefinitions>
              <Grid.ColumnDefinitions>
                 <ColumnDefinition />
                 <ColumnDefinition />
                 <ColumnDefinition/>
              </Grid.ColumnDefinitions>
            </Grid>
        </ItemsPanelTemplate>
     </ItemsControl.ItemsPanel>
     <ItemsControl.ItemContainerStyle>
         <Style TargetType="ContentPresenter">
             <Setter Property="Grid.Column" Value="{Binding Col}"/>
             <Setter Property="Grid.Row" Value="{Binding Row}"/>
         </Style>
     </ItemsControl.ItemContainerStyle>
</ItemsControl>

C#

public class FilterItem
{
    public int id_node { get; set; }
    public int id_h { get; set; }
    //[MaxLength(50)]
    public string name { get; set; }
    public int Col { get; set; }
    public int Row { get; set; }
}

Answer 1

try to add the main ItemsControl inside StackPanel with Orientation vertical.

Thanks

Answer 2

Unfortunately that will not work since there is nothing to bind to as the container isn't in XAML. What you have to do is subclass the ItemsControl and override the PrepareContainerForItemOverride function like so:

public class CustomItemsControl : ItemsControl
{
    protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
    {
        base.PrepareContainerForItemOverride(element, item);
        FrameworkElement source = element as FrameworkElement;
        source.SetBinding(Grid.ColumnProperty, new Binding { Path = new PropertyPath("Col") });
        source.SetBinding(Grid.RowProperty, new Binding { Path = new PropertyPath("Row") });
    } 
}

Then change your XAML to your CustomItemsControl instead of the items control:

        <local:CustomItemsControl x:Name="ItControl" ItemTemplate="{StaticResource DefaultGridItemTemplate}">
               <ItemsControl.ItemsPanel>

<ItemsPanelTemplate>
                    <Grid >
                        <Grid.RowDefinitions>
                            <RowDefinition />
                            <RowDefinition />
                            <RowDefinition/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition />
                            <ColumnDefinition />
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                    </Grid>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <!--<ItemsControl.ItemContainerStyle>
                <Style TargetType="ContentPresenter">
                    <Setter Property="Grid.Column" Value="{Binding Col}" />
                    <Setter Property="Grid.Row" Value="{Binding Row}"/>
                </Style>
            </ItemsControl.ItemContainerStyle>-->
        </local:CustomItemsControl>