アプリケーションの構造を軸にした 学習項目グラフによる

PBL -ソフトウェア班組み込みソフトウェアの開発
第三回
前回行ったこと
• 画面を設計する
– ボタンを配置する
– レイアウトを変更する
2
今回行うこと
• ボタンの動作を設定
何度かボタンを押す
3
動作の設定
Android では,
JAVAという言語を使って動作設定する
JAVA を説明する前に・・・
実際にどういうものか見てみよう!!
4
画面を設計 (XML) 1/3
前回も編集した
この場所にあるXMLを編集する
5
画面を設計 (XML) 2/3
1 <?xmlversion="1.0"encoding="utf-8"?>
2
<LinearLayoutxmlns:android="http://...
3
android:orientation="vertical"
4
android:layout_width="fill_parent"
5
android:layout_height="fill_parent"
6
>
7
<Button
8
android:id="@+id/button"
9
android:layout_width="wrap_content"
10
android:layout_height="wrap_content"
11
android:text="Button"
12
/>
13
<TextView
14
android:id="@+id/text"
15
android:layout_width="fill_parent"
16
android:layout_height="wrap_content"
17
/>
18
</LinearLayout>
前回までは無かったもの
どのボタンか,
どのテキストビューか,
指定するために
必要な記述
6
画面を設計 (XML) 3/3
1 <?xmlversion="1.0"encoding="utf-8"?>
2
<LinearLayoutxmlns:android="http://...
3
android:orientation="vertical"
このボタンに
「button」という
4
android:layout_width="fill_parent"
IDをつける
5
android:layout_height="fill_parent"
6
>
7
<Button
8
android:id="@+id/button"
9
android:layout_width="wrap_content"
このテキストビューに
10
android:layout_height="wrap_content"
「text」という
11
android:text="Button"
IDをつける
12
/>
13
<TextView
14
android:id="@+id/text"
15
android:layout_width="fill_parent"
16
android:layout_height="wrap_content"
17
/>
18
</LinearLayout>
ID:button
テキストビュー
ID:text
7
動作を設定 (JAVA) 1/5
この場所にあるJAVAを編集する
8
動作を設定 (JAVA) 2/5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
public class Hello extends Activity {
TextView tv;
Button button;
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
tv=(TextView)findViewById(R.id.text);
button = (Button)findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener(){
public void onClick(View arg0){
tv.append("Hello World!\n");
}
});
}
}
これが完成形
9
動作を設定 (JAVA) 3/5
~
2
~
8
TextView tv;
tv というものを用意する
tv=(TextView)findViewById(R.id.text);
• IDを「text」としたテキストビューを
JAVA で扱えるようになる
• テキストビューに対して動作を
設定するための準備
ID:button
テキストビュー
ID:text
10
動作を設定 (JAVA) 4/5
~
3
~
10
Button button;
button というものを用意する
button=(Button)findViewById(R.id.button);
• IDを「button」としたボタンを
JAVA で扱えるようになる
• ボタンに対して動作を設定する
ための準備
ID:button
テキストビュー
ID:text
11
動作を設定 (JAVA) 5/5
11
12
13
14
15
16
button.setOnClickListener(new View.OnClickListener(){
public void onClick(View arg0){
tv.append("Hello World!\n");
}
});
}
• button に対して動作の設定をする
• 13行目で動作を記述している
• tv に「HelloWorld!」という文字列を追加するという動作
• \n は改行することを表している
12
動作を設定 (JAVA) 6/6
•このマークが出たら,そのマークをクリック
•一番上の項目を選択
13
他の動作
• テキストの色を変える
• テキストの大きさを変える
14
テキストの色を変える 1/2
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
public class Hello extends Activity{
TextView tv;
Button button;
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
tv = (TextView)findViewById(R.id.text);
tv.setText("Hello World!");
2か所の変更点
button = (Button)findViewById(R.id.button);
button.setOnClickListener(newV iew.OnClickListener(){
public void onClick(Viewa rg0){
tv.setTextColor(Color.RED);
}
});
}
}
これが完成形
15
テキストの色を変える 2/2
9 tv.setText("Hello World!");
あらかじめテキストビューに「Hello World!」と表示させておく
14 tv.setTextColor(Color.RED);
Color.色 で,テキストを指定した色に変更する
クリック
16
テキストの大きさを変える 1/2
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
public class Hello extends Activity{
TextView tv;
Button button;
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
tv = (TextView)findViewById(R.id.text);
tv.setText("Hello World!");
1か所の変更点
button = (Button)findViewById(R.id.button);
button.setOnClickListener(newV iew.OnClickListener(){
public void onClick(Viewa rg0){
tv.setTextSize(50);
}
});
}
}
これが完成形
17
テキストの大きさを変える 2/2
14 tv.setTextSize(50);
()内の数字で指定した大きさに変更する
クリック
18
課題
• 前回作った画面に動作を設定してみよう
19