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…”.

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

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

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

          }

    }

}

view raw
MainTabbedPage.xaml.cs
hosted with ❤ by GitHub

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

        }

    }

}