CodeZine(コードジン)

特集ページ一覧

Android Studio2.3の新機能をCheck It Out!

Android Studioの新バージョン2.3をCheck It Out! 前編

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2017/05/09 14:00
目次

WebP変換

 「WebP」はGoogleが開発した画像フォーマットです。他の画像フォーマットと比べて圧縮率が高く、画質を維持しながらサイズを小さくすることができます。可逆圧縮の場合はPNGと比較して約26%、非可逆圧縮の場合はJPEGと比較して約25~34%サイズを小さくできます。元々はWebサイトのトラフィック軽減と表示速度短縮を目的として開発されたものですが、Androidアプリ内でこの画像形式を利用すると、アプリ全体のサイズを小さくすることが可能となります。

 実は、Android 4.0(APIレベル14)からこのWebPはサポートされていました。ただし、WebP画像を別ツールで作成するか、あるいはあらかじめ変換しておく必要がありました。今回のバージョンアップでは、この変換機能がAndroid Studioに標準装備されました。さっそく使ってみましょう。

 まずは画像を用意してください。高圧縮を確認するため、サイズが大きい画像が好ましいです。サンプルプロジェクトでは、この画像を使用しています。画像は、Max Pixelで検索し、入手したものです(画像掲載ページはこちらです)。画像の解像度は1280×853で、サイズは468KBあります。この画像をImageViewで表示させる際に、WebPに変換してサイズを小さくします。

 まず、画像ファイルをAndroidプロジェクトのリソースとして追加しますが、Androidのコーディング規約として、リソースファイル名には小文字とアンダーバーのみしか使えません。そのためリネームした上で「res/drawable」フォルダに追加してください。サンプルでは「blue_ocean.jpg」としています。

図2 画像ファイルを追加した状態のプロジェクトツールウィンドウ
図2 画像ファイルを追加した状態のプロジェクトツールウィンドウ

 では、早速WebPに変換してみましょう。プロジェクトツールウィンドウ上で「blue_ocean.jpg」を右クリックし、[Convert to WebP]を選択してください。

図3 [Convert to WebP]を選択
図3 [Convert to WebP]を選択

 すると、図4のダイアログが表示されます。

図4 WebP変換ダイアログ
図4 WebP変換ダイアログ

 この画面で圧縮方式を「非可逆圧縮(Lossy encoding)」と「可逆圧縮(Use lossless encoding)」の、どちらにするか設定できます。今回は元画像がJPEG形式なので、デフォルトの[Lossy encoding]を選択します。

 [Encoding quality]はデフォルトで75%となっていますが、変更可能です。さらに、[Preview/inspect each converted image before saving]のチェックボックスにチェックを入れておくと、[OK]ボタンクリック後に図5の画面が表示され、変換前後の比較を行うことができます。

図5 WebP変換プレビュー画面
図5 WebP変換プレビュー画面

 今回は75%のまま[Finish]をクリックします。すると「blue_ocean.webp」のようにファイルの拡張子が変更され、画面右下に図6のメッセージが表示されます。

図6 WebP変換後のメッセージ
図6 WebP変換後のメッセージ

 これを見ると、273.7KBのサイズダウンが達成されたことが分かります。

 最後に、この画像をImageViewに表示させましょう。activity_new_features.xmlのImageViewタグに以下の属性を追加してください。

android:src="@drawable/blue_ocean"

 その後、アプリを再起動してください。図7のように画像が表示されたと思います。

図7 画像が表示されたアプリ
図7 画像が表示されたアプリ

 このように、Android Studio上で手軽にWebP画像変換を行うことができます。今後はアプリサイズの節約のため、積極的にWebP画像を使っていきましょう。


  • LINEで送る
  • このエントリーをはてなブックマークに追加

バックナンバー

連載:Android Studioの新バージョン2.3をCheck It Out!

著者プロフィール

  • WINGSプロジェクト 齊藤 新三(サイトウ シンゾウ)

    <WINGSプロジェクトについて> 有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きた...

  • 山田 祥寛(ヤマダ ヨシヒロ)

    静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for ASP/ASP.NET。執筆コミュニティ「WINGSプロジェクト」代表。 主な著書に「入門シリーズ(サーバサイドAjax/XM...

あなたにオススメ

All contents copyright © 2005-2021 Shoeisha Co., Ltd. All rights reserved. ver.1.5