侧滑删除 仿微信

最新推荐文章于 2024-06-23 06:14:55 发布
最新推荐文章于 2024-06-23 06:14:55 发布
阅读量1w 收藏 11
点赞数
分类专栏： Android开发常识 Android UI设计与开发 文章标签： 微信 侧滑删除 仿微信

先上图 看效果

图片说明文字

直接上代码
自定的ListView

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
 
public class ListViewCompat extends ListView {

    private static final String TAG = "ListViewCompat";

    private SlideView mFocusedItemView;

    public ListViewCompat(Context context) {
        super(context);
    }

    public ListViewCompat(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public ListViewCompat(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public void shrinkListItem(int position) {
        View item = getChildAt(position);

        if (item != null) {
            try {
                ((SlideView) item).shrink();
            } catch (ClassCastException e) {
                e.printStackTrace();
            }
        }
    }

    @Override
    public 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);
            Log.e(TAG, "postion=" + position);
            if (position != INVALID_POSITION) {
                MessageItem data = (MessageItem) getItemAtPosition(position);
                mFocusedItemView = data.slideView;
                Log.e(TAG, "FocusedItemView=" + mFocusedItemView);
            }
        }
        default:
            break;
        }

        if (mFocusedItemView != null) {
            mFocusedItemView.onRequireTouchEvent(event);
        }

        return super.onTouchEvent(event);
    }

}

右边侧滑 的View

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
 
public class SlideView extends LinearLayout {

    private static final String TAG = "SlideView";

    private Context mContext;
    private LinearLayout mViewContent;
    private RelativeLayout mHolder;
    private Scroller mScroller;
    private OnSlideListener mOnSlideListener;

    private int mHolderWidth = 120;

    private int mLastX = 0;
    private int mLastY = 0;
    private static final int TAN = 2;

    public interface OnSlideListener {
        public static final int SLIDE_STATUS_OFF = 0;
        public static final int SLIDE_STATUS_START_SCROLL = 1;
        public static final int SLIDE_STATUS_ON = 2;

        /**
         * @param view current SlideView
         * @param status SLIDE_STATUS_ON or SLIDE_STATUS_OFF
         */
        public void onSlide(View view, int status);
    }

    public SlideView(Context context) {
        super(context);
        initView();
    }

    public SlideView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView();
    }

    private void initView() {
        mContext = getContext();
        mScroller = new Scroller(mContext);

        setOrientation(LinearLayout.HORIZONTAL);
        View.inflate(mContext, R.layout.slide_view_merge, this);
        mViewContent = (LinearLayout) findViewById(R.id.view_content);
        mHolderWidth = Math.round(TypedValue.applyDimension(
                TypedValue.COMPLEX_UNIT_DIP, mHolderWidth, getResources()
                        .getDisplayMetrics()));
    }

    public void setButtonText(CharSequence text) {
        ((TextView)findViewById(R.id.delete)).setText(text);
    }

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

    public void setOnSlideListener(OnSlideListener onSlideListener) {
        mOnSlideListener = onSlideListener;
    }

    public void shrink() {
        if (getScrollX() != 0) {
            this.smoothScrollTo(0, 0);
        }
    }

    public void onRequireTouchEvent(MotionEvent event) {
        int x = (int) event.getX();
        int y = (int) event.getY();
        int scrollX = getScrollX();
        Log.d(TAG, "x=" + x + "  y=" + y);

        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;
    }

    private void smoothScrollTo(int destX, int destY) {
        // 缓慢滚动到指定位置
        int scrollX = getScrollX();
        int delta = destX - scrollX;
        mScroller.startScroll(scrollX, 0, delta, 0, Math.abs(delta) * 3);
        invalidate();
    }

    @Override
    public void computeScroll() {
        if (mScroller.computeScrollOffset()) {
            scrollTo(mScroller.getCurrX(), mScroller.getCurrY());
            postInvalidate();
        }
    }

}

与它绑定的布局R.layout.slide_view_merge

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
 
<?xml version="1.0" encoding="utf-8"?>
<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/holder_bg">

        <TextView
            android:id="@+id/delete"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableLeft="@drawable/del_icon_normal"
            android:layout_centerInParent="true"
            android:gravity="center"
            android:textColor="@color/floralwhite"
            android:text="删除" />
    </RelativeLayout>

</merge>

主页面布局 R.layout.activity_list_delete

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
<?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" >

    <com.example.androidmenutoabhost.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"
        >


    </com.example.androidmenutoabhost.ListViewCompat>


</LinearLayout>

主页面ActivityListDelte

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
 
package com.example.androidmenutoabhost;

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

import com.example.androidmenutoabhost.SlideView.OnSlideListener;


import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;

public class ActivityListDelte extends Activity implements OnClickListener,OnItemClickListener{

    private static final String TAG = "MainActivity";

    private ListViewCompat mListView;

    private List<MessageItem> mMessageItems = new ArrayList<ActivityListDelte.MessageItem>();

    private SlideView mLastSlideViewWithStatusOn;

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

        initView();
    }

    private void initView() {
        mListView = (ListViewCompat) findViewById(R.id.list);

        for (int i = 0; i < 3; i++) {
            MessageItem item = new MessageItem();
            if (i % 3 == 0) {
                item.iconRes = R.drawable.default_qq_avatar;
                item.title = "腾讯新闻";
                item.msg = "青岛爆炸满月：大量鱼虾死亡";
                item.time = "晚上18:18";
            } else {
                item.iconRes = R.drawable.wechat_icon;
                item.title = "微信团队";
                item.msg = "欢迎你使用微信";
                item.time = "12月18日";
            }
            mMessageItems.add(item);
        }
        mListView.setAdapter(new SlideAdapter());
        mListView.setOnItemClickListener(this);
    }

    private class SlideAdapter extends BaseAdapter implements OnSlideListener{

        private LayoutInflater mInflater;

        SlideAdapter() {
            super();
            mInflater = getLayoutInflater();
        }

        @Override
        public int getCount() {
            return mMessageItems.size();
        }

        @Override
        public Object getItem(int position) {
            return mMessageItems.get(position);
        }

        @Override
        public long getItemId(int position) {
            return position;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            ViewHolder holder;
            SlideView slideView = (SlideView) convertView;
            if (slideView == null) {
                View itemView = mInflater.inflate(R.layout.list_item, null);

                slideView = new SlideView(ActivityListDelte.this);
                slideView.setContentView(itemView);

                holder = new ViewHolder(slideView);
                slideView.setOnSlideListener(this);
                slideView.setTag(holder);
            } else {
                holder = (ViewHolder) slideView.getTag();
            }
            MessageItem item = mMessageItems.get(position);
            item.slideView = slideView;
            item.slideView.shrink();

            holder.icon.setImageResource(item.iconRes);
            holder.title.setText(item.title);
            holder.msg.setText(item.msg);
            holder.time.setText(item.time);
            holder.deleteHolder.setOnClickListener(ActivityListDelte.this);

            return slideView;
        }

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

            if (status == SLIDE_STATUS_ON) {
                mLastSlideViewWithStatusOn = (SlideView) view;
            }
        }

    }

    public class MessageItem {
        public int iconRes;
        public String title;
        public String msg;
        public String time;
        public SlideView slideView;
    }

    private static class ViewHolder {
        public ImageView icon;
        public TextView title;
        public TextView msg;
        public TextView time;
        public ViewGroup deleteHolder;

        ViewHolder(View view) {
            icon = (ImageView) view.findViewById(R.id.icon);
            title = (TextView) view.findViewById(R.id.title);
            msg = (TextView) view.findViewById(R.id.msg);
            time = (TextView) view.findViewById(R.id.time);
            deleteHolder = (ViewGroup)view.findViewById(R.id.holder);
        }
    }

    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position,
            long id) {
        Log.e(TAG, "onItemClick position=" + position);
    }



    @Override
    public void onClick(View v) {
        if (v.getId() == R.id.holder) {
            Log.e(TAG, "onClick v=" + v);
            Toast.makeText(this, "delete", Toast.LENGTH_SHORT).show();
        }
    }


}

其中主页面的MessageItem类可以单独拿出来写一个类
以上即可实现侧滑删除的效果

AndyLizh
关注
专栏目录
Android仿微信侧滑删除控件
Mapleaf
04-04 4154
代码见GitHub：仿微信侧滑删除控件 首先看一下效果图： 基本思路是自定义一个ViewGroup作为RecyclerView中的条目，通过手势侧滑拉出删除按钮，动态改变删除按钮的宽度。 在网上也看了很多类似的实现，大多非常麻烦，我参考了Android动手实现一个侧滑删除控件，支持Recyclerview大神的实现，做出了这个控件。 实现过程 首先参考条目的布局： &lt;Fr...
Android自定义ListView实现仿微信侧滑删除
01-12
通过ListView + PopupWindow的方式实现了仿微信的侧滑删除、取消关注功能。
仿微信侧滑删除
m190607070的专栏
03-29 1132
先上效果图：代码实现如下：recyclerview添加如下ItemTouchListenerclass ItemTouchLis : RecyclerView.OnItemTouchListener { private var targetView: ViewGroup? = null//当前操作的view private var lastView: ViewGroup? = nu...
【Android】史上最简单，一步集成侧滑(删除)菜单，高仿QQ、IOS。
最新发布
2401_85493350的博客
06-23 646
小编这些年深知大多数初中级Android工程师，想要提升自己，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。因此我收集整理了一份《2024年Android移动开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友。一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！
Android自定义HorizontalScrollView实现仿微信侧滑删除（多触点拉出侧滑菜单）
weixin_52484998的博客
08-27 414
在现有的开源库中，多数侧滑删除组件仅支持单一触点拉出菜单选项。然而，iOS版的微信消息界面提供了一种多触点侧滑菜单的实现。为了模仿这一交互模式，采用了HorizontalScrollView来满足多触点拉出侧滑菜单的需求。下文将详细介绍该组件的实现过程和效果。
仿微信侧滑删除当前页面
Angus博客
11-18 819
效果图不是太明显 实际上有finish动画
【ionic】- 侧滑编辑删除
Arielle-L
06-09 363
项目进行过程中用到了侧滑修改删除，刚开始使用Ionic4，对于Ionic4的使用不是很熟悉，也许对于大牛来说很简单的一个操作，我却搞了半天，在这里总结一下， ...
Android ListView 仿微信侧滑删除
12-11
"Android ListView 仿微信侧滑删除"这个主题涉及到如何实现类似微信中常见的侧滑菜单功能，即用户在ListView的每一项上向左滑动时，会显示出一个包含删除按钮的视图，允许用户快速删除列表中的某一项。下面我们将...
Android实现微信侧滑关闭页面效果
01-04
最近手机升级了5.0系统后，突然间发现微信竟然有IOS一样的侧滑关闭当前页面的效果，就想把这种效果也加进自己的项目里面。本着不重复造轮子的原则，就在网上百度了很久，发现大多数人都是采用自定义View来实现，但是...
Android仿微信列表滑动删除之可滑动控件（一）
01-05
这次是列表滑动删除的第三波，仿微信的列表滑动删除。先上个效果图：   前面的文章里面说过开源框架SwipeListView的实现原理是每个列表item中包含上下两层view，普通状态下上层的view覆盖着下层的view，当用户滑...
微信5.0侧滑删除
11-15
微信5.0侧滑删除demo listview 侧滑删除 注释掉了SDK版本判断的代码 如果有需要可以打开
仿微信向左滑动删除效果
04-23
这是一个简单的仿照微信的向左滑动显示删除效果。存原生js，无需引用其他插件
仿微信侧滑删除SwipeListView实例
码农GG的专栏
08-14 2632
点击删除之后可以删除该行。                  下面是SwipeListView属性的一些讲解：                      xmlns:swipe="http://schemas.android.com/apk/res-auto"//命名空间                          android:id="@+id/ex
侧滑删除
未来~超越自己
10-18 733
一、引出 虽随时间发展，Android UI 界面绘制有了长足发展，而ListView作为内容承载一个重要控件的事实依旧未改变。Item多种状态的展示，以及不同小分区的响应事件更丰富了ListView的展现形式。侧滑则能够更大的扩展item所展示的区域，尤其以IOS的更多效果作对比。IOS能行的，Android也要会。 本例借用网友的智慧，展示侧滑删除的两种特效。强化自己对于自定义控件
android 仿QQ微信侧滑删除
qq_33776306的博客
09-20 906
最近由于项目需求，需要做一个listview中的item策划删除的效果，与是查找资料和参考了一些相关的博客，终于完美实现了策划删除的效果。           先看一下效果图（研究了半天竟然没研究出来真机上gif图怎么做，大家将就看一下吧）。                      侧滑效果图                 点击删除后的截图        点击删除后，listvi
ListView侧滑删除
恰好你来，恰好我在
06-17 3855
ListView侧滑删除效果图效果很好看代码实现 MessageCenterActivity.java ListViewAdapter.java message_center_activity.xml message_center_item.xml MessageCenterActivity.javapublic class MessageCenterActivity extends Activit
iOS开发：仿微信侧滑功能实现详解
“IOS开发仿微信右侧弹出视图实现，主要涉及图片拉伸、仿射变换和navigationBar样式设置。” 在iOS开发中，模仿微信的右侧弹出视图是一种常见的需求，这种效果通常用于展示更多的功能选项。以下是实现这一功能的...
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值