Xamarin Forms:如何根据日期删除listview项之间的空白? [英] Xamarin Forms: How to remove empty space between listview items based on date?

问题描述

我正在使用 listview 来显示项目列表.这些项目将根据其日期列出.如果一天中有多个事件，我需要删除事件之间的空间，并隐藏除第一个项目以外的其他项目的日期.现在，使用以下代码使用日期可见性变量隐藏日期:

I'm using listview to display the list of items. The items are getting listed based on their date. If there are multiple events in a day I need to remove the space between the events and hide the date for the items other than the first one. Now I'm hiding the date using the day visibility variable using the following code:

foreach (var eventshb in eventsHBList)
{
    bool isFirstItem = true;
    foreach (var events in eventshb.eventsList)
    {
        if (isFirstItem)
        {
            eventshb.dayVisibility = true;
            isFirstItem = false;
        }
        else
        {
            eventshb.dayVisibility = false;
        }
        eventshb.eventsListTO = events;
        EventAllItems.Add(eventshb);
    }
}

我正在尝试删除项目之间的空白区域.对于参考，我添加了当前用户界面和必需的用户界面屏幕截图.

I'm trying to remove the empty space between the items. For refers, I have added the current UI and the required UI Screenshots.

使用列表视图显示演示项目事件已上传到驱动器中.

The demo project using the listview for displaying the events is uploaded in the drive.

推荐答案

我认为使用

I think use Grouping is the best way to achieve this,becasuse you could define a DataTemplate for your head.

如果您不想进行大的更改，可以尝试使用 iValueConverter ，根据 dayVisibility 更改 Margin 值，但是这似乎只是相对减少了间距.

If you don't want to make a big change you could try using iValueConverter,change the Margin value according to dayVisibility，but this only seems to reduce the spacing relatively.

创建 IsHasSpaceConvert :

public class IsHasSpaceConvert : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
              if ((bool)value)
        {
            return new Thickness(5,10,5,0);
        }
        else
        {
            return new Thickness(5,-5, 5,0);
        }
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

然后在您的xaml中:

then in your xaml:

 <ContentPage.Resources>
    <ResourceDictionary>
        <local:IsHasSpaceConvert x:Key="isHasSpace" />
    </ResourceDictionary>
</ContentPage.Resources>

<StackLayout>
    <ListView 
        x:Name="EventsListview"
        IsVisible="true"
        SeparatorVisibility="Default"
        ItemsSource="{Binding EventAllItems, Mode=TwoWay}"
        HasUnevenRows="True">
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <ViewCell.View>
                        <StackLayout 
                            Margin="{Binding dayVisibility,
                                Converter={StaticResource isHasSpace}}"
                            Padding="5"
                            Orientation="Vertical">
                            <Frame>
                                <StackLayout
                                    Orientation="Vertical">

                                    <Label 
                                        Text="{Binding finalDay}"
                                        IsVisible="{Binding dayVisibility}"
                                        TextColor="Black"
                                        HorizontalOptions="Start" 
                                        HorizontalTextAlignment="Start"
                                        VerticalTextAlignment="Center"
                                        VerticalOptions="CenterAndExpand">
                                        <Label.FontSize>
                                            <OnIdiom x:TypeArguments="x:Double">
                                                <OnIdiom.Phone>15</OnIdiom.Phone>
                                                <OnIdiom.Tablet>22</OnIdiom.Tablet>
                                                <OnIdiom.Desktop>15</OnIdiom.Desktop>
                                            </OnIdiom>
                                        </Label.FontSize>
                                    </Label>

                                    <Label
                                        HorizontalOptions="StartAndExpand"
                                        Text="{Binding eventsListTO.title}"
                                        VerticalOptions="CenterAndExpand"
                                        TextColor="Black">
                                        <Label.FontSize>
                                            <OnIdiom x:TypeArguments="x:Double">
                                                <OnIdiom.Phone>20</OnIdiom.Phone>
                                                <OnIdiom.Tablet>30</OnIdiom.Tablet>
                                                <OnIdiom.Desktop>20</OnIdiom.Desktop>
                                            </OnIdiom>
                                        </Label.FontSize>
                                    </Label>
                                </StackLayout>
                            </Frame>
                        </StackLayout>
                    </ViewCell.View>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
        <ListView.Footer>
            <Label/>
        </ListView.Footer>
    </ListView>
</StackLayout> 

这篇关于Xamarin Forms:如何根据日期删除listview项之间的空白?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！