[Xamarin.CrossPlatform] マスタ/詳細アプリのプロジェクトを理解する1

数回に分けて、Xamarinのマスタ/詳細型アプリのプロジェクトについて理解を含めていきます。

今回はマスタ/詳細型プロジェクトの技術要素について見ていきます。

WindowsのVSはEnterprise 2017 Ver.15.5.2
MacのVSは7.3.2

を使用しています。

マスタ/詳細型プロジェクトの作成方法

クロスプラットフォームのアプリを作成する場合、WindowsのVisual StudioでもMacのVisual Studioでも、2つのテンプレートから作成することになります。

1つは空白のフォームのテンプレート、もう1つはマスター/詳細型のテンプレートです。

以下にプロジェクト作成時のダイアログを示します。上がWindows版で下がMac版です。

Windows版は、Master Detailを選択するとマスタ/詳細型のアプリを作成することができます。ちなみにBlank Appを選択すると空白のフォームアプリを作成することができます。

Mac版は、フォームアプリを選択することでマスタ/詳細型のアプリを作成することができます。

Windows版、Mac版とも、作成されるファイルは同じです。以降スクショはMac版を掲載します。

MVVM

マスタ/詳細型のプロジェクトは、MVVMパターンです。

MVVMはModel-View-ViewModelの略で、GUIを持つアプリケーションをModel、View、ViewModelの3つに分割して設計、実装を行います。

これはMVC(Model-View-Controller)の派生パターンになっています。

Model

Modelはビジネスロジック(アプリケーションのデータと手続き)を担う部分です。このため、表示機能については関与しませんが、背景色や文字色といった装飾部分のデータについてはModelで管理します。

View

Viewはデータを見える形にして表示したり、ユーザーからの入力を受け取る部分を担当します。Viewには複雑なロジックを持たせることはしません。基本的にはデータバインディング(後述)と呼ばれる機構を使用して、データの表示や入力の受け取りを行うようにします。

ViewModel

ViewModelはViewから受け取ったデータをModelに伝達したり、Viewの状態保持を担当します。このようにViewModelはViewとModelの仲介役となります。

データバインディング

データバインディングはUIとデータを関連付ける機構です。XamarinのCrossPlatform開発においては、Xamlの中にバインディング用の属性を記述することで、Modelが持つデータを自動で表示したり、ユーザーが入力したデータを受け取ることができるようになります。

 

今回は、マスタ/詳細型のプロジェクトの基本技術要素について触れてきました。文字ベースですし、説明がわかりにくいとことろもあるかと思います。

次回以降は、実際のコードも掲載しながら理解を進めていきます。

[Visual Studio][Xamarin][CrossPlatform] Android SDKをインストールする

Xamarin.Formsアプリのビルド時に「No resource found that matches xxxx」という警告が発生することがあります。これはAndroidのものです。

判断方法は簡単でプロジェクト名の後ろに.Droidが付いているかどうかです。

Android系の警告

たいていの場合はAndroid SDKをインストールすることで解決できるようです。

Android SDKのインストールは、Visual Studioの[ツール]-[Android]-[Android SDK Manager…]を選択します。

Andoroid SDKのインストール

続いて、Android SDK Managerが表示されます。

Android SDK Manager

あとは、必要なSDKにチェックを付けてインストールを行います。

以下のものはインストールしておきましょう。
Tools
・Android SDK Tools
・Android SDK Tools Platform-tools
・Android SDK Build-tools 23.0.3

Android 6.0(API 23)
・SDK Platform

Android 5.1.1(API 22)
・SDK Platform

Android 5.0.1(API 21)
・SDK Platform

Android 4.4.2(API 19)
・SDK Platform

Android 4.1.2(API 16)
・SDK Platform

Android 4.0.3(API 15)
・SDK Platform

Extras
・Android Support Repository
・Intel x86 Emulator Accelerator (Haxm Installer)

[Visual Studio][Xamarin] アップデート通知が表示されたのでアップデートしてみた

Visual Studio使用中にアップデート通知が来たので、アップデートをしてみました。メモ代わりにスクリーンショットを撮りながら作業を進めていきます。

はじめに以下のようなアップデート通知が表示されました。

アップデート通知

まずは[Download]ボタンを押します。するとダウンロードが開始され、以下のように進捗が進みます。[Pause]ボタンが表示されるので、途中で中断することもできるようです。

ダウンロードの進捗状況の表示

ダウンロードが完了すると[Install]ボタンが表示されるので、クリックします。

インストール

いよいよインストールの開始です。[Next]ボタンをクリックします。

[Next]ボタンをクリック

続いてライセンス条項をよく読み[I Accsept~]にチェックを付けて、[Next]ボタンをクリックします。

[I accept~]をチェックして[Next]をクリック

オプション選択画面が表示されるので、必要に応じて選択をし[Next]ボタンをクリックします。

オプションを選択して[Next]をクリック

[Install]ボタンをクリックして、インストールを開始します。

[Install]ボタンをクリック

ユーザーアカウント制御が表示されるので[はい]ボタンをクリックします。

ユーザーアカウント制御

インストールが始まりますが、Visual Studioが起動している場合は以下のようにダイアログが表示されます。Visual Studioを閉じて[OK]ボタンをクリックします。

Visual Studio起動中に表示されるダイアログ

インストール完了

無事にインストールが完了すると、以下のように表示されるので[Finish]ボタンをクリックします。

インストール完了画面