xamarin/Xamarin.Forms

[Bug] Shell - Navigation.PushAsync - Navigation Bar ignored on iOS

Open

#6,604 opened on Jun 20, 2019

View on GitHub
 (8 comments) (2 reactions) (0 assignees)C# (5,644 stars) (1,926 forks)batch import
a/shell :shell:a/templatese/1 :clock1:good first issuehacktoberfest 🍻help wantedinactivep/iOS 🍎t/bug :bug:up-for-grabs

Description

Description

I created a new Xamarin Forms project using the Shell Template. From the ItemsPage, when navigating to the detail page using await Navigation.PushAsync(new ItemDetailPage(new ItemDetailViewModel(item))) the detail ContentPage ignores the Shell Navigation Bar on iOS.

Steps to Reproduce

  1. Create new Mobile App (Xamarin Forms) project in Visual Studio (Windows) 16.1.3
  2. Select 'Shell' template
  3. Run solution (iOS + Android)
  4. Click an item in the 'Browse' screen

Expected Behavior

I expected the Item Detail page to respect the page boundaries and show all content below the Navigation Bar

Actual Behavior

On iOS the top of the Item Detail page is displayed underneath (hidden by) the Navigation Bar.

Comments

I tried changing the code to use a registered route and to use the Shell.Current.GotoAsync("itemdetail") approach but this also failed to show the page correctly.

As an aside, I note that the 'Add' function uses await Navigation.PushModalAsync(new NavigationPage(new NewItemPage())) to show a navigation bar for the user to back out of the modal dialog, it seems to me that under the shell model the NavigationPage shouldn't be needed, the target page should have to opt out of the shell navigation bar using Shell.NavBarIsVisible="false".

Please can we have detailed guidance on how to handle these options when using Shell.

Basic Information

  • Version with issue: 4.0.0.425677
  • Last known good version: n/a
  • IDE: Visual Studio Pro (WindowS) 2019 v 16.1.3
  • Platform Target Frameworks:
    • iOS: 12.2
    • Android: 9.0 - API 28
  • Android Support Library Version: ?
  • Nuget Packages: 4.0.0.425677
  • Affected Devices: Running in Simulators (though checked iOS device and same issue)

Same behaviour seen on 4.1.0 pre2

Screenshots

image image

Contributor guide

Tech stack
csharp
Domain
mobile
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Basic knowledge of Xamarin.Forms Shell navigationAccess to iOS simulator
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
30
Research direction
The issue involves Shell's PushAsync not respecting the navigation bar on iOS. Examine Shell's iOS renderer to understand how page frames are set. Check if NavigationPage is incorrectly bypassed when using PushAsync in Shell. Look at the native iOS view hierarchy to see if the detail page's top inset is not being adjusted for the navigation bar. Consider reviewing similar issues or PRs in the repository.