Top Tabbed Page para iOS – Xamarin.Forms

Olá, neste post irei demonstrar como implementar Top Tabbed Page para iOS.

Antes que você me pergunte

Abas no topo da página não vão contra as diretrizes da Apple ?”

Sim… mas já tentou explicar isso para um cliente ? (Acho que eu não preciso de outra justificativa né ? kkkk)

Bom, se você encontra-se em uma situação parecida, esse post com certeza é para você. Sem mais delongas, vamos ao código.

ADICIONANDO O NUGET PACKAGE

Clique com o botão direito em cima de sua Solution e selecione “Manage NuGet Packages for Solution…”.

1

 

Digite “Naxam.TopTabbedPage.Forms” e selecione o plugin como demonstrado na imagem a seguir.

2

 

Selecione o projeto compartilhado e clique no botão “Install”.

2

Compartilhado

Em seu projeto compartilhado, crie uma TabbedPage como você já está acostumado e lembre-se de referencia-lá na MainPage da classe App.cs.

MainPage = new NavigationPage(new MainTabbedPage());

 

Xaml

Referencie o namespace do plugin e utilize TopTabbedPage.

<?xml version="1.0" encoding="utf-8" ?>
<forms:TopTabbedPage
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:TopTabbedPageDemo"
x:Class="TopTabbedPageDemo.MainTabbedPage"
xmlns:forms="clr-namespace:Naxam.Controls.Forms;assembly=Naxam.TopTabbedPage.Forms"
BarBackgroundColor="#2196F3">
<local:Page1 Title="PAGE 1"/>
<local:Page2 Title="PAGE 2"/>
<local:Page3 Title="PAGE 3"/>
</forms:TopTabbedPage>

view raw
MainTabbedPage.xaml
hosted with ❤ by GitHub

Code-behind

Lembre-se de modificar a herança da classe para TopTabbedPage.

using Xamarin.Forms.Xaml;
using Naxam.Controls.Forms;
namespace TopTabbedPageDemo
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class MainTabbedPage : TopTabbedPage
{
public MainTabbedPage()
{
InitializeComponent();
}
}
}

iOS

Em seu projeto .iOS inicialize o Plugin na classe AppDelegate.

AppDelegate.cs

using Foundation;
using Naxam.Controls.Platform.iOS;
using UIKit;
namespace TopTabbedPageDemo.iOS
{
[Register("AppDelegate")]
public partial class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsApplicationDelegate
{
public override bool FinishedLaunching(UIApplication app, NSDictionary options)
{
TopTabbedRenderer.Init();
global::Xamarin.Forms.Forms.Init();
LoadApplication(new App());
return base.FinishedLaunching(app, options);
}
}
}

view raw
AppDelegate.cs
hosted with ❤ by GitHub

Resultado

ezgif.com-video-to-gif (2)
Android
ezgif.com-gif-maker
iOS

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Esse e todos os exemplos deste blog encontram-se disponíveis no GitHub.

icongithub

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair /  Alterar )

Foto do Google

Você está comentando utilizando sua conta Google. Sair /  Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair /  Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair /  Alterar )

Conectando a %s