GOOGLE ADS

viernes, 22 de abril de 2022

Múltiples TabBars en una sola aplicación Xamarin

Cómo usar múltiples TabBars (abajo) usando Shell en una sola aplicación para que diferentes páginas tengan diferentes TabBar. ¿Puedo usar múltiples Shell o es posible con un solo shell?


Solución del problema

Puede usar una aplicación Shell, en este ejemplo, Inicio tiene 3 pestañas. El ícono de Configuración es una página con pestañas con 3 pestañas.

Shell.xaml























<Shell.FlyoutFooterTemplate>
<DataTemplate>
<Grid RowDefinitions="30" ColumnDefinitions="150, 150">
<Image
Grid.Row="0"
Grid.Column="0"
Source="Settings.png"
HorizontalOptions="StartAndExpand"
Margin="50,0,0,0"
>
<Image.GestureRecognizers>
<TapGestureRecognizer
Tapped="TapGestureRecognizer_Tapped"
NumberOfTapsRequired="1" />
</Image.GestureRecognizers>
</Image>
<Image
Grid.Row="0"
Grid.Column="1"
Source="Power.png"
HorizontalOptions="EndAndExpand"
Margin="0,0,30,0">
<Image.GestureRecognizers>
<TapGestureRecognizer
Tapped="TapGestureRecognizer_Tapped_1"
NumberOfTapsRequired="1" />
</Image.GestureRecognizers>
</Image>
</Grid>
</DataTemplate>
</Shell.FlyoutFooterTemplate>

Shell.xaml.cs

 public AppShell()
{
InitializeComponent();
Routing.RegisterRoute(nameof(ItemDetailPage), typeof(ItemDetailPage));
Routing.RegisterRoute(nameof(NewItemPage), typeof(NewItemPage));
Routing.RegisterRoute(nameof(StartPage), typeof(StartPage));
Routing.RegisterRoute(nameof(HomePage), typeof(HomePage));
}
private async void OnMenuItemClicked(object sender, EventArgs e)
{
await Shell.Current.GoToAsync("ItemDetailPage");
Shell.Current.FlyoutIsPresented = false;
}
private async void MenuItem_Clicked(object sender, EventArgs e)
{
await Shell.Current.GoToAsync("//LoginPage");
}
private async void TapGestureRecognizer_Tapped(object sender, EventArgs e)
{
Routing.RegisterRoute(nameof(SettingsPage), typeof(SettingsPage));

await Shell.Current.GoToAsync("SettingsPage");

Shell.Current.FlyoutIsPresented = false;

}
private void TapGestureRecognizer_Tapped_1(object sender, EventArgs e)
{
/// do stuff what you want
}
}

ingrese la descripción de la imagen aquí

No hay comentarios.:

Publicar un comentario

Flutter: error de rango al acceder a la respuesta JSON

Estoy accediendo a una respuesta JSON con la siguiente estructura. { "fullName": "FirstName LastName", "listings...