2

How do I enable iOS 11 prefersLargeTitles throughout my Xamarin.Forms app?

I tried creating a custom renderer derived from PageRenderer for NavigationPage, setting:

ViewController.NavigationController.NavigationBar.PrefersLargeTitles = true;

This didn't have any effect, however.

Edward Brey
  • 40,302
  • 20
  • 199
  • 253
  • No disrespect, but for someone with your reputation on SO, I'd expect a bit more effort than this. What have you tried? – Gerald Versluis Sep 21 '17 at 19:26
  • I updated the question accordingly with my attempt. Since it had no effect, I didn't think it would be of much use, but just in case... – Edward Brey Sep 21 '17 at 19:30

2 Answers2

6

Voila

[assembly: ExportRenderer(typeof(NavigationPage), typeof(NavBarRenderer))]
namespace LargeTitleSample.iOS
{
    public class NavBarRenderer : NavigationRenderer
    {
        protected override void OnElementChanged(Xamarin.Forms.Platform.iOS.VisualElementChangedEventArgs e)
        {
            base.OnElementChanged(e);

            NavigationBar.PrefersLargeTitles = true;
        }
    }
}

You have to create a custom renderer for the NavigationPage inheriting the NavigationRenderer. Then set the PrefersLargeTitles property on the NavigationBar to true.

It seems that when you add some scrollable control to the page, it will automatically have to 'big to small' effect when scrolling up, at least for a ListView.

Working example repo is here: https://github.com/jfversluis/LargeTitleSample

Gerald Versluis
  • 30,492
  • 6
  • 73
  • 100
  • Worked like a charm, but there isn't a small bug? I mean, on the bottom is appearing a white margin now – rafaelbpa Oct 03 '17 at 19:08
  • When scrolled up on the bottom of the screen you mean? I see.. Probably has something to do with the insets of some sort. I'll try to see if I can figure something out when I have a few minutes. – Gerald Versluis Oct 03 '17 at 19:42
  • I ran into what may be a similar problem. The tab bar at the bottom of the page scrolls up when the text transitions from large to moving into the header. – Edward Brey Oct 06 '17 at 20:27
  • 1
    The issue with the white space at the bottom is resolves in Xamarin.Forms 2.5.0.91635 (see [link](https://forums.xamarin.com/discussion/comment/307295)) – Gerald Versluis Nov 23 '17 at 20:57
0

For XAML:

<NavigationPage Title="..." xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core" ios:NavigationPage.PrefersLargeTitles="true">
Maximiliano Talenti
  • 1
  • 1