You can enable large titles on iOS Navigation by adjusting the Frame using standard iOS APIs.
You can interact directly with the target platform using it's natural APIs. The property which defines this behavior is documented here in the Apple docs.
As we can see from the docs, this is a property of a UINavigationBar which is accessible from it's most commonly used owner, a UINavigationController, which is what a @nativescript/core Frame is on iOS.
The Frame is always accessible from the Page.
On iOS, each Page is a UIViewController instance and has a reference it it's parent UINavigationController via it's frame
property.
Depending on flavor usage, this may be implicit or explicitly defined. Let's look at a few examples.
The Page is implicit with Angular in that each page routed to always gets a Page injected into it. Every Page has a frame
property which is a reference to it's Frame instance. Since a Page is not loaded when a component is constructed we can setup a loaded
listener to access the frame at a time it becomes available.
@Component({
selector: 'ns-items',
templateUrl: './items.component.html',
})
export class ItemsComponent {
page = inject(Page);
constructor() {
// Setup large titles on iOS
this.page.on('loaded', (args) => {
if (__IOS__) {
const navigationController: UINavigationController =
this.page.frame.ios.controller;
navigationController.navigationBar.prefersLargeTitles = true;
}
});
}
}
The Page is explicit in Vue in that you define each template with a Page whereby the first component in your navigation stack will define the Frame explicitly.
<script lang="ts" setup>
function loadedFrame(args) {
if (__IOS__) {
const frame = args.object as Frame;
const navigationController: UINavigationController = frame.ios.controller;
navigationController.navigationBar.prefersLargeTitles = true;
}
}
</script>
<template>
<Frame @loaded="loadedFrame">
<Page>
<ActionBar title="Home"> </ActionBar>
<GridLayout></GridLayout
</Page>
</Frame>
</template>
Each flavor is built on the exact same constructs so where you can access the Page
, you can get a frame
and/or where you have an explicit Frame
you can interact with it's UINavigationController
as seen the exact same way.