Sí, usted puede utilizar DataTemplateSelector para lograr esto.
Un DataTemplateSelector
se puede utilizar para elegir una DataTemplate
en tiempo de ejecución basado en el valor de una propiedad enlazado a datos. Esto permite que múltiples DataTemplates a ser aplicado para el mismo tipo de objeto, para personalizar la apariencia de los objetos particulares.
1.La creación de un DataTemplateSelector
Una plantilla de datos selector es implementado por la creación de una clase que hereda de DataTemplateSelector
. El OnSelectTemplate
método se reemplaza para devolver un particular DataTemplate.
Puede consultar el siguiente código:
public class UrlTemplateSelector : DataTemplateSelector
{
public DataTemplate ImageTemplate { get; set; }
public DataTemplate VideoTemplate { get; set; }
public DataTemplate OtherTemplate { get; set; }
protected override DataTemplate OnSelectTemplate(object item, BindableObject container)
{
ItemModel model = (ItemModel)item;
if (model.Url.EndsWith(".mp4")|| model.Url.EndsWith(".avi")|| model.Url.EndsWith(".rmvb")) // you can add multiple video file suffixes
{
return VideoTemplate;
}
else if (model.Url.EndsWith(".png")|| model.Url.EndsWith(".bmp") || model.Url.EndsWith(".jpg"))//you can add multiple image file suffixes
{
return ImageTemplate;
}
else {
return OtherTemplate;
}
}
}
Supongamos que ItemModel
es el elemento ligante.
public class ItemModel
{
public string Name { get; set; }
public string Url { get; set; }
}
2. El uso de(supongamos que la página es TestPage
)
TestPage.xaml
<ContentPage.Resources>
<ResourceDictionary>
<DataTemplate x:Key="imageTemplate">
<ViewCell>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.4*" />
<ColumnDefinition Width="0.6*" />
</Grid.ColumnDefinitions>
<Label Text="{Binding Name}" TextColor="Green" FontAttributes="Bold" />
<Image Grid.Column="1" Source="{Binding Url}" />
</Grid>
</ViewCell>
</DataTemplate>
<DataTemplate x:Key="videoTemplate">
<ViewCell>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.4*" />
<ColumnDefinition Width="0.6*" />
</Grid.ColumnDefinitions>
<Label Text="{Binding Name}" TextColor="Red" FontAttributes="Bold" />
<behaviors:MediaElement Grid.Column="1" Source="{Binding Url}" />
</Grid>
</ViewCell>
</DataTemplate>
<local:UrlTemplateSelector x:Key="mediaUrlTemplateSelector" ImageTemplate="{StaticResource imageTemplate}" VideoTemplate="{StaticResource videoTemplate}" />
</ResourceDictionary>
</ContentPage.Resources>
<StackLayout Margin="20">
<Label Text="ListView with a DataTemplateSelector" FontAttributes="Bold" HorizontalOptions="Center" />
<ListView x:Name="listView" Margin="0,20,0,0" ItemTemplate="{StaticResource mediaUrlTemplateSelector}" />
</StackLayout>
Para más detalles, puedes consultar:https://docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/templates/data-templates/selector.
Y hay un ejemplo incluido en el documento antes mencionado, se puede intentar.