Picasso で角丸なImageを描画する

  • 23
    いいね
  • 0
    コメント
この記事は最終更新日から1年以上が経過しています。

Picassoを使って、カジュアルに写真を表示させ、ついでに角も丸めちゃおう!
と思っていたのですが、iOS的な気持ちでいたのが大間違い。

というのも、iOSでは

view.layer.cornerRadius = 5.0;
view.layer.masksToBounds = YES;

的なことをすれば、ImageViewの角が丸くなってくれて、実に楽。

Androidもそんな感じでいけちゃいそう〜。と思っていたけど、ないんすよね。そういうの。

ということで、 Picasso では Transformation のクラスを拡張して、処理を渡してあげるオプションがあるので、それを使って角丸を実現する模様。

RoundedTransformation

https://gist.github.com/aprock/6213395

ここのgistが全てですが、直後に付いているお兄さんのコメント通り

@Override
public String key() {
    return "rounded(radius=" + Integer.toString(radius) + ", margin=" + Integer.toString(margin) + ")"
}

というメソッドに書き換えてあげたほうがよさげ。

この RoundedTransformation というクラスを作った後に、

RoundedTransformation transform = new RoundedTransformation(15, 0);
Picasso.with(context).load(photo).resize(width, height).
    centerCrop().transform(transform).into(imageView);

的なことをしてあげればOK。

一瞬面倒だと思ったけど、大変助けられた。