Xamarin Native プロジェクトで Xamarin.FormsXamarin.Forms in Xamarin Native Projects

サンプルのダウンロードサンプルのダウンロードDownload Sample Download the sample

通常、Xamarin.Forms アプリケーションから派生した 1 つまたは複数のページが含まれます。 ContentPage 、これらのページは、.NET Standard ライブラリ プロジェクトまたは共有プロジェクトのすべてのプラットフォームによって共有されます。Typically, a Xamarin.Forms application includes one or more pages that derive from ContentPage, and these pages are shared by all platforms in a .NET Standard library project or Shared Project. ただし、ネイティブのフォームでは、 ContentPage-Xamarin.iOS、Xamarin.Android、および UWP のネイティブ アプリケーションに直接追加するページを派生します。However, Native Forms allows ContentPage-derived pages to be added directly to native Xamarin.iOS, Xamarin.Android, and UWP applications. 使用するネイティブ プロジェクトを持つと比較してContentPage-派生ページから、.NET Standard ライブラリ プロジェクトまたは共有プロジェクト、ネイティブ プロジェクトに直接ページの追加の利点は、ネイティブ ビューでページを拡張することができます。Compared to having the native project consume ContentPage-derived pages from a .NET Standard library project or Shared Project, the advantage of adding pages directly to native projects is that the pages can be extended with native views. XAML でのネイティブ ビューを付けることができますし、x:Name分離コードから参照されているとします。Native views can then be named in XAML with x:Name and referenced from the code-behind. ネイティブ ビューの詳細については、次を参照してください。ネイティブ ビューします。For more information about native views, see Native Views.

Xamarin.Forms を使用するためのプロセス ContentPage -ネイティブ プロジェクト内の派生のページを次に示します。The process for consuming a Xamarin.Forms ContentPage-derived page in a native project is as follows:

  1. ネイティブ プロジェクトに Xamarin.Forms NuGet パッケージを追加します。Add the Xamarin.Forms NuGet package to the native project.
  2. 追加、 ContentPage -ページ、およびネイティブ プロジェクトへのすべての依存関係を派生します。Add the ContentPage-derived page, and any dependencies, to the native project.
  3. Forms.Init メソッドを呼び出します。Call the Forms.Init method.
  4. インスタンスを構築、 ContentPage -ページを派生し、次の拡張メソッドのいずれかを使用して、適切なネイティブ型に変換: CreateViewController ios、 CreateSupportFragment for Android、またはCreateFrameworkElementのUWP です。Construct an instance of the ContentPage-derived page and convert it to the appropriate native type using one of the following extension methods: CreateViewController for iOS, CreateSupportFragment for Android, or CreateFrameworkElement for UWP.
  5. ネイティブな型表現に移動し、 ContentPage -ネイティブ ナビゲーション API を使用してページを派生します。Navigate to the native type representation of the ContentPage-derived page using the native navigation API.

Xamarin.Forms を呼び出すことによって初期化する必要があります、Forms.Initメソッドのネイティブ プロジェクトを作成する前に、 ContentPage -ページを派生します。Xamarin.Forms must be initialized by calling the Forms.Init method before a native project can construct a ContentPage-derived page. アプリケーション フローの最も便利なタイミングによって決まります主にこれを実行するタイミングを選択する – アプリケーションの起動時または直前に実行できます、 ContentPage-派生ページを構築します。Choosing when to do this primarily depends on when it's most convenient in your application flow – it could be performed at application startup, or just before the ContentPage-derived page is constructed. この記事と付属のサンプル アプリケーションで、Forms.Initメソッドは、アプリケーションの起動時に呼び出されます。In this article, and the accompanying sample applications, the Forms.Init method is called at application startup.

注意

NativeFormsサンプル アプリケーション ソリューションには、Xamarin.Forms プロジェクトが含まれていません。The NativeForms sample application solution does not contain any Xamarin.Forms projects. 代わりに、Xamarin.iOS プロジェクトを Xamarin.Android プロジェクトの場合、および UWP プロジェクトで構成されます。Instead, it consists of a Xamarin.iOS project, a Xamarin.Android project, and a UWP project. 各プロジェクトは、使用するネイティブのフォームを使用するネイティブ プロジェクト ContentPage -ページを派生します。Each project is a native project that uses Native Forms to consume ContentPage-derived pages. ただし、ネイティブのプロジェクトで利用できませんでした理由理由はありませんContentPage-.NET Standard ライブラリ プロジェクトまたは共有プロジェクトからページを派生します。However, there's no reason why the native projects couldn't consume ContentPage-derived pages from a .NET Standard library project or Shared Project.

ネイティブ数字形式を使用して、Xamarin.Forms などの機能 DependencyService MessagingCenter 、およびデータ バインディング エンジンで、すべて引き続き使用します。When using Native Forms, Xamarin.Forms features such as DependencyService, MessagingCenter, and the data binding engine, all still work. ただし、ページ ナビゲーションは、ネイティブ ナビゲーション API を使用して実行する必要があります。However, page navigation must be performed using the native navigation API.

iOSiOS

Ios では、FinishedLaunchingで上書き、AppDelegateクラスは、アプリケーションを実行する場所では通常、スタートアップ タスクに関連します。On iOS, the FinishedLaunching override in the AppDelegate class is typically the place to perform application startup related tasks. アプリケーションがついに発売されましたが、通常、メイン ウィンドウを構成し、コント ローラーを表示するオーバーライド後に呼び出されます。It's called after the application has launched, and is usually overridden to configure the main window and view controller. 次のコード例は、AppDelegateサンプル アプリケーション内のクラス。The following code example shows the AppDelegate class in the sample application:

[Register("AppDelegate")]
public class AppDelegate : UIApplicationDelegate
{
    public static AppDelegate Instance;
    UIWindow _window;
    AppNavigationController _navigation;

    public static string FolderPath { get; private set; }

    public override bool FinishedLaunching(UIApplication application, NSDictionary launchOptions)
    {
        Forms.Init();

        Instance = this;
        _window = new UIWindow(UIScreen.MainScreen.Bounds);

        UINavigationBar.Appearance.SetTitleTextAttributes(new UITextAttributes
        {
            TextColor = UIColor.Black
        });

        FolderPath = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData));
        UIViewController mainPage = new NotesPage().CreateViewController();
        mainPage.Title = "Notes";

        _navigation = new AppNavigationController(mainPage);
        _window.RootViewController = _navigation;
        _window.MakeKeyAndVisible();

        return true;
    }
    // ...
}

FinishedLaunchingメソッドは、次のタスクを実行します。The FinishedLaunching method performs the following tasks:

  • Xamarin.Forms は呼び出すことによって初期化、Forms.Initメソッド。Xamarin.Forms is initialized by calling the Forms.Init method.
  • 参照、AppDelegateでクラスが格納されている、 static Instanceフィールド。A reference to the AppDelegate class is stored in the static Instance field. これは他のクラスで定義されているメソッドを呼び出すためのメカニズムを提供する、AppDelegateクラス。This is to provide a mechanism for other classes to call methods defined in the AppDelegate class.
  • UIWindow、これは、ネイティブの iOS アプリケーションでのビューのメイン コンテナーを作成します。The UIWindow, which is the main container for views in native iOS applications, is created.
  • FolderPath プロパティは、ノートデータが格納されるデバイス上のパスに初期化されます。The FolderPath property is initialized to a path on the device where note data will be stored.
  • NotesPageクラスは、これは、Xamarin.Forms ContentPage -派生ページの XAML で定義されている、作成され、変換、UIViewControllerを使用して、CreateViewController拡張メソッド。The NotesPage class, which is a Xamarin.Forms ContentPage-derived page defined in XAML, is constructed and converted to a UIViewController using the CreateViewController extension method.
  • Titleのプロパティ、UIViewControllerに表示される設定、UINavigationBarします。The Title property of the UIViewController is set, which will be displayed on the UINavigationBar.
  • AAppNavigationController階層型ナビゲーションを管理するために作成されます。A AppNavigationController is created for managing hierarchical navigation. これは、UINavigationControllerから派生するカスタムナビゲーションコントローラークラスです。This is a custom navigation controller class, which derives from UINavigationController. AppNavigationController オブジェクトはビューコントローラーのスタックを管理し、コンストラクターに渡された UIViewControllerAppNavigationController が読み込まれるときに最初に表示されます。The AppNavigationController object manages a stack of view controllers, and the UIViewController passed into the constructor will be presented initially when the AppNavigationController is loaded.
  • AppNavigationController オブジェクトは UIWindowの最上位の UIViewController として設定され、UIWindow はアプリケーションのキーウィンドウとして設定され、表示されるようになります。The AppNavigationController object is set as the top-level UIViewController for the UIWindow, and the UIWindow is set as the key window for the application and is made visible.

1 回、FinishedLaunchingメソッドの実行が、UI は、Xamarin.Forms で定義されているNotesPage次のスクリーン ショットに示すようにクラスが表示されます。Once the FinishedLaunching method has executed, the UI defined in the Xamarin.Forms NotesPage class will be displayed, as shown in the following screenshot:

XAML で定義された UI を使用する Xamarin iOS アプリケーションのスクリーンショットScreenshot of a Xamarin.iOS application that uses a UI defined in XAML

たとえば、 + Buttonをタップして UI と対話すると、NotesPage コードビハインドで次のイベントハンドラーが実行されます。Interacting with the UI, for example by tapping on the + Button, will result in the following event handler in the NotesPage code-behind executing:

void OnNoteAddedClicked(object sender, EventArgs e)
{
    AppDelegate.Instance.NavigateToNoteEntryPage(new Note());
}

static AppDelegate.Instanceフィールドを使用できます、AppDelegate.NavigateToNoteEntryPageの次のコード例に示すメソッドが呼び出されます。The static AppDelegate.Instance field allows the AppDelegate.NavigateToNoteEntryPage method to be invoked, which is shown in the following code example:

public void NavigateToNoteEntryPage(Note note)
{
    var noteEntryPage = new NoteEntryPage
    {
        BindingContext = note
    }.CreateViewController();
    noteEntryPage.Title = "Note Entry";
    _navigation.PushViewController(noteEntryPage, true);
}

NavigateToNoteEntryPageメソッドは、Xamarin.Forms を変換 ContentPage -派生にページ、UIViewControllerで、CreateViewController拡張メソッド、およびセット、Titleのプロパティ、UIViewControllerです。The NavigateToNoteEntryPage method converts the Xamarin.Forms ContentPage-derived page to a UIViewController with the CreateViewController extension method, and sets the Title property of the UIViewController. UIViewControllerしプッシュAppNavigationControllerによって、PushViewControllerメソッド。The UIViewController is then pushed onto AppNavigationController by the PushViewController method. そのため、UI を Xamarin.Forms で定義されているNoteEntryPage次のスクリーン ショットに示すようにクラスが表示されます。Therefore, the UI defined in the Xamarin.Forms NoteEntryPage class will be displayed, as shown in the following screenshot:

XAML で定義された UI を使用する Xamarin iOS アプリケーションのスクリーンショットScreenshot of a Xamarin.iOS application that uses a UI defined in XAML

NoteEntryPage が表示されると、戻るナビゲーションによって AppNavigationControllerから NoteEntryPage クラスの UIViewController がポップされ、UIViewController クラスの NotesPage にユーザーが返されます。When the NoteEntryPage is displayed, back navigation will pop the UIViewController for the NoteEntryPage class from the AppNavigationController, returning the user to the UIViewController for the NotesPage class. ただし、iOS ネイティブナビゲーションスタックから UIViewController をポップしても、UIViewController およびアタッチされた Page オブジェクトは自動的に破棄されません。However, popping a UIViewController from the iOS native navigation stack does not automatically dispose of the UIViewController and attached Page object. したがって、AppNavigationController クラスは PopViewController メソッドをオーバーライドして、後方ナビゲーション時にビューコントローラーを破棄します。Therefore, the AppNavigationController class overrides the PopViewController method, to dispose of view controllers on backwards navigation:

public class AppNavigationController : UINavigationController
{
    //...
    public override UIViewController PopViewController(bool animated)
    {
        UIViewController topView = TopViewController;
        if (topView != null)
        {
            // Dispose of ViewController on back navigation.
            topView.Dispose();
        }
        return base.PopViewController(animated);
    }
}

PopViewController オーバーライドは、iOS ネイティブナビゲーションスタックからポップされた UIViewController オブジェクトの Dispose メソッドを呼び出します。The PopViewController override calls the Dispose method on the UIViewController object that's been popped from the iOS native navigation stack. この操作を行わないと、UIViewController とアタッチされた Page オブジェクトが孤立します。Failure to do this will result in the UIViewController and attached Page object being orphaned.

重要

孤立したオブジェクトはガベージコレクションできないため、メモリリークが発生します。Orphaned objects can't be garbage collected, and so result in a memory leak.

AndroidAndroid

Android では、OnCreateで上書き、MainActivityクラスは、アプリケーションを実行する場所では通常、スタートアップ タスクに関連します。On Android, the OnCreate override in the MainActivity class is typically the place to perform application startup related tasks. 次のコード例は、MainActivityサンプル アプリケーション内のクラス。The following code example shows the MainActivity class in the sample application:

public class MainActivity : AppCompatActivity
{
    public static string FolderPath { get; private set; }

    public static MainActivity Instance;

    protected override void OnCreate(Bundle bundle)
    {
        base.OnCreate(bundle);

        Forms.Init(this, bundle);
        Instance = this;

        SetContentView(Resource.Layout.Main);
        var toolbar = FindViewById<Toolbar>(Resource.Id.toolbar);
        SetSupportActionBar(toolbar);
        SupportActionBar.Title = "Notes";

        FolderPath = Path.Combine(System.Environment.GetFolderPath(System.Environment.SpecialFolder.LocalApplicationData));
        Android.Support.V4.App.Fragment mainPage = new NotesPage().CreateSupportFragment(this);
        SupportFragmentManager
            .BeginTransaction()
            .Replace(Resource.Id.fragment_frame_layout, mainPage)
            .Commit();
        ...
    }
    ...
}

OnCreateメソッドは、次のタスクを実行します。The OnCreate method performs the following tasks:

  • Xamarin.Forms は呼び出すことによって初期化、Forms.Initメソッド。Xamarin.Forms is initialized by calling the Forms.Init method.
  • 参照、MainActivityでクラスが格納されている、 static Instanceフィールド。A reference to the MainActivity class is stored in the static Instance field. これは他のクラスで定義されているメソッドを呼び出すためのメカニズムを提供する、MainActivityクラス。This is to provide a mechanism for other classes to call methods defined in the MainActivity class.
  • Activityレイアウト リソースからコンテンツを設定します。The Activity content is set from a layout resource. レイアウトは、サンプル アプリケーションで、LinearLayoutを格納している、 Toolbar、およびFrameLayoutフラグメントのコンテナーとして機能します。In the sample application, the layout consists of a LinearLayout that contains a Toolbar, and a FrameLayout to act as a fragment container.
  • Toolbarが取得され、設定の操作バーとして、 Activity、操作バーのタイトルを設定します。The Toolbar is retrieved and set as the action bar for the Activity, and the action bar title is set.
  • FolderPath プロパティは、ノートデータが格納されるデバイス上のパスに初期化されます。The FolderPath property is initialized to a path on the device where note data will be stored.
  • NotesPageクラスは、これは、Xamarin.Forms ContentPage -派生ページの XAML で定義されている、作成され、変換、Fragmentを使用して、CreateSupportFragment拡張メソッド。The NotesPage class, which is a Xamarin.Forms ContentPage-derived page defined in XAML, is constructed and converted to a Fragment using the CreateSupportFragment extension method.
  • SupportFragmentManagerクラスを作成し、置換するトランザクションのコミット、FrameLayoutインスタンス、FragmentNotesPageクラス。The SupportFragmentManager class creates and commits a transaction that replaces the FrameLayout instance with the Fragment for the NotesPage class.

フラグメントの詳細については、次を参照してください。フラグメントします。For more information about Fragments, see Fragments.

1 回、OnCreateメソッドの実行が、UI は、Xamarin.Forms で定義されているNotesPage次のスクリーン ショットに示すようにクラスが表示されます。Once the OnCreate method has executed, the UI defined in the Xamarin.Forms NotesPage class will be displayed, as shown in the following screenshot:

XAML で定義された UI を使用する Xamarin Android アプリケーションのスクリーンショットScreenshot of a Xamarin.Android application that uses a UI defined in XAML

たとえば、 + Buttonをタップして UI と対話すると、NotesPage コードビハインドで次のイベントハンドラーが実行されます。Interacting with the UI, for example by tapping on the + Button, will result in the following event handler in the NotesPage code-behind executing:

void OnNoteAddedClicked(object sender, EventArgs e)
{
    MainActivity.Instance.NavigateToNoteEntryPage(new Note());
}

static MainActivity.Instanceフィールドを使用できます、MainActivity.NavigateToNoteEntryPageの次のコード例に示すメソッドが呼び出されます。The static MainActivity.Instance field allows the MainActivity.NavigateToNoteEntryPage method to be invoked, which is shown in the following code example:

public void NavigateToNoteEntryPage(Note note)
{
    Android.Support.V4.App.Fragment noteEntryPage = new NoteEntryPage
    {
        BindingContext = note
    }.CreateSupportFragment(this);
    SupportFragmentManager
        .BeginTransaction()
        .AddToBackStack(null)
        .Replace(Resource.Id.fragment_frame_layout, noteEntryPage)
        .Commit();
}

NavigateToNoteEntryPageメソッドは、Xamarin.Forms を変換します。 ContentPage -派生にページ、Fragmentで、CreateSupportFragment拡張メソッドを追加し、Fragmentフラグメント バック スタック。The NavigateToNoteEntryPage method converts the Xamarin.Forms ContentPage-derived page to a Fragment with the CreateSupportFragment extension method, and adds the Fragment to the fragment back stack. そのため、UI を Xamarin.Forms で定義されているNoteEntryPage次のスクリーン ショットに示すように表示されます。Therefore, the UI defined in the Xamarin.Forms NoteEntryPage will be displayed, as shown in the following screenshot:

XAML で定義された UI を使用する Xamarin Android アプリケーションのスクリーンショットScreenshot of a Xamarin.Android application that uses a UI defined in XAML

ときに、NoteEntryPage背面をタップして、表示される矢印が表示されます、FragmentNoteEntryPageフラグメントのバック スタックからユーザーを返す、FragmentNotesPageクラス。When the NoteEntryPage is displayed, tapping the back arrow will pop the Fragment for the NoteEntryPage from the fragment back stack, returning the user to the Fragment for the NotesPage class.

バックナビゲーションサポートを有効にするEnable back navigation support

SupportFragmentManagerクラスには、BackStackChangedフラグメント戻るスタックのコンテンツが変更されるたびに発生するイベントです。The SupportFragmentManager class has a BackStackChanged event that fires whenever the content of the fragment back stack changes. OnCreateメソッドで、MainActivityクラスには、このイベントの匿名のイベント ハンドラーが含まれています。The OnCreate method in the MainActivity class contains an anonymous event handler for this event:

SupportFragmentManager.BackStackChanged += (sender, e) =>
{
    bool hasBack = SupportFragmentManager.BackStackEntryCount > 0;
    SupportActionBar.SetHomeButtonEnabled(hasBack);
    SupportActionBar.SetDisplayHomeAsUpEnabled(hasBack);
    SupportActionBar.Title = hasBack ? "Note Entry" : "Notes";
};

このイベント ハンドラーは、1 つまたは複数があること、操作バーで [戻る] ボタンを表示Fragmentフラグメント上のインスタンスがスタックをバックアップします。This event handler displays a back button on the action bar provided that there's one or more Fragment instances on the fragment back stack. [戻る] ボタンをタップする応答の処理、OnOptionsItemSelectedをオーバーライドします。The response to tapping the back button is handled by the OnOptionsItemSelected override:

public override bool OnOptionsItemSelected(Android.Views.IMenuItem item)
{
    if (item.ItemId == global::Android.Resource.Id.Home && SupportFragmentManager.BackStackEntryCount > 0)
    {
        SupportFragmentManager.PopBackStack();
        return true;
    }
    return base.OnOptionsItemSelected(item);
}

OnOptionsItemSelectedオプション メニュー内の項目が選択されるたびに、オーバーライドが呼び出されます。The OnOptionsItemSelected override is called whenever an item in the options menu is selected. この実装は、[戻る] ボタンが選択されており、1 つまたは複数があることに、フラグメントのバック スタックから現在のフラグメントをポップFragmentフラグメント上のインスタンスがスタックをバックアップします。This implementation pops the current fragment from the fragment back stack, provided that the back button has been selected and there are one or more Fragment instances on the fragment back stack.

複数のアクティビティMultiple activities

アプリケーションが複数のアクティビティで構成される場合 ContentPage -派生ページは、各アクティビティに埋め込まれることができます。When an application is composed of multiple activities, ContentPage-derived pages can be embedded into each of the activities. このシナリオで、Forms.Initメソッドでのみ呼び出す必要があります、OnCreate最初のオーバーライドActivity、Xamarin.Forms を埋め込みますをContentPageします。In this scenario, the Forms.Init method need be called only in the OnCreate override of the first Activity that embeds a Xamarin.Forms ContentPage. ただし、これに、次の影響です。However, this has the following impact:

  • Xamarin.Forms.Color.Accentから取得されます、Activityという、Forms.Initメソッド。The value of Xamarin.Forms.Color.Accent will be taken from the Activity that called the Forms.Init method.
  • Xamarin.Forms.Application.Currentに関連付けられた、Activityという、Forms.Initメソッド。The value of Xamarin.Forms.Application.Current will be associated with the Activity that called the Forms.Init method.

ファイルの選択Choose a file

埋め込み時、 ContentPage -派生を使用するページ、 WebView する必要がある HTML"Choose File"をサポートするボタン、Activityをオーバーライドする必要があります、 OnActivityResult方法:When embedding a ContentPage-derived page that uses a WebView that needs to support an HTML "Choose File" button, the Activity will need to override the OnActivityResult method:

protected override void OnActivityResult(int requestCode, Result resultCode, Intent data)
{
    base.OnActivityResult(requestCode, resultCode, data);
    ActivityResultCallbackRegistry.InvokeCallback(requestCode, resultCode, data);
}

UWPUWP

UWP、ネイティブのAppクラスは、アプリケーションを実行する場所では通常、スタートアップ タスクに関連します。On UWP, the native App class is typically the place to perform application startup related tasks. Xamarin.Forms は、通常は、Xamarin.Forms UWP アプリケーションで初期化、OnLaunchedネイティブ オーバーライドAppを渡すためのクラス、LaunchActivatedEventArgsへの引数、Forms.Initメソッド。Xamarin.Forms is usually initialized, in Xamarin.Forms UWP applications, in the OnLaunched override in the native App class, to pass the LaunchActivatedEventArgs argument to the Forms.Init method. この理由は、Xamarin.Forms を使用するネイティブの UWP アプリケーション ContentPage -派生ページが最も簡単に呼び出すことができます、Forms.Initからメソッド、App.OnLaunchedメソッド。For this reason, native UWP applications that consume a Xamarin.Forms ContentPage-derived page can most easily call the Forms.Init method from the App.OnLaunched method.

既定では、ネイティブAppクラスの起動、MainPageアプリケーションの最初のページとしてクラス。By default, the native App class launches the MainPage class as the first page of the application. 次のコード例は、MainPageサンプル アプリケーション内のクラス。The following code example shows the MainPage class in the sample application:

public sealed partial class MainPage : Page
{
    NotesPage notesPage;
    NoteEntryPage noteEntryPage;
    
    public static MainPage Instance;
    public static string FolderPath { get; private set; }

    public MainPage()
    {
        this.InitializeComponent();
        this.NavigationCacheMode = NavigationCacheMode.Enabled;
        Instance = this;
        FolderPath = Path.Combine(System.Environment.GetFolderPath(System.Environment.SpecialFolder.LocalApplicationData));
        notesPage = new Notes.UWP.Views.NotesPage();
        this.Content = notesPage.CreateFrameworkElement();
        // ...        
    } 
    // ...
}

MainPageコンス トラクターは、次のタスクを実行します。The MainPage constructor performs the following tasks:

  • ページのキャッシュが有効になっているように、新しいMainPageのページに戻るユーザーが移動したときに構成されていません。Caching is enabled for the page, so that a new MainPage isn't constructed when a user navigates back to the page.
  • 参照、MainPageでクラスが格納されている、 static Instanceフィールド。A reference to the MainPage class is stored in the static Instance field. これは他のクラスで定義されているメソッドを呼び出すためのメカニズムを提供する、MainPageクラス。This is to provide a mechanism for other classes to call methods defined in the MainPage class.
  • FolderPath プロパティは、ノートデータが格納されるデバイス上のパスに初期化されます。The FolderPath property is initialized to a path on the device where note data will be stored.
  • NotesPageクラスは、これは、Xamarin.Forms ContentPage -派生ページの XAML で定義されているが構築されに変換、FrameworkElementを使用して、CreateFrameworkElement拡張メソッドとのコンテンツとして設定しますMainPageクラスです。The NotesPage class, which is a Xamarin.Forms ContentPage-derived page defined in XAML, is constructed and converted to a FrameworkElement using the CreateFrameworkElement extension method, and then set as the content of the MainPage class.

1 回、MainPageコンス トラクターが実行される、Xamarin.Forms で定義されている UINotesPage次のスクリーン ショットに示すようにクラスが表示されます。Once the MainPage constructor has executed, the UI defined in the Xamarin.Forms NotesPage class will be displayed, as shown in the following screenshot:

Xamarin の XAML で定義された UI を使用する UWP アプリケーションのスクリーンショットScreenshot of a UWP application that uses a UI defined with Xamarin.Forms XAML

たとえば、 + Buttonをタップして UI と対話すると、NotesPage コードビハインドで次のイベントハンドラーが実行されます。Interacting with the UI, for example by tapping on the + Button, will result in the following event handler in the NotesPage code-behind executing:

void OnNoteAddedClicked(object sender, EventArgs e)
{
    MainPage.Instance.NavigateToNoteEntryPage(new Note());
}

static MainPage.Instanceフィールドを使用できます、MainPage.NavigateToNoteEntryPageの次のコード例に示すメソッドが呼び出されます。The static MainPage.Instance field allows the MainPage.NavigateToNoteEntryPage method to be invoked, which is shown in the following code example:

public void NavigateToNoteEntryPage(Note note)
{
    noteEntryPage = new Notes.UWP.Views.NoteEntryPage
    {
        BindingContext = note
    };
    this.Frame.Navigate(noteEntryPage);
}

UWP でのナビゲーションは、通常の実行、Frame.Navigateを受け取るメソッドをPage引数。Navigation in UWP is typically performed with the Frame.Navigate method, which takes a Page argument. Xamarin.Forms の定義、Frame.Navigate拡張メソッドを受け取る、 ContentPage -派生ページ インスタンス。Xamarin.Forms defines a Frame.Navigate extension method that takes a ContentPage-derived page instance. したがって、ときに、NavigateToNoteEntryPageメソッドが実行される、Xamarin.Forms で定義されている UINoteEntryPage次のスクリーン ショットに示すように表示されます。Therefore, when the NavigateToNoteEntryPage method executes, the UI defined in the Xamarin.Forms NoteEntryPage will be displayed, as shown in the following screenshot:

Xamarin の XAML で定義された UI を使用する UWP アプリケーションのスクリーンショットScreenshot of a UWP application that uses a UI defined with Xamarin.Forms XAML

ときに、NoteEntryPage背面をタップして、表示される矢印が表示されます、FrameworkElementNoteEntryPageアプリ内のバック スタックからユーザーを返す、FrameworkElementNotesPageクラス。When the NoteEntryPage is displayed, tapping the back arrow will pop the FrameworkElement for the NoteEntryPage from the in-app back stack, returning the user to the FrameworkElement for the NotesPage class.

ページサイズ変更のサポートを有効にするEnable page resizing support

UWP アプリケーションウィンドウのサイズを変更する場合は、Xamarin のコンテンツのサイズも変更する必要があります。When the UWP application window is resized, the Xamarin.Forms content should also be resized. これを実現するには、MainPage コンストラクターに Loaded イベントのイベントハンドラーを登録します。This is accomplished by registering an event handler for the Loaded event, in the MainPage constructor:

public MainPage()
{
    // ...
    this.Loaded += OnMainPageLoaded;
    // ...
}

Loaded イベントは、ページがレイアウトされ、レンダリングされ、操作の準備が整ったときに発生し、OnMainPageLoaded メソッドを応答として実行します。The Loaded event fires when the page is laid out, rendered, and ready for interaction, and executes the OnMainPageLoaded method in response:

void OnMainPageLoaded(object sender, RoutedEventArgs e)
{
    this.Frame.SizeChanged += (o, args) =>
    {
        if (noteEntryPage != null)
            noteEntryPage.Layout(new Xamarin.Forms.Rectangle(0, 0, args.NewSize.Width, args.NewSize.Height));
        else
            notesPage.Layout(new Xamarin.Forms.Rectangle(0, 0, args.NewSize.Width, args.NewSize.Height));
    };
}

OnMainPageLoaded メソッドは、Frame.SizeChanged イベントの匿名イベントハンドラーを登録します。これは、FrameActualHeight または ActualWidth プロパティが変更されたときに発生します。The OnMainPageLoaded method registers an anonymous event handler for the Frame.SizeChanged event, which is raised when either the ActualHeight or the ActualWidth properties change on the Frame. 応答として、アクティブページの Xamarin のコンテンツは Layout メソッドを呼び出すことによってサイズが変更されます。In response, the Xamarin.Forms content for the active page is resized by calling the Layout method.

バックナビゲーションサポートを有効にするEnable back navigation support

UWP では、アプリケーションが別のデバイス フォーム ファクターのすべてのハードウェアとソフトウェア戻るボタン、ナビゲーションを有効にする必要があります。On UWP, applications must enable back navigation for all hardware and software back buttons, across different device form factors. これは、BackRequested イベントのイベントハンドラーを登録することによって実現できます。これは、MainPage コンストラクターで実行できます。This can be accomplished by registering an event handler for the BackRequested event, which can be performed in the MainPage constructor:

public MainPage()
{
    // ...
    SystemNavigationManager.GetForCurrentView().BackRequested += OnBackRequested;
}

アプリケーションを起動すると、GetForCurrentViewメソッドの取得、SystemNavigationManagerオブジェクトは、現在のビューに関連付けられているし、イベント ハンドラーを登録します、BackRequestedイベント。When the application is launched, the GetForCurrentView method retrieves the SystemNavigationManager object associated with the current view, then registers an event handler for the BackRequested event. アプリケーションは、前面のアプリケーションは、応答を呼び出す場合のみこのイベントを受け取る、OnBackRequestedイベント ハンドラー。The application only receives this event if it's the foreground application, and in response, calls the OnBackRequested event handler:

void OnBackRequested(object sender, BackRequestedEventArgs e)
{
    Frame rootFrame = Window.Current.Content as Frame;
    if (rootFrame.CanGoBack)
    {
        e.Handled = true;
        rootFrame.GoBack();
        noteEntryPage = null;
    }
}

OnBackRequestedイベント ハンドラーの呼び出し、GoBackセット、アプリケーションのルート フレームのメソッド、BackRequestedEventArgs.Handledプロパティをtrueイベントを処理済みとしてマークします。The OnBackRequested event handler calls the GoBack method on the root frame of the application and sets the BackRequestedEventArgs.Handled property to true to mark the event as handled. イベントを処理済みとしてマークしないと、イベントは無視されます。Failure to mark the event as handled could result in the event being ignored.

アプリケーションでは、タイトルバーに [戻る] ボタンを表示するかどうかを選択します。The application chooses whether to show a back button on the title bar. これを実現するには、AppViewBackButtonVisibility プロパティを App クラスの AppViewBackButtonVisibility 列挙値のいずれかに設定します。This is achieved by setting the AppViewBackButtonVisibility property to one of the AppViewBackButtonVisibility enumeration values, in the App class:

void OnNavigated(object sender, NavigationEventArgs e)
{
    SystemNavigationManager.GetForCurrentView().AppViewBackButtonVisibility =
        ((Frame)sender).CanGoBack ? AppViewBackButtonVisibility.Visible : AppViewBackButtonVisibility.Collapsed;
}

OnNavigatedへの応答に実行されるイベント ハンドラー、Navigatedイベントの発生は、ページ ナビゲーションが発生した場合に、タイトル バーの [戻る] ボタンの可視性を更新します。The OnNavigated event handler, which is executed in response to the Navigated event firing, updates the visibility of the title bar back button when page navigation occurs. これにより、タイトル バーの [戻る] ボタンが表示されるは、アプリに戻るスタックが空でない場合は、または、アプリに戻るスタックが空の場合は、タイトル バーから削除します。This ensures that the title bar back button is visible if the in-app back stack is not empty, or removed from the title bar if the in-app back stack is empty.

UWP の戻るナビゲーション サポートの詳細については、次を参照してください。ナビゲーション履歴内を後方に向かってと UWP アプリのナビゲーションします。For more information about back navigation support on UWP, see Navigation history and backwards navigation for UWP apps.