The requested page is not available for the requested platform. You are viewing the content for Default platform.

SwipeItem Class

Stores information about an action button shown when a user swipes a data row.

Namespace: DevExpress.XamarinForms.DataGrid

Assembly: DevExpress.XamarinForms.Grid.dll

Declaration

public class SwipeItem :
    BindableObject

Remarks

Add SwipeItem objects to the DataGridView.StartSwipeItems or DataGridView.EndSwipeItems collections to create swipe buttons in the grid.

Examples

This example shows how to extend the grid’s UI with additional elements (buttons) that appear when a user swipes a data row (from left to right or from right to left) and perform custom actions on tap.

Define two swipe actions for rows of the grid bound to the collection of orders:

  • Display information on a customer - When a user swipes a data row from left to right, the Customer button appears on the left side of the row.
  • Remove an order - When a user swipes a data row from right to left, the Delete button appears on the right side of the row.

Follow the steps below to implement this functionality:

  1. Add a SwipeItem object to the DataGridView.StartSwipeItems or DataGridView.EndSwipeItems collection.
  2. Use this object's Caption, BackgroundColor and Image properties to customize each button appearance.
    If you need to apply the same appearance settings to all swipe buttons of the grid, assign a SwipeItemStyle object with the specified properties to DataGridView.SwipeItemStyle. In the current example, all buttons have the identical width (SwipeItemStyle.Width).
  3. Handle the SwipeItem.Tap event to assign a custom action to a button.
<dxg:DataGridView x:Name="grid" ItemsSource="{Binding Orders}">
    <!-- ... -->
    <dxg:DataGridView.StartSwipeItems>
            <dxg:SwipeItem Caption="Customer" BackgroundColor="#797bff" Image="person.png" 
                           Tap="Swipe_ShowCustomerInfo" />
    </dxg:DataGridView.StartSwipeItems>
    <dxg:DataGridView.EndSwipeItems>
            <dxg:SwipeItem Caption="Delete" BackgroundColor="#ff3b30" Image="delete.png" 
                           Tap="Swipe_Delete"/>
    </dxg:DataGridView.EndSwipeItems>

    <dxg:DataGridView.SwipeItemStyle>
        <dxg:SwipeItemStyle Width="100"/>
    </dxg:DataGridView.SwipeItemStyle>
</dxg:DataGridView>

Inheritance

Object
SwipeItem
See Also