Xamarin.FormsのLabelのクリックイベントを実装する
Xamarin.FormsのLabelにタップイベントをつける
スマホアプリを作るときにButtonではなくLabelにクリックイベントをつけたいと思ったことないですか？
私はButtonではなく、ただ文字が表示されている部分をタップしたら何かが起こるようにしたいと思うことが多いので、多々Labelにクリックイベントを実装します。
Buttonにクリックイベントがあるのは当たり前なので、多くの情報があります。しかし、Labelはそもそも文字などを表示するものなので、標準ではクリックイベントが実装できません。
なので、今回はLabelにクリックイベントを付ける方法をまとめたいと思います。
普通のButtonの実装例
まずはXamarin.FormsでのButtonのクリックイベントの実装方法を説明します。
実装方法はシンプルで、XAMLファイルにButtonを設置し、そのXAMLファイルに関連付けられているC#ファイルにメソッドを記述するだけです。
- XAMLファイル
ButtonとLabelを設置してみましょう。
属性は次のようにします。
<StackLayout>
<Label x:Name="label1" Text="おしてない" />
<Button Text="ボタン" Clicked="OnButtonClick" />
</StackLayout>
C#ファイルには次のメソッドを追加しておきます。
public void OnButtonClick( object sender, EventArgs args )
{
label1.Text = "おした";
}
XAMLファイルのButtonのClicked属性で指定している「OnButtonClick」はC#ファイルのメソッドとなります。引数はobjectとEventArgsです。この部分はほとんど決め打ちです。
Labelにクリックイベントを付けてみる
先程Buttonにクリックイベントを付ける方法は説明しました。
ならLabelもClicked属性でメソッドを指定すれば良いのでは？？
と思いませんか。
残念ながらLabelにはClicked属性が存在していません。まあ、当たり前といえば当たり前ですよね、、、Labelはあくまで文字表示が仕事ですから
では、どうやって実装するのか。それはGestureRecognizersを使います。使い方は簡単で、Labelの部分を以下のように書くだけです。
- XAMLファイル
<Label x:Name="label1" Text="おしてない">
<Label.GestureRecognizers>
<TapGestureRecognizer Tapped="OnLabelClick" />
</Label.GestureRecognizers>
</Label>
public void OnLabelClick( object sender, EventArgs args )
{
label1.Text = "おした";
}
XAMLの記述が少し増えるだけで、Labelであっても実装は難しくありませんね。このGestureRecognizersを利用すれば、ほかのものにもクリックイベントを追加できるようになるかもしれないです。 例えば、画面右半分にLabelを配置しておき、GestureRecognizersでクリックイベントを追加しておけば、画面右半分をタップするとイベントが起こるなんていう実装もできそうですね。
GestureRecognizersの注意点
XAMLを使わずに、C#のコードでレイアウトを作成することもあると思います。このときGestureRecognizersもコードから実装できます。
コードで追加するときは以下のようになります。
var tgr = new TapGestureRecognizer();
tgr.Tapped += (s, e) => { TapLabel1(); };
label1.GestureRecognizers.Add( tgr );
TapLabel1は任意のメソッドです。このようにGestureRecognizersはListのようにイベントを追加していきます。複数個のイベントをつけることができるのです。
しかし、クリックイベントを追加するだけなら問題はないのですが、イベントを取り除きたいときは注意が必要です。
GestureRecognizersには削除用にClearメソッドが用意されていますが、なんとこのメソッドはiosで機能していないみたいなのです。Androidでは機能していました。
そのためiosでイベントの削除を実装するためには違う方法が必要となります。その例は以下のようになります。
// label1.GestureRecognizers.Clear(); <-これはダメ
if( label1.GestureRecognizers.Count() > 0 )
{
label1.GestureRecognizers.RemoveAt(0);
}
このように番号を指定してイベントを取り除くという方法でしか削除できませんでした。
まとめ
ということで今回はXamarin.FormsのLabelにクリックイベントを実装する方法をまとめました。
はじめはClicked属性が存在していなかったので焦りましたが、割とシンプルに実装する方法があってよかったです。
これからもXamarin.Formsでのアプリ開発は勉強していきたいので、また何かあればまとめたいと思います。
今回はこの辺で、ではまた！