How to bind SwipeItem in Xamarin using FreshMvvm

68 views Asked by At

I'm new in Xamarin and now facing with issue how to ad SwipeView in my collectionView. I look on some Youtube videos but I'm too stupid to solve ti... what I need is when user swipe from right item from list will be deleted. I use FreshMvvm and for all buttons etc. I'm able to bind it but here no...

My StockIncomePage.xaml

 <ContentPage.Content>
    <StackLayout Margin="5">
        <ListView 
            Margin="5"
            SeparatorColor="Green"
            ItemsSource="{Binding ScannedItems}">
            <ListView.Header>
                <StackLayout Orientation="Horizontal">
                    <Label Text="Posledních 15 přijatých"
                           FontSize="Title"
                           TextColor="Blue"/>
                </StackLayout>
            </ListView.Header>
            <ListView.ItemTemplate>
                <DataTemplate>
                     <SwipeView>
                        <SwipeView.RightItems>
                            <SwipeItems Mode="Execute" >
                                <SwipeItem Text="Delete"
                                           IconImageSource="delete.png"
                                           BackgroundColor="LightPink"
                                           Command="{Binding ProductDeleted}"
                                           CommandParameter="{Binding ProductNo}"
                                           />
                            </SwipeItems>
                        </SwipeView.RightItems>
                    </SwipeView>
                    <TextCell Text="{Binding ProductNo}" Detail="{Binding ProductDetail}" />
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <Button Margin="0,2" Text="Píp :-)" Command="{Binding PrintLabel}"></Button>
    </StackLayout>
</ContentPage.Content>

StockIncomePage.xaml.cs

 public partial class StockIncomePage : ContentPage
{
    public StockIncomePage()
    {
        InitializeComponent();
    }
}

and finally StockIncomePageModel where I have ICommand ProductDeleted and some void with internal logic.

public class StockIncomePageModel:FreshBasePageModel
{
    public ObservableCollection<LogRoll> ScannedItems { get; set; }
        = new ObservableCollection<LogRoll>();
    public ICommand PrintLabel { get; set; }
    public ICommand ProductDeleted { get; set; }
    public StockIncomePageModel()
    {
        PrintLabel = new Command(() =>
        {
            NewBarcodeScanned("BNIWH-12-22-32");
        });
        ProductDeleted = new Command(ItemDeleted);
    }
    public override void Init(object initData)
    {
        base.Init(initData);
        MessagingCenter.Subscribe<App, string>(this, "ScanBarcode", 
            (sender, arg) => {  NewBarcodeScanned(arg); });
    }

    private void ItemDeleted()
    {
        //someLogic
    }

How I can bind it and pass item what user want to delete to Command ? As a backend dev I'm totally lost. I think there must be some change in xaml and also in page model I will need to handle the item what should be deleted but my head is total blackout :-) If somebody can kick my ass it will be helpfull.

1

There are 1 answers

0
Liyun Zhang - MSFT On

You can try to change the parameter binding as:

CommandParameter="{Binding Source={RelativeSource Self}, Path=BindingContext}"

And then change the command:

private void ItemDeleted(LogRoll item)
{
   ScannedItems.Remove(item);
}