Saltar al contenido

Xamarin.Forms: ¿Puedo incrustar un ContentPage o ContentView en otro ContentPage?

Solución:

Muchas gracias IdoT, funcionó para mí, pero después de agregar algunas líneas. Ya que esto ayudará a crear plantillas / controles personalizados / sub formularios, que se pueden agregar / compartir fácilmente en Xamarin.Forms.

Aquí está mi trabajo completo basado en su sugerencia, para que pueda usarse como está con otros:

HeaderNavigationBar.xaml

<?xml version="1.0" encoding="utf-8" ?>
<StackLayout xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="App9.MVC.Views.HeaderNavigationBar"
             Orientation="Horizontal"
             HorizontalOptions="FillAndExpand"
             Padding="10"
             ackgroundColor="White">

    <Button Text="Internal 1" />
    <Button Text="Internal 2" />
</StackLayout>

Como puede ver, agregó:

xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"

y en el HeaderNavigationBar.cs, fue declarado como StackLayout:

HeaderNavigationBar.cs

using Xamarin.Forms;

namespace App9.MVC.Views
{
    public partial class HeaderNavigationBar : StackLayout
    {
        public HeaderNavigationBar()
        {
            InitializeComponent();
        }
    }
}

luego para la página que lo contendrá / lo mostrará:

MainView.xaml

<?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:common="clr-namespace:App9.MVC.Views;assembly=App9"
             x:Class="App9.MVC.Views.MainView">

    <StackLayout Padding="0,0,0,20">
        <common:HeaderNavigationBar>
            <Button Text="External 1" />
        </common:HeaderNavigationBar>

        <Button Text="Test Button 1
                x:Name="btnPage1"
                Clicked="btnPage1_clicked" />
    </StackLayout>
</ContentPage>

Como puede observar, el espacio de nombres tiene la ruta completa, en el MainView:

xmlns:common="clr-namespace:App9.MVC.Views;assembly=App9"

Además, puede notar que hay un botón llamado External 1, esto también se mostrará con los botones internos, ya que el control es un StackLayout, por lo que puede manejar agregar más controles.

Captura de pantalla:

ingrese la descripción de la imagen aquí

También para la página dentro de otra página:

  • https://github.com/twintechs/TwinTechsFormsLib
  • http://blog.twintechs.com/advanced-xamarin-forms-techniques-for-flexible-and-performant-cross-platform-apps-part-5-page-in-page-embedding

Una vez más, gracias a IdoT.

Puede llevarse al padre hijo de su ContentPage (por ejemplo, un StackLayout que envuelve a todos los hijos), colóquelo en un archivo xaml externo y luego incluya ese componente en cada una de sus ContentPages.

El archivo xaml externo será un StackLayout type, en lugar de ContentPage.

Editar – agregó una muestra de código:

Agreguemos un encabezado StackLayout: agregamos un código detrás de la clase:

public partial class HeaderNavigationBar 
{
    public HeaderNavigationBar()
    {
        InitializeComponent();
    }
}

Luego agregue el código XAML:

<StackLayout x:Class="HeaderNavigationBar"
             Orientation="Horizontal"
             HorizontalOptions="FillAndExpand"
             Padding="10"
             BackgroundColor="White">

    <Image Source="burger_icon"
           HorizontalOptions="StartAndExpand"
           Aspect="AspectFit">
        <Image.GestureRecognizers>
            <TapGestureRecognizer Command="{Binding SlideNavigationDrawerCommand}" />
        </Image.GestureRecognizers>
    </Image>
</StackLayout>

Y finalmente, en la página donde desea reutilizar su componente, agregue esta referencia:<HeaderNavigationBar />.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *