Is it possible to add a SwipeView to a grid row is Xamarin Forms-CodePudding

I am building a grid in the C# code of my Xamarin Forms app. I want to provide the user with ability to swipe on a row and have a swipeview tray display. I have tried to follow the documentation here - https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/swipeview.

Below is the code I have:

   private void AddSwipeControl(int pi_RowNumber)
    {
        try
        {
            //Add the swipeview
            //Add a swip control to the and have it go all the way across.  See if this works
            // SwipeItems
            SwipeItem tobj_DeleteSwipeItem = new SwipeItem
            {
                Text = "Delete",
                BackgroundColor = Color.LightGreen
            };

            tobj_DeleteSwipeItem.Invoked  = tobj_DeleteSwipeItem_Invoked; ;
            List<SwipeItem> tobj_swipeItems = new List<SwipeItem>() { tobj_DeleteSwipeItem };

            // SwipeView content
            Label swipeContent = new Label()
            {
                BackgroundColor = Color.Pink,
                HorizontalOptions = LayoutOptions.FillAndExpand,
                VerticalOptions = LayoutOptions.FillAndExpand
            };

            var tobj_SwipeGestureRecognizer = new SwipeGestureRecognizer() { Direction = SwipeDirection.Right };
            tobj_SwipeGestureRecognizer.Swiped  = tobj_SwipeGestureRecognizer_Swiped;
            swipeContent.GestureRecognizers.Add(tobj_SwipeGestureRecognizer);

            SwipeView swipeView = new SwipeView
            {
                LeftItems = new SwipeItems(tobj_swipeItems) { Mode = SwipeMode.Reveal },
                Content = swipeContent
            };

            //Add the swipeview to the grid
            grdDataGrid.Children.Add(swipeView, 0, pi_RowNumber);
            Grid.SetColumnSpan(swipeView, grdDataGrid.ColumnDefinitions.Count);
        }
        catch (Exception ex)
        {
            SharedErrorHandler.ProcessException(ex);
        }
    }

    private void tobj_SwipeGestureRecognizer_Swiped(object sender, SwipedEventArgs e)
    {
        try
        {
            if (e.Direction == SwipeDirection.Right)
            {
                var tobj_SwipeView = ((Label)sender).Parent as SwipeView;
                tobj_SwipeView.Open(OpenSwipeItem.LeftItems);
            }
        }
        catch (Exception ex)
        {
            SharedErrorHandler.ProcessException(ex);
        }
    }

I can see the content of my swipeview in my grid row exactly where I want it and the swipe event of the label control fires as expect. However the swipe tray never opens even if I attempt to programmatically open it using tobj_SwipeView.Open(OpenSwipeItem.LeftItems); This leads me to think I am doing something wrong in building my swipe view. I have tested on Android and UWP. Any ideas what I am doing wrong?.

UPDATE: So this only appears to be a challenge on UWP. Below is my updated code. I have a button on the screen I press to run the Button_Clicked event.

    private void tobj_SwipeGestureRecognizer_Swiped(object sender, SwipedEventArgs e)
    {
        try
        {
            if (e.Direction == SwipeDirection.Right)
            {
                var tobj_SwipeView = ((Label)sender).Parent as SwipeView;
                tobj_SwipeView.Open(OpenSwipeItem.LeftItems);
            }
        }
        catch (Exception ex)
        {
            //SharedErrorHandler.ProcessException(ex);
            System.Diagnostics.Debug.WriteLine(ex.ToString());
        }
    }

    private void Button_Clicked(object sender, EventArgs e)
    {
        try
        {
            //First add two rows
            grdDataGrid.RowDefinitions.Add(new RowDefinition() { Height = GridLength.Auto });
            grdDataGrid.RowDefinitions.Add(new RowDefinition() { Height = GridLength.Auto });

            //First add some data columns to the grid
            grdDataGrid.ColumnDefinitions.Add(new ColumnDefinition() { Width = GridLength.Auto});
            grdDataGrid.ColumnDefinitions.Add(new ColumnDefinition() { Width = GridLength.Auto });
            grdDataGrid.ColumnDefinitions.Add(new ColumnDefinition() { Width = GridLength.Auto });


            //Add data to each row
            grdDataGrid.Children.Add(new Label() { Text = "Row 0 Col 0" }, 0 , 0);
            grdDataGrid.Children.Add(new Label() { Text = "Row 0 Col 1" }, 1, 0);
            grdDataGrid.Children.Add(new Label() { Text = "Row 0 Col 2" }, 2, 0);

            grdDataGrid.Children.Add(new Label() { Text = "Row 1 Col 0" }, 0, 1);
            grdDataGrid.Children.Add(new Label() { Text = "Row 1 Col 1" }, 1, 1);
            grdDataGrid.Children.Add(new Label() { Text = "Row 1 Col 2" }, 2, 1);

            var ti_RowNumber = -1;
            foreach (RowDefinition tobj_Row in grdDataGrid.RowDefinitions)
            {
                ti_RowNumber  = 1;

                //Add the swipeview
                //Add a swip control to the and have it go all the way across.  See if this works
                // SwipeItems
                SwipeItem tobj_DeleteSwipeItem = new SwipeItem
                {
                    Text = "Delete",
                    BackgroundColor = Color.LightGreen
                };

                tobj_DeleteSwipeItem.Invoked  = OnDeleteSwipeItemInvoked; ;
                List<SwipeItem> tobj_swipeItems = new List<SwipeItem>() { tobj_DeleteSwipeItem };   //comment out

                // SwipeView content
                Label swipeContent = new Label()
                {
                    BackgroundColor = Color.Pink,
                    Text = "test",
                    HorizontalOptions = LayoutOptions.FillAndExpand,
                    VerticalOptions = LayoutOptions.FillAndExpand
                };

                var tobj_SwipeGestureRecognizer = new SwipeGestureRecognizer() { Direction = SwipeDirection.Right };
                tobj_SwipeGestureRecognizer.Swiped  = tobj_SwipeGestureRecognizer_Swiped;
                swipeContent.GestureRecognizers.Add(tobj_SwipeGestureRecognizer);

                SwipeView swipeView = new SwipeView
                {
                    LeftItems = new SwipeItems(tobj_swipeItems) { Mode = SwipeMode.Reveal },
                    Content = swipeContent
                };

                //Add the swipeview to the grid
                grdDataGrid.Children.Add(swipeView, 0, ti_RowNumber);
                Grid.SetColumnSpan(swipeView, grdDataGrid.ColumnDefinitions.Count);
            }
        }
        catch (Exception ex)
        {
            System.Diagnostics.Debug.WriteLine(ex.ToString());
        }
    }

This seems to work fine on iOS and Android but on UWP, the swipe event for the label fires but the Swipe tray never opens. Is this a known UWP challenge?

CodePudding user response：

I create a simple demo based on your code , and it works properly on my side.

You can refer to the following code:

   <StackLayout Margin="20">
        <Grid    x:Name="grdDataGrid"   VerticalOptions="FillAndExpand">
            <Grid.RowDefinitions  >
                <RowDefinition Height="60"  />
                <RowDefinition Height="60" />
            </Grid.RowDefinitions>


        <Button  Text="add" Clicked="Button_Clicked" />
    </StackLayout>

The c# code is:

    private void AddSwipeControl()
    {
        try
        {
            //Add the swipeview
            //Add a swip control to the and have it go all the way across.  See if this works
            // SwipeItems
            SwipeItem tobj_DeleteSwipeItem = new SwipeItem
            {
                Text = "Delete",
                BackgroundColor = Color.LightGreen
            };

            tobj_DeleteSwipeItem.Invoked  = OnDeleteSwipeItemInvoked; ;
            List<SwipeItem> tobj_swipeItems = new List<SwipeItem>() { tobj_DeleteSwipeItem };   //comment out

            //SwipeItems tobj_swipeItems = new SwipeItems();
            //tobj_swipeItems.Add(tobj_DeleteSwipeItem);

            // SwipeView content
            Label swipeContent = new Label()
            {
                BackgroundColor = Color.Pink,
                Text = "test",
                HorizontalOptions = LayoutOptions.FillAndExpand,
                VerticalOptions = LayoutOptions.FillAndExpand
            };

            var tobj_SwipeGestureRecognizer = new SwipeGestureRecognizer() { Direction = SwipeDirection.Right };
            tobj_SwipeGestureRecognizer.Swiped  = tobj_SwipeGestureRecognizer_Swiped;
            swipeContent.GestureRecognizers.Add(tobj_SwipeGestureRecognizer);

            SwipeView swipeView = new SwipeView
            {
                LeftItems = new SwipeItems(tobj_swipeItems) { Mode = SwipeMode.Reveal },
                Content = swipeContent
            };

            //Add the swipeview to the grid
            grdDataGrid.Children.AddVertical(swipeView);

           // grdDataGrid.Children.Add(swipeView, 0, pi_RowNumber);
           // Grid.SetColumnSpan(swipeView, grdDataGrid.ColumnDefinitions.Count);
        }
        catch (Exception ex)
        {
           // SharedErrorHandler.ProcessException(ex);

            System.Diagnostics.Debug.WriteLine(ex.ToString());
        }
    }

    private void tobj_SwipeGestureRecognizer_Swiped(object sender, SwipedEventArgs e)
    {
        try
        {
            if (e.Direction == SwipeDirection.Right)
            {
                var tobj_SwipeView = ((Label)sender).Parent as SwipeView;
                tobj_SwipeView.Open(OpenSwipeItem.LeftItems);
            }
        }
        catch (Exception ex)
        {
            //SharedErrorHandler.ProcessException(ex);
            System.Diagnostics.Debug.WriteLine(ex.ToString());
        }
    }

Note:

When adding the SwipeControl to Grid, I used code:

grdDataGrid.Children.AddVertical(swipeView);

And to simplify the code,I removed the parameter of function AddSwipeControl().