Swipe and Dismiss Behavior in Views of Android

Hi Friends.
I am back!!(May be some late).
I will post my first tutorial of android.
Here I will discuss about how to give swipe and dismiss functionality to our views or layouts.
This feature introduces with the "Design support Library" that includes a public class called "SwipeDismissBehavior" that can be easily used with Coordinator layout to implement this functionality.
Following is layout of my simple page that has a parent coordinator layout and linear layout as a child.Linear layout contains a image view and text view.

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout    
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:layout_gravity="bottom"
    tools:context="com.affle.coordinatorlayoutexa.MainActivity">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:orientation="horizontal"
        android:weightSum="2"
        android:id="@+id/llContainer"
        android:gravity="bottom">
        <ImageView
            android:layout_width="0dp"
            android:layout_height="150dp"
            android:layout_weight="1"
            android:layout_gravity="center_vertical"
            android:src="@drawable/imgpsh_fullsize"
            android:id="@+id/ivIamge"/>
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="This view is for swipped and dismiss"/>
    </LinearLayout>
</android.support.design.widget.CoordinatorLayout>





Following is my main activity that uses the "SwipeDismissBehaviour" class.
First we have to create instance of this class as - 




SwipeDismissBehavior<LinearLayout> swipeDismissBehavior = new SwipeDismissBehavior<>();
Then we set the direction of swiping as - 
swipeDismissBehavior.setSwipeDirection(SwipeDismissBehavior.SWIPE_DIRECTION_START_TO_END);
Now we set the listener of swipe event that includes two override methods - 
1. OnDismiss()
2. OnDragStateChanged
swipeDismissBehavior.setListener(new SwipeDismissBehavior.OnDismissListener() {
    @Override    public void onDismiss(View view) {
        Toast.makeText(MainActivity.this,
                "View swiped ", Toast.LENGTH_SHORT).show();}
    @Override    public void onDragStateChanged(int state) {}
});
And at last we find the LayoutParams of the parent layout and set its behavior as -
CoordinatorLayout.LayoutParams params=(CoordinatorLayout.LayoutParams)llContainer.getLayoutParams();
params.setBehavior(swipeDismissBehavior);

And that's all we have to do!!!
Enjoy the Swipe and Dismiss feature.






No comments:

Post a Comment

Flutter : Using Form and Text Fields

Flutter is a popular cross-platform mobile development framework that allows developers to build native apps for both Android and iOS using ...