Округление углов фотографий с ImageMagick

Facebook не изменяет фотографии , чтобы иметь закругленные углы. Вместо этого они используют HTML и CSS , чтобы применить этот образ над каждой картинкой пользователя: http://www.facebook.com/images/ui/UIRoundedImage.png

Если вы проверяете UIRoundedImage.png, вы обнаружите , что каждый «квадрат» состоит из прозрачного центра, и непрозрачные углов, которые предназначены , чтобы соответствовать фону , на котором картинка пользователя будет отдыхать. Например, если изображение пользователя находится на белом фоне, а затем белые непрозрачные закругленные углы будут наложены на изображениях пользователя.

Техника CSS для использования только определенную часть UIRoundedImage.pngназывается «CSS спрайтов». Вы можете прочитать об этом здесь: http://www.alistapart.com/articles/sprites/

Вот код, который я написал, чтобы закруглить углы с ImageMagick с помощью Perl. Он должен порт Руби довольно легко:

http://article.gmane.org/gmane.comp.video.graphicsmagick.apis/322

Универсальное решение

Это решение работает с прозрачными и непрозрачными снимками. Для того, чтобы добавить 15 пикселей радиуса закругленных углов , original_picture.pngкоторый является 100x100 картиной:

convert -size 100x100 xc:none -draw "roundrectangle 0,0,100,100,15,15" mask.png
convert original_picture.png -matte mask.png \
  -compose DstIn -composite picture_with_rounded_corners.png

Это решение было дано PM здесь: https://stackoverflow.com/a/1916256/499917

Элегантное решение, не работает с прозрачными картинками

Это решение работает без какого-либо промежуточного изображения. Как мило! Но это нарушит прозрачность вашего оригинального снимка. Так что используйте только тогда, когда вы уверены, что ваша картина не является прозрачной.

Предположим, вы хотите закругленные углы с радиусом 15px:

convert original_picture.png \
  \( +clone  -alpha extract \
    -draw 'fill black polygon 0,0 0,15 15,0 fill white circle 15,15 15,0' \
    \( +clone -flip \) -compose Multiply -composite \
    \( +clone -flop \) -compose Multiply -composite \
  \) -alpha off -compose CopyOpacity -composite picture_with_rounded_corners.png

Для удобства здесь то, что вы обычно делаете в Ruby, или некоторых других языках:

in_pic = "original_picture.png"
out_pic = "picture_with_rounded_corners.png"
radius = 15
cmd = "convert #{in_pic} \\( +clone  -alpha extract " +
        "-draw 'fill black polygon 0,0 0,#{radius} #{radius},0 fill white circle #{radius},#{radius} #{radius},0' " +
        "\\( +clone -flip \\) -compose Multiply -composite " +
        "\\( +clone -flop \\) -compose Multiply -composite " +
        "\\) -alpha off -compose CopyOpacity -composite #{out_pic}"
`#{cmd}`

Источник: http://www.imagemagick.org/Usage/thumbnails/#rounded