アプリ開発日記 #4 Xamarin.Formsで最初に表示するページ

今日の目標

起動時に下の画面が最初に表示されるようににする。

起動時に表示させたい画面

最初に表示する画面のレイアウトを整える

実際にやったこと

• 最初に表示するページの変更

作成したプロジェクトに何もコードを追加せずに実行した場合に、作成したプロジェクトのMainPageが表示されます。

プロジェクトのビルドで最初に表示されていた画面

そのため、とりあえず"MainPage"でソリューションを検索しました。

その結果、App.xamlでMainPageをnewしている箇所がありましたので、MainPageをnewしている箇所を変更しました。

修正した箇所

これにより、最初に表示する画面を当初目的の画面に変更できました。

なお、"MainPage = new MainPage()"の前方のMainPageはXamarinのプロジェクトを作成した際に、自動的に作成されるプロパティです。
そのため、new以下を最初に起動したい画面のクラス名にするだけで問題ありません。

• ボタンの角を丸くする

ボタンの属性に"CornerRadius"があるため、"CornerRadius"を設定することでボタンの角を丸くすることができました。

Before

After

困ったことと解決方法

困ったこと

機能作成した画面のName属性が重複していたため、ビルドエラーが発生していた。
また、ビルド後に表示されるエラー一覧からダブルクリックで該当箇所に富んだ場合、自動生成されたソースに富んでしまう。

解決策

xamlのほうの該当箇所を修正した。
自動生成されたソースの修正は、後々おかしなことになる可能性があるので、自動生成されたソースで重複していた項目が記載されているxamlファイルを探し、Nameが重複している項目のうちの片方を変更し、名称の重複を避けるようにした。

明日への思い

明日は、C#でリスト項目を作成し、画面へリストを表示させられるようにしたい。

雑記

こんだけ書いているとすごい進んでるように見えるけど、実際は2行くらいしかソースコードの修正をしていないんだよな。。。

アプリ開発の参考になる本

絶対に挫折しないiPhoneアプリ開発「超」入門 第7版 【Xcode 10 & iOS 12】 完全対応 (Informatics&IDEA)

独学プログラマーのためのAIアプリ開発がわかる本

基礎&応用力をしっかり育成! Androidアプリ開発の教科書 なんちゃって開発者にならないための実践ハンズオン (CodeZine BOOKS)

Androidアプリを作ろう [Android Studio 2.1対応版]

Xamarinでアプリを作ろう

基礎から学ぶ Xamarinプログラミング

Xamarinネイティブによるモバイルアプリ開発 C#によるAndroid/iOS UI制御の基礎

Creating Mobile Apps with Xamarin.Forms Preview Edition 2 (Developer Reference) (English Edition)

あと、パソコンも。。。

マイクロソフト Surface Book 2 [サーフェス ブック 2 ノートパソコン] 13.5 インチ Core i7/16GB/512GB - HNL-00023

マイクロソフト Surface Pro 6 [サーフェス プロ 6 ノートパソコン]Office Home and Business 2019 / Windows 10 Home / 12.3 インチ Core i7/ 512GB/16GB ブラック KJV-00028

Apple MacBook Pro (15インチ, 第9世代の2.3GHz 8コアIntel Core i9プロセッサ, 512GB) - スペースグレイ (最新モデル)