Android自定義可編輯、刪除的側(cè)滑LisitView
最近由于項目的需要,自定義了一個具有側(cè)滑功能的listview,側(cè)滑后可以點(diǎn)擊編輯、刪除。好了,大家先看一下效果圖,畢竟是看臉的世界。
好了,我要先講一下思路,一次編輯很難完善,有什么問題我后來還會補(bǔ)上,歡迎各位大神拍磚:
1、首先先說一下item:item用的LinearLayout布局,刪除、編輯分別是寫死了寬度的TextView,左邊是一個match_parent的RelativeLayout,內(nèi)容自己隨意搞
2、上下滑動和左右滑動的處理:當(dāng)用戶手指滑動時,可以進(jìn)行坐標(biāo)的判斷,如果Y軸移動距離大,則listview上下滑動;否則當(dāng)X軸移動距離達(dá)到或者超過一個TextView的寬度時,動態(tài)控制item的marginLeft為負(fù)的兩倍TextView的寬度,從而實現(xiàn)滑動效果
3、編輯、刪除的點(diǎn)擊:編輯、刪除在adapter中進(jìn)行監(jiān)聽,然后自己在adapter中再定義一個監(jiān)聽接口,方便用戶在使用listview的activity中進(jìn)行監(jiān)聽
下面附上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; // 按下點(diǎn)的x值 private int mDownY; // 按下點(diǎn)的y值 private int mDeleteBtnWidth;// 刪除按鈕的寬度 private boolean isDeleteShown; // 刪除按鈕是否正在顯示 private ViewGroup mPointChild; // 當(dāng)前處理的item private LinearLayout.LayoutParams mLayoutParams; // 當(dāng)前處理的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(); // 獲取當(dāng)前點(diǎn)的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; } // 重新設(shè)置leftMargin mLayoutParams.leftMargin = scroll*2; mPointChild.getChildAt(0).setLayoutParams(mLayoutParams); } return true; } return super.onTouchEvent(ev); } // 處理action_up事件 private void performActionUp() { // 偏移量大于button的一半,則顯示button // 否則恢復(fù)默認(rèn) if(-mLayoutParams.leftMargin >= mDeleteBtnWidth / 2) { mLayoutParams.leftMargin = -mDeleteBtnWidth*2; isDeleteShown = true; }else { turnToNormal(); } mPointChild.getChildAt(0).setLayoutParams(mLayoutParams); } /** * 變?yōu)檎顟B(tài) */ public void turnToNormal() { mLayoutParams.leftMargin = 0; mPointChild.getChildAt(0).setLayoutParams(mLayoutParams); isDeleteShown = false; } /** * 當(dāng)前是否可點(diǎn)擊 * @return 是否可點(diǎn)擊 */ 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設(shè)置監(jiān)聽的位置,放錯了會報錯哦
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")); } } }
更多學(xué)習(xí)內(nèi)容,可以點(diǎn)擊《Android側(cè)滑效果匯總》學(xué)習(xí)。
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Android中的人臉檢測的示例代碼(靜態(tài)和動態(tài))
本篇文章主要介紹了Android中的人臉檢測的示例代碼(靜態(tài)和動態(tài)),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-01-01Android Material Design 陰影實現(xiàn)示例
這篇文章主要介紹了Android Material Design 陰影實現(xiàn)示例,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-04-04完美解決客戶端webview持有的頁面緩存,不會立即釋放的問題
下面小編就為大家?guī)硪黄昝澜鉀Q客戶端webview持有的頁面緩存,不會立即釋放的問題。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-12-12關(guān)于如何使用Flutter開發(fā)執(zhí)行操作系統(tǒng)shell命令的工具詳解
本文主要介紹如何在Flutter應(yīng)用中開發(fā)一個Android終端命令行工具,包括終端命令行頁面的布局設(shè)計、與Shell通信的基本原理、輸入輸出處理的基本技巧等,以及如何在具體應(yīng)用中利用終端命令行工具來執(zhí)行系統(tǒng)命令和與用戶進(jìn)行交互2023-06-06Android自定義TextBanner實現(xiàn)自動滾動
這篇文章主要為大家詳細(xì)介紹了Android自定義TextBanner實現(xiàn)自動滾動,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2020-07-07android Retrofit2網(wǎng)絡(luò)請求封裝介紹
大家好,本篇文章主要講的是android Retrofit2網(wǎng)絡(luò)請求封裝介紹,感興趣的同學(xué)趕快來看一看吧,對你有幫助的話記得收藏一下,方便下次瀏覽2021-12-12