Xamarin.Forms icon indicating copy to clipboard operation
Xamarin.Forms copied to clipboard

[Bug] iOS issue in Shell with more than 4 pages does not work the same as Android

Open tschlarman opened this issue 4 years ago • 4 comments

Description

I have a startup wizard with 6 pages. Shell.TabBar and NavBar are not visible on all the pages. On startup the app goes thru these 6 pages and at the end ends up at the main screen.

AppShell.xaml looks like this:

<Shell
	xmlns="http://xamarin.com/schemas/2014/forms"
	xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
	xmlns:views="clr-namespace:MyApp"
	x:Class="MyApp.AppShell"
	Navigating="Shell_Navigating"
	Navigated="Shell_Navigated"
	>
	<Shell.FlyoutHeaderTemplate>
		<DataTemplate>
			<Grid
				BackgroundColor="Black"
				HeightRequest="100">
				<!--<Image
					Aspect="AspectFill"
					Source="xamarinstore.jpg"
					Opacity="0.6" />-->
				<Label
					Text="MyApp"
					TextColor="White"
					FontAttributes="Bold"
					HorizontalTextAlignment="Center"
					VerticalTextAlignment="Center" />
			</Grid>
		</DataTemplate>
	</Shell.FlyoutHeaderTemplate>

	<ShellItem
		Route="onboarding">
		<ShellContent
			Route="welcome"
			ContentTemplate="{DataTemplate views:Welcome}" />
		<ShellContent
			Route="eula"
			ContentTemplate="{DataTemplate views:OnboardEula}" />
		<ShellContent
			Route="login"
			ContentTemplate="{DataTemplate views:OnboardLogin}" />
		<ShellContent
			Route="license"
			ContentTemplate="{DataTemplate views:OnboardLicense}" />
		<ShellContent
			Route="mapDownload"
			ContentTemplate="{DataTemplate views:OnboardMapDownload}" />
		<ShellContent
			Route="pickTruckProfile"
			ContentTemplate="{DataTemplate views:OnboardTruckProfile}" />
	</ShellItem>

	<FlyoutItem
		Route="main"
		Title="MyApp"
		FlyoutDisplayOptions="AsMultipleItems">
		<ShellContent
			Title="Home"
			Route="home"
			>
			<ShellContent.Icon>
				<FontImageSource
					FontFamily="fa-solid"
					Glyph="&#xf2b9;"
					Size="24"/>
			</ShellContent.Icon>
			<views:Dashboard />
		</ShellContent>
		<ShellContent
			Title="Map"
			Route="map"
			>
			<ShellContent.Icon>
				<FontImageSource
					FontFamily="fa-solid"
					Glyph="&#xf5a0;"
					Size="24"/>
			</ShellContent.Icon>
			<views:CustomMapPageTom />
		</ShellContent>
		<ShellContent
			Title="Alerts"
			Route="alerts"
			>
			<ShellContent.Icon>
				<FontImageSource
					FontFamily="fa-solid"
					Glyph="&#xf071;"
					Size="24"/>
			</ShellContent.Icon>

			<views:Alerts />
		</ShellContent>
		<ShellContent
			Title="Settings"
			Route="settings"
			>
			<ShellContent.Icon>
				<FontImageSource
					FontFamily="fa-solid"
					Glyph="&#xf0d1;"
					Size="24"/>
			</ShellContent.Icon>
			<views:Settings />
		</ShellContent>
	</FlyoutItem>
	<ShellContent
		Title="About"
		Route="about"
		Icon="img_home.png">
		<views:About />
	</ShellContent>
	<!--<ShellContent
		Title="Developer"
		Route="developer"
		Icon="img_home.png">
		<views:DeveloperPage />
	</ShellContent>-->
</Shell>

Each wizard ContentPage has:

	xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
	Shell.TabBarIsVisible="False"
	Shell.NavBarIsVisible="False"
	ios:Page.UseSafeArea="true"

Then in code use the following to go between pages.

`await Shell.Current.GoToAsync("//onboarding/mapDownload");

`

Steps to Reproduce

  1. Just running my startup wizard

Expected Behavior

The pages change 1 after the other until I hit the main screen.

Actual Behavior

On Android this works. On iOS after the 4th screen I get a More page for some reason:

image

The 2 options are active and go to the last 2 pages of the wizard. Also the bottom tab bar appears. They seem to have invisible items in them because tapping on them takes me to the first 4 pages in the wizard.

Not sure why.

Basic Information

  • Version with issue: Xamarin.Forms 4.7.0.1080
  • Last known good version: unknown - first run thru in iOS.
  • IDE: VS2019 16.6.4
  • Platform Target Frameworks: Android/iOS
    • iOS: 13.5
    • Android: 9.0
  • Nuget Packages: Xamarin.Essentials 1.5.3.2
  • Affected Devices: iOS emulator and iPhone 8

Screenshots

see above

Reproduction Link

Part of a larger project right now. Maybe somebody can see if there's something wrong in the shell code or explain why this works correctly on Android and not the same on iOS.

Workaround

None yet. I'll try and extract out a separate project to show this, but I think this is a Form Shell on iOS thing. Just looking for guidance.

tschlarman avatar Jul 15 '20 18:07 tschlarman

@PureWeen

jsuarezruiz avatar Jul 16 '20 08:07 jsuarezruiz

Same problem, any fix?

Basic Information Version with issue: Xamarin.Forms 5.0.0.2012+671-sha.68c17772d-azdo.4465181 IDE: VS2019 16.11.0 Platform Target Frameworks: Android/iOS iOS: 12.5.4 Nuget Packages: Xamarin.Essentials 1.6.1 Affected Devices: iOS device

cbsCr avatar Aug 19 '21 19:08 cbsCr

I had to break my wizard up into 2 parts and just link one to the next. That made it work and now looks the same on both platforms.

tschlarman avatar Aug 19 '21 21:08 tschlarman

Similar issue on Maui...

ghost avatar Jun 08 '22 15:06 ghost