29
33

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

onClickListenerの実装とその後の処理

Last updated at Posted at 2015-06-07

OnClickListenerとは

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

目次

  • onClickListenerの実装
  • ViewのonClickによってUIに現れるよくある処理

下準備

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

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=""には2種類あります。
上にあるように

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

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

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

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に不安があれば先にアプリケーションのレイアウトを読んでいただければ勉強になると思います)
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

string.xmlの定義

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

まずは「string.xml」を開きます。
2.png
res -> values -> strings.xml です。

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

からの中に記します。
テキスト

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

    <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の実装

実装していきましょう。

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を設置しています。

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

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

onClick
    View.OnClickListener 名前 = new View.OnClickListener() {
        @Override
        public void onClick(View v) {
          処理
        }
    };

のようにします。

onClickListenerと合わせてよく使われるUI上の処理

ViewがclickされたときによくやるUI上の処理を記します。

  • Toast
  • Intent
  • Viewの置き換え

Toast文

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

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

MainActivity.java
  Toast.makeText(MainActivity.this,
                    "Toast",
                    Toast.LENGTH_SHORT).show();

android.widgetに属します。
では引数の紹介をします。

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

ContextはDay2で紹介しました。なので指定方法としては現在のclass(activity)を指定してあげればいいでしょう。
例) MainActivity.this

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

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

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

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

intent

説明が飛び飛びになってしまって申し訳ないんですがこちらも軽くDay2のintentの項でお話しました。

明示的intent

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

MainActivity.java
            Intent intent = new Intent(getApplication(),subActivity.class);
       intent.putExtra("string name",extra);
            startActivity(intent);
            
Intent(Context PackageContext,class);
intent.putExtra(String key,extra);

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

呼び出しは

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

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

Viewの置き換え

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

Buttonと同じ要領です。

以上です。

29
33
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
29
33

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?