Using FlexGrid's CellLongPressed Event to capture a Long Press Gesture

The recent release of Xuni 2016 v2.5 contains some much requested enhancements to existing APIs including a new FlexGrid event for capturing long press gestures. In the past, we've taken a look at an ad hoc solution for implementing this type of behavior on iOS, but there wasn't an out of the box solution for this. The CellLongPressed event gives you the ability to capture this input directly in the API efficiently and across platforms. In this article, we'll take a look at how you can apply the new event in Xamarin.Forms.

Implementing the CellLongPressed Event

The CellLongPressed event behaves similarly to the CellTapped and CellDoubleTapped events in that it gives you a GridCellRangeEventArgs when the event is raised. This object gives you ability to determine the type of cell tapped, the cell range, and the option to cancel the event. If you want to shift entering edit mode from the double tap gesture to the long press, you could manipulate the events such that the CellDoubleTapped no longer enters edit (or entirely is canceled in this case), and use the cell range in the CellLongPressed event to enter edit mode on that specific cell.

        void Handle_CellLongPressed(object sender, Xuni.Forms.FlexGrid.GridCellRangeEventArgs e)  
        {  
            grid.StartEditing(e.CellRange.Row, e.CellRange.Column);  
        }  

        void Handle_CellDoubleTapped(object sender, Xuni.Forms.FlexGrid.GridCellRangeEventArgs e)  
        {  
            e.Cancel = true;  
        }    

Other uses

You can follow this pattern to add other new behaviors or toggle different behaviors between the available gestures. Since you can use the event args to determine which type of cell has been pressed (be it column header, row header, cell, or the top left corner) you can also provide different behaviors based on what's been tapped. In this way you can provide different contextual behaviors for your different grid elements. For instance, you can add display alerts for your column headers and row headers with some more descriptive information.

        void Handle_CellLongPressed(object sender, Xuni.Forms.FlexGrid.GridCellRangeEventArgs e)  
        {  
            if (e.CellType == GridCellType.ColumnHeader)  
            {  
                if (e.CellRange.Column == 0)  
                {  
                    DisplayAlert("ID", "Customer Id assigned based on order of entry into system.", "OK");  
                }  
                else if (e.CellRange.Column == 1)  
                {  
                    DisplayAlert("First Name ", "First Name as provided by customer when acount was first created.", "OK");  
                }  
                else if (e.CellRange.Column == 2)  
                {  
                    DisplayAlert("Last Name ", "Last Name as provided by customer when acount was first created", "OK");  
                }  
            }    
         }  

The API for these gesture based events gives you flexibility in how you handle user interactions, and allows you to give your users a number of ways to interact with their data.