MAUI - CollectionView with SwipeView

Question

I am trying to achieve CollectionView with right swipe for item deletion. I know how to do it in Xamarin, I read MAUI documentation and samples around SwipeView but it simply isn't there. This is what I have, tested on windows platform.

EDIT - I've put SwipeView into DataTemplete of CollectionView, but its not working either, check the sample.

EDIT2 - It work's on Android, probably on iOS too, so this looks like Windows feature.

<SwipeView
    Threshold="200">
    <SwipeView.RightItems>
        <SwipeItems>
            <SwipeItemView>
                <!--Delete icon-->
                <Frame 
                    Grid.Column="0"
                    VerticalOptions="Fill"                   
                    HorizontalOptions="Fill"
                    WidthRequest="88"
                    BackgroundColor="red">

                    <Grid VerticalOptions="Center" HorizontalOptions="Center">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <!--Delete-->
                        <Label 
                            Text="D"
                            FontSize="25" 
                            HorizontalOptions="CenterAndExpand"
                            VerticalOptions="CenterAndExpand" />
                    </Grid>
                </Frame>
            </SwipeItemView>
        </SwipeItems>
    </SwipeView.RightItems>

    <!-- Content of SwipeView-->
    <CollectionView 
        x:Name="fro_CollectionView"
        VerticalScrollBarVisibility="Always"
        SelectionMode="Single"
        VerticalOptions="Fill"
        HorizontalOptions="Fill"
        MinimumHeightRequest="5"
        ItemsSource="{Binding StockCards}">

        <CollectionView.ItemTemplate>
            <DataTemplate x:DataType="Models:StockCard">
                <Grid Padding="2">

                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>

                    <Label Grid.Row="0" Grid.Column="0" Text="{Binding Name}"/>
                    <Label Grid.Row="0" Grid.Column="1" Text="{Binding Price}"/>

                </Grid>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</SwipeView>

Link to sample project.

if you want to be able to swipe on an individual row, you would put the SwipeView inside your template, not surrounding the entire CollectionView — Jason, Dec 18 '22 at 12:45
yes, I've done that, but it isn't working either. I will update sample project with this version — Kalixt, Dec 18 '22 at 12:46

score 0 · Answer 1 · answered Dec 18 '22 at 13:24

0

It's platform specific issue (windows), currently under development.

https://github.com/dotnet/maui/issues/6152

answered Dec 18 '22 at 13:24

Kalixt

123
1
11

MAUI - CollectionView with SwipeView

1 Answers1