Very practical sideslip delete control SwipeLayout

  • 2021-10-13 08:35:39
  • OfStack

Project often use similar to QQ skidding click delete effect, online open source library is also many. Personally, I feel that SwipeLayout is best used. Here's how to use it.

1. First, import the required Jar packages, there are three, AndroidSwipeLayout-v1.1. 8.jar, AndroidViewAnimations-1. 1.3. jar, nineoldandroids-2. 4.0. jar. The first jar package is the jar package where we use this control, and the next two are the jar packages needed to sideslip the animation to delete menu. Here's how to use it.

The xml file for the main layout is as follows, which is an ListView:


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical" >

  <ListView
    android:id="@+id/swipe_listview"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
  </ListView>

</LinearLayout>

The layout of each Item in listview is as follows:


<?xml version="1.0" encoding="utf-8"?>
<com.daimajia.swipe.SwipeLayout xmlns:swipe="http://schemas.android.com/apk/res-auto"
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/swipe"
  android:layout_width="match_parent"
  android:layout_height="wrap_content" >

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="80dp"
    android:background="#FF5534"
    android:gravity="center"
    android:tag="Bottom3"
    android:weightSum="10" >

    <ImageView
      android:id="@+id/trash"
      android:layout_width="27dp"
      android:layout_height="30dp"
      android:layout_weight="1"
      android:src="@drawable/trash" />

    <TextView
      android:layout_width="0dp"
      android:layout_height="wrap_content"
      android:layout_weight="5"
      android:text="Delete Item?"
      android:textColor="#fff"
      android:textSize="17sp" />

    <Button
      android:id="@+id/delete"
      android:layout_width="0dp"
      android:layout_height="40dp"
      android:layout_weight="4"
      android:background="@drawable/white"
      android:text="Yes,Delete"
      android:textColor="#FF5534" />
  </LinearLayout>

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/item_selector"
    android:padding="10dp" >

    <TextView
      android:id="@+id/position"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content" />

    <TextView
      android:id="@+id/text_data"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:tag="Hover"
      android:text="Just Do it . " />
  </LinearLayout>

</com.daimajia.swipe.SwipeLayout>

The top LinerLayout is equivalent to bottomView, and the bottom one is equivalent to SurfaceView. At first, SurfaceView is displayed on the screen of the mobile phone, while bottomView is outside the screen and gradually displayed on the screen as the finger slides.

Adapter. java is as follows:


package com.example.adapter;

import java.util.List;

import android.content.Context;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.TextView;
import android.widget.Toast;

import com.daimajia.androidanimations.library.Techniques;
import com.daimajia.androidanimations.library.YoYo;
import com.daimajia.swipe.SimpleSwipeListener;
import com.daimajia.swipe.SwipeLayout;
import com.daimajia.swipe.adapters.BaseSwipeAdapter;
import com.example.firstactivity.R;

public class ListViewAdapter extends BaseSwipeAdapter {

  private Context mContext;
  private List<String> mDatas;
  //private TextView mDelete;
  //private SwipeLayout swipeLayout;
  private int pos ;

  public ListViewAdapter(Context context, List<String> mDatas) {
    this.mContext = context;
    this.mDatas = mDatas;
  }

  @Override
  public int getCount() {
    // TODO Auto-generated method stub
    return mDatas.size();
  }

  @Override
  public Object getItem(int position) {
    // TODO Auto-generated method stub
    return mDatas.get(position);
  }

  @Override
  public long getItemId(int position) {
    // TODO Auto-generated method stub
    return position;
  }

  @Override
  public void fillValues(int position, View convertView) {
    // TODO Auto-generated method stub
    Log.e("fillValues", "position = "+position);
    TextView tv = (TextView) convertView.findViewById(R.id.position);
    //tv.setText((position + 1) + ".");
    tv.setText(mDatas.get(position)+"....");

    final SwipeLayout sl = (SwipeLayout) convertView.findViewById(getSwipeLayoutResourceId(position));
    final TextView delete = (TextView) convertView.findViewById(R.id.delete);
    delete.setTag(position);
    delete.setOnClickListener(new OnClickListener() {

      @Override
      public void onClick(View v) {
        // TODO Auto-generated method stub
        int pos = (Integer) delete.getTag();
        String obj = mDatas.get(pos);

        Log.e("onClick", "........pos ...."+pos+" obj = "+obj);
        mDatas.remove(obj);
        notifyDataSetChanged();
        sl.close();
      }
    });

  }

  @Override
  public View generateView(int position, ViewGroup arg1) {
    // TODO Auto-generated method stub
    Log.e("generateView", "position = "+position);
    View v = LayoutInflater.from(mContext).inflate(R.layout.swipe_lv_item,null);
    pos = position;
    final SwipeLayout swipeLayout = (SwipeLayout) v.findViewById(R.id.swipe);

    swipeLayout.addSwipeListener(new SimpleSwipeListener() {
      @Override
      public void onOpen(SwipeLayout layout) {// When hidden deletions menu Callback function when opened 
        // TODO Auto-generated method stub
        YoYo.with(Techniques.Tada).duration(500).delay(100).playOn(layout.findViewById(R.id.trash));

      }
    });

    swipeLayout.setOnDoubleClickListener(new SwipeLayout.DoubleClickListener() {
          @Override
          public void onDoubleClick(SwipeLayout layout,
              boolean surface) {
            Toast.makeText(mContext, "DoubleClick",Toast.LENGTH_SHORT).show();

          }
        });
//   v.findViewById(R.id.delete).setOnClickListener(
//       new View.OnClickListener() {
//         @Override
//         public void onClick(View view) {
//           Toast.makeText(mContext, "click delete position = "+pos,Toast.LENGTH_SHORT).show();
//           swipeLayout.close();
//         }
//       });

    return v;
  }

  @Override
  public int getSwipeLayoutResourceId(int position) {
    // TODO Auto-generated method stub
    return R.id.swipe;
  }

}

Note that generateView only adds layout, so it is best not to set click events in it. Click the event to set fillValues in this method.

Activity. java is as follows:


package com.example.firstactivity;

import java.util.ArrayList;
import java.util.List;

import com.example.adapter.ListViewAdapter;

import android.app.Activity;
import android.os.Bundle;
import android.widget.ListView;

import com.daimajia.swipe.util.Attributes;

public class SwipeListViewActivity extends Activity{

  private ListView mListView;
  private ListViewAdapter mAdapter;
  private List<String> mDatas;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    super.onCreate(savedInstanceState);
    setContentView(R.layout.swipe_layout_main);

    getData();

    mListView = (ListView) findViewById(R.id.swipe_listview);
    mAdapter = new ListViewAdapter(this, mDatas);
    mAdapter.setMode(Attributes.Mode.Single);
    mListView.setAdapter(mAdapter);
  }

  public void getData(){
    mDatas = new ArrayList<String>();
    //for(int i =0; i<10; i++){
      mDatas.add("A");
      mDatas.add("B");
      mDatas.add("C");
      mDatas.add("D");
      mDatas.add("E");
      mDatas.add("F");
      mDatas.add("G");
      mDatas.add("H");
      mDatas.add("I");
      mDatas.add("J");


    //}
  }
}

Related articles: