首页  »   移动开发

跟着ScrollView的滑动,渐渐的执行动画View

网友分享于:2015-06-29  浏览:0次
随着ScrollView的滑动,渐渐的执行动画View
今天是实现了一个小功能的东西。看看效果图:
123.gif

实现方式:
1.自定义ScrollView   复写onScrollChange方法,来计算滑动的位置。
2.自定义接口,通过接口来在ScrollView中控制,滑动的高度的进度。
3.在自定义View中去执行动画。


代码实现:
1.ScrollView   最主要的代码只有计算滑动位置的代码了,其实也是很简单的,获取子View的个数,每次都去for循环,去计算字View的位置,以及当前ScrollView的top bottom
代码:

@Override
    protected void onScrollChanged(int l, int t, int oldl, int oldt) {
        super.onScrollChanged(l, t, oldl, oldt);
        int currentBottom = t + height ;
        int currentTop = t ; 
        Log.e("Slide""onScrollChange") ;
        
        for (int i = 0; i < childCount; i++) {
            View childView = contentLayout.getChildAt(i )  ;
            if (!(childView  instanceof EasySlideInter)) {
                continue ; 
            }
            int childTop = childView.getTop() ; 
            int childBottom = childView.getBottom() ;
            int childHeight = childView.getHeight() ; 
            EasySlideInter inter = (EasySlideInter) childView ; 
            if ( currentTop > childTop && currentTop < childBottom ) {
                inter.contentSlide(countProgress(currentTop, childBottom, childHeight)); 
            }else if (currentBottom > childTop && currentBottom < childBottom ) {
                inter.contentSlide(100 - countProgress(currentBottom, childBottom, childHeight)); 
            }else if(childTop >= currentTop && childBottom <= currentBottom){
                inter.resetContent();
            }
        }
}  


通过childView的top位置与ScrollView的当前的top位置来判断是哪个子View正在慢慢的出现,计算出progress 传递给子View中去。

其实最终要的代码就是这么一段,动画的执行都在子View的接口方法中去做的。
我贴上一个子View的实现:
    
    @Override
    public void contentSlide(int progress) {
        textAnimator.setCurrentPlayTime(progress);
        backAnimator.setCurrentPlayTime(progress);
    }
    @Override
    public void resetContent() {
        textAnimator.setCurrentPlayTime(100);
        backAnimator.setCurrentPlayTime(100);
    }
    
    
    private void initAnimation(){
        textAnimator = ObjectAnimator.ofInt(text"textColor", Color.BLUE , Color.RED); 
        textAnimator.setEvaluator(new ArgbEvaluator());
        textAnimator.setDuration(100)  ;
        textAnimator.setInterpolator(new LinearInterpolator()) ;
        
        backAnimator = ObjectAnimator.ofInt(this"backgroundColor", Color.BLACK , Color.BLUE , Color.BLACK); 
        backAnimator.setEvaluator(new ArgbEvaluator());
        backAnimator.setDuration(100)  ;
        backAnimator.setInterpolator(new LinearInterpolator()) ;
        
    }  
实现两个接口的方法,在这两个方法中,去控制动画的进度。
很简单的,不再累赘叙述了。
源码下载:
百度网盘:  http://pan.baidu.com/s/1dDtVzSt 

github地址 : https://github.com/flyme2012/EasySlide 

相关解决方案

最新解决方案