iOS 18: iPad: TabGroup looks very different vs iOS 17.

[tyroneBaba]

I have searched and made sure there are no existing issues for the issue I am filing

• [X] I have searched the existing issues

Description

iOS 18 tabbed bar is displaying as a weird bar at the top. is fine on iOS 17.

Expected Behavior

It should be at the bottom like on the App store.

Actual behavior

its showing as a pill shaped menu at the top, almost like a Tab Bar.

Reproducible sample

index.js

function doClick(e) { alert($.label.text); } $.tabGroup.open();

index.xml

<TabGroup id='tabGroup'>
	<Tab title='Tab 1'>
		<Window class="container">
			<Label id="label" onClick="doClick">Hello, World 1</Label>
		</Window>
	</Tab>
	<Tab title='Tab 2'>
		<Window class="container">
			<Label id="label" onClick="doClick">Hello, World 2</Label>
		</Window>
	</Tab>
</TabGroup>

Steps to reproduce

Create a new project and add a TabGroup to xml. Load it up on iOS 17 and iOS 18 and observe.

Platform

iOS

SDK version you are using

12.5.0.GA

Alloy version you are using

No response

[m1ga]

In iPadOS 18 and later, the position of the tab bar moves from the bottom of the screen to float over your content at the top.

https://developer.apple.com/documentation/uikit/app_and_environment/elevating_your_ipad_app_with_a_tab_bar_and_sidebar

I was checking iPhone before, that's why I didn't see that 😄 Think that is Apples new way to display it now 🤷

[de1mat]

Not cool Apple. This thread provides more context. https://forums.developer.apple.com/forums/thread/756652

[tyroneBaba]

Seems that this is intended, is there any way to have more control (the way it looks or how it works)?

[prashantsaini1]

@de1mat You may want to keep an eye on this PR as it support removing the pill-shaped 😄 tab-group (but I think it removes both tab-bar).

[hbugdoll]

@de1mat You may want to keep an eye on this PR as it support removing the pill-shaped 😄 tab-group (but I think it removes both tab-bar).

I provided a PR for opt-out to the new tab bar.