‫お帰りなさい｡
‫このビデオでは､ ラジオボタンを使って作業します｡
‫そして､ ご覧のように､ ツールボックスからドラッグすることができます｡
‫UIに放射状ボタンをドラッグするだけで､ コンテンツがあるグリッドにラジオボタンが表示されます｡
‫まあ､ すでに見てきたように複数の性質を持っているのですが｡
‫そして､ これはこのビデオでラジオボタンを操作したい方法ではない｡
‫Stackパネルを作成し､ そのほとんどをXAMLで構築していきます｡
‫そこで､ 「STACK」パネルに､ まずラベルを付けます｡ ラベルには､ 「Do you like me?(私のこと好き？)」というようなことを書きます｡
‫私たちがそうであるように､ あなたも私を好きですか？
‫これは私たちのレーベルなので､ 太字にした方がいいと思います｡
‫というわけで､ フォントのウェイトはこのように太字になり､ さて､ 他に何を加えればいいのでしょうか｡
‫フォントサイズとかね｡
‫そこで､ フォントサイズを追加して､ 20にしてみましょう｡
‫だから､ あなたは私がかなり長いテキストを好きですか｡
‫そして今､ 私たちはイエスかノーか､ あるいはまあ､ そうかもしれないと言う必要がありますが､ その3つの間には何もありませんから､ その3つの選択肢しかないのです｡
‫そして､ それがラジオボタンの利点でもあります｡
‫無線グループ内では常に1つしかアクティブにならないそうです｡
‫では､ ここにラジオボタン､ radio buttonを作りましょう｡
‫そして､ 先ほど見たような単純なラジオボタンだけではもったいないので､ もう少し拡張したものを作ってみようと思います｡
‫このラジオボタンは､ まあ､ ラップと矩形とテキストブロックにしたいのです｡
‫だから､ ラップパネルのようなもの｡
‫そこで､ ここにラップパネルを作成することにします｡
‫そして､ ラップパネル内に､ 今回は緑色の長方形を配置します｡
‫だから､ 誰かが「そうだ､ だから緑にしよう」と言うのです｡
‫緑がよくて､ 幅は16くらい､ 高さも16くらいがいいんじゃないでしょうか｡
‫つまり､ 16×16の緑のグリッドが私たちの存在する場所なのです｡
‫これが今ある矩形です｡
‫これが私たちの長方形で､ ご覧のように緑色のものです｡
‫そして今度は､ その横に何かテキストが欲しい｡
‫だからテキストブロック､ そしてそれはイエスのテキストになるのです｡
‫だから､ 人物も好きだし､ 前景も緑にしたほうがいい｡
‫だから､ グリーンとグリーン｡
‫その人が好きだから｡
‫これが私たちのテキストブロックであり､ イエスと書かれているわけです｡
‫あとは､ オブジェクトの間に少し余白があったほうがいいかもしれませんね｡
‫という感じで､ STACKパネルレベルの一番高いところにマージンを追加していきます｡
‫ご覧のように､ 少し距離ができているので､ テキストブロックやラジオボタンに少し余白を加えることもできます｡
‫ラジオボタン全体の余白を10ピクセルにしよう､ あるいは5ピクセルだけにしてみよう｡
‫それでいいはずです｡
‫それから､ テキストブロックのマージンも､ ちょっと他と近すぎるから､ それから上に向かってはダメです｡
‫そして下に向かって､ でも左側だけ｡
‫そして､ マージンはどちらか1つの値です｡
‫つまり､ 1つの値を追加することも､ 左から始めて上､ 右､ 下と4つの値を追加することもできるのです｡
‫だから､ 左､ 上､ 右､ 下｡
‫だから､ 私が欲しいのは､ 左5ピクセル上です｡
‫どんな権利もいらない｡
‫何もいらないし､ 底もいらない｡
‫私も同じく､ 何もいらないです｡
‫そして､ イエスと正方形または長方形の間に5ピクセルの余白があることがおわかりいただけると思います｡
‫わかりました｡
‫だから､ 左上､ 右下｡
‫このマージンをどう使うかですね｡
‫わかりました｡
‫ということで､ ラジオボタンは1つで､ ラジオボタンは3つ用意したいと思います｡
‫そこで､ 実際に､ ここに適切な量の線しかないように､ 背面をカットしてみます｡
‫そして､ このラジオボタンをコピーして､ そのすぐ横か下に配置します｡
‫そして､ これは赤く塗りつぶされ､ テキストにはNoのように書かれているはずです｡
‫だからテキストはノーになる｡
‫そして私たちは､ イエス､ ノーです｡
‫もちろん本文も読むべき｡
‫だから実はここじゃなくて､ ここなんです｡
‫つまり､ 「いいえ」ボタンでは､ 「いいえ」を赤にする必要があるのです｡
‫ラジオボタンでそれなんですね｡
‫超シンプル｡
‫しかし､ 今度は別のものを追加したいと思います｡ 多分､ 矩形の代わりに､ ここに小さな画像を持たせたいと思います｡
‫そこで､ 矩形をなくして､ まだ使っていないimageを使うことにします｡
‫そして､ 画像を使いたいときには､ その画像のソースが必要です｡
‫だから私の場合､ ソースがあるんです｡
‫私のPCでは､ だから､ ソースと言いながら､ 正しいディレクトリが必要です｡
‫しかも私の場合､ PCで｡
‫それで､ このC-shine Masterclassというフォルダがあります｡
‫もちろん､ プロジェクトフォルダがあって､ その中にmaybeファイルというのがあって､ maybe Dot, P and Gという名前で､
‫ここにこのファイルがあります｡
‫もちろん､ とても大きいので小型化されるでしょうしね｡
‫しかし､ もしダウンサイジングしたいのであれば､ 画像を使用する前に行うのが本当に理にかなっています｡
‫だから､ この画像を編集してサイズを小さくすればいいんです｡
‫でも､ これは使いたい画像になりそうです｡
‫これが私の画像のソースになるわけです｡
‫そうすれば､ 幅などを指定することができますね｡
‫だから､ それ以外はご覧の通り､ オリジナルサイズだからです｡
‫でも､ ダウンスケールも可能で､ 例えばwithを32､ heightを32とします｡
‫そのため､ このような画像が表示され､ テキストは赤くならないはずです｡
‫実は､ 標準色の黒でもいいんです｡
‫これが､ ラジオボタンのテキストです｡
‫私のこと好き？
‫はい｡
‫いいえ｡
‫そして､ たぶん｡
‫それでは､ このアプリケーションを起動して確認してみましょう｡
‫そこにいるのは､ 私たちです｡
‫私のこと好き？
‫はい｡
‫いや､ そうかもしれない｡
‫そして､ ご覧の通り､ それ以前は空っぽだったのです｡
‫そして今､ 私たちはそれを選択することができ､ それらは常に互いに接続されていることになります｡
‫その3人が同じグループになっているわけです｡
‫これらは互いに接続されており､ どちらか一方だけがアクティブになることができます｡
‫これが､ チェックボックスと比較した場合の放射状ボタンの利点ですね｡
‫そのため､ 選択肢を1つだけ持ちたい場合は､ 放射状ボタンが適しています｡ もし､ どちらかを最初に指定し､ どちらかを最初にチェックするようにしたい場合は､
‫is checkedプロパティを使用すればよいでしょう｡
‫そこで､ このラジオボタンの中で､ 多分をチェックすることにしましょう｡
‫そこで､ このcheckedを使い､ trueに設定することにします｡
‫わかりました｡
‫では､ 次にもう一度始めましょう｡
‫そして､ もしかしたら最初からチェックされているのかもしれない､ ということがわかるはずです｡
‫もし､ 誰かがその一つを押したときにイベントを発生させたい場合は､ ここにチェックを入れてイベントリスナーを手動で追加するか､
‫あるいは単にダブルクリックすることでイベントを作成できます｡
‫そこで､ 「No」をダブルクリックします｡
‫そして､ ご覧の通り､ ラジオボタンが1つチェックされ､ 本当はチェックされていませんでした｡
‫この2つのメソッドは､ オブジェクトセンターとイベントアークを経由して作成されていることがわかります｡
‫つまり､ チェックボックスと同じことです｡
‫そしてここに､ 表示メッセージボックスのようなものを追加することができます｡
‫表示する小さなメッセージボックス｡
‫イエスと言ってください｡
‫ということで､ こんなことが書いてあります｡
‫そしてもう一人は､ 「知ること」だから､ 「はい」と答えるつもりです｡
‫そして多分､ 私がイベントを追加したことが一度でもあり､ もしその名前が気に入らなければ､ 名前を変更することができます｡
‫だから､ ラジオボタンがチェックされていないとか言い出すんだけど､ いや､ 何がチェックされているんだ？
‫もちろん､ 後ろのコードで名前を変更する必要があります｡ これはno checkedで､ 次にmaybe
‫checkedがあるので､ ここでも名前をmaybe checkedに変更します｡
‫それをコピーして､ ここで変えているんです｡
‫だから､ イエスと言ってください｡
‫2回「はい」と言ってください｡
‫そして､ 誰かが「はい」を押したら､ 「ありがとうございました」というようなことを言うことができます｡
‫では､ それを手動で作ってみましょう｡
‫ここではcheckedを使って､ yes, underscore checkedという新しいメソッドを作ってみます｡
‫そして､ そのためのメソッドを作り､ 後ろにコードを書きましょう｡
‫そこで､ ここで見てきたような原理を使うことになります｡
‫プライベートボイド
‫はい｡
‫私たちは､ 実はこうなんです｡
‫はい｡
‫オブジェクト､ 送信者､ ルートされたイベントアークをチェックした｡
‫そして､ 私もEと呼ぼうと思います｡
‫そして今ここで､ 私たちは先に進んで､ ありがとうございました､ というようなことを言うことができるのです｡
‫ありがとうございます｡
‫わかりました｡
‫では､ 確認してみましょう｡
‫ちなみに､ そうすると､ このイベントはbecauseと呼ばれていたことがわかります｡
‫まあ､ 確認されたのでもう一度進めてみましょう｡
‫このような機能があります｡
‫ここで､ 私のプログラムがまだ表示されていないのに､ 自動的にplease say yesが開かれたわけです｡
‫そして､ 「はい」をクリックすると､ プログラムが表示されます｡
‫そしてそれは､ もしかしたらチェックが入っていて､ どちらにしてもこのイベントが呼ばれるからかもしれません｡
‫だから､ いつチェックされてもいいように､ スタート時にチェックされているので､ 初期化されたときに､
‫だから､ ノーと言うと､ どうぞ､ イエスと言われます｡
‫そして､ 私が「はい」と答えると､ ありがとうと書いてあるのです｡
‫というわけで､ こことここに作ったさまざまなイベントです｡
‫こちらは､ この情報はチェックイコール真です｡
‫この行､ つまりこのコードは､ プログラムが初期化されるたびに､ このチェックされたイベントを直接トリガーします｡
‫例えば､ ここにnameという名前があって､ これはRBになるけれども､ もしかしたらこれはRBかもしれない､
‫だからここで初期化メソッドかコンストラクタでrbをチェックし､ trueに設定することができる｡
‫そうすると､ コードで確認することができるんですね｡
‫わかりました｡
‫そこで､ もう一度実行すると､ このイベントがまだポップアップしていることがわかります｡
‫だから､ このチェックイベント､ はいと言ってください､ まだ出てくるんですよ｡
‫私のこと好き？
‫はい｡
‫素晴らしい｡
‫これで､ ラジオボタンの使い方がわかり､ ユーザーインターフェースに画像を実装する方法がわかりました｡