Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save glennstephens/8bedb3a0c9709ac402645e3d7666f14a to your computer and use it in GitHub Desktop.
Save glennstephens/8bedb3a0c9709ac402645e3d7666f14a to your computer and use it in GitHub Desktop.
Swipeable View Cell. You could add some animations to make it slightly prettier.
using System;
using Xamarin.Forms;
namespace PanningAViewCellDemo
{
public class PanningViewCell<V1, V2> : ViewCell
where V1 : View, new()
where V2 : View, new()
{
V1 mainView;
V2 hiddenView;
public double MinimumSwipeAmount { get; set; } = 30;
public PanningViewCell()
{
var grid = new Grid();
grid.RowDefinitions.Add(new RowDefinition());
grid.ColumnDefinitions.Add(new ColumnDefinition());
mainView = new V1();
hiddenView = new V2()
{
IsVisible = false
};
grid.Children.Add(hiddenView, 0, 0);
grid.Children.Add(mainView, 0, 0);
var panner = new PanGestureRecognizer();
panner.PanUpdated += (s, e) =>
{
if (e.TotalX < -MinimumSwipeAmount)
{
// Its a swipe left
hiddenView.IsVisible = true;
mainView.IsVisible = false;
} else if (e.TotalX > MinimumSwipeAmount) {
// Its a swipe right
hiddenView.IsVisible = false;
mainView.IsVisible = true;
}
};
grid.GestureRecognizers.Add(panner);
View = grid;
}
}
}
// A demo page. The TheMainDisplay and TheOtherDisplay are Content views
using Xamarin.Forms;
namespace PanningAViewCellDemo
{
public partial class PanningAViewCellDemoPage : ContentPage
{
string[] items = {
"Glenn",
"Kym",
"Rob",
"Judy",
"Sam"
};
public PanningAViewCellDemoPage()
{
InitializeComponent();
myList.ItemTemplate =
new DataTemplate(typeof(PanningViewCell<TheMainDisplay, TheOtherDisplay>));
myList.ItemsSource = items;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment