読者です 読者をやめる 読者になる 読者になる

XamarinでUITableViewのセルの内容を遷移先のUITextViewに表示させる方法。

C# ios TableView UITextView Xamarin Xamarin Studio アプリ メモ帳

前回からの続きで、今回はUITableViewのセルをタップするとセルの内容が遷移先のUITextViewに表示されるようにする方法です。

nooootion.hatenablog.com

まず、UITableViewのセルをクリックして、controlとドラッグで画面遷移先のUITextViewに線を移動させます。画面の間に表示された矢印をクリック、プロパティを表示させてsegueのidentifierに適当に名前を付けます。(next_detailViewにしました。)

f:id:nooootion:20160617220559p:plain

続いてUITableViewの乗っているTableViewController(ここではMainTableViewController)にプログラムを追加します。UIViewControllerのメソッド(PrepareForSegue)をオーバーライドして中身を実装します。

f:id:nooootion:20160617221407p:plain

続いて呼び出し先のDetailViewControllerのsetContentsメソッドの中を実装します。

f:id:nooootion:20160617221923p:plain

フィールド変数として、row、isNew、contentsを保持しており、遷移前に押されたセルの番号、文字を格納します。

後は、DetailViewControllerのViewDidLoadメソッド内で、UITextView.Text=contentsとして文字を表示させればOKです。

 

完成動作がこちらです。

①MainTableViewControllerに表示されている文字をタップする。

f:id:nooootion:20160617222309p:plain

②遷移先のDetailViewControllerに先ほどセルに表示されていた文字がUITextViewに表示されます。

f:id:nooootion:20160617222402p:plain

XamarinでTextViewで入力した内容をTableViewの一覧に表示する。

C# ios UINavigationController UITextView Xamarin Xamarin Studio アプリ メモ帳 TableView

前回からの続きでiOSアプリ標準のメモ帳を作成していますが、今日はTextViewに記入したメモの内容をTableViewに一覧表示する方法を記入したいと思います。

nooootion.hatenablog.com

全体の構成としてはこんな感じです。

UINavigationController

    ↓

MainTableViewController(UITableViewController)

             

DetailViewController(UIViewController)

f:id:nooootion:20160613234143p:plain

MainTableViewControllerがRoot画面となっており、TableviewのNameをtableとしてあります。また、DetailViewControllerのTextViewのNameにdetailTextViewと命名してあります。

画面遷移の方法は前回の記事を見ていただければ良いかと思いますので省略します。

今日はDetailViewControllerのTextViewに内容を記入したものを、MainTableViewControllerに戻る際に一時保存してテーブル一覧に表示させます。

動作としてはこんな感じです。

①TextViewにメモを記入します。

f:id:nooootion:20160613235453p:plain

②メモボタンでMainTableViewController画面に戻ります。

f:id:nooootion:20160613235707p:plain

③右下の新規作成でTextView画面で再度メモを入力すれば一覧に追加される。

f:id:nooootion:20160614000214p:plain

f:id:nooootion:20160614000135p:plain

f:id:nooootion:20160614000312p:plain

 

ここからはコードを記載します。

まず、DetailViewControllerの内容になります。

f:id:nooootion:20160614000525p:plain

前回から追加されているのはViewWillDisappear()になります。

メモボタンでMainTableViewController画面に戻る際に、DataSourceクラスにTextViewに入力した内容を保存します。

DataSourceクラスになります。

f:id:nooootion:20160614000941p:plain

内部にListクラスを持っており、先ほどのSet()でパラメータで渡された文字列をListに保存しています。

もう一つ、フィールド変数として自分自身(DataSourceクラス)を保持していますが、

全体でデータ情報を管理するクラスとして一つだけ存在するようにコンストラクタをprivateにして初回時に一度だけインスタンスを生成するシングルトンクラスになるようにしてあります。

また、UITableViewSourceを継承しており、GetInstance()で自分自身を戻り値の型とすることで、UITableView.Source()にデータを代入してテーブルに表示できます。

最後に、MainTableViewControllerになります。

f:id:nooootion:20160614001954p:plain

ViewWillAppear()で画面再度表示される際にDataSource.GetInstance()でデータをセットしてUITableView.ReloadData()でセルの内容を再描画しています。

 

ハマったポイントとして、

ViewWillAppear()で画面が再度呼ばれればデータも再描画されると思ったら、表示がされないためちょっとハマってしまいました。

再度セルに表示させるためにはUITableView.ReloadData()で再度読み込ませないとテーブルにデータが表示されないので注意が必要です。

XamarinでUINavigationControllerの戻るボタンを押した際に処理をさせる方法。

C# ios Xamarin Xamarin Studio アプリ メモ帳 UINavigationController

nooootion.hatenablog.com

前回の記事の続きで、UINavigationControllerで戻るボタンを押した際に何か処理をさせる方法です。

今回はテストとして、戻るボタンを押した際にアラートが表示されるようにします。

この部分を書き換えればメモ帳アプリのように戻るボタンが押された際にUITextViewに書き込みがあれば内容を保存するような処理が書けるかと思います。

①詳細画面(DetailViewController)から一覧画面に戻る

f:id:nooootion:20160607215955p:plain

②UINavigationControllerにデフォルトで付いている戻るボタン(メモ)を押す

f:id:nooootion:20160607220223p:plain

③アラートが表示される

 

処理方法

プログラムは至って簡単です。

UIViewContorllerのメソッド、ViewWillDisappear()を実装します。

DetailViewController自体UIViewControllerを継承しているので、

オーバーライドして新しく処理させたい内容を記述します。

なぜオーバーライドさせるかというと、継承しただけでは自分が処理させたい内容が実装できないからです。そのためにUIViewControllerのViewWillDisappear()はvirtual 型となっています。

f:id:nooootion:20160607221232p:plain

まとめ

最終的にはSQLiteを使用してDBに保存したデータをTableViewとTextViewに表示、編集できるようにしたいと思います。

XamarinでUITextViewのキーボードを表示・閉じる方法

C# ios Xamarin Xamarin Studio アプリ UITextView メモ帳

XamarinでUITextViewを使用してキーボードの表示と閉じる方法を紹介します。

参考としてはiosに標準で付いているメモ帳を模倣しました。

①起動時の画面

f:id:nooootion:20160606213103p:plain

②右下の新規作成用のツールバーボタンを押すと詳細画面に遷移

画面遷移と同時にキーボードが表示される

f:id:nooootion:20160606213333p:plain

③右上のDoneボタンを押すとキーボードが閉じる

f:id:nooootion:20160606213426p:plain

 

全体構成

f:id:nooootion:20160606214028p:plain

UINavigationControllerを配置して、初期表示画面にUITableViewController、新規メモ作成用のツールバーボタンを押した際の画面遷移先をUIViewController(DetailViewController)として、その上にUITextViewを配置します。

DetailViewControllerのViewDidLoadメソッド内にキーボードの表示・閉じるの処理を書きます。

f:id:nooootion:20160606215052p:plain

画面タッチ等のイベントはUIResponderクラスが管理しており、

UITextViewはこのクラスを継承しているためUIResponderのメンバのBecomeFirstResponder()メソッドやEndEditing()メソッドを呼び出して使用することができます。

 

まとめ

キーボード操作は必須かと思うので、UITextViewもUITextFieldもUIResponderを継承しているため、画面イベント関係で何かしたかったUIResponderを調べてみれば良さそうですね。

Xamarinを使ってみた感想。

C# ios Xamarin Xamarin Studio アプリ

Xamarinを1ヶ月位使った感想です。

・環境

Mac Air 4G

Xamarin Studio

(Parallels DesktopVisual Studio for Xamarinも少々)

 

Xamarin StudioとVisual Studio for Xamarin

主観的な感想ですが、Xamarin Studioの方がインターフェースがすっきりしていて使いやすい気がします。ショートカットキーも設定でVisual Studioと同じようにできるので普段Visual Studioに慣れた人でも大丈夫です。

ただPCスペックの問題だと思いますがVisual StudioでStorybordの画面表示とシミュレータ起動する際に非常に時間が掛かります。今から始めようと思っている方はご注意下さい。

後、自分がVisual Studioのシュミレータで動かす際にはまったポイントとして、

シュミレータで起動する際にソースが見つからないというようなエラーと、デバック時にF11でステップインするとUIKit関係を使用している部分でモジュールが見つからないとエラー表示されます。

最初の問題はParallels Desktopを使用するとVisual Studioを起動するパスが仮想パス(¥¥D:〜)の場合?になるようで、Macに実際に保存されているパスを使用してVisual Studioを起動すれば解決しました。2つ目の問題はF11のステップインがだめなのか?F10が代わりにステップインでエラーせずにデバックできました。どうゆうことかは分かりません。

 

Xamarinについて

UIについてはデスクトップアプリやASP.NETを使用しているのでコントロールを配置してイベント処理があってと理解しやすかったですが、もともとSwiftで記述していた部分はどうすれば良いのか最初分かりませんでした。

オリジナルなロジック部分のみC#で記述して、残りの部分はSwiftも織り交ぜて書くのかと思ったらC#ように対応したXamarinのライブラリを使用するんですね。それはそうかw

API Documentation - Xamarin

 

最後に

まだ正直よくわからんところもあるけど、ちょくちょく触って遊んでみようと思います。

 

XamarinでUIViewcontrollerの画面遷移

Xamarin Studio ios アプリ C# Xamarin

XamarinでUIViewControllerに配置したボタンを押すと下からもう一つの画面へ遷移する方法を紹介。

 

 

まずSingle View Appleから画面が一つだけのプロジェクトを作成する。

真ん中位にToolboxからボタンを配置して、f:id:nooootion:20160526214356p:plain

 

PropertiesのWdgetからButtonのTitleを適当に変更する。

f:id:nooootion:20160526214458p:plain

 

次は遷移先になる画面を配置します。

ToolboxからUIViewControllerを最初の画面の右にドラッグ・ドロップします。

先ほどのボタンをクリックしてフォーカスを当てて、【control】キーを押しながらボタンの上部から右端に配置したUIViewControllerに線を伸ばします。

すると2つの画面の間に矢印アイコンが表示され画面遷移する先が表示されます。

f:id:nooootion:20160526214805p:plain

 

2つ目の画面をクリックしてフォーカスを当てたら、PropertiesからviewのBackgroundから好きな色を選択して画面い色を付けます。

f:id:nooootion:20160526215503p:plain

 

アプリを実行してみます。

シュミレータが起動して作成した1つ目の画面が表示されます。

ボタンを押してみると。。。

f:id:nooootion:20160526215709p:plain

 

下から2つ目の画面が遷移して表示されます。

f:id:nooootion:20160526215825p:plain

 

Story bordを使用すればUI部分を作るのは比較的簡単にできます。

 

 

Xamarin始めました。

Xamarin C# Xamarin Studio ios アプリ

最近Xamarin Studioでiosアプリ開発を始めました。

使い慣れたC#で書けるのはいいですね。