【Android】画像データをこねくり回す

画像データをこねくり回します

• ImageViewに画像を設定
• リソースIDから画像のBitmapを取得
• BitmapをImageViewに表示させる
• Bitmapをbyte配列に変換する
• byte配列をBitmapに変換する
• byte配列をBase64(String)に変換する
• Base64データを、webViewのimgタグに画像として表示させる

今回やりたかったのは、
- サーバーから画像データを取得 ＞　それをWeView上で広告として表示

なのですが、
ついでに画像データの扱いについてまとめました

ImageViewに画像を設定

まずは一番簡単な方法
LayoutのXMLに直接書きます
HTMLのimgタグのような感じです

<ImageView
　　　android:id="@+id/image01"
　　　android:layout_width="wrap_content"
　　　android:layout_height="wrap_content"
　　　android:src="@drawable/ic_launcher" />

次にコードから設定します

ImageView imageView = (ImageView)findViewById(R.id.image01);
imageView.setImageResource(R.drawable.ic_launcher);

リソースIDから画像のBitmapを取得

リソースIDから画像データを取得したい場合は以下のように記述します

Resources r = getResources();
Bitmap bmp = BitmapFactory.decodeResource(r, R.drawable.ic_launcher);

BitmapをImageViewに表示させる

ImageView imageView = (ImageView)findViewById(R.id.image01);
imageView.setImageBitmap(bmp); 

上記のコードは一応書きましたが、私はあまり書きません
普段はAndroiodQueryというライブラリを使用していて、それを使用して設定しています
AndroidQueryを使えば、Jqueryを書くように簡単に画像の設定が出来ます
詳しくは今度まとめようと思います

Bitmapをbyte配列に変換する

取得したBitmapデータをbyte配列に変換する方法です

compressメソッドの第2引数はcompressorへのヒント用に0-100の値を入れ、0は画像サイズが小さいことを示し、100は大きいことを示します。
通常は100でOKでしょう
第1引数は画像の形式です

ByteArrayOutputStream stream = new ByteArrayOutputStream();
bmp.compress(Bitmap.CompressFormat.PNG, 100, stream);
byte[] bytes = stream.toByteArray();

byte配列をBase64(String)に変換する

base64は、WebView内に動的に画像の設定を行うときなどに使用します
わけあってImageURLを直接指定できない時などは最適です（例えば取得元のサーバーにBasic認証がかかっている場合など）
一定間隔で改行が入ってしまうのでそれを取り除くことを忘れないようにしましょう
encodeToStringの第2引数にBase64.NO_WRAPを指定すると改行は消せます

String strBase64 =  Base64.encodeToString(bytes, Base64.NO_WRAP);

Base64データを、webViewのimgタグに画像データを表示させる

今回やりたかったのはこれです
webViewに対してjavascriptを実行して設定します

ただし、画像データをサーバーから取得する場合など
WebViewをレンダリングするタイミングがずれる場合は別の方法も考える必要があります

お手軽にJqueryでやります

• html

<div id="webad01" style=" display:none;"><img src="" ></div>

• javascript

function viewImage(tagId, imageUrl) {
	
	$("#"+tagId+" img").attr("src", imageUrl );
	$("#"+tagId).show();
}

• java
  • javascript側の関数を実行します
  • ポイントは、base64データの頭に"data:image/png" などの画像形式が必要なところです

//strBase64 にBase64データが入っています
String imageID = "webad01";	//Imgタグに設置するID
String base64ImgHtml = "data:" + "image/png" + ";base64," + strBase64;
String js = String.format("viewImage(\"%s\", \"%s\");", imageID, base64ImgHtml);
webview.loadUrl( "javascript:" + js );