android 流失布局,Android使用RecyclerView实现流式布局的注意事项

纯手打,不喜勿喷 long may the sun shine

众所周知，Android开发中Recycleview的功能十分强大，可以实现各种炫酷的效果，今天我根据最近开发的一个项目简要说下流式布局的注意事项。

使用RecyclerView时，流式布局我们通常使用StaggeredGridLayoutManager来实现：

rv_photo.layoutManager = StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL)

这句话是实现此功能的关键，当然里面的参数是可以更改的。

但是问题也随之出现，当我们使用这个功能加载网络图片时，由于不同的图片长宽和分辨率不同，并且Glide等图片加载框架都是异步加载，往往会出现图片刚开始时高度为0，之后才加载出正常高度的问题，这样如果网络延迟比较高的话，视觉效果还是比较差的，甚至会出现item错乱等一系列问题。

解决这个问题最有效的方法，就是把item的高度写成固定的。item的高度要固定，又要达到流式布局的效果，我整理了两种比较方便的解决方法：、

1.根据图片的真实宽高比例计算item里图片的实际大小

现在不论是前端还是后台的上传控件都有获取图片宽高的功能，接口返回数据时带着宽高数据，然后前端根据这些数据计算出ImageView在item当中的大小，这样每一张图片都是按照原始比例进行的展示，视觉效果要好一点：

public static void loadImageLiu(Context context, ImageView view, String url, int width, int height, int defaultWidth) {

try {

ViewGroup.LayoutParams layoutParams = (ViewGroup.LayoutParams) view.getLayoutParams();//获取你要填充图片的布局的layoutParam

int downloadWidth = 0;

int downloadHeight = 0;

if (width != 0 && height != 0) {//如果宽度和高度都能获取到,根据比例计算ImageView的大小

layoutParams.height = (int) (((float) height) / width * defaultWidth);

layoutParams.width = defaultWidth;//这个是布局的宽度

view.setLayoutParams(layoutParams);//容器的宽高设置好了

} else {//如果宽度和高度获取不到，就让它们等于默认值，此处是两列的RecyclerView,所以defaultWidth等于屏幕一般的宽度减去RecylcerView的间隔和margin(eg:ScreenUtils.getScreenWidth() / 2 - SizeUtils.dp2px(10f))

layoutParams.height = defaultWidth;

layoutParams.width = defaultWidth;//这个是布局的宽度

view.setLayoutParams(layoutParams);//容器的宽高设置好了

}

downloadWidth = layoutParams.width;

downloadHeight = layoutParams.height;

url = EncodeUtils.htmlDecode(url).toString();

if (!TextUtils.isEmpty(url) && !url.contains("http"))

url = new UrlUtils().getAPIHTTP() + url;

RequestOptions options = new RequestOptions();

options.centerCrop().placeholder(R.drawable.default_image).error(R.drawable.default_image).diskCacheStrategy(DiskCacheStrategy.ALL);

Glide.with(context)

.asBitmap()

.load(url)

.apply(options)

.into(new SimpleTarget(downloadWidth, downloadHeight) {//这里是根据原图大小和屏幕宽度计算的预览图的尺寸，如果这里不加参数，图片又相当大的话，列表会非常卡顿

@Override

public void onResourceReady(@NonNull Bitmap bitmap, @Nullable Transition super Bitmap> transition) {

//这个bitmap就是你图片url加载得到的结果

//获取bitmap信息，可赋值给外部变量操作，也可在此时行操作。

view.setImageBitmap(bitmap);

}

});

} catch (Exception e) {

e.printStackTrace();

}

}

这是我在RecyclerView的Adapter里加载图片的写法。

2.先给ImageView写一个基本的高度，然后在这上面加上或者减去随机的值，这个方法就不赘述了，虽然比较方便，但是效果不是很好。