Android自定義可編輯、刪除的側(cè)滑LisitView
更新時間：2016年07月08日 10:00:51 作者：sinat_27681957
這篇文章主要為大家詳細(xì)介紹了Android自定義可編輯、刪除的側(cè)滑LisitView，感興趣的小伙伴們可以參考一下
最近由于項目的需要，自定義了一個具有側(cè)滑功能的listview，側(cè)滑后可以點擊編輯、刪除。好了，大家先看一下效果圖，畢竟是看臉的世界。
好了，我要先講一下思路，一次編輯很難完善，有什么問題我后來還會補上，歡迎各位大神拍磚：
1、首先先說一下item：item用的LinearLayout布局，刪除、編輯分別是寫死了寬度的TextView，左邊是一個match_parent的RelativeLayout,內(nèi)容自己隨意搞
2、上下滑動和左右滑動的處理：當(dāng)用戶手指滑動時，可以進行坐標(biāo)的判斷，如果Y軸移動距離大，則listview上下滑動；否則當(dāng)X軸移動距離達到或者超過一個TextView的寬度時，動態(tài)控制item的marginLeft為負(fù)的兩倍TextView的寬度，從而實現(xiàn)滑動效果
3、編輯、刪除的點擊：編輯、刪除在adapter中進行監(jiān)聽，然后自己在adapter中再定義一個監(jiān)聽接口，方便用戶在使用listview的activity中進行監(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; // 按下點的x值
private int mDownY; // 按下點的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)前點的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)前是否可點擊
* @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設(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)容，可以點擊《Android側(cè)滑效果匯總》學(xué)習(xí)。
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
Android中的人臉檢測的示例代碼（靜態(tài)和動態(tài)）
本篇文章主要介紹了Android中的人臉檢測的示例代碼（靜態(tài)和動態(tài)），小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-01-01
Android Material Design 陰影實現(xiàn)示例
這篇文章主要介紹了Android Material Design 陰影實現(xiàn)示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-04-04
完美解決客戶端webview持有的頁面緩存,不會立即釋放的問題
下面小編就為大家?guī)硪黄昝澜鉀Q客戶端webview持有的頁面緩存,不會立即釋放的問題。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-12-12
這篇文章主要介紹了Android彈幕框架黑暗火焰使基本使用方法,需要的朋友可以參考下。今天我將分享由BiliBili開源的Android彈幕框架（DanmakuFlameMaster）的學(xué)習(xí)經(jīng)驗，感興趣的朋友一起看看吧2016-10-10
關(guān)于如何使用Flutter開發(fā)執(zhí)行操作系統(tǒng)shell命令的工具詳解
本文主要介紹如何在Flutter應(yīng)用中開發(fā)一個Android終端命令行工具，包括終端命令行頁面的布局設(shè)計、與Shell通信的基本原理、輸入輸出處理的基本技巧等，以及如何在具體應(yīng)用中利用終端命令行工具來執(zhí)行系統(tǒng)命令和與用戶進行交互2023-06-06
這篇文章主要為大家詳細(xì)介紹了Android評分RationBar控件的使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-12-12
Android自定義TextBanner實現(xiàn)自動滾動
這篇文章主要為大家詳細(xì)介紹了Android自定義TextBanner實現(xiàn)自動滾動，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-07-07
這篇文章主要為大家詳細(xì)介紹了Android實現(xiàn)藍(lán)牙聊天功能，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-06-06
android Retrofit2網(wǎng)絡(luò)請求封裝介紹
大家好，本篇文章主要講的是android Retrofit2網(wǎng)絡(luò)請求封裝介紹，感興趣的同學(xué)趕快來看一看吧，對你有幫助的話記得收藏一下，方便下次瀏覽2021-12-12
本篇文章主要介紹了Android 帶有彈出收縮動畫的扇形菜單實例，具有一定的參考價值，有興趣的可以了解一下2017-06-06