46.Android 简单的顶部图片,下滑放大效果

导读:本篇文章讲解 46.Android 简单的顶部图片,下滑放大效果,希望对大家有帮助,欢迎收藏,转发!站点地址:www.bmabk.com

//———————————第一步 上布局———————————

//我的滑动的Scrollview布局

<ScrollView
    android:id="@+id/scollview"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <ImageView
            android:id="@+id/img"
            android:scaleType="centerCrop"
            android:layout_gravity="center"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:src="@mipmap/ic_launcher" />


        <TextView
            android:gravity="center"
            android:text="俄语小调"
            android:layout_width="match_parent"
            android:layout_height="50dp" />
        <TextView
            android:gravity="center"
            android:text="俄语小调"
            android:layout_width="match_parent"
            android:layout_height="50dp" />
        <TextView
            android:gravity="center"
            android:text="俄语小调"
            android:layout_width="match_parent"
            android:layout_height="50dp" />
        <TextView
            android:gravity="center"
            android:text="俄语小调"
            android:layout_width="match_parent"
            android:layout_height="50dp" />
        <TextView
            android:gravity="center"
            android:text="俄语小调"
            android:layout_width="match_parent"
            android:layout_height="50dp" />
        <TextView
            android:gravity="center"
            android:text="俄语小调"
            android:layout_width="match_parent"
            android:layout_height="50dp" />
        <TextView
            android:gravity="center"
            android:text="俄语小调"
            android:layout_width="match_parent"
            android:layout_height="50dp" />
        <TextView
            android:gravity="center"
            android:text="俄语小调"
            android:layout_width="match_parent"
            android:layout_height="50dp" />
        <TextView
            android:gravity="center"
            android:text="俄语小调"
            android:layout_width="match_parent"
            android:layout_height="50dp" />

        <View
            android:layout_width="match_parent"
            android:layout_height="500dp"
            android:background="#af7676" />
    </LinearLayout>
</ScrollView>

//—————————–第二步 初始化 并添加滑动监听

private ImageView img;
private ScrollView scollview;

// 记录首次按下位置
private float mFirstPosition = 0;
// 是否正在放大
private Boolean mScaling = false;

private DisplayMetrics metric;
private void initView() {
    img = (ImageView) findViewById(R.id.img);
    scollview = (ScrollView) findViewById(R.id.scollview);

    // 获取屏幕宽高
    metric = new DisplayMetrics();
    getWindowManager().getDefaultDisplay().getMetrics(metric);

    //设置图片初始大小  这里我设为满屏的16:9
    ViewGroup.LayoutParams lp = (ViewGroup.LayoutParams) img.getLayoutParams();
    lp.width = metric.widthPixels;
    lp.height = metric.widthPixels * 9 / 16;
    img.setLayoutParams(lp);

    //        //监听滚动事件
    scollview.setOnTouchListener(this);
}

//———————-第三步 监听 并设置动画 回弹

//重写监听的方法

@Override
public boolean onTouch(View view, MotionEvent event) {
    ViewGroup.LayoutParams lp = (ViewGroup.LayoutParams) img.getLayoutParams();
            switch (event.getAction()) {
                case MotionEvent.ACTION_UP:
                    //手指离开后恢复图片
                    mScaling = false;
                    replyImage();
                    break;
                case MotionEvent.ACTION_MOVE:
                    if (!mScaling) {
                        if (scollview.getScrollY() == 0) {
                            mFirstPosition = event.getY();// 滚动到顶部时记录位置,否则正常返回
                        } else {
                            break;
                        }
                    }
                    int distance = (int) ((event.getY() - mFirstPosition) * 0.6); // 滚动距离乘以一个系数
                    if (distance < 0) { // 当前位置比记录位置要小,正常返回
                        break;
                    }

                    // 处理放大
                    mScaling = true;
                    lp.width = metric.widthPixels + distance;
                    lp.height = (metric.widthPixels + distance) * 9 / 16;
                    img.setLayoutParams(lp);
                    return true; // 返回true表示已经完成触摸事件,不再处理
            }
            return false;
}

 

 

//设置动画

// 回弹动画 (使用了属性动画)
@SuppressLint("NewApi")
public void replyImage() {
    final ViewGroup.LayoutParams lp = (ViewGroup.LayoutParams) img.getLayoutParams();
    final float w = img.getLayoutParams().width;// 图片当前宽度
    final float h = img.getLayoutParams().height;// 图片当前高度
    final float newW = metric.widthPixels;// 图片原宽度
    final float newH = metric.widthPixels * 9 / 16;// 图片原高度

    // 设置动画
    ValueAnimator anim = ObjectAnimator.ofFloat(0.0F, 1.0F).setDuration(200);

    anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator animation) {
            float cVal = (Float) animation.getAnimatedValue();
            lp.width = (int) (w - (w - newW) * cVal);
            lp.height = (int) (h - (h - newH) * cVal);
            img.setLayoutParams(lp);
        }
    });
    anim.start();
}

 

//————————————————————————–完——————————————————————

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/118348.html

(0)
seven_的头像seven_bm

相关推荐

发表回复

登录后才能评论
极客之音——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!