ViewPager相片打标签

2024-04-09 06:38

文章标签 标签 viewpager 相片

本文主要是介绍ViewPager相片打标签，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

世面上现在有很多图片分享社交类app都喜欢加上打标签这个功能，比如比较知名“nice”、“理理相册”等等，他们打标签的方式可能各不相同但是本质原理是一样的，我感觉理理相册做的很好，于是参照它的交互模式自己实现了一下，基本做到了高仿。

项目简述

通过ToolBar的menu菜单点击添加标签；
作为ViewPager外嵌套一层帧布局使用，解决了和ViewPager的滑动冲突；
随意在界面拖动标签，加入严格的边界控制；
具备标签点击进行编辑修改和长按删除标签的功能；
标签点加入view视图动画效果；
随着ViewPager切换当前界面的标签会相应的销毁和创建；

这里贴出标签帧布局核心代码：

    @Overridepublic boolean onTouch(View v, MotionEvent event) {switch (event.getAction()) {case MotionEvent.ACTION_DOWN:mTouchView = null;mStartX = (int) event.getX();mStartY = (int) event.getY();if(hasView(mStartX,mStartY)){mStartTouchViewLeft = mTouchView.getLeft();mStartTouchViewTop = mTouchView.getTop();mStartTime = System.currentTimeMillis();return true;}break;case MotionEvent.ACTION_MOVE:moveView((int) event.getX(),(int) event.getY());break;case MotionEvent.ACTION_UP:mEndTime = System.currentTimeMillis();int endX = (int) event.getX();int endY = (int) event.getY();ArrayList<TagItem> tagItems = mAllTag.get(new Integer(mCurrentPosition));tagItems.get(mTouchView.getLocation()).setX(endX);tagItems.get(mTouchView.getLocation()).setY(endY);tagItems.get(mTouchView.getLocation()).setDx(mStartX -mStartTouchViewLeft);tagItems.get(mTouchView.getLocation()).setDy(mStartY -mStartTouchViewTop);Log.e(TAG,"ACTION_UP"+mTouchView.getLocation());//如果挪动的范围很小，并且时间间隔超过500，则判定为长按点击if(mTouchView!=null&& Math.abs(endX - mStartX)<CLICKRANGE&& Math.abs(endY - mStartY)<CLICKRANGE&&(mEndTime - mStartTime) > 500){removeItem();}else if (mTouchView!=null&& Math.abs(endX - mStartX)<CLICKRANGE&& Math.abs(endY - mStartY)<CLICKRANGE){editItem();}else{mTouchView = null;}break;}return false;}

在down事件按下的时候，我们判断该触摸点是否存在有标签，如何存在的话进行事件处理否则交给viewpager处理，其次在up事件结束的时候我们处理点击和长按事件对标签进行相应的处理。

再看看我们对viewpager滑动监听过程中的处理：

        mVpContainer.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {@Overridepublic void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {}@Overridepublic void onPageSelected(int position) {mToolbar.setTitle((mCurrPosition = position) + 1 + "/" + mUrls.size());//处理标签mPtyConver.setCurrentPosition(position);mPtyConver.removeAllViews();//清空标签Map<Integer, ArrayList<TagItem>> allTag = mPtyConver.getAllTag();if (allTag.get(new Integer(position)) != null) {ArrayList<TagItem> tagItems = allTag.get(new Integer(position));for (int i = 0; i < tagItems.size(); i++) {Log.e(TAG, "onPageSelected+setItem");mPtyConver.setItem(tagItems.get(i).getX(), tagItems.get(i).getY(), tagItems.get(i).getName(),i, tagItems.get(i).getDx(), tagItems.get(i).getDy());}}}@Overridepublic void onPageScrollStateChanged(int state) {}});