Xamarin.Forms en proyectos nativos de Xamarin

Descarga del ejemplo

Normalmente, una aplicación incluye una o varias páginas que derivan de y todas las plataformas comparten estas páginas en un proyecto de biblioteca de .NET Standard o Xamarin.FormsContentPage compartido Project. Sin embargo, Native Forms permite agregar páginas derivadas directamente a aplicaciones nativas de ContentPage Xamarin.iOS, Xamarin.Android y UWP. En comparación con que el proyecto nativo consuma páginas derivadas de un proyecto de biblioteca de .NET Standard o un Project compartido, la ventaja de agregar páginas directamente a proyectos nativos es que las páginas se pueden ampliar con vistas ContentPage nativas. A continuación, las vistas nativas se pueden denominar en XAML con y x:Name se hace referencia a estas desde el código subyacente. Para obtener más información sobre las vistas nativas, vea Vistas nativas.

El proceso para consumir una Xamarin.FormsContentPage página derivada de en un proyecto nativo es el siguiente:

1. Agregue el Xamarin.Forms NuGet al proyecto nativo.
2. Agregue la ContentPage página derivada de y las dependencias al proyecto nativo.
3. Llame al método Forms.Init.
4. Construya una instancia de la página derivada de y conviéndola al tipo nativo adecuado mediante uno de los métodos de extensión siguientes: para ContentPageCreateViewController iOS, para Android o para CreateSupportFragmentCreateFrameworkElement UWP.
5. Vaya a la representación de tipo nativo de la página derivada mediante ContentPage la API de navegación nativa.

Xamarin.Forms debe inicializarse llamando al método Forms.Init para que un proyecto nativo pueda construir una página derivada de ContentPage . La elección de cuándo hacerlo depende principalmente de cuándo sea más conveniente en el flujo de la aplicación: podría realizarse en el inicio de la aplicación o justo antes de que se construyese la página ContentPage derivada. En este artículo, y las aplicaciones de ejemplo que lo acompañan, se llama al Forms.Init método en el inicio de la aplicación.

Cuando se usan formularios Xamarin.Forms nativos, características DependencyService como , y el motor de enlace de MessagingCenter datos, todo sigue funcionando. Sin embargo, la navegación por páginas debe realizarse mediante la API de navegación nativa.

iOS

En iOS, la invalidación de la clase suele ser FinishedLaunching el lugar para realizar tareas relacionadas con el inicio de la AppDelegate aplicación. Se llama después de que se haya iniciado la aplicación y normalmente se invalida para configurar la ventana principal y el controlador de vista. En el ejemplo de código siguiente se muestra AppDelegate la clase en la aplicación de ejemplo:

[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();

        // Create app-level resource dictionary.
        Xamarin.Forms.Application.Current = new Xamarin.Forms.Application();
        Xamarin.Forms.Application.Current.Resources = new MyDictionary();

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

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

        FolderPath = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData));

        NotesPage notesPage = new NotesPage()
        {
            // Set the parent so that the app-level resource dictionary can be located.
            Parent = Xamarin.Forms.Application.Current
        };

        UIViewController notesPageController = notesPage.CreateViewController();
        notesPageController.Title = "Notes";

        _navigation = new AppNavigationController(notesPageController);

        _window.RootViewController = _navigation;
        _window.MakeKeyAndVisible();

        notesPage.Parent = null;
        return true;
    }
    // ...
}

El método FinishedLaunching realiza las siguientes tareas:

• Xamarin.Forms se inicializa mediante una llamada al Forms.Init método .
• Se crea un nuevo objeto is y su diccionario de recursos de nivel de aplicación se establece en un que Xamarin.Forms.ApplicationResourceDictionary se define en XAML.
• Una referencia a la AppDelegate clase se almacena en el campo staticInstance . Esto es para proporcionar un mecanismo para que otras clases llamen a métodos definidos en la AppDelegate clase .
• Se UIWindow crea , que es el contenedor principal para las vistas en aplicaciones iOS nativas.
• La propiedad se inicializa en una ruta de acceso en el dispositivo donde se almacenarán FolderPath los datos de la nota.
• Se crea un objeto , que es una página derivada de definida en XAML, y su elemento primario se establece NotesPage en el objeto creado Xamarin.FormsContentPageXamarin.Forms.Application anteriormente.
• El NotesPage objeto se convierte en mediante el método de extensión UIViewControllerCreateViewController .
• Se Title establece la propiedad de , que se mostrará en UIViewControllerUINavigationBar .
• Se AppNavigationController crea un objeto para administrar la navegación jerárquica. Se trata de una clase de controlador de navegación personalizada, que deriva de UINavigationController . El objeto administra una pila de controladores de vista y el objeto pasado al constructor se presentará AppNavigationControllerUIViewController inicialmente cuando AppNavigationController se cargue .
• El objeto se establece como el nivel superior de , y se establece como la ventana de clave de la aplicación AppNavigationControllerUIViewController y se hace UIWindowUIWindow visible.
• La Parent propiedad del objeto se establece en , para evitar una pérdida de NotesPagenull memoria.

Una vez ejecutado el método, se mostrará la interfaz de usuario definida en la clase FinishedLaunching , como se muestra en la captura de pantalla Xamarin.FormsNotesPage siguiente:

Screenshot (Captura de pantalla de la aplicación Xamarin.iOS con una interfaz de usuario

La interacción con la interfaz de usuario, por ejemplo, pulsando en , dará lugar a que se ejecute el siguiente controlador de eventos en el +ButtonNotesPage código subyacente:

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

El staticAppDelegate.Instance campo permite invocar el método , que AppDelegate.NavigateToNoteEntryPage se muestra en el ejemplo de código siguiente:

public void NavigateToNoteEntryPage(Note note)
{
    NoteEntryPage noteEntryPage = new NoteEntryPage
    {
        BindingContext = note,
        // Set the parent so that the app-level resource dictionary can be located.
        Parent = Xamarin.Forms.Application.Current
    };

    var noteEntryViewController = noteEntryPage.CreateViewController();
    noteEntryViewController.Title = "Note Entry";

    _navigation.PushViewController(noteEntryViewController, true);
    noteEntryPage.Parent = null;
}

El método convierte la página derivada de en con el método de extensión NavigateToNoteEntryPageXamarin.FormsContentPage y establece la propiedad UIViewController de CreateViewControllerTitleUIViewController . A UIViewController continuación, el método inserta AppNavigationController en PushViewController . Por lo tanto, se mostrará la interfaz de usuario definida Xamarin.FormsNoteEntryPage en la clase , como se muestra en la captura de pantalla siguiente:

con una interfaz de usuario XAML

Cuando se muestra , la navegación hacia atrás mostrará para la clase de , devolviendo el NoteEntryPage usuario a para la clase UIViewControllerNoteEntryPageAppNavigationControllerUIViewControllerNotesPage . Sin embargo, al eliminar un de la pila de navegación nativa de iOS no se elimina UIViewController automáticamente el objeto adjunto y UIViewControllerPage . Por lo tanto, AppNavigationController la clase invalida el método para eliminar los controladores de vista en la navegación hacia PopViewController atrás:

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);
    }
}

La invalidación llama al método en el objeto que PopViewController se ha partido de la pila de navegación nativa de DisposeUIViewController iOS. Si no lo hace, el objeto UIViewController adjunto y se queda Page huérfano.

Android

En Android, la OnCreate invalidación de la MainActivity clase suele ser el lugar para realizar tareas relacionadas con el inicio de la aplicación. En el ejemplo de código siguiente se muestra MainActivity la clase en la aplicación de ejemplo:

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);

        // Create app-level resource dictionary.
        Xamarin.Forms.Application.Current = new Xamarin.Forms.Application();
        Xamarin.Forms.Application.Current.Resources = new MyDictionary();

        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));

        NotesPage notesPage = new NotesPage()
        {
            // Set the parent so that the app-level resource dictionary can be located.
            Parent = Xamarin.Forms.Application.Current
        };
        AndroidX.Fragment.App.Fragment notesPageFragment = notesPage.CreateSupportFragment(this);

        SupportFragmentManager
            .BeginTransaction()
            .Replace(Resource.Id.fragment_frame_layout, mainPage)
            .Commit();
        //...

        notesPage.Parent = null;
    }
    ...
}

El método OnCreate realiza las siguientes tareas:

• Xamarin.Forms se inicializa mediante una llamada al Forms.Init método .
• Se crea un nuevo objeto is y su diccionario de recursos de nivel de aplicación se establece en un que Xamarin.Forms.ApplicationResourceDictionary se define en XAML.
• Una referencia a la MainActivity clase se almacena en el campo staticInstance . Esto es para proporcionar un mecanismo para que otras clases llamen a métodos definidos en la MainActivity clase .
• El Activity contenido se establece a partir de un recurso de diseño. En la aplicación de ejemplo, el diseño consta de un que contiene un y LinearLayout un para actuar como un contenedor de ToolbarFrameLayout fragmentos.
• se recupera y establece como la barra de acciones de y se establece el título Toolbar de la barra de Activity acciones.
• La propiedad se inicializa en una ruta de acceso en el dispositivo donde se almacenarán FolderPath los datos de la nota.
• Se crea un objeto , que es una página derivada de definida en XAML, y su elemento primario se establece NotesPage en el objeto creado Xamarin.FormsContentPageXamarin.Forms.Application anteriormente.
• El NotesPage objeto se convierte en mediante el método de extensión FragmentCreateSupportFragment .
• La SupportFragmentManager clase crea y confirma una transacción que reemplaza la instancia por para la clase FrameLayoutFragmentNotesPage .
• La Parent propiedad del objeto se establece en , para evitar una pérdida de NotesPagenull memoria.

Para obtener más información sobre los fragmentos, vea Fragmentos.

Una vez ejecutado el método, se mostrará la interfaz de usuario definida en la clase OnCreate , como se muestra en la captura de pantalla Xamarin.FormsNotesPage siguiente:

Screenshot (Captura de pantalla de la aplicación Xamarin.Android con una interfaz de usuario XAML) muestra una pantalla De notas en un dispositivo móvil con un banner azul y texto de nota

La interacción con la interfaz de usuario, por ejemplo, pulsando en , dará lugar a que se ejecute el siguiente controlador de eventos en el +ButtonNotesPage código subyacente:

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

El staticMainActivity.Instance campo permite invocar el método , que MainActivity.NavigateToNoteEntryPage se muestra en el ejemplo de código siguiente:

public void NavigateToNoteEntryPage(Note note)
{
    NoteEntryPage noteEntryPage = new NoteEntryPage
    {
        BindingContext = note,
        // Set the parent so that the app-level resource dictionary can be located.
        Parent = Xamarin.Forms.Application.Current
    };

    AndroidX.Fragment.App.Fragment noteEntryFragment = noteEntryPage.CreateSupportFragment(this);
    SupportFragmentManager
        .BeginTransaction()
        .AddToBackStack(null)
        .Replace(Resource.Id.fragment_frame_layout, noteEntryFragment)
        .Commit();

    noteEntryPage.Parent = null;
}

El método convierte la página derivada en un con el método de extensión y agrega a la pila de copia de seguridad NavigateToNoteEntryPageXamarin.FormsContentPageFragment de CreateSupportFragmentFragment fragmentos. Por lo tanto, se mostrará la interfaz de usuario Xamarin.FormsNoteEntryPage definida en , como se muestra en la captura de pantalla siguiente:

con una interfaz de usuario XAML muestra una entrada de nota en un

Cuando se muestra , al pulsar la flecha atrás se mostrará el de la pila de fragmentos atrás, devolviendo el usuario a NoteEntryPageFragment para la clase NoteEntryPageFragmentNotesPage .

Habilitación de la compatibilidad con la navegación hacia atrás

La clase tiene un evento que se activa cada vez que cambia el SupportFragmentManager contenido de la pila de copia de seguridad del BackStackChanged fragmento. El OnCreate método de la clase contiene un controlador de eventos anónimo para este MainActivity evento:

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

Este controlador de eventos muestra un botón Atrás en la barra de acciones siempre que haya una o varias instancias en la pila de copia de Fragment seguridad de fragmentos. La invalidación controla la respuesta a pulsar el botón OnOptionsItemSelected Atrás:

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);
}

Se OnOptionsItemSelected llama a la invalidación cada vez que se selecciona un elemento en el menú de opciones. Esta implementación hace que el fragmento actual se resalte de la pila de fragmentos, siempre que se haya seleccionado el botón Atrás y haya una o varias instancias en la pila de Fragment fragmentos.

Varias actividades

Cuando una aplicación se compone de varias actividades, las páginas derivadas de se ContentPage pueden incrustar en cada una de las actividades. En este escenario, solo es necesario llamar al método en Forms.Init la OnCreate invalidación de la primera Activity que inserta un Xamarin.FormsContentPage . Sin embargo, esto tiene el siguiente impacto:

• El valor de Xamarin.Forms.Color.Accent se toma del que Activity llamó al método Forms.Init .
• El valor de Xamarin.Forms.Application.Current se asociará al Activity que llamó al método Forms.Init .

Elegir un archivo

Al insertar una página derivada de que usa un que necesita admitir un botón HTML "Elegir archivo", tendrá que ContentPageWebView invalidar el método ActivityOnActivityResult :

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

UWP

En UWP, la clase App nativa suele ser el lugar para realizar tareas relacionadas con el inicio de la aplicación. Xamarin.Forms normalmente se inicializa, en aplicaciones para UWP, en la invalidación en Xamarin.FormsOnLaunched la clase nativa, para pasar App el argumento al método LaunchActivatedEventArgsForms.Init . Por este motivo, las aplicaciones para UWP nativas que consumen una página derivada de pueden llamar más fácilmente al Xamarin.FormsContentPage método desde el Forms.Init método App.OnLaunched :

protected override void OnLaunched(LaunchActivatedEventArgs e)
{
    // ...
    Xamarin.Forms.Forms.Init(e);

    // Create app-level resource dictionary.
    Xamarin.Forms.Application.Current = new Xamarin.Forms.Application();
    Xamarin.Forms.Application.Current.Resources = new MyDictionary();

    // ...
}

Además, el método también puede crear cualquier diccionario de recursos de nivel de aplicación que OnLaunched requiera la aplicación.

De forma predeterminada, la App clase nativa inicia la clase como la primera página de la MainPage aplicación. En el ejemplo de código siguiente se muestra MainPage la clase en la aplicación de ejemplo:

public sealed partial class MainPage : Page
{
    NotesPage notesPage;
    NoteEntryPage noteEntryPage;

    public static MainPage Instance;
    public static string FolderPath { get; private set; }

    public MainPage()
    {
        this.NavigationCacheMode = NavigationCacheMode.Enabled;
        Instance = this;
        FolderPath = Path.Combine(System.Environment.GetFolderPath(System.Environment.SpecialFolder.LocalApplicationData));

        notesPage = new Notes.UWP.Views.NotesPage
        {
            // Set the parent so that the app-level resource dictionary can be located.
            Parent = Xamarin.Forms.Application.Current
        };
        this.Content = notesPage.CreateFrameworkElement();
        // ...
        notesPage.Parent = null;    
    }
    // ...
}

El MainPage constructor realiza las siguientes tareas:

• El almacenamiento en caché está habilitado para la página, por lo que no se construye un nuevo cuando un usuario MainPage vuelve a la página.
• Una referencia a la MainPage clase se almacena en el campo staticInstance . Esto es para proporcionar un mecanismo para que otras clases llamen a métodos definidos en la MainPage clase .
• La FolderPath propiedad se inicializa en una ruta de acceso en el dispositivo donde se almacenarán los datos de la nota.
• Se crea un objeto , que es una página derivada de definida en XAML, y su elemento primario se establece NotesPage en el objeto creado Xamarin.FormsContentPageXamarin.Forms.Application anteriormente.
• El objeto se convierte en mediante el método de extensión y, a continuación, se establece NotesPage como el contenido de la clase FrameworkElementCreateFrameworkElementMainPage .
• La Parent propiedad del objeto se establece en , para evitar una pérdida de NotesPagenull memoria.

Una vez ejecutado el constructor, se mostrará la interfaz de usuario definida en la clase , como se MainPage muestra en la captura de pantalla Xamarin.FormsNotesPage siguiente:

Aplicación para de Xamarin.Forms con una clase de intervalo de <= interfaz de usuario XAML" data-linktype="relative-path">Captura de pantalla que muestra una página Notas con notas y Interfaz de usuario XAML de Xamarin.Forms" data-linktype="relative-path"/>

La interacción con la interfaz de usuario, por ejemplo pulsando en , dará lugar a que se ejecute el siguiente controlador de eventos en el código +ButtonNotesPage subyacente:

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

El staticMainPage.Instance campo permite invocar el método , que MainPage.NavigateToNoteEntryPage se muestra en el ejemplo de código siguiente:

public void NavigateToNoteEntryPage(Note note)
{
    noteEntryPage = new Notes.UWP.Views.NoteEntryPage
    {
        BindingContext = note,
        // Set the parent so that the app-level resource dictionary can be located.
        Parent = Xamarin.Forms.Application.Current
    };
    this.Frame.Navigate(noteEntryPage);
    noteEntryPage.Parent = null;
}

La navegación en UWP normalmente se realiza con Frame.Navigate el método , que toma un argumento Page . Xamarin.Forms define un Frame.Navigate método de extensión que toma una instancia de página derivada de ContentPage . Por lo tanto, cuando se ejecute el método , se mostrará la interfaz de usuario definida en , como se NavigateToNoteEntryPage muestra en la captura de pantalla Xamarin.FormsNoteEntryPage siguiente:

Aplicación para de Xamarin.Forms con una clase de intervalo de <= interfaz de usuario XAML" data-linktype="relative-path">Captura de pantalla que muestra una página Notas con un cuadro de texto con una nota Interfaz de usuario XAML de Xamarin.Forms" data-linktype="relative-path"/>

Cuando se muestra , al pulsar la flecha atrás, se mostrará el de la pila de NoteEntryPage back-stack en la aplicación y se devuelve al usuario a FrameworkElementNoteEntryPage para la clase FrameworkElementNotesPage .

Habilitación de la compatibilidad con el tamaño de página

Cuando se cambia el tamaño de la ventana de la aplicación para UWP, Xamarin.Forms también se debe cambiar el tamaño del contenido. Esto se logra mediante el registro de un controlador de eventos para el Loaded evento, en el MainPage constructor :

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

El evento se produce cuando la página se coloca, se representa y está lista para la interacción, y Loaded ejecuta el método en OnMainPageLoaded respuesta:

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));
    };
}

El método registra un controlador de eventos anónimo para el evento , que se genera cuando las OnMainPageLoaded propiedades o cambian en Frame.SizeChangedActualHeightActualWidthFrame . En respuesta, se cambia el tamaño del contenido de Xamarin.Forms la página activa mediante una llamada al método Layout .

Habilitación de la compatibilidad con la navegación hacia atrás

En UWP, las aplicaciones deben habilitar la navegación hacia atrás para todos los botones atrás de hardware y software, en diferentes factores de forma de dispositivo. Esto se puede lograr mediante el registro de un controlador de eventos para el BackRequested evento , que se puede realizar en el constructor MainPage :

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

Cuando se inicia la aplicación, el método recupera el objeto asociado a la vista actual y, a continuación, registra un controlador de GetForCurrentViewSystemNavigationManager eventos para el BackRequested evento. La aplicación solo recibe este evento si es la aplicación en primer plano y, en respuesta, llama al controlador OnBackRequested de eventos:

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

El controlador de eventos llama al método en el marco raíz de la aplicación y establece la propiedad en para marcar OnBackRequestedGoBack el evento como BackRequestedEventArgs.Handledtrue manipulado. Si no se marca el evento como manipulado, se podría omitir el evento.

La aplicación elige si se debe mostrar un botón Atrás en la barra de título. Esto se logra estableciendo la propiedad en uno de los valores de AppViewBackButtonVisibilityAppViewBackButtonVisibility enumeración, en la App clase :

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

El controlador de eventos, que se ejecuta en respuesta a la activación del evento, actualiza la visibilidad del botón Atrás de la barra de título cuando se produce la OnNavigatedNavigated navegación por la página. Esto garantiza que el botón Atrás de la barra de título esté visible si la pila de back-in-app no está vacía o se quita de la barra de título si la pila de back-app está vacía.

Para obtener más información sobre la compatibilidad con la navegación hacia atrás en UWP, consulta Historial de navegación y navegación hacia atrás para aplicaciones para UWP.

Vínculos relacionados

• NativeForms (ejemplo)
• Vistas nativas