RecyclerView瀑布流如何动态计算imageview的宽高

 

RecyclerView瀑布流如何动态计算imageview的宽高

2016-06-27 18:01  2016人阅读  评论(1)  收藏  举报

  分类：

解决方案（11） 

版权声明：本文为博主原创文章，未经博主允许不得转载。

我们上一篇说到计算recyclerView均等的间距，在这个基础上我们要用瀑布流展示图片的时候，要想动态展示宽高的话，就要知道图片的宽高并且在adapter里面计算宽高，这个宽高可以让服务器获取当让我们也可以自己获取。 
下面就说下实现方式吧 
既然要动态适配宽高就要根据图片的宽度和手机的宽度计算出比率来然后根据这个比率来计算imageview的高度

package com.jtech.scrollimageloaddemo;

import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;

import com.bumptech.glide.Glide;
import com.jtech.adapter.RecyclerAdapter;
import com.jtech.view.RecyclerHolder;

import java.util.ArrayList;
import java.util.List;

/**
 * 图片适配器
 * 关于 同等间距的recycleView
 * 我们在xml文件里设置的距离是dp 在代码里设置的距离是px
 * 所以都在代码中设置统一格式就是同等编剧的recyclerview
 * Created by wuxubaiyang on 16/5/6.
 */
public class ImageAdapter extends RecyclerAdapter<ImageModel> {

    private boolean isScroll = false;
    private int itemWidth;
    public ImageAdapter(Activity activity) {
        super(activity);
        //计算item的宽度
        itemWidth = (DeviceUtils.getScreenWidth(activity)-48) / 2;
    }

    public void setScroll(boolean scroll) {
        isScroll = scroll;
        if (!isScroll) {
            notifyDataSetChanged();
        }
    }

    @Override
    public View createView(LayoutInflater layoutInflater, ViewGroup viewGroup, int i) {
        return layoutInflater.inflate(R.layout.view_item, viewGroup, false);
    }

    @Override
    public void convert(RecyclerHolder recyclerHolder, ImageModel imageModel, int i) {
        ImageView imageView = recyclerHolder.getView(R.id.imageview);
        //等比缩放
        double ratio = (itemWidth * 1.0) / imageModel.getWidth();
        int height = (int) (imageModel.getHeight() * ratio);
        ViewGroup.LayoutParams layoutParams = imageView.getLayoutParams();
        layoutParams.width = itemWidth;
        layoutParams.height = height;
        imageView.setLayoutParams(layoutParams);
        //显示图片
//        if (isScroll) {
//            imageView.setImageResource(R.mipmap.ic_launcher);
//        } else {
            Glide.with(getActivity()).load(imageModel.getUrl()).placeholder(R.mipmap.ic_launcher).into(imageView);
//        }
    }
}
   
   
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
   
   
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64

  在xml中

    <ImageView
        android:id="@+id/imageview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:src="@mipmap/ic_launcher" />
   
   
1
2
3
4
5
6
7
   
   
1
2
3
4
5
6
7

这样我们就能实现瀑布流了 
例子就是下面这篇博客里面的例子注意Android:scaleType=”fitXY”必须是fitxy （ 例子中可能是centercrop 这是不对的）给位有用到的改下 
http://blog.csdn.net/applicaton/article/details/51705165