５－２ 基本的なウィジェット （１）Toggle Button A. 配置

Presentation on theme: "５－２ 基本的なウィジェット （１）Toggle Button A. 配置"— Presentation transcript:

1 ５－２ 基本的なウィジェット （１）Toggle Button A. 配置
「Form Widgets」から「Off」と表示されているボタン風のウィジェットを配置する

2 B. 「main.xml」の内容 （配置後、確認）
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_height="wrap_content" /> <ToggleButton android:layout_width="wrap_content" android:text="ToggleButton" /> </LinearLayout>

3 C. 「R.java」の内容 （配置後、実行すると生成される）
package jp.eclipse; public final class R { public static final class attr { } public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int toggleButton1=0x7f050000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040001; public static final int hello=0x7f040000;

4 D. ソースプログラム（その1） package jp.eclipse; import android.app.Activity;
import android.os.Bundle; import android.view.View; import android.widget.*; import android.widget.CompoundButton.OnCheckedChangeListener; public class ToggleButtonActivity extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); final Activity activity=this; （次ページに続く）

5 ソースプログラム（その２） ToggleButton toggle1 =
(ToggleButton)this.findViewById(R.id.toggleButton1); toggle1.setOnCheckedChangeListener 　　　　　(new OnCheckedChangeListener(){ @Override public void onCheckedChanged 　　　　　　　　(CompoundButton buttonView, boolean isChecked){ Toast toast=Toast.makeText(activity, 　　　　　　　　　　　　　　　　　　　　"指定：" +isChecked, 　　　　　　　　　　　　　　　　　　　　 Toast.LENGTH_LONG); toast.show(); } });

6 E. 実行状態 Java 1.6で実行すること

7 （２）Check Box A. 配置 「Form Widgets」から「CheckBox」と表示されているウィジェットを配置し、
「Text」プロパティを変更する

8 B. 「main.xml」の内容 （配置後、確認）
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_height="wrap_content" /> <CheckBox android:layout_width="wrap_content" android:text="これを選ぶか？" /> </LinearLayout>

9 C. 「R.java」の内容 （配置後、実行すると生成される）
package jp.eclipse; public final class R { public static final class attr { } public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int checkBox1=0x7f050000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040001; public static final int hello=0x7f040000;

10 D. ソースプログラム（その1） package jp.eclipse; import android.app.Activity;
import android.os.Bundle; import android.widget.*; import android.widget.CompoundButton.OnCheckedChangeListener; public class CheckBoxActivity extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); final Activity activity = this;

11 ソースプログラム（その2） CheckBox check1 = (CheckBox) this.findViewById
(R.id.checkBox1); check1.setOnCheckedChangeListener (new OnCheckedChangeListener(){ @Override public void onCheckedChanged (CompoundButton buttonView, boolean isChecked){ Toast toast = Toast.makeText(activity, "選択:"+isChecked, Toast.LENGTH_LONG); toast.show(); } });

12 E. 実行状態 Java 1.6で実行すること

13 （３）Radio ButtonまたはRadio Group A. 配置
「Form Widgets」から「Radio Group」を配置し、足りない場合「Radio Button」を配置し、ボタンの「Text」プロパティを変更する

14 B. 「main.xml」の内容（その１） （配置後、確認）
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_height="wrap_content" />

15 「main.xml」の内容（その２） <RadioButton android:id="@+id/radio0"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:checked="true" android:text="情報工学科" /> android:text="電気電子工学科" /> android:text="システム工学科" /> </RadioGroup> </LinearLayout>

16 C. 「R.java」の内容（その１） （配置後、実行すると生成される）
package jp.eclipse; public final class R { public static final class attr { } public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int radio0=0x7f050001; public static final int radio1=0x7f050002; public static final int radio2=0x7f050003; public static final int radioGroup1=0x7f050000;

17 「R.java」の内容（その２） public static final class layout {
public static final int main=0x7f030000; } public static final class string { public static final int app_name=0x7f040001; public static final int hello=0x7f040000;

18 D. ソースプログラム（その1） package jp.eclipse; import android.app.Activity;
import android.os.Bundle; import android.widget.*; import android.widget.RadioGroup.OnCheckedChangeListener; public class RadioButtonActivity extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); final Activity activity = this;

19 D. ソースプログラム（その1） RadioGroup group1 =
　　　　(RadioGroup)this.findViewById(R.id.radioGroup1); group1.setOnCheckedChangeListener 　　　(new OnCheckedChangeListener(){ @Override public void onCheckedChanged 　　　　　(RadioGroup group, int checkedID) { 　RadioButton btn =(RadioButton)findViewById(checkedID); Toast toast = Toast.makeText(activity, "選択:"+btn.getText(), Toast.LENGTH_LONG); toast.show(); } });

20 E. 実行状態 Java 1.6で実行すること

21 （４）Spinnerによるリスト A. 配置 ①Spinnerの配置
ポップアップして現れるリストの表示 ①「Form Widgets」から「Spinner」を配置

22 ②リソース要素の追加 ②「strings.xml]を開いて、右側の「追加」ボタンをクリック

23 ③新規要素の作成 ③「String Array」を選んで「追加」ボタンをクリック

24 ④新規要素の名前の入力 ④右の「Name」欄に要素の名前を入力して「追加」ボタンをクリック

25 ⑤文字列配列の要素を生成 ⑤「Item」を選んで「OK」ボタンをクリック

26 ⑥～⑧文字列配列の要素の値を入力 ⑥「Value」欄に文字列を入力して「追加」ボタンをクリック
⑦上記⑤を必要なだけ繰り返す（以下は2回目のところ） ⑧終わったらこの状態で実行しておく（各種関連の生成）。

27 ⑨～⑩「Entries」プロパティ設定 ⑨Layoutの「main.xml」に戻り、 Spinnerの「Entries」プロパティの
右「…」をクリック。 ⑩「Array」の右の「w」マークをクリックすると、「y」マークに変わり、一覧表が表示されるので、「list1」を選択。 ⑩ 「w」マークをクリックして、「list1」を選択 ⑨「…」をクリック

28 ⑪「list1」選択 ⑪「フィルター入力」と書かれているフィールドに「list1」の先頭文字「l」を入力すると「Array」の下に「list1」が現れるので、これを選択して、「OK」ボタンをクリック。

29 ⑫Spinnerが表示されるかを確認 ⑫ためしに実行して表示されたSpinnerの右の「▼]をクリックしたらSpinnerが表示されるかを確認。選んだときの表示も確かめよう。

30 B. 「main.xml」の内容 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_height="wrap_content" /> 　　<Spinner android:layout_width="match_parent" android:layout_height="wrap_content" </LinearLayout>

31 C. 「string.xml」の内容 <?xml version="1.0" encoding="utf-8"?>
<resources> <string name="hello">Hello World, SpinnerActivity!</string> <string name="app_name">Spinner</string> <string-array name="list1"> <item >乗用車</item> <item >トラック</item> <item >オープンカー</item> </string-array> </resources>

32 D. 「R.java」の内容 package jp.exclipse; public final class R {
public static final class array { public static final int list1=0x7f050000; } public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int spinner1=0x7f060000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040001; public static final int hello=0x7f040000; D. 「R.java」の内容

33 E. 現時点でのソースプログラム package jp.exclipse; import android.app.Activity;
import android.os.Bundle; public class SpinnerActivity extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); }

34 F. ソースプログラム（その1） イベントとしてOnClick ではなく、OnItemSelectedListenerを使用
package jp.exclipse; import android.app.Activity; import android.os.Bundle; import android.view.View; import android.widget.AdapterView.OnItemSelectedListener; import android.widget.*; public class SpinnerActivity extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); final Activity activity = this; 　 　Spinner spinner =(Spinner)this.findViewById(R.id.spinner1); spinner.setOnItemSelectedListener 　　　 　(new OnItemSelectedListener(){

35 ソースプログラム（その２） @Override
　　public void onItemSelected(AdapterView<?> parent, 　　　　　　　　　　　　　 View view, int position, long id) { Spinner spinner=(Spinner)parent; String str=(String)spinner.getSelectedItem(); Toast toast =Toast.makeText(activity, "選択された項目："+str,Toast.LENGTH_LONG); toast.show(); } @Override public void onNothingSelected(AdapterView<?> parent) { Toast toast =Toast.makeText(activity,“未選択！！”, Toast.LENGTH_LONG); });

36 G. 実行状態 Java 1.6で実行すること

37 （５）Image View A. 配置 ①～②ボタンとテキストビューの配置
②「Image & Media」の「Image View」ウィジェットをドラッギングする。 ①コマンドボタンを貼り付ける

38 ③「ic_launcher」指定 ③「ic_launcher」を選択し、「OK」ボタンをクリック。 　　（後で画像が変わることを確認するため）

39 ④～⑤表示画像データを保存 ④表示したい画像を「drawable-hdpi」にドラッギング（ファイル名は小文字）
⑤「ファイル操作」ダイアログが表示されるので「ファイルをコピー」を選択して「OK」ボタンをクリック ④ ④

40 ⑥ボタンのプロパティ設定 ⑥「Text」プロパティを「画像表示」に、 「On click」プロパティを「doAction」に指定。

41 ⑦仮実行して「R.java」を確認 ⑦実行しても「onAction」がないのでエラーとなるが構わない。
「R.java」に「R.id」が生成されていることを確認する。 package jp.eclipse; public final class R { public static final class attr { } public static final class drawable { public static final int ic_launcher=0x7f020000; public static final int sample1=0x7f020001; public static final class id { public static final int button1=0x7f050000; public static final int imageView1=0x7f050001; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040001; public static final int hello=0x7f040000;

42 B. 「main.xml」の内容 [main.xml]
<?xml version="1.0" encoding="utf-8"?> <LinearLayout 　　xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="画像表示" android:onClick="doAction"/> <ImageView /> </LinearLayout>

43 C. ソースプログラム package jp.eclipse; import android.app.Activity;
import android.os.Bundle; import android.view.View; import android.widget.ImageView; public class ImageViewActivity extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); } public void doAction(View view){ ImageView imageV =(ImageView)findViewById(R.id.imageView1); imageV.setImageResource(R.drawable.sample1);

44 このボタンをクリックすると画像が表示される
D. 実行状態 Java 1.6で実行すること このボタンをクリックすると画像が表示される