この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
1 はじめに
今回は、前記事で紹介した「Xamarinによる3種類のアプローチ」の内の2番目である「Xamarin.Android」について書いています。 シンプルなプロジェクトを通じて、こちらも「薄いラッパー」となっていることを実感していただければと考えています。
2 テンプレート(Blank App)
VisualStudioでプロジェクトを作成する際に、「Blank App (Android)」を選択すると下記の構造のプロジェクトが生成されます。
(1)MainActivity.cs
MainActivityは、プログラム起動時に最初に起動されるアクティビティです。 テンプレートではOnCreate()がオーバライドされており、その中でResource.Layout.Mainがビューとして設定されています。
MainActivity.cs
[Activity(Label = "BlankApp", MainLauncher = true, Icon = "@drawable/icon")]
public class MainActivity : Activity {
int count = 1;
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
//ビューとしてMain.axmlを設定
SetContentView(Resource.Layout.Main);
//リソースID(MyButton)からButtonコントロールを取得
Button button = FindViewById<button>(Resource.Id.MyButton);
//ボタンがクリックされた際のイベント処理を定義
button.Click += delegate {
button.Text = string.Format("{0} clicks!", count++);
};
}
}
</button>
このResource.Layout.Mainというのは、Resources/layoutの階層下にあるMain.axmlの事であり、このaxmlがビューとして指定されていることになります。
※テンプレートでは、Main.axmlで配置されたボタンを押した時のイベント処理が、サンプルとして記述されています。
(2)Main.axml
ソリューションエクスプローラでMain.axmlをダブルクリックすると、axmlの内容をレンダリングしたデザイン画面が表示され、LinearLayoutとButtonが配置されているのが確認できます。 また、「表示(V)」-「その他のウインドウ(E)」から「ドキュメント アウトライン(D)」を表示すると、その階層構造を分かりやすく確認することもできます。 Main.axmlでは、「Design」タブから「Source」タブに切り替えることで、axmlのコードを直接編集することもできます。
Main.axml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:id="@+id/MyButton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/Hello" />
</LinearLayout>
3 UIViewだけのアプリ
(1)Viewクラスの定義
Viewだけの単純なアプリが、よく入門書に紹介されていますが、本テンプレートにおいては、Viewはaxmlで定義されているため、コードで記述することはできません。 そこで、ここではaxmlを使わずに自前でViewクラスを作成して表示してみたいと思います。
ソリューションエクスプローラでプロジェクトに新しいクラス(ここのでは「MyView」としました)を追加します。 新しく作成したクラスはViewを継承させます。 基底クラスをViewとすると、コンストラクタでContextを要求しますので、これを引数とするコンストラクタも併せて定義します。
MyView.cs
namespace BlankApp {
class MyView:View {
public MyView(Context context) : base(context) {
}
}
}
(2)Viewクラスの使用
続いて、このクラスをアクティビティのビューとして使用されるようにします。 MainActivity.csで、OnCreate()の中のコードを全部削除し、SetContentView()で、今回作成したViewクラス(MyView)を指定します。
MainActivity.cs
[Activity(Label = "BlankApp", MainLauncher = true, Icon = "@drawable/icon")]
public class MainActivity : Activity {
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
//作成したMyViewをビューとしてセットする
SetContentView(new MyView(this));
//テンプレートで生成されたコードをコメントアウトする
//SetContentView(Resource.Layout.Main);
//Button button = FindViewById<button>(Resource.Id.MyButton);
//button.Click += delegate { button.Text = string.Format("{0} clicks!", count++);};
}
}
</button>
(3)文字列表示
入門で、よく最初に紹介されているdraw()を使用したビューへの文字列描画は、Xamarinでは次のようになります。
MyView.cs
class MyView:View {
public MyView(Context context) : base(context) {
}
public override void Draw(Canvas canvas) {
base.Draw(canvas);
var paint = new Paint {
Color = Color.White,
TextSize = 40,
AntiAlias = true
};
canvas.DrawText("Developers.IO", 100, 60, paint);
}
}
もし、タイトルを非表示にしたい場合は、アクティビティ側でSetContentView()の前にRequestWindowFeature(WindowFeatures.NoTitle)を追加してください。
MainActivity.cs
[Activity(Label = "BlankApp", MainLauncher = true, Icon = "@drawable/icon")]
public class MainActivity : Activity {
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
//タイトルを非表示にする
RequestWindowFeature(WindowFeatures.NoTitle);
SetContentView(new MyView(this));
}
}
まとめ
今回は、XamarinのAndroid用テンプレートから、Blank Appを使用した最もシンプルなアプリを作成することで、その構造を概観しました。 こちらも、Xamarin.iOSと同様、Android開発者から見れば、「C#である」ということ以外は、ほとんど違和感がなかったのでは無いでしょうか。
サンプルコード(http://github.com/furuya02/Xamarin.Android.Samples)
参考リンク
Xamarin Developers (Android Getting Started Hello, Android)
初めての Xamarin.Android アプリケーション開発 - 入門ガイド