Compartir a través de


Títulos de página grandes en iOS

Este .NET Multi-platform App UI (.NET MAUI) iOS específico de la plataforma se usa para mostrar el título de la página como un título grande en la barra de navegación de NavigationPage, para dispositivos que usan iOS 11 o superior. Un título grande se alinea a la izquierda y usa una fuente más grande y realiza la transición a un título estándar a medida que el usuario comienza a desplazar el contenido, de modo que la pantalla se use de forma eficaz. Sin embargo, en la orientación horizontal, el título volverá al centro de la barra de navegación para optimizar el diseño de contenido. Se consume en XAML configurando la propiedad adjunta NavigationPage.PrefersLargeTitles en un valor boolean:

<NavigationPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                xmlns:ios="clr-namespace:Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;assembly=Microsoft.Maui.Controls"
                ...
                ios:NavigationPage.PrefersLargeTitles="true">
  ...
</NavigationPage>

Como alternativa, se puede consumir desde C# mediante la API fluida:

using Microsoft.Maui.Controls.PlatformConfiguration;
using Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;
...

var navigationPage = new Microsoft.Maui.Controls.NavigationPage(new iOSLargeTitlePageCode());
navigationPage.On<iOS>().SetPrefersLargeTitles(true);

El método NavigationPage.On<iOS> especifica que esta plataforma específica solo se ejecutará en iOS. El método NavigationPage.SetPrefersLargeTitle, en el espacio de nombres Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific, controla si los títulos grandes están habilitados.

Siempre que los títulos grandes estén habilitados en NavigationPage, todas las páginas de la pila de navegación mostrarán títulos grandes. Este comportamiento se puede invalidar en las páginas estableciendo la propiedad adjunta Page.LargeTitleDisplay en un valor de la enumeración LargeTitleDisplayMode:

<ContentPage ...
             xmlns:ios="clr-namespace:Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;assembly=Microsoft.Maui.Controls"
             Title="Large Title"
             ios:Page.LargeTitleDisplay="Never">
  ...
</ContentPage>

Como alternativa, el comportamiento de la página se puede invalidar desde C# mediante la API fluida:

using Microsoft.Maui.Controls.PlatformConfiguration;
using Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;
...

public class iOSLargeTitlePageCode : ContentPage
{
    public iOSLargeTitlePageCode
    {
        On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Never);
    }
    ...
}

El método Page.On<iOS> especifica que esta plataforma específica solo se ejecutará en iOS. El método Page.SetLargeTitleDisplay, en el espacio de nombres Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific, controla el comportamiento de título grande en Page, con la enumeración LargeTitleDisplayMode que proporciona tres valores posibles:

  • Always: fuerza la barra de navegación y el tamaño de fuente para usar el formato grande.
  • Automatic: usa el mismo estilo (grande o pequeño) que el elemento anterior de la pila de navegación.
  • Never: fuerza el uso de la barra de navegación normal y de formato pequeño.

Además, el método SetLargeTitleDisplay se puede usar para alternar los valores de enumeración llamando al método LargeTitleDisplay, que devuelve el objeto actual LargeTitleDisplayMode:

switch (On<iOS>().LargeTitleDisplay())
{
    case LargeTitleDisplayMode.Always:
        On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Automatic);
        break;
    case LargeTitleDisplayMode.Automatic:
        On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Never);
        break;
    case LargeTitleDisplayMode.Never:
        On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Always);
        break;
}

El resultado es que se aplica un LargeTitleDisplayMode a Page, que controla el comportamiento de título grande:

Page title as a large title.