Quantcast
Channel: Xamarin.Forms — Xamarin Community Forums
Viewing all articles
Browse latest Browse all 91519

How to create tabbed page in Xamarin.Forms similar to that of Facebook app?

$
0
0

I am working with Xamarin.Forms and I would like to create a navigation method similar to that of the Facebook app and also other newer versions of different apps. Here are two pictures, one of Facebook app on Android and the other is of KakaoTalk, also on Android (on iOS are the same):

I've tried several different ways to implement this. For example I wrapped the MainPage (TabbedPage) inside a NavigationPage. I also tried wrapping the MainPage (ContentPage) inside a NavigationPage then calling

PushAsync(new TabbedPage());

inside the MainPage via the Navigation property. I also tried wrapping the children of the MainPage (TabbedPage) inside separate NavigationPages. None of these attempts resulted in the desired effect.

I would like the following to happen. When a user taps on a Button or something that navigates to another page I'd like a ContentPage to pop in front of everything (tab bar included) except for the Navigation bar (or Action Bar). Obviously this happens via the PushAsync() method which also results in a small back arrow appearing in the Nav bar. My understanding is that a PushAsync() call pushes the chosen page onto the navigation stack provided by the NavigationPage. Therefore if a TabbedPage is wrapped inside a NavigationPage a new ContentPage would not be able to pop in front of the tabs like in the two applications mentioned above. But according to Xamarin API Doc, the Navigation property is context-aware, i.e. it will find all its parents until there is a NavigationPage. And in Android, only one NavigationPage is allowed and therefore even you call PushAsync() inside the TabbedPage, it will still push via your wrapping NavigationPage.

This, plus the fact that the tab bars of said apps don't get inside the ActionBar (in Android) in landscape mode leads me to believe that what I'm trying to achieve is best done not using TabbedPage but something that acts like a tab bar, e.g. a horizontal stack of Buttons perhaps.

Has anyone implemented this correctly and in an elegant way using Xamarin.Forms? So again, I would like to make this tab like navigation with the tabs staying underneath the ActionBar in landscape mode and a new Page appearing in front of the tabs (hiding them) when pushed onto the navigation stack. Do you think this can be done with Custom Renderers or with some Grid trick?

My app uses Xamarin.Forms with a common PCL project and an Android and iOS project.

Thank you in advance for your help.


Viewing all articles
Browse latest Browse all 91519

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>