Skip to content

Swipeable (list) view

Yaxi Ye edited this page Sep 12, 2013 · 3 revisions

You might have seen the Twitter swipe feature and maybe found Android pattern (swipe for action) already. But while searching for working code you'll find nothing. So here it is: A working implementation of that feature. Besides that the swipeable API provides features beyond the quick action implementation. It enables you to create any kind of a swipeable (list) item. It's even possible to use that feature without a list view.

The idea

The idea is that a view (group) is implementing an interface and listens for swipe events. A special implementation of a list view is sending those events and enables list items which are implementing that interface to perform a swipe action. Furthermore the view (group) which is implementing the interface can implement touch event dispatching which enables you to use the view without the list view but still provide the swipe feature.

The interface is SwipeableListItem and the special list implementation is SwipeableListView. I tried to create a detailed documentation so you can get the idea how to implement an own swipeable view. Because that's not a trivial task you can check the already existing implementations and the Showcase app for a better insight.

General pattern

This is the puristic main activity layout which uses a swipeable list. Actually you'll use it like an ordinary list.

<!-- main.xml -->
<de.viktorreiser.toolbox.widget.SwipeableListView
    android:id="@+id/my_list"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" />

The layout for a list item. It's an example so maybe another implementation won't even have children and will extend an ordinary view instead.

<!-- my_list_item.xml -->

<any.view.which.implements.SwipeableListItem
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="The implementation usually supports children" />

</any.view.which.implements.SwipeableListItem>

Here we inflate the list view item and setup the functionality. The common pattern is that the swipeable implementation is using a (global and single) setup object which defines how the the implementation looks like and behaves. This is a recommendation, not a must, there are no limits...

// in your custom list adapter

public View getView(int position, View convertView, ViewGroup parent) {
    if (convertView == null) {
        LayoutInflater l = (LayoutInflater) getContext()
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE)
        convertView = l.inflate(R.layout.my_list_item, null);

        // this one implements the SwipeableListItem interface
        MySwipeableView v = (MySwipeableView) convertView;

        // it will be common to provide a setup to a swipable view
        // most of the time this setup is global (one setup for all views of the same kind)
        // but there might be implementations which want a setup for each view
        // see existing implementations to understand this better
        v.setSetup(mSetupConfiguration);
    }

    // ... ordinary setup
}