[Spec] Shell/NavigationPage TitleView

[PureWeen]

NavigationPage/Shell TitleView

Utilize our current LayoutOptions to indicate how you want a TitleView to layout on the screen. All work done here should be generalized so that it applies to Navigation.TitleView as well

These will have no effect as they only apply to cases where the parent is a stack layout

StartAndExpand
CenterAndExpand
EndAndExpand
FillAndExpand

Realistically users should only need to use Center and Fill

Center

VerticalOptions

When used it will center the rendered view inside the given title view container so that the margin above and below the content appear equal

HorizontalOptions

Centered on the device screen. View will have a width equal to measured content

Fill

VerticalOptions

This is the current behavior. The Layout will just layout inside all available vertical space. In a perfect world if the measured height of the supplied layout exceeds the min height of the navigation bar then the navigation bar should be resized to match the height of the TitleView. If this is extremely difficult to get working we can look at doing that for a second PR.

HorizontalOptions

This will cause the title view to take up the entire width of the header on the device. So the titleview layout will overlap the backbutton, hamburger, etc... We can detect this layout option and just not render toolbaritems/hamburger/etc..

Start

VerticalOptions

View will measure vertically to the size of the content and will layout against the top edge of the allotted TitleView space.

HorizontalOptions

View will measure horizontally to the size of the content and will layout against the left edge of the allotted TitleView space. For example on iOS this will just cause the view to layout against the hamburger

End

VerticalOptions

View will measure vertically to the size of the content and will layout against the bottom edge of the allotted TitleView space.

HorizontalOptions

View will measure horizontally to the size of the content and will layout against the right edge of the allotted TitleView space. For example on iOS this will just cause the view to layout against the hamburger Template level control of the entire experience.

Additional Work to look at while implementing these changes

• Shell needs to allow the TitleView to be settable at all levels #4650
• If the measured height of the titleview exceeds the navigation bar min height than the navigationbar should resize to the measured content

XAML Example

This will center the title vertically within the given titleview space and horizontally on the device screen

<Shell.TitleView>
     <StackLayout HorizontalOptions="Center" VerticalOptions="Center">
          <Label Text="Title"  />
     </StackLayout>
</Shell.TitleView>

---

Difficulty : medium

[Alexgoon]

Not sure if this is related to the current thread, but it seems that TitleView has a default padding that cannot be removed. Found a Xamarin-specific issue about it at [Spec] Shell/NavigationPage TitleView

[Qythyx]

Is there a workaround to this until it is implemented? Specifically, I'm having difficulties setting my TitleView to use the full height of the NavBar in iOS. Is there anyway to know what the full heigh of the NavBar should be?

[shijianoo]

Why wasn't it fixed?

[kubaflo]

Hi, @PureWeen could you please have a look at this PR? :) https://github.com/dotnet/maui/pull/20959 Thanks!