滑动删除ListView的Item

转载请注明出处: http://blog.csdn.net/forwardyzk/article/details/42643865

在玩QQ的时候，我们会看到这样的效果，可以滑动删除消息，下面就模拟一下这样的效果。

1.创建一个类ListViewCompat，继承ListView。

  重写其OnTouchEvent事件。

@Overridepublic boolean onTouchEvent(MotionEvent event) {switch (event.getAction()) {case MotionEvent.ACTION_DOWN: {int x = (int) event.getX();int y = (int) event.getY();int position = pointToPosition(x, y);if (position != INVALID_POSITION) {// 获取Item内容，获取Item显示的View对象，就是SlideViewMessageItem data = (MessageItem) getItemAtPosition(position);mFocusedItemView = data.getSlideView();}}default:break;}if (mFocusedItemView != null) {mFocusedItemView.onRequireTouchEvent(event);}return super.onTouchEvent(event);}

pointToPosition获取点击的item的位置position，然后通过getItemAtPosition（position）获取适配器的中制定item的信息.查看getItemAtPosition的源码

 /**     * Gets the data associated with the specified position in the list.     *     * @param position Which data to get     * @return The data associated with the specified position in the list     */    public Object getItemAtPosition(int position) {        T adapter = getAdapter();        return (adapter == null || position < 0) ? null : adapter.getItem(position);    }

调用的是getItem().所以在定义适配器的时候，要记得重写getItem(int position)方法

mFocusedItemView.onRequireTouchEvent(event)操作Item的OnTouchEvent()事件

2.MessageItem是要展示Item的信息对象。

/** *  * item显示信息的类，包含删除按钮，要显示的信息 *  */public class MessageItem {private String tv_content;private SlideView slideView;public String getTv_content() {return tv_content;}public void setTv_content(String tv_content) {this.tv_content = tv_content;}public SlideView getSlideView() {return slideView;}public void setSlideView(SlideView slideView) {this.slideView = slideView;}}

tv_content:是item显示信息的内容

SlideView slideView：是适配器中Item的View，getView()的返回值，ListView的Item显示的是slideView。

3.我们看一下定义的适配器

public View getView(final int position, View convertView, ViewGroup parent) {ViewHolder holder;SlideView slideView = (SlideView) convertView;if (slideView == null) {View itemView = View.inflate(mContext,R.layout.item_listview_delete, null);// 将item显示的内容设置到Item对象中slideView = new SlideView(mContext);slideView.setContentView(itemView);holder = new ViewHolder(slideView);slideView.setOnSlideListener(SlideAdapter.this);slideView.setTag(holder);} else {holder = (ViewHolder) slideView.getTag();}MessageItem item = mMessageItems.get(position);item.setSlideView(slideView);item.getSlideView().shrink();holder.tv_content.setText(item.getTv_content());holder.deleteHolder.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {if (deleteItemListener != null) {deleteItemListener.deleteItem(v, position);}}});return slideView;}

默认是显示在原点item.getSlideView().shrink();

item.setSlideView(slideView);会把当前的item对象，设置给item信息对象的属性，为了在ListView的OnTouchEvent方便的调用其Item的onTouchEvent()事件。

设置滑动监听:slideView.setOnSlideListener(SlideAdapter.this);

会把convertView转换为SlideView。会把直接展示的Item的内容，添加到SlideView对象的内容View中

View itemView = View.inflate(mContext,R.layout.item_listview_delete, null);

slideView.setContentView(itemView);

item_listview_delete.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="58dp"    android:background="@drawable/delete_list_item_bg"    android:descendantFocusability="blocksDescendants"    android:gravity="center_vertical"    android:paddingBottom="5dp"    android:paddingLeft="10dp"    android:paddingRight="10dp"    android:paddingTop="5dp" >    <TextView        android:id="@+id/tv_content"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:gravity="center"        android:textColor="@android:color/black"        android:textSize="25sp" /></RelativeLayout>

SlideView加载的布局文件

activity_listview_delete_slide_view_merge.xml

<merge xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <LinearLayout        android:id="@+id/view_content"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="horizontal" >    </LinearLayout>    <RelativeLayout        android:id="@+id/holder"        android:layout_width="120dp"        android:layout_height="match_parent"        android:clickable="true"        android:background="@drawable/delete_holder_bg">        <TextView            android:id="@+id/delete"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:drawableLeft="@drawable/delete_icon_normal"            android:layout_centerInParent="true"            android:gravity="center"            android:textColor="@android:color/white"            android:text="删除" />    </RelativeLayout></merge>

其实就是把展示Item的内容添加到了SlideView中加载的布局中，id为view_content先行布局中。

View.inflate(mContext,R.layout.activity_listview_delete_slide_view_merge, this);mViewContent = (LinearLayout) findViewById(R.id.view_content);

public void setContentView(View view) {mViewContent.addView(view);}

这样就把整个item需要的内容(包含删除按钮)完全的显示到了item中。

4.我们要监听Item的滑动事件

public void onRequireTouchEvent(MotionEvent event) {int x = (int) event.getX();int y = (int) event.getY();int scrollX = getScrollX();switch (event.getAction()) {case MotionEvent.ACTION_DOWN: {if (!mScroller.isFinished()) {mScroller.abortAnimation();}if (mOnSlideListener != null) {mOnSlideListener.onSlide(this,OnSlideListener.SLIDE_STATUS_START_SCROLL);}break;}case MotionEvent.ACTION_MOVE: {int deltaX = x - mLastX;int deltaY = y - mLastY;if (Math.abs(deltaX) < Math.abs(deltaY) * TAN) {break;}int newScrollX = scrollX - deltaX;if (deltaX != 0) {if (newScrollX < 0) {newScrollX = 0;} else if (newScrollX > mHolderWidth) {newScrollX = mHolderWidth;}this.scrollTo(newScrollX, 0);}break;}case MotionEvent.ACTION_UP: {int newScrollX = 0;if (scrollX - mHolderWidth * 0.75 > 0) {newScrollX = mHolderWidth;}this.smoothScrollTo(newScrollX, 0);if (mOnSlideListener != null) {mOnSlideListener.onSlide(this,newScrollX == 0 ? OnSlideListener.SLIDE_STATUS_OFF: OnSlideListener.SLIDE_STATUS_ON);}break;}default:break;}mLastX = x;mLastY = y;}

在MotionEvent.ACTION_DOWN中处理，此时点击下去后，会调用滑动监听事件OnSlideListener，执行onSlide，

mOnSlideListener.onSlide(this,OnSlideListener.SLIDE_STATUS_START_SCROLL)

然而是适配器中会处理此监听

public void onSlide(View view, int status) {if (mLastSlideViewWithStatusOn != null&& mLastSlideViewWithStatusOn != view) {mLastSlideViewWithStatusOn.shrink();}if (status == SLIDE_STATUS_ON) {mLastSlideViewWithStatusOn = (SlideView) view;}}

是把前一个没有回到原点的，使其滑动到原点，保持点击ListView时，其Item全部回到原点.

MotionEvent.ACTION_MOVE时：滑动的距离来移动item，this.scrollTo(newScrollX, 0);只是水平方向移动，

if (newScrollX < 0) {newScrollX = 0;} else if (newScrollX > mHolderWidth) {newScrollX = mHolderWidth;}

限制了滑动的范围。

MotionEvent.ACTION_UP：当收值离开的时候，会把根据滑动的位置，来调节是否要显示出删除按钮。当滑动的距离大于删除按钮宽度的3/4，那么就显示出删除按钮，否则item就回到原点。this.smoothScrollTo(newScrollX, 0);

同时要把mOnSlideListener.onSlide(this,newScrollX == 0 ? OnSlideListener.SLIDE_STATUS_OFF
: OnSlideListener.SLIDE_STATUS_ON)

当前的Item对象，在适配器中记录下来，这样当点击下一个Item的时候，把当前的Item移动到原点。

/** * 使Item回到圆点位置 */public void shrink() {if (getScrollX() != 0) {this.smoothScrollTo(0, 0);}}

5.在适配器中设置了删除的监听事件

private DeleteItemListener deleteItemListener;/** * @param deleteItemListener *            设置删除Item监听事件 */public void setDeleteItemListener(DeleteItemListener deleteItemListener) {this.deleteItemListener = deleteItemListener;}

holder.deleteHolder.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {if (deleteItemListener != null) {deleteItemListener.deleteItem(v, position);}}});

6.使用步骤

布局文件

<com.example.view.ListViewCompat        android:id="@+id/list"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:background="#fff4f7f9"        android:cacheColorHint="#00000000"        android:divider="#dddbdb"        android:dividerHeight="1.0px"        android:drawSelectorOnTop="false"        android:listSelector="@android:color/transparent"        android:scrollbars="none" />

public void initView() {mListView = (ListViewCompat) findViewById(R.id.list);for (int i = 0; i < 20; i++) {MessageItem item = new MessageItem();item.setTv_content("我是第  " + i + " 个Item");mMessageItems.add(item);}// 创建适配器对象adapter = new SlideAdapter(DeleteListViewMainActivity.this,mMessageItems);// 删除监听adapter.setDeleteItemListener(new DeleteItemListener() {@Overridepublic void deleteItem(View view, int position) {mMessageItems.remove(position);adapter.notifyDataSetChanged();Toast.makeText(getApplicationContext(),"删除了第  " + position + " item", 0).show();}});// 设置适配器mListView.setAdapter(adapter);// 点击item事件mListView.setOnItemClickListener(new OnItemClickListener() {@Overridepublic void onItemClick(AdapterView<?> parent, View view,int position, long id) {Toast.makeText(getApplicationContext(), "点击了=" + position, 0).show();}});}

源码下载:  http://download.csdn.net/detail/forwardyzk/8353961

效果图: