叫教你打造一个滑动悬浮置顶的视觉效果,给你的广告栏增加一些特色

一个滑动悬浮置顶的View,通过自定义ScrollView来实现一个精美的固定悬浮效果

效果图:

效果图

这个特效其实没有那么复杂!

思路:
- 自定义ListView对头布局进行处理
- 自定义 RecycleView 貌似很复杂的样子
- 自定义Behavior 把问题复杂化了
- 自定义listView + PopuWindows
- 自定义ViewGroup ,(需要重新onLayout登方法)
- 自定义Scrollview,对View进行处理

思来考去,其实我们写View的时候以少量的代码打造轮子才是精髓。于是对scrollView进行处理。明显的简单方面!!!

 未完全置顶的时候

通过广告栏的高度H和view中Y方向所滑动的距离Y进行比较,从而对view进行处理

完全置顶的时候

 初始静态值

关键代码:

重写onTouchEvent获取滑动的距离

/**
 * 重写onTouchEvent, 当用户的手在HoveringScrollview上面的时候,
 */
public boolean onTouchEvent(MotionEvent ev) {
        //直接将HoveringScrollview滑动的Y方向距离回调给onScroll方法中
        if (onScrollListener != null) {
            onScrollListener.onMyScroll(lastScrollY = this.getScrollY());
        }
        switch (ev.getAction()) {
            //当用户抬起手的时候,  HoveringScrollview可能还在滑动,
            // 所以当用户抬起手我们隔6毫秒给handler发送消息,
            // 在handler处理 HoveringScrollview滑动的距离
        case MotionEvent.ACTION_UP:
            handler.sendMessageDelayed(handler.obtainMessage(), 20);
            break;
        }
        return super.onTouchEvent(ev);
};
````    

需要在Handler里面进行





<div class="se-preview-section-delimiter"></div>

/**
* 用于用户手指离开MyScrollView的时候获取MyScrollView滚动的Y距离,然后回调给onScroll方法中
*/
private Handler handler = new Handler() {

public void handleMessage(android.os.Message msg) {
    int scrollY = HoveringScrollview.this.getScrollY();

    // 此时的距离和记录下的距离不相等,在隔6毫秒给handler发送消息?
    if (lastScrollY != scrollY) {
        lastScrollY = scrollY;
        handler.sendMessageDelayed(handler.obtainMessage(), 6);
    }
    if (onScrollListener != null) {
        onScrollListener.onMyScroll(scrollY);
    }
};

};


重要的在监听回调里面做一些操作:





<div class="se-preview-section-delimiter"></div>
@Override
public void onMyScroll(int scrollY) {
    LogUtils.e("yuyahao","scrollY: " +scrollY);
    // TODO Auto-generated method stub
    if (scrollY >= searchLayoutTop) {
        if (hoveringLayout.getParent() != search01) {
            search02.removeView(hoveringLayout);
            search01.addView(hoveringLayout);
        }
    } else {
        if (hoveringLayout.getParent() != search02) {
            search01.removeView(hoveringLayout);
            search02.addView(hoveringLayout);
        }
    }
}

“`

当广告栏的高亮 大于手指所滑动的高度的时候,所指定固定悬浮的View在他本身父布局的View中,否则指定一个顶部的父容器添加在里面即可。

效果图

关于更多

2017上半年技术文章集合—184篇文章分类汇总

高级UI特效仿直播点赞效果—一个优美炫酷的点赞动画

一个实现录音和播放的小案例

NDK项目实战—高仿360手机助手之卸载监听

玩转自定义柱形图—教你玩一把牛逼的

玩转雷达效果—一个炫酷的仿雷达扩散效果竟如此简单

高级UI特效之仿3D翻转切换效果

手把手教你撸一个上下拉刷新控件

代码并没有很多,需要的同学可以下载github Demo体验和学习。

项目Github链接地址

https://github.com/androidstarjack/MyCorverUpLoadApp

下载慢?CSDN下载链接:

http://download.csdn.net/download/androidstarjack/10030270

相信自己,没有做不到的,只有想不到的

如果你觉得此文对您有所帮助,欢迎入群 QQ交流群 :232203809
微信公众号:终端研发部

技术+职场

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

androidstarjack

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值