使用WrapPanel

时间:2016-01-28 07:15:39

标签: c# xaml windows-phone itemscontrol

我正在尝试实现以下scanarios   enter image description here

快速接触

尝试使用ItemsControl(带有WrapPanel)和一个包装在WrapPanel内的TextBox来实现它,但它没有所需的输出,因为有两个WrapPanel单独包装

<toolkit:WrapPanel Orientation="Horizontal">
     <ItemsControl ItemsSource="{Binding someThing}">
         <ItemsControl.ItemTemplate>
              <DataTemplate>
                   <Grid>
                       <Border>
                           <TextBlock Text="somesomething" />
                       </Border>
                   </Grid>
               </DataTemplate>
         </ItemsControl.ItemTemplate>
         <ItemsControl.ItemsPanel>
             <ItemsPanelTemplate>
                <toolkit:WrapPanel Orientation="Horizontal" />
              </ItemsPanelTemplate>
          </ItemsControl.ItemsPanel>
      </ItemsControl>
      <TextBox/>
 </toolkit:WrapPanel>

我在想如果我可以在ItemsControl的END处添加TextBox,但是没有这样做。请说明我的任何方法是否有任何其他解决方法/解决方案

1 个答案:

答案 0 :(得分:0)

您需要对DataTemplateSelector使用ItemsControl,并为不同的列表项指定不同的模板。

public class BlockItem
{
    // TODO
}

public class BoxItem
{
    // TODO
}

public class MyTemplateSelector : DataTemplateSelector
{
    public DataTemplate BlockTemplate { get; set; }
    public DataTemplate BoxTemplate { get; set; }

    protected override DataTemplate SelectTemplateCore(object item)
    {
        if (item is BlockItem) return BlockTemplate;
        else if (item is BoxItem) return BoxTemplate;

        return base.SelectTemplateCore(item);
    }
}

XAML:

<ItemsControl ItemsSource="{Binding someObject}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <toolkit:WrapPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplateSelector>
        <local:MyTemplateSelector>
            <local:MyTemplateSelector.BlockTemplate>
                <DataTemplate>
                    <Grid>
                        <TextBlock Text="something"/>
                    </Grid>
                </DataTemplate>
            </local:MyTemplateSelector.BlockTemplate>
            <local:MyTemplateSelector.BoxTemplate>
                <DataTemplate>
                    <Grid>
                        <TextBox Text="something"/>
                    </Grid>
                </DataTemplate>
            </local:MyTemplateSelector.BoxTemplate>
        </local:MyTemplateSelector>
    </ItemsControl.ItemTemplateSelector>
</ItemsControl>

然后,您可以在商品来源中添加不同类型的对象:

someObject.Add(new BlockItem());
someObject.Add(new BlockItem());
someObject.Add(new BlockItem());
someObject.Add(new BlockItem());
someObject.Add(new BoxItem());

如果您希望TextBox成为最后一个元素,那么您需要将其作为ItemsSource列表中的最后一项。