rksoftware

Visual Studio とか C# とかが好きです

Uno Platform でページを追加する (mac)

Uno Platform は Windows の Visual Studio でなら簡単にページを追加できます。
しかし、残念ながら mac では GUI でポチポチしてページを追加することはできそうにありません。

■ ポチポチできないなら

Uno Platform でアプリを作る際のソースコードはテキストなので、普通にファイルを作って編集してで追加できます。
この方法なら mac でも問題なく追加できました。
作業はプロジェクトの新規作成をしたばかりの状態から始める想定で書いています。

  1. プロジェクトのディレクトリを Finder で開く (<アプリ名>.Shared ディレクトリ)
  2. ファイル MainPage.xamlMainPage.xaml.cs をコピーして複製する
  3. 複製したファイル名を AnotherPage.xamlAnotherPage.xaml.cs などとリネームする。
  4. AnotherPage.xaml を書き換える (詳細は後述)
  5. AnotherPage.xaml.cs を書き換える (詳細は後述)
  6. <アプリ名>.Shared.projitems を書き換える (詳細は後述)

簡単ですね。

■ AnotherPage.xaml を書き換える

AnotherPage.xaml のクラス名を書き換えます。ファイルを Visual Studio Code などで開いて先頭の

<Page
    x:Class="<プロジェクト名>.MainPage"

<Page
    x:Class="<プロジェクト名>.AnotherPage"

全容は次のようになります。

<Page
    x:Class="<プロジェクト名>.AnotherPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="using:<プロジェクト名>"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <TextBlock
            Margin="20"
            FontSize="30"
            Text="Hello, world!" />
    </Grid>
</Page>

■ AnotherPage.xaml.cs を書き換える

AnotherPage.xaml.cs のクラス名とコンストラクタ名を書き換えます。ファイルを Visual Studio Code などで開いて終わりあたりの

    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }
    }

    public sealed partial class AnotherPage : Page
    {
        public AnotherPage()
        {
            this.InitializeComponent();
        }
    }

全容は次のようになります。

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409

namespace <プロジェクト名>
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class AnotherPage : Page
    {
        public AnotherPage()
        {
            this.InitializeComponent();
        }
    }
}

■ <アプリ名>.Shared.projitems を書き換える

<アプリ名>.Shared.projitemsAnotherPage.xamlAnotherPage.xaml.cs を追加します。MainPage の真似をして増やすだけの簡単な作業です。手を入れる箇所は 2 箇所です。Visual Studio Code などで開いて

ひとつめ

    <Compile Include="$(MSBuildThisFileDirectory)MainPage.xaml.cs">
      <DependentUpon>MainPage.xaml</DependentUpon>
    </Compile>

の下に AnotherPage を追加します。

    <Compile Include="$(MSBuildThisFileDirectory)MainPage.xaml.cs">
      <DependentUpon>MainPage.xaml</DependentUpon>
    </Compile>
    <Compile Include="$(MSBuildThisFileDirectory)AnotherPage.xaml.cs">
      <DependentUpon>AnotherPage.xaml</DependentUpon>
    </Compile>

ふたつめ

    <Page Include="$(MSBuildThisFileDirectory)MainPage.xaml">
      <SubType>Designer</SubType>
      <Generator>MSBuild:Compile</Generator>
    </Page>

の下に AnotherPage を追加します。

    <Page Include="$(MSBuildThisFileDirectory)MainPage.xaml">
      <SubType>Designer</SubType>
      <Generator>MSBuild:Compile</Generator>
    </Page>
    <Page Include="$(MSBuildThisFileDirectory)AnotherPage.xaml">
      <SubType>Designer</SubType>
      <Generator>MSBuild:Compile</Generator>
    </Page>

全容はプロジェクトで変わる箇所があり、とても重要なファイルなので省略します。あやまってコピペしてしまう結構面倒なことになり良くないので。

■ 簡単ですね

これでページが追加できました。簡単ですね。