Xamarin逆引きTips
Xamarin.iOSでの画面遷移で「戻る」を実現するには？（Storyboard、Unwind Segue使用）
画面遷移で戻る処理を実装する方法として、Xamarin StudioのiOSデザイナーで「Unwind Segue」を使う方法を説明する。
Xamarin.iOSでは、「Unwind Segue」という機能で「画面を戻る」ときの処理をカスタマイズできる。今回は、この方法について解説する。
今回も、「Tips：Xamarin.iOSで画面遷移先にデータを渡すには？（Storyboard使用）」の続きとして解説するので、プロジェクトの準備は前回を参照してほしい。
1. 画面を準備する
前回終了時点で、MainStoryboard.storyboardファイルを開くと、以下の画面のようになっているはずだ。
図2に示すように、ViewControllerを新たに追加し、背景色を黄色とする。また、青のViewControllerにボタン「Goto Yellow」を配置し、Controlキーを押しながら黄色のViewControllerにドラッグ＆ドロップし、画面遷移（＝［Push］のセグエ）を作る。
2. 任意のViewControllerへ「戻る」処理を実装する
黄色のViewControllerから、白のFirstViewControllerへ戻る処理を実装する。
まず、FirstViewController.csファイルを開いて、「画面遷移で戻ってきた際に呼ばれるメソッド」を以下のように実装する。
|
partial class FirstViewController : UIViewController
{
……省略……
[Action ("BackToWhiteViewController:")]
public void BackToWhiteViewController(UIStoryboardSegue segue)
{
}
}
|
UIStoryboardSegueオブジェクトを引数とするメソッドを定義し、[Action]属性を付与する。今は、戻ってきた際に行う処理は何も無いので実装はない。
次に、MainStoryboard.storyboardファイルを開き、黄色のViewControllerにボタンを追加し、［Title］を「Back to White」とする。そしてボタンを、Controlキーを押しながら、ViewControllerの下部にある［Scene Exit］アイコンにドラッグ＆ドロップする。するとAction Segueを選択するポップアップが表示され、先ほど追加したBackToWhiteViewControllerが現れるので、それを選択する。こうして作成したものが「Unwind Segue」だ。「Scene Exit」を選択すると、プロパティウィンドウに作成したUnwind Segueが表示される。
この操作により、「[Back To White]ボタンを押すと、白のViewControllerへ戻る」という処理が定義される。
ここまでのプログラムを実行すると、以下のようになる。
3. 「戻る」際にデータを渡す
表示した画面で入力したデータを呼び出し元で使用したいときも、Unwind Segueを使用する。
例として、黄色のViewControllerで入力した文字列を、白のViewControllerに表示する実装を行う。
まず、黄色のViewControllerにテキストフィールドを配置し、［Name］を「textCity」とする。同時に、ViewControllerの［Class］を「FourthViewController」とする。
FourthViewController.csファイルが作成されているので、それを開いて、以下のように実装する。
|
partial class FourthViewController : UIViewController
{
public FourthViewController (IntPtr handle) : base (handle)
{
}
public string City //<--1
{
get;
private set;
}
public override void ViewDidLoad()
{
base.ViewDidLoad();
textCity.EditingChanged += (sender, e) =>
this.City = textCity.Text; //<--2
}
}
|
Cityプロパティを用意する（1）。このプロパティは、戻ったViewControllerからデータを取得するためのものだ。そして、テキストフィールドの編集終了時に、このプロパティを更新する（2）。
次に、白のFirstViewController.csファイルを以下のように修正する。
|
partial class FirstViewController : UIViewController
{
……省略……
[Action ("BackToWhiteViewController:")]
public void BackToWhiteViewController(UIStoryboardSegue segue)
{
var vc = segue.SourceViewController as FourthViewController; //<--1
if (vc != null)
{
textCountry.Text = vc.City;
}
}
}
|
textCountryは、前回作成したテキストフィールド。
黄色のViewControllerから戻った際のBackToWhiteViewControllerで、引数であるsegueオブジェクトのSourceViewControllerプロパティから、戻り元のFourthViewControllerが取り出せるので、Cityプロパティからデータを取り出している（1）。
4. プログラムを実行する
ここまでのプログラムを実行すると、以下の画面のようになる。
黄色のViewControllerで文字列を入力して白のViewControllerに戻ると、入力した値が表示される。
まとめ
前々回、前回、そして今回とXamarin StudioのiOSデザイナーを利用した画面遷移の方法を解説した。iOSデザイナーは非常に強力で、XcodeのInterface Builderで行えるほとんどのことには対応しており、中には本家より使いやすい機能もある。
まだ一部、iOSデザイナーが対応していない機能もあるが、そのような機能を使いたい場合はXcodeのInterface Builderを使えばよい。これは、.storyboardファイルをマウスで右クリックして［Xcode Interface Builder］を選択することで使用できる。Xcodeで行った変更は、すぐにXamarin Studioにも反映されるので、両者を切り替えながら作業できる。Xcodeを利用した画面の作成については、「Tips：Xamarin.iOSで画面をレイアウトするには？（Xcode利用／ビルトインiOS用UIデザイナー）」を参照してほしい。
※以下では、本稿の前後を合わせて5回分（第14回～第18回）のみ表示しています。
連載の全タイトルを参照するには、［この記事の連載 INDEX］を参照してください。
14. Xamarin.iOSで画面遷移を行うには？（Storyboard使用）
Xamarin.iOSでのStoryboardによる画面遷移を、Xamarin StudioのiOSデザイナーを使用して行う方法を解説。また、コードで画面遷移を実装する方法も説明する。
15. Xamarin.iOSで画面遷移先にデータを渡すには？（Storyboard使用）
Xamarin.iOSでStoryboardにより画面遷移を行う際に、遷移元から遷移先にデータを渡す方法を解説する。
16. 【現在、表示中】≫ Xamarin.iOSでの画面遷移で「戻る」を実現するには？（Storyboard、Unwind Segue使用）
画面遷移で戻る処理を実装する方法として、Xamarin StudioのiOSデザイナーで「Unwind Segue」を使う方法を説明する。
17. Xamarin.iOSで地図を表示するには？（MapKit使用）
Xamarin.iOSでiOS標準の地図ライブラリ「MapKit」を使って地図を表示する方法を解説。また、地図の種類の変更、ジェスチャの有効／無効の切り替えなども説明する。
18. Xamarin.iOSで地図に図形を表示するには？（MapKit使用）
Xamarin.iOSでiOS標準の地図ライブラリ「MapKit」を使って、ライン、ポリゴン、円などの図形を地図上に表示する方法を解説する。
