iconDecotterにおいては、当初はPHPのGDライブラリでアイコンの取得から加工までやっていました。OAuth認証が完了すれば、そのユーザーのアイコンのURLをプロフィールから取得出来るので、それをImageCreateFromPNG（JPG/GIF）等で取得し、フレーム画像と重ねてTwitterに返す、というのが大雑把な流れです。
GDライブラリのリファレンス：PHP: GD – Manual
Web上の画像も、GDイメージストリームとして呼び出すことが可能ですが、画像形式によって関数が違うので、まずは現在のアイコンURLを取得して画像形式を調べ、それぞれ対応した関数で呼び出してあげなければなりません。
//Twitterのプロフィール画像のURL
$origin_filename = "http://twimg0～～～";
//プロフィール画像のURLから形式を判定して読み込む
if(preg_match("/.jpg$|.jpeg$/i",$origin_filename) or preg_match("/jpg|jpeg/i",$get["filetype"])){
$image = ImageCreateFromJPEG($origin_filename);
}elseif(preg_match("/.gif$/i",$origin_filename) or preg_match("/gif/i",$get["filetype"])){
$image = ImageCreateFromGIF($origin_filename);
}else{
$image = ImageCreateFromPNG($origin_filename);
}
拡張子がjpegのものもあるので忘れないように。
ところで、現在はTwitterはWebからプロフィールアイコンをアップする場合、どんな画像でもGUIで正方形に調整してアップする仕組みになっていますが、APIを利用したアップロードだったり、以前に長方形の画像をアップしていたユーザー等は、Twitterサーバー上の画像そのものが正方形ではないこともあります。そのため、デコレーションのフレーム画像が正方形を前提とした場合、上手く加工するためには以下のどちらかを考慮してあげておく必要がありました。
- 別途正方形のイメージストリームを新規作成し、そっちに対して上記で読み込んだ画像を貼り付ける
- Twitterが長方形画像を表示する際のトリミング領域に合わせて、フレーム画像を重ねる
Twitterの方針としてアイコンは正方形推奨であると見て、iconDecotterでは1の方法にしています。
//元アイコンのサイズ取得 list($width, $height, $type, $attr) = getimagesize($origin_filename); $canvas_sq = 240; //Twitterアイコンの標準サイズ240px (2012年12月時点) //規定サイズで画像作成 $effected_image = ImageCreateTrueColor($canvas_sq, $canvas_sq); imagefill($effected_image , 0 , 0 , 0xFFFFFF); //白塗り //正方形の新規画像にアイコン画像を貼付け ImageCopyResampled($effected_image,$image,0,0,0,0,$width,$height,$sq_width,$sq_width);
ImageCreateTrueColorで新規画像を作成し、一旦imagefillで白背景にした後、ImageCopyResampledで元アイコンを貼り付けます。ここで、白背景にしてしまうので元アイコンが透過画像だったりするとそこは白塗りされてしまうんですが、現状Twitter本家もそのようになるようなので、そこは準じておくことにしました。なお、上記では前述の「元アイコン画像が正方形でない場合」について考慮していませんが、実際は縦横のサイズを比較し、短い方の辺にサイズを合わせ、中央でトリミングするという処理をしています。
同様に、フレーム画像もImageCreateFromPNGで読み込み、ImageCopyResampledで上から重ねます。フレーム画像はpngに限定しているので、特に考慮せずそのまま貼り付けます。本来は透過色指定とかちゃんと考えてやる必要がありますが、ほとんどのケースで問題なく処理出来ているようなので、現状GDライブラリを使用した場合ではそこは考慮してません。
また、iconDecotterではフレーム画像の位置やサイズ、角度等を調整できるオプションがありますが、それはフレーム画像を貼り付けるタイミングで、ImageCopyResampledのパラメータを調整したり、更に別の新規イメージストリームを作成して回転させたものを貼り付ける等の方法で実装しています。単に位置やサイズの調整であれば、リファレンスで言うところの dst_x,dst_y や、dst_w,dst_h の調整で済みます。
これで、フレーム画像でデコレーションされたアイコン画像のイメージストリームが出来ました。あとはこれをTwitterAPIへリクエストするだけです。その方法については、次回書こうと思います。
コメント