Android自訂可編輯、刪除的側滑LisitView_Android

來源:互聯網
上載者:User

最近由於項目的需要,自訂了一個具有側滑功能的listview,側滑後可以點擊編輯、刪除。好了,大家先看一下效果圖,畢竟是看臉的世界。 

好了,我要先講一下思路,一次編輯很難完善,有什麼問題我後來還會補上,歡迎各位大神拍磚:
1、首先先說一下item:item用的LinearLayout布局,刪除、編輯分別是寫死了寬度的TextView,左邊是一個match_parent的RelativeLayout,內容自己隨意搞 

2、上下滑動和左右滑動的處理:當使用者手指滑動時,可以進行座標的判斷,如果Y軸移動距離大,則listview上下滑動;否則當X軸移動距離達到或者超過一個TextView的寬度時,動態控制item的marginLeft為負的兩倍TextView的寬度,從而實現滑動效果 

3、編輯、刪除的點擊:編輯、刪除在adapter中進行監聽,然後自己在adapter中再定義一個監聽介面,方便使用者在使用listview的activity中進行監聽 

下面附上item的布局檔案:

<?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="wrap_content" android:orientation="horizontal" > <RelativeLayout  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:background="#ffffff"  android:orientation="horizontal">  <RelativeLayout   android:id="@+id/rlTop"   android:layout_width="match_parent"   android:layout_height="65dp"   android:padding="10dp">   <ImageView    android:id="@+id/imgLamp"    android:layout_alignParentLeft="true"    android:layout_marginLeft="10dp"    android:src="@mipmap/ic_launcher"    android:layout_width="40dp"    android:layout_height="40dp"/>   <TextView    android:id="@+id/tvName"    android:layout_width="wrap_content"    android:layout_height="22dp"    android:layout_toRightOf="@+id/imgLamp"    android:layout_marginLeft="10dp"    android:gravity="center"    android:textSize="17sp"    android:textColor="#000000" />   <TextView    android:id="@+id/tvContent"    android:layout_width="wrap_content"    android:layout_height="18dp"    android:layout_toRightOf="@+id/imgLamp"    android:layout_below="@+id/tvName"    android:layout_marginLeft="10dp"    android:gravity="center"    android:textSize="14sp"    android:textColor="#000000"    android:text="content"/>  </RelativeLayout>  <View   android:layout_width="match_parent"   android:layout_height="1dp"   android:layout_marginLeft="20dp"   android:layout_marginRight="20dp"   android:layout_below="@+id/rlTop"   android:background="#EEEEEE"/> </RelativeLayout> <!--Edit--> <TextView  android:id="@+id/tvEdit"  android:layout_width="80dp"  android:layout_height="match_parent"  android:background="#dddddd"  android:gravity="center"  android:paddingLeft="20dp"  android:layout_marginBottom="1dp"  android:textColor="@android:color/white"  android:paddingRight="20dp"  android:text="編輯" /> <!--delete--> <TextView  android:id="@+id/delete"  android:layout_width="80dp"  android:layout_height="match_parent"  android:background="#FFFF0000"  android:gravity="center"  android:paddingLeft="20dp"  android:layout_marginBottom="1dp"  android:textColor="@android:color/white"  android:paddingRight="20dp"  android:text="刪除" /></LinearLayout>

Adapter代碼: 

package com.lei.slidelistview;import android.content.Context;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.ImageView;import android.widget.TextView;import java.util.List;/** * Created by 磊 on 2016/7/7. */public class ListViewSlideAdapter extends BaseAdapter{ private List<String> bulbList; private Context context; private OnClickListenerEditOrDelete onClickListenerEditOrDelete;  public ListViewSlideAdapter(Context context, List<String> bulbList){   this.bulbList=bulbList;   this.context=context;  }  @Override  public int getCount() {   return bulbList.size();  }  @Override  public Object getItem(int position) {   return bulbList.get(position);  }  @Override  public long getItemId(int position) {   return position;  }  @Override  public View getView(final int position, View convertView, ViewGroup parent) {   final String bulb=bulbList.get(position);   View view;   ViewHolder viewHolder;   if(null == convertView) {    view = View.inflate(context, R.layout.item_slide_delete_edit, null);    viewHolder=new ViewHolder();    viewHolder.tvName=(TextView)view.findViewById(R.id.tvName);    viewHolder.img=(ImageView)view.findViewById(R.id.imgLamp);    viewHolder.tvDelete=(TextView)view.findViewById(R.id.delete);    viewHolder.tvEdit=(TextView)view.findViewById(R.id.tvEdit);    view.setTag(viewHolder);//store up viewHolder   }else {    view=convertView;    viewHolder=(ViewHolder)view.getTag();   }   viewHolder.img.setImageResource(R.mipmap.ic_launcher);   viewHolder.tvName.setText(bulb);   viewHolder.tvDelete.setOnClickListener(new View.OnClickListener() {    @Override    public void onClick(View v) {     if (onClickListenerEditOrDelete!=null){      onClickListenerEditOrDelete.OnClickListenerDelete(position);     }    }   });   viewHolder.tvEdit.setOnClickListener(new View.OnClickListener() {    @Override    public void onClick(View v) {     if (onClickListenerEditOrDelete!=null){      onClickListenerEditOrDelete.OnClickListenerEdit(position);     }    }   });   return view;  }  private class ViewHolder{   TextView tvName,tvEdit,tvDelete;   ImageView img;  } public interface OnClickListenerEditOrDelete{  void OnClickListenerEdit(int position);  void OnClickListenerDelete(int position); } public void setOnClickListenerEditOrDelete(OnClickListenerEditOrDelete onClickListenerEditOrDelete1){  this.onClickListenerEditOrDelete=onClickListenerEditOrDelete1; } }
  

自訂ListView檔案代碼:

package com.lei.slidelistview;import android.content.Context;import android.util.AttributeSet;import android.util.DisplayMetrics;import android.view.MotionEvent;import android.view.ViewGroup;import android.view.WindowManager;import android.widget.LinearLayout;import android.widget.ListView;public class SlideListView extends ListView { private int mScreenWidth; // 螢幕寬度 private int mDownX; // 按下點的x值 private int mDownY; // 按下點的y值 private int mDeleteBtnWidth;// 刪除按鈕的寬度  private boolean isDeleteShown; // 刪除按鈕是否正在顯示  private ViewGroup mPointChild; // 當前處理的item private LinearLayout.LayoutParams mLayoutParams; // 當前處理的item的LayoutParams  public SlideListView(Context context, AttributeSet attrs) { this(context, attrs, 0); } public SlideListView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle);  // 擷取螢幕寬度 WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE); DisplayMetrics dm = new DisplayMetrics(); wm.getDefaultDisplay().getMetrics(dm); mScreenWidth = dm.widthPixels; }  @Override public boolean onTouchEvent(MotionEvent ev) { switch (ev.getAction()) { case MotionEvent.ACTION_DOWN: performActionDown(ev); break; case MotionEvent.ACTION_MOVE: return performActionMove(ev); case MotionEvent.ACTION_UP: performActionUp(); break; }  return super.onTouchEvent(ev); } // 處理action_down事件 private void performActionDown(MotionEvent ev) { if(isDeleteShown) { turnToNormal(); }  mDownX = (int) ev.getX(); mDownY = (int) ev.getY(); // 擷取當前點的item mPointChild = (ViewGroup) getChildAt(pointToPosition(mDownX, mDownY) - getFirstVisiblePosition()); // 擷取刪除按鈕的寬度 mDeleteBtnWidth = mPointChild.getChildAt(1).getLayoutParams().width; mLayoutParams = (LinearLayout.LayoutParams) mPointChild.getChildAt(0) .getLayoutParams(); mLayoutParams.width = mScreenWidth; mPointChild.getChildAt(0).setLayoutParams(mLayoutParams); }  // 處理action_move事件 private boolean performActionMove(MotionEvent ev) { int nowX = (int) ev.getX(); int nowY = (int) ev.getY(); if(Math.abs(nowX - mDownX) > Math.abs(nowY - mDownY)) { // 如果向左滑動 if(nowX < mDownX) { // 計算要位移的距離 int scroll = (nowX - mDownX) / 2; // 如果大於了刪除按鈕的寬度, 則最大為刪除按鈕的寬度 if(-scroll >= mDeleteBtnWidth) {  scroll = -mDeleteBtnWidth; } // 重新設定leftMargin mLayoutParams.leftMargin = scroll*2; mPointChild.getChildAt(0).setLayoutParams(mLayoutParams); } return true; } return super.onTouchEvent(ev); }  // 處理action_up事件 private void performActionUp() { // 位移量大於button的一半,則顯示button // 否則恢複預設 if(-mLayoutParams.leftMargin >= mDeleteBtnWidth / 2) { mLayoutParams.leftMargin = -mDeleteBtnWidth*2; isDeleteShown = true; }else { turnToNormal(); }  mPointChild.getChildAt(0).setLayoutParams(mLayoutParams); } /** * 變為正常狀態 */ public void turnToNormal() { mLayoutParams.leftMargin = 0; mPointChild.getChildAt(0).setLayoutParams(mLayoutParams); isDeleteShown = false; } /** * 當前是否可點擊 * @return 是否可點擊 */ public boolean canClick() { return !isDeleteShown; }}

下面附上使用布局代碼+使用後台代碼(2016年7月7日親測可用)
布局: 

<?xml version="1.0" encoding="utf-8"?><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="match_parent" tools:context="com.lei.slidelistview.MainActivity"> <TextView  android:id="@+id/tvTitle"  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:gravity="center"  android:textSize="20sp"  android:text="title" /> <com.lei.slidelistview.SlideListView  android:id="@+id/list"  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:layout_below="@+id/tvTitle"> </com.lei.slidelistview.SlideListView></RelativeLayout>

使用後台代碼,這裡要注意以下adapter設定監聽的位置,放錯了會報錯哦 

package com.lei.slidelistview;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.widget.Toast;import java.util.ArrayList;import java.util.List;public class MainActivity extends AppCompatActivity { private SlideListView listView; private List<String> list=new ArrayList<String>(); private ListViewSlideAdapter listViewSlideAdapter; @Override protected void onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentView(R.layout.activity_main);  getData();  initView(); } private void initView(){  listView=(SlideListView)findViewById(R.id.list);  listViewSlideAdapter=new ListViewSlideAdapter(this,list);  listView.setAdapter(listViewSlideAdapter);  listViewSlideAdapter.setOnClickListenerEditOrDelete(new ListViewSlideAdapter.OnClickListenerEditOrDelete() {   @Override   public void OnClickListenerEdit(int position) {    Toast.makeText(MainActivity.this, "edit position: " + position, Toast.LENGTH_SHORT).show();   }   @Override   public void OnClickListenerDelete(int position) {    Toast.makeText(MainActivity.this, "delete position: " + position, Toast.LENGTH_SHORT).show();   }  }); } private void getData(){  for (int i=0;i<20;i++){   list.add(new String("第"+i+"個item"));  } }}

以上就是本文的全部內容,希望對大家的學習有所協助,也希望大家多多支援雲棲社區。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.