UrhoSharp.FormsでHelloWorld

UrhoSharp Xamarin.Forms Xamarin

こんにちは、world_wide_anitoです。

今回は、Xamarin.Forms上でUrhoSharpアプリケーションを動かすまでのサンプルプログラムを作ってみました。
github.com

なお、このサンプルプログラムは以下のブログを参考に作成しております。
Introduction to UrhoSharp in Xamarin Forms - Xamarin Helpxamarinhelp.com

開発環境
  • Visual Studio 2017 v15.7.1
  • Xamarin.Forms v3.0.0.446417
  • UrhoSharp.Forms v1.8.93
プロジェクトの作成

まずは、Xamarin.Formsのプロジェクトを作成して、NuGetからUrhoSharp.Formsをインストールします。

Xamlの編集

MainPage.xamlを以下の通り編集します。
PreserveViewは、Xamarin.Formsと共存を確認するための領域で灰色に表示されるだけで特に使用しません。

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:HelloUrho"
             x:Class="HelloUrho.MainPage">

    <StackLayout Spacing="0">
        <ContentView x:Name="UrhoView" VerticalOptions="FillAndExpand" BackgroundColor="Aqua"/>
        <ContentView x:Name="PreserveView" HeightRequest="50" BackgroundColor="Gray"/>
    </StackLayout>

</ContentPage>
UrhoSurfaceの設定

UrhoSurfaceクラスのインスタンスを生成して、Xamlで定義したUrhoViewの子要素として追加します。

    public partial class MainPage : ContentPage
    {
        private UrhoSurface urhoSurface;

        public MainPage()
        {
            InitializeComponent();

            urhoSurface = new UrhoSurface();

            // UrhoViewはMainPage.xamlで定義済
            this.FindByName<ContentView>("UrhoView").Content = urhoSurface;
        }
    }
UrhoSharpアプリケーションの作成

Urho.Applicationを継承するクラスを定義します。Xamarin.Forms.Applicationと混同しないように、名前空間は省略せずに記載しましょう。
テキストを表示するには、Textクラスを使用します。Textクラスでは、フォントを指定が必須なので忘れず設定しましょう。
CoreAssets.Fonts.AnonymousProというのは、コンポーネントに組み込まれているフォントで、"Fonts/Anonymous Pro.ttf"と指定することもできます。

    class HelloUrhoApp : Urho.Application
    {
        public HelloUrhoApp(ApplicationOptions options) : base(options)
        {
        }

        protected override void Start()
        {
            base.Start();　// 必須

            var helloText = new Text()
            {
                Value = "Hello Urho",
                HorizontalAlignment = HorizontalAlignment.Center,
                VerticalAlignment = VerticalAlignment.Center,
            };

            // フォントの指定は必須
            helloText.SetFont(CoreAssets.Fonts.AnonymousPro, 80f);

            this.UI.Root.AddChild(helloText);
        }
    }
UrhoSharpアプリケーションの起動

MainPageにOnAppearingメソッドを追加して、起動するアプリケーションクラスを指定します。

    public partial class MainPage : ContentPage
    {
        private UrhoSurface urhoSurface;

        protected override async void OnAppearing()
        {
            base.OnAppearing();
            await urhoSurface.Show<HelloUrhoApp>(new ApplicationOptions(assetsFolder: null));
        }
    }
実行結果

画面いっぱいにでかでかと、Hello Urhoと表示されました。
f:id:world_wide_anito:20180514023732p:plain:h320 f:id:world_wide_anito:20180514023747p:plain:h320