在教程使用的carrierwave图片管理工具能够让我们上传一张图片获得不同尺寸的图片
class MyUploader < CarrierWave::Uploader::Base
include CarrierWave::MiniMagick
process resize_to_fit: [800, 800]
version :thumb do
process resize_to_fill: [200,200]
end
version :medium do
process resize_to_fill: [400,400]
end
end
但是同样的宽高比得出的都是四四方方的图片,如果要将图片设置成矩形该怎么办呢?比如:
在首页我要的是这个比例
在index页面我要的是这个比例:
而在show页面则是这样:
那该怎么做呢? 可能首先想到的是去把thumb和medium中的尺寸改成自己想要的,但是刷新页面发现什么都没有改变,还是老样子,为什么呢?
我们来看看官方的解释
When this uploader is used, an uploaded image would be scaled to be no larger than 800 by 800 pixels. A version called thumb is then created, which is scaled and cropped to exactly 200 by 200 pixels.
One important thing to remember is that process is called before versions are created. This can cut down on processing cost.
意思是当使Uploader时,首先就是运行这一行process resize_to_fit: [800, 800]
,将图片裁剪成一个固定尺寸;接着才会根据[800,800]的比例生成thumb和medium尺寸的图片。
这样看来,如果你已经建立了一个产品,那么当前图片的thumb和medium尺寸的图片已经生成了,临时更改的尺寸只能在下一个新建产品中才能有效。
注意: 在设置resize_to_fit: [width,height]的时候,如果只想固定某一个值,比如让宽度固定在1000,高度不设限,那么就可以用一个极大值代替高度,例如: [100,10000]
同样,version版本数量是完全可以自定义的,只需要在image_tag中使用相对应的URL即可,例如:定义了一个
version :small do
process resize_to_fill: [200, 100]
end
那么只需使用<%= image_tag(event.image.small.url) %>
即可。
网友评论