We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Swiping not working on Android but works on iOS, Mac and ipad

Hello as the title implies, swiping isn't working my code is as shown below:


<syncfusion:SfListView x:Name="invoicesListView"

   x:Uid="Invoices"

   SelectionMode="Single"

   SelectedItem="{Binding SelectedInvoice, Mode=TwoWay}"

   IsScrollingEnabled="True"

   IsStickyHeader="True"

   IsStickyGroupHeader="True"

   AllowSwiping="{OnIdiom Default=True, Desktop=False}"

   AllowGroupExpandCollapse="True"

   ItemSize="200"

   HeaderSize="75"

   ItemsSource="{Binding Invoices}"

   GroupHeaderSize="50"

   BackgroundColor="{DynamicResource Transparent}"

   SelectionBackground="{DynamicResource Transparent}"

   SelectionChangedCommand="{Binding TappedCommand}"

   SelectionChangedCommandParameter="{Binding Source={x:Reference invoicesListView},Path=SelectedItem}"

   SwipeEnded="invoicesListView_SwipeEnded"

   ItemTemplate="{StaticResource ItemTemplate}"

   SelectedItemTemplate="{StaticResource SelectedItemTemplate}"

   StartSwipeTemplate="{StaticResource LeftSwipeTemplate}"

   EndSwipeTemplate="{StaticResource RightSwipeTemplate}"

   HeaderTemplate="{StaticResource HeaderTemplate}"

   GroupHeaderTemplate="{StaticResource GroupHeaderTemplate}">

<syncfusion:SfListView.ItemsLayout>

<syncfusion:GridLayout SpanCount="{OnIdiom Phone=1, Tablet=2, Desktop=3, Default=4}" />

</syncfusion:SfListView.ItemsLayout>

</syncfusion:SfListView>






7 Replies

SY Suthi Yuvaraj Syncfusion Team November 1, 2022 02:56 PM UTC

Hi Paula


We are unable to reproduce the issue at our end, we have create a simple sample with provided code snippet , swiping is works fine with ItemsLayout as GridLayout and Grouping , Start and EndSwipeTemplates are shown while swiping. we have attached the workable sample for your reference.


Please share the below details which would be more helpful for us to find the solution as soon as possible.

  1. Code snippet related to ItemTemplate , StartSwipeTemplate and EndSwipeTemplate
  2. Code snippet related to grouping
  3. Code snippet related Swiping events and customization if any.
  4. .NET Framework Dependencies version
  5. Syncfusion.Maui.ListView version
  6. Tested device details and replication image or video to illustrate the  issue.


Regards,

Suthi Yuvaraj.



Attachment: Swiping_cd3e3ace.zip


PA Paula Aliu November 1, 2022 06:44 PM UTC

Hello Suthi,

Listview version 20.3.52


I have attached the .cs and xaml files in a zip file 

<ContentPage.Resources>

<LinearGradientBrush x:Key="RedLinearGradientBrush"

 StartPoint="0.0,0.0"

 EndPoint="1.0, 1.0">

<LinearGradientBrush.GradientStops>

<GradientStop Color="{DynamicResource Dull-Red}"

  Offset="0.1" />

<GradientStop Color="{DynamicResource Red}"

  Offset="1.0" />

</LinearGradientBrush.GradientStops>

</LinearGradientBrush>


<LinearGradientBrush x:Key="GreenLinearGradientBrush"

 StartPoint="0.0,0.0"

 EndPoint="1.0, 1.0">

<LinearGradientBrush.GradientStops>

<GradientStop Color="{DynamicResource LightGreen}"

  Offset="0.0" />

<GradientStop Color="{DynamicResource Green}"

  Offset="1.0" />

</LinearGradientBrush.GradientStops>

</LinearGradientBrush>


<Shadow x:Key="ItemButton"

Offset="-2,2"

Radius="5"

Brush="{DynamicResource PrimaryTextColor}"/>


<Shadow x:Key="ItemFrame"

Offset="-2,2"

Radius="5"

Brush="{DynamicResource Gray-400}" />


<DataTemplate x:Key="ItemTemplate"

  x:DataType="entities:Item">

<Frame Margin="15,5"

   Padding="0"

   Shadow="{StaticResource ItemFrame}"

   BackgroundColor="{DynamicResource GrayShadowColor}"

   CornerRadius="5">

<Border Style="{StaticResource DataFormBorderlessEntryBorderStyle}"

Padding="0">

<Grid ColumnDefinitions="*,9*"

  ColumnSpacing="2">

<BoxView BackgroundColor="{Binding Type, Converter={StaticResource ItemTypeToColorConverter}}" />

<Grid RowDefinitions="2*, *, *"

  Padding="10"

  Grid.Column="1"

  VerticalOptions="FillAndExpand">

<Label Grid.Row="0"

   Text="{Binding Description}"

   Style="{StaticResource MediumLabelStyle}"

   LineBreakMode="WordWrap"

   Padding="0,5"

   HorizontalTextAlignment="Start"

   VerticalOptions="StartAndExpand"

   HorizontalOptions="StartAndExpand" />

<HorizontalStackLayout Grid.Row="1"

   Spacing="8">

<Label Text="{Binding Currency}"

   Style="{StaticResource MediumLabelStyle}" />

<Label Text="{Binding Price}"

   Style="{StaticResource MediumLabelStyle}" />

</HorizontalStackLayout>

<HorizontalStackLayout Grid.Row="2"

   Spacing="10"

   HorizontalOptions="End"

   VerticalOptions="FillAndExpand">


<Button BackgroundColor="{Binding Type, Converter={StaticResource ItemTypeToColorConverter}}"

HorizontalOptions="EndAndExpand"

BorderColor="{Binding Type, Converter={StaticResource ItemTypeToColorConverter}}"

BorderWidth="0.5"

CornerRadius="10"

Shadow="{StaticResource ItemFrame}"

Style="{StaticResource IconButtonStyle}"

TextColor="{DynamicResource Gray-White}"

Text="{StaticResource Edit}"

Command="{Binding Path=BindingContext.EditCommand, Source={x:Reference itemsListView}}"

CommandParameter="{Binding .}" />

<Button BackgroundColor="{Binding Type, Converter={StaticResource ItemTypeToColorConverter}}"

HorizontalOptions="EndAndExpand"

BorderColor="{Binding Type, Converter={StaticResource ItemTypeToColorConverter}}"

BorderWidth="0.5"

CornerRadius="10"

Shadow="{StaticResource ItemFrame}"

Style="{StaticResource IconButtonStyle}"

TextColor="{DynamicResource Gray-White}"

Text="{StaticResource Delete}"

Command="{Binding Path=BindingContext.DeleteCommand, Source={x:Reference itemsListView}}"

CommandParameter="{Binding .}" />


</HorizontalStackLayout>

</Grid>

</Grid>

</Border>

</Frame>

</DataTemplate>


<DataTemplate x:Key="SelectedItemTemplate"

  x:DataType="entities:Item">

<Frame Margin="15,5"

Padding="0"

Shadow="{StaticResource ItemFrame}"

BackgroundColor="{DynamicResource TranslucentDisabled}"

CornerRadius="5">

<Border Style="{StaticResource DataFormBorderlessEntryBorderStyle}"

Padding="0">

<Grid ColumnDefinitions="*,9*"

  ColumnSpacing="2">

<BoxView BackgroundColor="{Binding Type, Converter={StaticResource ItemTypeToColorConverter}}" />

<Grid RowDefinitions="2*, *, *"

  Padding="10"

  Grid.Column="1"

  VerticalOptions="FillAndExpand">

<Label Grid.Row="0"

   Text="{Binding Description}"

   Style="{StaticResource MediumLabelStyle}"

   LineBreakMode="{OnPlatform MacCatalyst='TailTruncation', Default='WordWrap'}"

   Padding="0,5"

   HorizontalTextAlignment="Start"

   VerticalOptions="StartAndExpand"

   HorizontalOptions="StartAndExpand" />

<HorizontalStackLayout Grid.Row="1"

   Spacing="8">

<Label Text="{Binding Currency}"

   Style="{StaticResource MediumLabelStyle}" />

<Label Text="{Binding Price}"

   Style="{StaticResource MediumLabelStyle}" />

</HorizontalStackLayout>

<HorizontalStackLayout Grid.Row="2"

   Spacing="10"

   HorizontalOptions="End"

   VerticalOptions="FillAndExpand">


<Button BackgroundColor="{Binding Type, Converter={StaticResource ItemTypeToColorConverter}}"

HorizontalOptions="EndAndExpand"

BorderColor="{Binding Type, Converter={StaticResource ItemTypeToColorConverter}}"

BorderWidth="0.5"

CornerRadius="10"

Shadow="{StaticResource ItemButton}"

Style="{StaticResource IconButtonStyle}"

TextColor="{DynamicResource Gray-White}"

Text="{StaticResource Edit}"

Command="{Binding Path=BindingContext.EditCommand, Source={x:Reference itemsListView}}"

CommandParameter="{Binding .}" />

<Button BackgroundColor="{Binding Type, Converter={StaticResource ItemTypeToColorConverter}}"

HorizontalOptions="EndAndExpand"

BorderColor="{Binding Type, Converter={StaticResource ItemTypeToColorConverter}}"

BorderWidth="0.5"

CornerRadius="10"

Shadow="{StaticResource ItemButton}"

Style="{StaticResource IconButtonStyle}"

TextColor="{DynamicResource Gray-White}"

Text="{StaticResource Delete}"

Command="{Binding Path=BindingContext.DeleteCommand, Source={x:Reference itemsListView}}"

CommandParameter="{Binding .}" />


</HorizontalStackLayout>

</Grid>

</Grid>

</Border>

</Frame>

</DataTemplate>


<DataTemplate x:Key="RightSwipeTemplate">

<Border StrokeShape="RoundRectangle 2,20,20,2"

StrokeThickness="0.5"

Background="{StaticResource Transparent}">

<Button BorderColor="{DynamicResource Transparent}"

Background="{StaticResource RedLinearGradientBrush}"

FontFamily="UIFontIcons"

FontSize="36"

Text="{StaticResource Delete}"

TextColor="{DynamicResource Gray-White}"

Command="{Binding Path=BindingContext.DeleteCommand, Source={x:Reference itemsListView}}"

CommandParameter="{Binding Source={x:Reference itemsListView},Path=SelectedItem}" />


<Border.Shadow>

<Shadow Offset="-3,3"

Radius="3"

Brush="{DynamicResource RedLinearGradientBrush}" />

</Border.Shadow>


</Border>

</DataTemplate>


<DataTemplate x:Key="LeftSwipeTemplate">

<Border StrokeShape="RoundRectangle 2,20,20,2"

StrokeThickness="0.5"

Background="{StaticResource Transparent}">

<Button Background="{StaticResource GreenLinearGradientBrush}"

BorderColor="{DynamicResource Transparent}"

Text="{StaticResource Edit}"

FontFamily="UIFontIcons"

FontSize="36"

TextColor="{DynamicResource Gray-White}"

Command="{Binding Path=BindingContext.EditCommand, Source={x:Reference itemsListView}}"

CommandParameter="{Binding Source={x:Reference itemsListView},Path=SelectedItem}" />

<Border.Shadow>

<Shadow Offset="3,3"

Radius="3"

Brush="{DynamicResource GreenLinearGradientBrush}" />

</Border.Shadow>

</Border>


</DataTemplate>


<DataTemplate x:Key="GroupHeaderTemplate">

<Border BackgroundColor="{DynamicResource TranslucentSelected}"

StrokeShape="RoundRectangle 15, 0, 0, 15"

Shadow="{StaticResource ItemFrame}"

Margin="5">

<Grid ColumnDefinitions="*, Auto"

  ColumnSpacing="1"

  Padding="15,2">

<Label Text="{Binding Key}"

   Style="{StaticResource LargeLabelStyle}"

   HorizontalOptions="Start"

   VerticalOptions="CenterAndExpand" />

<Label Text="{StaticResource Next}"

   FontFamily="UIFontIcons"

   FontSize="Large"

   Grid.Column="1"

   Padding="3"

   HorizontalOptions="Start"

   VerticalOptions="CenterAndExpand" />

</Grid>

</Border>

</DataTemplate>


<DataTemplate x:Key="HeaderTemplate"

  x:DataType="vm:ItemsViewModel">

<Border HorizontalOptions="End">

<Grid ColumnDefinitions="*,*"

  Padding="15,0"

  ColumnSpacing="10">

<Label Text="{Binding Title}"

   Grid.Column="0"

   HorizontalOptions="StartAndExpand"

   Style="{StaticResource TitleLabelStyle}"/>

<StackLayout Orientation="Horizontal"

 Spacing="20"

 Grid.Column="1"

 HorizontalOptions="End">

<!--#region Group By Item Type -->


<ImageButton Grid.Column="0"

 x:Name="GroupByType"

 Command="{Binding GroupByCommand}"

 CommandParameter="{Binding Source={x:Reference itemsListView}}"

 CornerRadius="5"

 BorderWidth="0.5"

 BorderColor="{DynamicResource Transparent}"

 BackgroundColor="{DynamicResource Transparent}">


<ImageButton.Source>

<FontImageSource Glyph="{StaticResource Category}"

 Color="{DynamicResource TertiaryTextColor}"

 FontFamily="UIFontIcons" />

</ImageButton.Source>


<ImageButton.Shadow>

<Shadow Offset="-2, 2"

Radius="5"

Brush="{DynamicResource PrimaryColor}" />

</ImageButton.Shadow>


</ImageButton>


<!--#endregion-->


<!--#region Add Item -->


<ImageButton Grid.Column="1"

 Command="{Binding NewCommand}"

 CornerRadius="5"

 BorderWidth="0.5"

 BorderColor="{DynamicResource Transparent}"

 BackgroundColor="{DynamicResource Transparent}">


<ImageButton.Source>

<FontImageSource Glyph="{StaticResource Add}"

 Color="{DynamicResource TertiaryTextColor}"

 FontFamily="UIFontIcons" />

</ImageButton.Source>


<ImageButton.Shadow>

<Shadow Offset="-2, 2"

Radius="5"

Brush="{DynamicResource PrimaryColor}" />

</ImageButton.Shadow>

</ImageButton>


<!--#endregion-->

</StackLayout>

</Grid>

</Border>

</DataTemplate>

</ContentPage.Resources>


Attachment: Issue_Requests_1c1068bb.zip


SY Suthi Yuvaraj Syncfusion Team November 3, 2022 02:14 AM UTC

We are able to reproduce issue at our end with provided code snippets . you have used DynamicResources for StartSwipe and EndSwipeTemplates, As Border only supports solidcolors , the crash occurs when you use the swipe templates , hence the swiping is not working . we suggest you to use solid colors instead of LinearGradientBrush used in DynamicResources. Please refer the below documentation related to Border.

Documentation link: https://learn.microsoft.com/en-us/dotnet/maui/user-interface/shadow


Also Please refer the UG for Swiping in SfListView.

UG Link: https://help.syncfusion.com/maui/listview/swiping



PA Paula Aliu November 3, 2022 08:06 PM UTC

I have changed the shadow brush to red and green, both solid colors and that doesn't affect it. To be clear, Swiping and Selection still do not work. 



SY Suthi Yuvaraj Syncfusion Team November 7, 2022 02:02 PM UTC

We have checked the provided code snippet, swiping and selection work fine. We have noticed that you have defined all the template with DynamicResources for LinearGradientBrush, and that
you have defined DynamicResources for the color property of GradientStop, which is not mentioned in the code snippet. We tested two scenarios.

  1. Scenario 1: If you set the DynamicResources as Color, which maps to the color property of GradientStop of LinearGradientBrush, GradientStop.Color property has the type of Color, it works fine.
  2. Scenario 2: If you set the DynamicResources as SolidColorBrush which maps to the color property of GradientStop , Here the crash occurs at the GradientStop.Color property is set by default in System.Windows.Media.Color type.

Refer to the below documentation for more references.

https://learn.microsoft.com/en-us/dotnet/api/system.windows.media.gradientstop.color?view=windowsdesktop-6.0#system-windows-media-gradientstop-color

Also, we have attached the tested sample for your reference. Let us know if you are still facing the issue. If yes, please share the below details, which will be more helpful for us to find the solution as soon as possible.

  1. Code snippet related to DynamicResources set to the Gradientstop.Color property
  2. Replication image or video to replicate the issue.
  3. Syncfusion.Maui.ListView version.
  4. .NET MAUI dependency packages version.


Note: We are facing issue with Frame inside the any CustomView(eg SfListView), Touch action is not passed to the control ,We have already logged a bug report for this case. Hence we suggest you to use Border or Grid instead of Frame , which restrict the tap action for selection and swiping action when you tried to swipe or tap inside the template.

Bug Report: https://github.com/dotnet/maui/issues/8330


Attachment: ListViewMaui_d16aeb95.zip


MK Maiia Kuzmishyna December 6, 2022 08:01 AM UTC

Dear SF Team,

I have faced a similar issue on Swiping in SfListView not working on Android platform but working fine on iOS.

In my case it seems the Swiping on Android is hindered by Tap Gesture Recognizer on ItemTemplate.

If I remove it - swiping works on Android fine.

However, I need to have Tap Gesture Recognizer for my application. 


Please, find a simple sample attached.


Best regards,

Maiia Kuzmishyna


Attachment: SwipingSpike_cb07ba54.zip


SY Suthi Yuvaraj Syncfusion Team December 8, 2022 03:05 PM UTC

Hi Maiia,


We have checked the reported sample “Swiping not working on Android but works on iOS, Mac and ipad”, we have checked the reported scenario with provided sample , as you have added the TapGesture to the layout inside the DataTemplate, while Swiping the items the tap gesture will recognized by the touch will not be passed to the SfListView, Hence the swipe action will not be detected.


Also we would like to let you know that if you need to use tap for your application ,you can use SfListView.ItemTapped event .Please refer the below sample and documentation for more reference.

UG Link: https://help.syncfusion.com/maui/listview/working-with-sflistview#tapped-event


Please let us know if you need further details as soon as possible.


Regards,

Suthi Yuvaraj.


Attachment: SwipingSpike_b23ec406.zip

Loader.
Live Chat Icon For mobile
Up arrow icon