ViewCell中具有不同边距的元素

时间:2018-07-25 11:11:52

标签: c# listview xamarin xamarin.forms

我有一个从列表中获取元素的列表视图,我的问题是第一项必须与第二项具有不同的利润,如下图所示:

enter image description here

偶数项应为Margin =“ 20,0,0,0”,奇数Margin =“ 0,0,0,0。

我的列表视图是这样创建的:

<ListView ItemsSource="{Binding items}" HasUnevenRows="True" ItemTapped="ListView_OnItemTapped">
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <Grid HorizontalOptions="StartAndExpand" VerticalOptions="StartAndExpand" ColumnSpacing="0" RowSpacing="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="564"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="80"/>
                        </Grid.RowDefinitions>
                        <forms:CachedImage  x:Name="Imagebe"  Grid.Row="0" DownsampleToViewSize="True"  HeightRequest="80" WidthRequest="564"  Source="{Binding Img}" Margin="0,0,0,0">
                            <forms:CachedImage.GestureRecognizers>
                                <TapGestureRecognizer NumberOfTapsRequired="1" ></TapGestureRecognizer>
                            </forms:CachedImage.GestureRecognizers>
                        </forms:CachedImage>
                    </Grid>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

1 个答案:

答案 0 :(得分:0)

正如Depechie在评论中已经提到的那样,这可能是我先前发布的答案的变体。有关随附的博客文章,请参见:https://blog.verslu.is/stackoverflow-answers/alternate-row-color-listview/

您唯一需要做的就是换掉模板,不要让它们具有不同的背景颜色,而要有不同的边距。

因此,创建一个DataTemplateSelector,如下所示:

public class MarginDataTemplateSelector : DataTemplateSelector
{
    public DataTemplate EvenTemplate { get; set; }
    public DataTemplate OddTemplate { get; set; }

    protected override DataTemplate OnSelectTemplate(object item, BindableObject container)
    {
        // TODO: Maybe some more error handling here
        return ((List<string>)((ListView)container).ItemsSource).IndexOf(item as string) % 2 == 0 ? EvenTemplate : OddTemplate;
    }
}

您的XAML是这样的:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:AlternateRowColorSample" x:Class="AlternateRowColorSample.MainPage">
    <ContentPage.Resources>
        <ResourceDictionary>
            <DataTemplate x:Key="evenTemplate">
                <ViewCell>
                    <Grid Margin="20,0,0,0">
                        <Label Text="{Binding .}" HorizontalOptions="Center" VerticalOptions="Center" />
                    </Grid>
                </ViewCell>
            </DataTemplate>
            <DataTemplate x:Key="oddTemplate">
                <ViewCell>
                    <Grid Margin="0">
                        <Label Text="{Binding .}" TextColor="White" HorizontalOptions="Center" VerticalOptions="Center" />
                    </Grid>
                </ViewCell>
            </DataTemplate>
            <local:MarginDataTemplateSelector x:Key="marginDataTemplateSelector"
                EvenTemplate="{StaticResource evenTemplate}"
                OddTemplate="{StaticResource oddTemplate}" />
        </ResourceDictionary>
    </ContentPage.Resources>

    <ListView ItemTemplate="{StaticResource marginColorDataTemplateSelector}" ItemsSource="{Binding Items}">

    </ListView>
</ContentPage>