visual - gana la aplicación 8 metro c#multiple itemTemplate

windows apps with javascript

Question

Estoy trabajando en una aplicación de metro y tengo una situación. En una de mis páginas usé listview con una plantilla de artículo personalizada que muestra una imagen y su nombre. ahora tengo que usar 2 plantillas de elementos si la imagen es vertical. Tengo que usar otra plantilla con mayor altura. ¿Puede haber 2 plantillas diferentes en una lista? Debo cambiar la plantilla en .cs algo así como if the image is horizontal listview.ItemTemplate = 1 else if the image is vertical listvew.ItemTemplate =2 ¿cómo puedo usar esto?

Answer 1

Primero crea una clase personalizada DataTemplateSelector :

public class OrientationTemplateSelector : DataTemplateSelector
{
    protected override DataTemplate SelectTemplateCore(object item, DependencyObject container)
    {
        // cast item to your custom item class
        var customItem = item as CustomItem;
        if (customItem == null)
            return null;

        string templateName = String.Empty;
        if (customItem.Width > customItem.Height
        {
            // image is horizontal
            templateName = "HorizontalItemTemplate";
        }
        else
        {
            templateName = "VerticalItemTemplate";
        }

        object template = null;
        // find template in App.xaml
        Application.Current.Resources.TryGetValue(templateName, out template);
        return template as DataTemplate;
    }
}

Defina sus plantillas de elementos como recursos (en mi caso en App.xaml - asegúrese de buscarlos en el lugar correcto dentro del selector de plantillas):

<Application.Resources>
    <DataTemplate x:Key="HorizontalItemTemplate">
        <!-- item template for horizontal image -->
    </DataTemplate>
    <DataTemplate x:Key="VerticalItemTemplate">
        <!-- item template for vertical image -->
    </DataTemplate>
</Application.Resources>

Agregue también el selector de plantillas como recurso (en el nivel de ListView como se muestra a continuación o en otro lugar superior, es decir, en la página o nivel de aplicación):

<ListView.Resources>
    <local:OrientationTemplateSelector x:Key="OrientationTemplateSelector" />
</ListView.Resources>

Ahora puede configurarlo como ItemTemplateSelector en su ListView :

<ListView ItemTemplateSelector="{StaticResource OrientationTemplateSelector}" ItemsSource="{Binding CustomItemsList}" />