Xamarin Forms ViewCell проведите пальцем для отображения кнопок
Tl; dr: как использовать swipe для отображения кнопок в формах Xamarin, таких как почтовое приложение iOS
Я пытаюсь реализовать swipe для отображения кнопок для приложения Xamarin Forms iOS, аналогичного пользовательскому интерфейсу почтового приложения iOS или этого https://components.xamarin.com/view/swtableviewcell этот компонент среди многих других примеров, которые я нашел, отлично подходит для собственных реализаций iOS, но мне нужно показать этот пользовательский интерфейс через Xamarin forms.
В настоящее время у меня есть пользовательский распознаватель жестов swipe вот так:
[assembly: ExportRenderer(typeof(SwipeViewCell), typeof(SwipeIosRenderer))]
namespace MyApp.iOS.Renderers
{
public class SwipeIosRenderer : ViewCellRenderer
{
UISwipeGestureRecognizer swipeRightGestureRecognizer;
UISwipeGestureRecognizer swipeLeftGestureRecognizer;
protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
{
base.OnElementChanged(e);
swipeRightGestureRecognizer = new UISwipeGestureRecognizer(() => UpdateRight()) { Direction = UISwipeGestureRecognizerDirection.Right };
swipeLeftGestureRecognizer = new UISwipeGestureRecognizer(() => UpdateLeft()) { Direction = UISwipeGestureRecognizerDirection.Left };
if (e.NewElement == null)
{
if (swipeRightGestureRecognizer != null)
{
this.RemoveGestureRecognizer(swipeRightGestureRecognizer);
}
if (swipeLeftGestureRecognizer != null)
{
this.RemoveGestureRecognizer(swipeLeftGestureRecognizer);
}
}
if (e.OldElement == null)
{
this.AddGestureRecognizer(swipeRightGestureRecognizer);
this.AddGestureRecognizer(swipeLeftGestureRecognizer);
}
}
private void UpdateLeft()
{
Console.WriteLine("Left swipe");
}
private void UpdateRight()
{
Console.WriteLine("Right swipe");
}
}
, который привязан к viewcells в списке. Теперь, когда я могу распознать жест "swipe", мне нужна помощь в том, как на самом деле переместить ячейку представления и показать кнопку, как в приведенных выше примерах?
Было бы здорово сделать это в рамках представлений XAML, но я открыт для всего. У меня есть функция UpdateLeft и UpdateRight, которая также вызывается при соответствующих движениях салфетки, если это можно использовать?
**EDIT: мне нужно сделать это как для левого, так и для правого взмах. ContextActions предоставляет только функцию левого свайпа.
Надеюсь, что это имеет смысл!
1 ответ:
Будут ликонтекстные действия работать для вас? Я не пробовал на других платформах,но на iOS он создаст меню swipe, как и почтовое приложение. Вы также должны иметь возможность использовать XAML и привязку к свойствам команд.
Редактировать: Поскольку вы уточнили, что вам нужны кнопки прокрутки влево и вправо, которые не существуют в ContextActions, вы можете использовать существующий компонент SWTableViewCell, который уже имеет желаемое поведение, и адаптировать его к Ксамарин.Формы.
Иосрендерер:
public class SwipeIosRenderer : TextCellRenderer { static NSString rid = new NSString("SWTableViewCell"); public override UITableViewCell GetCell(Cell item, UITableViewCell reusableCell, UITableView tv) { var forms_cell = (SwipeCell)item; SWTableViewCell native_cell = reusableCell as SWTableViewCell; if (native_cell == null) { native_cell = new SWTableViewCell(UITableViewCellStyle.Default, rid); if (forms_cell != null) { var cellDelegate = new CellDelegate(forms_cell); native_cell.Delegate = cellDelegate; if (forms_cell.LeftContextActions != null) { var left = new NSMutableArray(); foreach (var btn in forms_cell.LeftContextActions) { AddButton(left, btn); } native_cell.LeftUtilityButtons = NSArray.FromArray<UIButton>(left); } if (forms_cell.RightContextActions != null) { var right = new NSMutableArray(); foreach (var btn in forms_cell.RightContextActions) { AddButton(right, btn); } native_cell.RightUtilityButtons = NSArray.FromArray<UIButton>(right); } } native_cell.TextLabel.Text = forms_cell.Text; } var fs = forms_cell.ImageSource as FileImageSource; if (fs != null) { native_cell.ImageView.Image = UIImage.FromBundle(fs.File); } return native_cell; } void AddButton(NSMutableArray array,Button btn){ if (!String.IsNullOrEmpty(btn.Image?.File)) { array.AddUtilityButton(btn.BorderColor.ToUIColor(), UIImage.FromBundle(btn.Image.File)); } else { array.AddUtilityButton(btn.BorderColor.ToUIColor(), btn.Text); } } public class CellDelegate : SWTableViewCellDelegate { SwipeCell forms_cell; public CellDelegate(SwipeCell forms_cell) { this.forms_cell = forms_cell; } public override void DidTriggerLeftUtilityButton(SWTableViewCell cell, nint index) { if (forms_cell.LeftContextActions.Count > index) { var c = forms_cell.LeftContextActions[(int)index]; var cmd = c.Command; if (cmd != null) { cmd.Execute(c.CommandParameter); } } } public override void DidTriggerRightUtilityButton(SWTableViewCell cell, nint index) { if (forms_cell.RightContextActions.Count > index) { var c = forms_cell.RightContextActions[(int)index]; var cmd = c.Command; if (cmd != null) { cmd.Execute(c.CommandParameter); } } } }Пример XAML:
<ListView x:Name="SwipeList"> <ListView.ItemTemplate> <DataTemplate> <test:SwipeCell Text="{Binding Data}" ImageSource="{Binding Image}"> <test:SwipeViewCell.LeftContextActions> <Button Text="L1" Command="{Binding LeftAction}" BorderColor="Aqua"/> <Button Command="{Binding LeftAction2}" BorderColor="Gray" Image="xamarin.png"/> </test:SwipeViewCell.LeftContextActions> <test:SwipeViewCell.RightContextActions> <Button Text="R1" Command="{Binding RightAction}" BorderColor="Blue" /> <Button Text="R2" Command="{Binding RightAction2}" BorderColor="Purple" /> </test:SwipeViewCell.RightContextActions> </test:SwipeViewCell> </DataTemplate> </ListView.ItemTemplate> </ListView>Пример Кода За
public class MyListItem { Page page; public MyListItem(Page page) { this.page = page; this.LeftAction= new Command(() => this.page.DisplayAlert("Left 1", this.Data, "OK")); this.LeftAction2= new Command(() => this.page.DisplayAlert("Left 2", this.Data, "OK")); this.RightAction= new Command(() => this.page.DisplayAlert("Right 1", this.Data, "OK")); this.RightAction2= new Command(() => this.page.DisplayAlert("Right 2", this.Data, "OK")); } public string Image{ get; set; } string data; public string Data { get { return data; } set { data = value; } } ICommand leftAction; public ICommand LeftAction { get { return leftAction; } set { leftAction = value; } } ICommand leftAction2; public ICommand LeftAction2 { get { return leftAction2; } set { leftAction2 = value; } } ICommand rightAction; public ICommand RightAction { get { return rightAction; } set { rightAction = value; } } ICommand rightAction2; public ICommand RightAction2 { get { return rightAction2; } set { rightAction2 = value; } } public override string ToString() { return this.Data; } } public TestPage() { InitializeComponent(); this.SwipeList.ItemsSource = new List<MyListItem>(){ new MyListItem(this){Data="A"}, new MyListItem(this){Data="B", Image="xamarin.png"}, new MyListItem(this){Data="C"}, new MyListItem(this){Data="D"}, }; }
Comments