onClickListenerの実装とその後の処理


# OnClickListenerとは
OnClickListenerとは名前の通りClickを検知して反応するInterfaceです。
Android開発ではこのOnClickListenrを使ってClick(クリック）されたときの処理を書きます。何パターンか実装方法がありますが、無名クラスは使わない方法で実装していきます。

# 目次
- onClickListenerの実装
- ViewのonClickによってUIに現れるよくある処理


# 下準備
OnClickListenrを実装するためには「どのViewがクリックされたか」という判定をしなければいけません。そこでView自体に「id」を持たせます。
下のコード例を見てください。

```xml:android.xml
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/textView"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:id="@id/textView"/>

```

一見何でもないTextViewですが各々一番↓に「android:id="@+id/textView"」といった記述があります。これは「このTextViewに『textView』という名前を付けて」といった内容です。これでどのViewがタップされたかを判別するわけです。
また、android:id=""には２種類あります。
上にあるように

- android="@+id/textView"
- android="@id/textView"

「＋」符号をつけた場合は、新規にResource(R.java.)に対してIDを作成します。
つけていない場合は既存のidを参照します。

今回使うレイアウトを下に記します。

```xml:activity_main.xml
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        android:layout_gravity="center"
        android:id="@+id/textView"/>
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content" 
        android:text="ボタン"
        android:id="@+id/button"/>
</LinearLayout>
```

初心者向けに解説します。（もし.xmlに不安があれば先に[アプリケーションのレイアウト](http://qiita.com/Yuki_Yamada/items/eb4a25cedca2ff8078fd)を読んでいただければ勉強になると思います）
LinearLayoutの中に二つのviewを設置しています。TextViewとButtonです。LinearLayoutはorientationをverticalに指定しているので縦方向に並んでいます。
Textviewのパラメータは今回

- 横幅は必要なだけ
- 縦幅は必要なだけ
- textは「hello world!」
- TextViewは「layout_gravity」を「center」に指定しているためview自体が真ん中に寄っている
- 新規id"textView"を指定

Buttonのパラメータは今回

- 横幅は最大
- 縦は必要なだけ
- textは「ボタン」
- 新規id"@+id/button"を指定

です。
![1.png](https://qiita-image-store.s3.amazonaws.com/0/59803/4c18ea35-fd0e-9a82-da44-0f3ca8dfd7f6.png)

## string.xmlの定義
少し余談にはなりますが文字列の指定は「string.xml」での指定をお勧めします。
これはローカライズ（多言語化）や仕様変更に対応するためです。
ぜひ入門の段階から慣れておくことをお勧めします。

まずは「string.xml」を開きます。
![2.png](https://qiita-image-store.s3.amazonaws.com/0/59803/ee0cdfc4-e26a-576a-2549-9cff0df4c75a.png)
res -> values -> strings.xml　です。

```xml:string.xml
<resource>
    <string name="main_text_top">こんにちは</string>
    <string name="main_button_text">ボタン</string>
</resources>
```

<resource>から</resources>の中に記します。
<string name="?????">テキスト</string>

???の部分にlayout.xmlで指定する名前を入れます。
これを「layout.xml」でviewに反映させるには以下の通りです。

```xml
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/main_text_top"
        android:layout_gravity="center"
        android:id="@+id/textView"/>
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/main_button_text"
        android:id="@+id/button"/>
```

android:text=""の中に@string/main_text_top等、先ほどstring.xmlで指定したnameを渡しているのがわかるかと思います。このようにviewに反映してあげます。

## onClickListenerの実装
実装していきましょう。

```java:MainActivity.java
public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        setViews();
    }

    private void setViews(){
        Button button = (Button)findViewById(R.id.button);
        button.setOnClickListener(onClick_button);
    }

    private View.OnClickListener onClick_button = new View.OnClickListener(){
        @Override
        public void onClick(View v) {
            Toast.makeText(MainActivity.this,"button clicked",Toast.LENGTH_SHORT).show();
        }
    };
}
```

onCreateでsetContentViewでlayoutを置いて、その後setViewsを呼び出しています。setViewsでは
layout内のButtonをリソースから読み込み、そのbuttonにonClickListenrを設置しています。

```java:setViews()
button.setOnClickListener(呼び出すView.onCLickListener);
```

次に、呼び出すView.OnClickListenerを定義します。

```java:onClick
    View.OnClickListener 名前 = new View.OnClickListener() {
        @Override
        public void onClick(View v) {
　　　　　　　　　　処理
        }
    };
```
のようにします。



# onClickListenerと合わせてよく使われるUI上の処理
ViewがclickされたときによくやるUI上の処理を記します。

- Toast
- Intent
- Viewの置き換え

## Toast文

Toast文といわれるとピンとこないかもしれませんが、皆さんスマートフォンに触れていれば必ず見たことがある部品の一つです。

上の例でも登場しました。ですので、一回実行していただければイメージがわくかと思います。

```java:MainActivity.java
  Toast.makeText(MainActivity.this,
                    "Toast",
                    Toast.LENGTH_SHORT).show();
```
android.widgetに属します。
では引数の紹介をします。

```java:
Toast.makeText("Context context",String text,int duration)
```

Contextは[Day2](http://qiita.com/BD1-FM/items/c5ed161feec1fdf92796)で紹介しました。なので指定方法としては現在のclass(activity)を指定してあげればいいでしょう。
例) MainActivity.this

String textはそのままです。""で囲んだ文字列、もしくは文字型の変数も可能です。今回は直接文を打ち込んでいます。

int durationは秒数です。といっても単純な数字(int)では指定することはできません。Toastの中に二種類

```java
Toast.LENGTH_LONG  //4秒弱
Toast.LENGTH_SHORT  //2秒弱
```

が存在します。これらで指定することができます。
具体的な数字、またToastのsleep等は別途自分で継承したclassを用意するしかありませんので、現段階ではとりあえず二つ指定することができる、という形で。

## intent
説明が飛び飛びになってしまって申し訳ないんですがこちらも軽く[Day2](http://qiita.com/Yuki_Yamada/items/c5ed161feec1fdf92796)のintentの項でお話しました。

### 明示的intent
一般的には同一アプリケーション内での画面遷移に用いられれます。
intentクラスのstartActivityメソッドの引数として。

```java:MainActivity.java
            Intent intent = new Intent(getApplication(),subActivity.class);
　　　　　　 intent.putExtra("string name",extra);
            startActivity(intent);
            
```

```java
Intent(Context PackageContext,class);
intent.putExtra(String key,extra);
```

putExtraでデータをActivity間でやり取りすることができます。
keyをStringで私、データをそれぞれ渡すことでそのkeyに保存されます。
extraは本当になんでもよく
数字でも文字列でも真偽でもなんでもあり。

呼び出しは

```java
Strng text = intent.getStringExtra("");
int number = intent.getIntentExtra("",初期化);
```

となります。
呼び出す際は何を呼び出すか明確にする必要があります。


## Viewの置き換え

```java
            TextView textView = (TextView)findViewById(R.id.text_topText);
            textView.setText("ボタンを押してください");
```

Buttonと同じ要領です。

以上です。