Shell TitleView Not Working in iOS 16 [Bug] #15512
Comments
|
Just wanted to second this issue. I see the same thing, and it breaks functionality in an app I have in the App Store. Using these versions: |
|
I also have this issue, is there a workaround? I feel this should be a high priority as iOS 16 should roll out in September. |
|
I believe this may be a related issue mentioned here from a native Xcode perspective: https://developer.apple.com/forums/thread/712461 Anyway, below is a custom renderer that gets the TitleView showing for me again (and it may just happen to work because of something else I'm doing, not sure). YMMV, this is not well tested at all, and is definitely more of a hack than a long term solution. And there's probably a much cleaner/easier way to do this. I based it off some code from I also agree this should be a high priority issue to fix. Here's the hacky custom renderer: [assembly: ExportRenderer(typeof(Shell), typeof(CustomShellRenderer))]
namespace Your.Namespace.Here
{
public class CustomShellRenderer : ShellRenderer
{
protected override IShellPageRendererTracker CreatePageRendererTracker()
{
return new CustomShellPageRendererTracker(this);
}
}
public class CustomShellPageRendererTracker : ShellPageRendererTracker
{
public CustomShellPageRendererTracker(IShellContext context)
: base(context)
{
}
protected override void UpdateTitleView()
{
if (ViewController == null || ViewController.NavigationItem == null)
return;
var titleView = Shell.GetTitleView(Page);
if (titleView == null)
{
var view = ViewController.NavigationItem.TitleView;
ViewController.NavigationItem.TitleView = null;
view?.Dispose();
}
else
{
var view = new CustomTitleViewContainer(titleView);
ViewController.NavigationItem.TitleView = view;
}
}
}
public class CustomTitleViewContainer : UIContainerView
{
public CustomTitleViewContainer(View view) : base(view)
{
TranslatesAutoresizingMaskIntoConstraints = false;
}
public override CGSize IntrinsicContentSize => UILayoutFittingExpandedSize;
}
}
Edit: updated with the version I've been using. |
|
Just wanted to add, this isn't caused by new tooling. This issue with the TitleView also occurs on a build with older tools on iOS 16. Just tested on the below versions, and a custom TitleView also does not work on iOS 16 when built with the below: Xcode 13.4.1 |
|
@adam-russell Thank you for the workaround!! It worked great! the only issue I have with the workaround is my TitleView is not bottom aligned rather than centered vertically. Any tidbits on getting that to center using your Renderer? Thanks! |
|
@bobbydharrell So this code (adapted from the example in this issue, but with a red background on a Grid to see the space occupied by the TitleView): <Shell.TitleView>
<Grid VerticalOptions="Center" HeightRequest="44" BackgroundColor="Red">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Label TextColor="Orange"
FontSize="Large"
FontAttributes="Bold"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center"
Text="test 2 - 2 test 2 curious">
</Grid>
</Shell.TitleView>
Shows a TitleView like this: Not sure if that's similar to the bottom alignment you're mentioning? Because the shell menu icon doesn't appear to itself be centered. It does seem the text in the TitleView can be centered OK in this way, but maybe not inside the frame you'd expect. I'm also not sure why I had to set the HeightRequest on the Grid above to get it to work correctly. The one I'm dealing with in a real application doesn't have the HeightRequest set, but works OK. The sizing in Xamarin Forms is often confusing to me. (As an aside, the horizontal alignment is also an issue with the Grid example I used above.. if using a Grid that way in a TitleView, I would personally hack it by adding another column at the end.. which probably isn't the right way to do it.) |
|
@adam-russell Thanks! I was just thinking it is probably centering but the height is more than what is actually there for some reason.
And yes, the Horizontal Alignment is trash on a Custom TitleView. The menu button seems to be part of the space and pushed the Title over. I wrote custom adjusters using columns with nothing in them to get it centered per platform per idiom. It's gross but effective. Be nice if they fixed that also LOL Code for Horizontal Alignment: This allows me to center the title as the Title control is pushed by the Menu Button This is to provide a buffer for the menu button for alignment |
|
Can we get an update on this issue? All Xamarin apps that use Shell TitleView are now functionally broken in iOS 16 - the content won’t show. If you have important navigation features your Shell TitleView it’s a big problem. |
|
@mphill we have a working workaround using a iOS Renderer above so that you can get your apps back up and running. |
|
To anyone using the fix from @adam-russell (thank you so much). If the TitleView is still blank, make sure you specify a You can also try Otherwise the content will sort of slide down behind and not show. Hopefully this gets fixed soon! |
|
occurring on builds using Xcode 13.4.1 |
jsuarezruiz
added
a/shell 🐚
p/iOS 🍎
and removed
s/unverified
|
same issue here |
|
should i wait for a fix? or Maui is our everything... |
|
Hi. We have implemented the workaround proposed by @adam-russell and now our app is fixed in Prod. |
Will be a fix in Xamarin.Forms and of course also changed on .NET MAUI. |
|
@jsuarezruiz I might be wrong, but doesn't |
|
This fix causes my titleview to be visible again, but its shifted up compared to the old appearance. and when implemented with a SegmentedControl I'm using off nuget, appears to be missing until I switch segments. In this video you can see the My Activity Title should be visible on page load and its not. And in the existing Forms implementation, showing/hiding the visibility of an imagebutton in the titleview's horizontal stacklayout shifts the title label. RPReplay_Final1663257250.MP4.mp4Basically, while this fix somewhat resolves the issue of a completely missing titlebar, its not restoring the same layout and sizing that was present previously. we have a Searchbar control in another page's titleview and that's also not sizing as before.
|
|
@edgiardina Yeah, the workaround definitely isn't quite right. I think there may be some differences in the underlying iOS TitleView, too, since I can't get it to be as wide as it was in previous iOS versions. In my particular implementation, I have different hacks in it that are dependent on iOS version to shift it around. The current Xamarin.Forms implementation has extra code for sizing, but I think it's what's breaking the TitleView in iOS 16. That's stripped out of the custom renderer, but the Height in particular is often a problem, and I certainly don't understand why it works sometimes without having to force a HeightRequest/etc. You could maybe try to set a static HeightRequest on your TitleView that's missing until the SegmentedControl is switched or maybe set the orientation as others have mentioned above? Just a guess, and I agree it probably shouldn't be needed. On the image button, personally I would use a Grid rather than a StackLayout and set the width of the column containing the image button to a static value. I would sort of expect the StackLayout to shift when setting visibility of one of its children. I use Grids because the TitleView has changed sizing multiple times in the time I've been using Xamarin Forms, and I've unfortunately changed sizing hacks in it multiple times as new versions of Xamarin Forms are released. Sorry that's probably not super helpful, but just some thoughts. |
|
@adam-russell that's actually really helpful. Luckily we are only using titleviews in 5 of our 40+ views so I will try hacking some heights or converting them to grids to see how it renders. These are good suggestions. |
|
I can confirm on our large app with tens of thousands of users that the CustomShellRenderer from @adam-russell works in iOS 16 |
|
I'm seeing the same as @npostma - using version 5.0.0.2545 - note that it is now also an issue on Android as well. Below is my TitleBarView.xaml (its fairly simple its display one of 2 images for connection status and 2 labels). |
|
Why isn't this reopend yet? It it still broken on the latest xamarin. Als @michaelonz porting to MAUI wont save you. I am porting my app from xamarin to MAUI, and there the issue is exactly the same. I hoped MAUI would fix some issues i am having with Xamarin, but alas. There it is still open: |
|
As a workaround you can set Shell.NavBarIsvisible to false and just create your own titleview. That works in Xamarin.Forms and MAUI. |
Sometimes i used the title property but mostly I (already) use the TitleView. Like so: I had |
|
@npostma |
And then on your page use it like this
hope this makes sense now. Like I initially said create at least one more ControlTemplate for those pages without back navigation, add your hamburger menu and create as many more templates as you like. You also have to add the NavigateBackCommand in your BaseViewModel which should just be something like Shell.Navigation.GoToAsync(“..”) or whatever type of navigation you use. In my example I also have a LoadingIndicator and a PostingIndicator which are in my BaseViewModel as bool properties. |
|
Hi all, the issue is still present.. When will an official fix be ready? The custom renderer is a great patch for no, however when migrating to MAUI when MAUI is "ready" for us all. The customer renderers will cause a real nightmare in the migration process.. @jfversluis is there an official fix on the horizon? (p.s - huge fan of your YT channel) |
|
Hi Xamarin team - One thing that I have noticed that may help with a fix - if you have a tab page with tab pages within it then the titlebar will always draw correctly - so having the tabpage children appears to cause some sort of re layout call that resolves the issue...maybe that could help find a fix that isn't a lot of work.....just thought i would mention it as its consistent - in my app i have 5 tab pages , within one of them i have 3 children tab pages.....the page with the children will always draw the title bar correctly - all the others are hit and miss. |
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
|
@adam-russell Thank you for sharing your custom renderer with us all. It solves the issue for now. I just hope Microsoft provide us with an actual fix. Kind regards, Rob |
|
looks like this is now fixed on Maui dotnet/maui#12834 |
|
Hi @jfversluis I've tested the fix, but for me its better, but not quite correct. Red is the container, green the label. What ever i do the container always behaves like this. I can change heightrequest, verticalOptions, margins, paddings but the behavior is always the same, container is first stretched and the second, third, etc time tightly wrapped around the label. Also it does not matter if i use a stacklayout or a grid, outcome is always the same.
I use this simple layout as header: Style: [EDIT] |
|
This Custom renderer works a treat for me. However, I already had another Custom Renderer in place to show badges on Tab Icons. Is there any way to combine the two or to add both renderers and have them both work? When I add them both in the MauiProgram, only the second one takes effect. |
|
@EddieBhoy Yes, you should just be able to merge the code manually from both custom renderers into a single custom renderer (so that you only have one custom renderer for |
|
Thanks Adam - worked a treat - I now have a Titlebar logo and Tab Badges! |
|
We found a solution that works for us. Our case:
What fixed it (combination of things)
`
|
ehi you saved my day, it seems it works like a charm. I don't know if it's the best solution but anyway right now, it's working |
|
It works for static content, unfortunately not for buttons or click behaviours. |
I have buttons on mine and they work fine. Share some code. |
|
Thank you all. |
|
It's still not working for me |
Did you try the work around we posted? Most all of us have prolly been busy porting to MAUI recently lol. Post a code snippet and we can have a look. |
I tried the workaround, indeed and it didn't work for me. No, I get you're all busy with MAUI, don't worry, and I respect that 😊, I just wanted to let people know that I'm still facing the issue. |
|
Hi there, Since we have a workaround, (that doesn't work for me personally), do we know what is exactly causing the issue? 🙂 |
and others
Description
Shell content is not visible within a TitleView when testing against iOS 16.
https://github.com/mmholtman/xamarinios16bug.git
Steps to Reproduce
Expected Behavior
The title is visible on the view
Actual Behavior
The title is not visible on the view
Basic Information
Environment
The text was updated successfully, but these errors were encountered: