Posted at

Xamarin.Android で Font Awesome のアイコンを利用する

More than 1 year has passed since last update.

Xamarin でもFont Awesome などのアイコンが利用できるとのことなので、Xamarin.Android で検証した手順を以下に示します。



0. プロジェクトの作成

今回は、Visual Studio の [Andorid Blank AppCompat] のテンプレートを利用してプロジェクトを作成しました。


1. Nuget パッケージを取得します

Xam.Plugin.Iconize は必須パッケージなので必ずインストールしましょう。その他のパッケージは、必要に応じてインストールしましょう。


  • Xam.Plugin.Iconize

  • Xam.Plugin.Iconize.FontAwesome


2. 初期化処理を実装する

Icon を利用するには、Activity か Application の OnCreate メソッド内で、Plugin の初期化を実行しなければなりません。今回は、MainActivity の OnCreate 内に初期化処理を実装しました。


MainActivity.cs

public override void OnCreate()

{
base.OnCreate();

// プラグインの初期化処理
Plugin.Iconize.Iconize.With(new Plugin.Iconize.Fonts.FontAwesomeModule());
}



3. アイコンボタンを画面に配置

画面にアイコンボタンを記述します。


main.axml

<Plugin.Iconize.Droid.Controls.IconButton

android:id="@+id/SampleButton"
android:textSize="25sp"
android:textColor="@color/primaryText"
android:minWidth="35dp"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />


4. ボタンのテキストにアイコンのフォントを指定する

IconButtonText Property への値の代入方法がポイントです。{アイコン名} の形式で代入してください。

IconButton iconButton = FindViewById<IconButton>(Resource.Id.SampleButton);

iconButton.Text = "{fa-calendar}";

本家のサイトを参考にして、お好みのアイコンを指定してください。


今回は、Android での検証を行いましたが、Iconize Plugin for Xamarin は Xamarin.Forms, Xamarin.iOS にも対応しています。機会があれば検証してみたいと思います。