Androidの授業 6 [ 画面の操作(画像を使用してみる) ] | Let's Re⇒move

Androidの授業 6 [ 画面の操作(画像を使用してみる) ]

【画面の操作(画像を使用してみる)】


新規プロジェクト: Sample7

・画像の使用
・トグルボタン(ON・OFF切り替え)を使用

準備した素材
・back.png
・btn_set.xml
・green.png
・green_btn.gif(200*60)
・pink.png
・pink_btn.gif(200*60)
・title.gif(450*200)


素材をdrawable-hdpiフォルダへ入れる。
(Sample7→res→drawable-hdpi)


・main.xmlの編集(Sample7→res→layout→main.xml)
------------------------------------------------------
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="
http://schemas.android.com/apk/res/android "
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:background="@drawable/back"
>

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerInside"
android:background="@drawable/title" />

<View
android:layout_width="match_parent"
android:layout_height="20dp" />

<ImageView
android:id="@+id/iv_top"
android:layout_width="200dp"
android:layout_height="200dp"
android:scaleType="fitXY"
android:src="@drawable/green" />

<View
android:layout_width="match_parent"
android:layout_height="30dp" />

<ToggleButton
android:id="@+id/btn_change"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textOn=""
android:textOff=""
android:background="@drawable/btn_set" />

</LinearLayout>
---------------------------------------------------------

※幅の調整の為に<View/>を使用する手段はよく使う。
 (クラスとして軽い為上位クラスを使用)


ボタンを押した時の画像の切り替えの為にSample7.javaファイルを編集
(Sample7→src→test.sample7→MainActivity.java

CompoundButton.OnCheckedChangeListenerインターフェイスを実装
---------------------------------------------------------
package test.sample7;

import android.app.Activity;
import android.os.Bundle;
import android.widget.CompoundButton;
import android.widget.ImageView;
import android.widget.ToggleButton;

public class MainActivity extends Activity
implements CompoundButton.OnCheckedChangeListener {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

ToggleButton btn =
(ToggleButton)findViewById(R.id.btn_change);
btn.setOnCheckedChangeListener(this);
}

@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
ImageView iv = (ImageView)findViewById(R.id.iv_top);

// ON:ピンク OFF:緑
if(isChecked) {
iv.setImageResource(R.drawable.pink);
} else {
iv.setImageResource(R.drawable.green);
}
}
}
-----------------------------------------------------------