实现木桶布局的图片尺寸处理主要有以下步骤: 1、设置行高、行宽、边距 2、获取图片高、宽 3、将每个图片高度设置为行高,并等比例缩放图片宽度 4、遍历图片尺寸数组,从第一个图片开始,累计图片宽度,并将图片放入一个数组,当加上第 n+1 个图片的宽度后,累计宽度与行宽的差大于行高,从第 n+1 个图片开始重新累计图片宽度,并重新第 n+1 个开始放入新的数组中,以此获取多个包含着若干图片宽度之和与行宽相近的数组,将它们整成二维数组以便下一步处理。 5、将预处理好的二维数组,再次遍历,先计算图片处理后的宽度之 width 和与行宽 row_width 之比 ratio,再用行高 row_height 与该 ratio 相除,获取等比例 width 等比例缩小成 row_width 得到的图片高度 height,这个 height 就是图片实际应该设置的高,接下来按 height 通过等比例缩放来获取图片实际应该设置的宽度 img_width,并更新原数组中的宽度。 6、处理后的数组就差不多是可实现木桶布局的图片尺寸了,但由于之前的计算中,由于可能浮点数运算然后四舍五入导致出现误差,所有还需要矫正一下,累计每一个图片组的宽度之和,计算与行宽的误差 over_width,然后通过为每组最后一个图片增减 over_width,矫正误差。