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

//---------------------------------第一步 上布局---------------------------------

//我的滑动的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();
}

 

//--------------------------------------------------------------------------完------------------------------------------------------------------

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值