Shell TitleView disappearing on tab change #9687
Comments
|
|
|
I had something similar where I had a Route assigned to a TabBar, but not the child tabs. Added those routes and it fixed the header title updating. It's refreshes slow if adding a new page to a stack, but it happens. |
|
We've moved this issue to the Backlog milestone. This means that it is not going to be worked on for the coming release. We will reassess the backlog following the current release and consider this item at that time. To learn more about our issue management process and to have better expectation regarding different types of issues you can read our Triage Process. |
|
Is there a workaround for this? this is pretty much a showstopper :/ |
|
@nebula2 Exactly! We cannot release as well until it fixed. Application title area has a vital information that has be visible always. |
Jeah i started with designing android . yesterday I got an iPhone to test how the app looks and it was horrible. Spent the whole day fixing the most basic things. I have a readme with a list of issues which is getting bigger and bigger. There are new issues which may be related to this one here. At least they sound like it. #10128 It's terrible that I cannot even change to something else on iOS (like showing simple text, or an icon or whatever) because no matter what you put into there - it will disappear or it will be outdated ( #6582 ). and seeing issues with "priority high" and "moved to backlog" has it's very own taste :-| |
|
@nebula2 |
|
@belmonmi I worked around it by not using shell at all. There are disadvantages and I had to rewrite a few parts of my app in order to get this working - but at least my journey can go on. |
|
@nebula2 thank you for the update. We are using Developer Express components; I will check if I can accomplish the same with what they provide. |
|
@belmonmi feel free to contact me if you struggle. A sorrow shared is a sorrow halved |
|
@belmonmi, @nebula2 I just added a workaround here, then remembered this issue. Looks like you might have found a workaround using some Syncfusion components. Unfortunately I was not able to use Syncfusion. I tested my workaround using the flyout and tabs and it appears to work. It is essentially the same except you would need to add a menu item to your TitleView to present the flyout. I have added an example of how to do this in the repro project in #9269, which I believe is a duplicate. |
Thank you for sharing. Better than my approach. I wrote some fancy stuff that instantiates views instead of pages to render stuff inside the SfTabView, where every tab item is a view and not a page. |
|
attached video shows a Shell TitleView on an iOS device while navigating between Tabs using .NET 7. Sometimes the Title doesn't appear at all, sometimes it moves up, approximately half way out of the window, and sometimes it renders fine. The same TitleView works always as expected on android. @rachelkang why is this in backlog? Can we expect a fix soon? It seems not possible to show anything else than a plain string in a Title on iOS using AppShell, which is the default template. RPReplay_Final1667995764.mov |
|
I fixed the issue by using a custom render for AppShell on iOS.
using CoreGraphics;
using Microsoft.Maui.Controls.Handlers.Compatibility;
using Microsoft.Maui.Controls.Platform.Compatibility;
using UIKit;
namespace DemoMauiApp.Platforms.iOS.Renderers;
public class CustomShellRenderer : ShellRenderer
{
protected override IShellPageRendererTracker CreatePageRendererTracker()
{
return new CustomShellPageRendererTracker(this);
}
protected override IShellNavBarAppearanceTracker CreateNavBarAppearanceTracker()
{
return new NoLineAppearanceTracker();
}
}
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;
}
public class NoLineAppearanceTracker : IShellNavBarAppearanceTracker
{
public void Dispose() { }
public void ResetAppearance(UINavigationController controller) { }
public void SetAppearance(UINavigationController controller, ShellAppearance appearance)
{
var navBar = controller.NavigationBar;
var navigationBarAppearance = new UINavigationBarAppearance();
navigationBarAppearance.ConfigureWithOpaqueBackground();
navigationBarAppearance.ShadowColor = UIColor.Clear;
navigationBarAppearance.BackgroundColor = UIColor.White; // Set the background color you want on the Shell NavBar
navBar.ScrollEdgeAppearance = navBar.StandardAppearance = navigationBarAppearance;
}
public void SetHasShadow(UINavigationController controller, bool hasShadow) { }
public void UpdateLayout(UINavigationController controller) { }
}
var builder = MauiApp.CreateBuilder();
builder
.UseMauiApp<App>()
.ConfigureMauiHandlers(handlers =>
{
#if IOS
handlers.AddHandler(typeof(Shell), typeof(DemoMauiApp.Platforms.iOS.Renderers.CustomShellRenderer));
#endif
});
I hope this helps others as well! Thank you |
|
Thank you, works like a charm! Also I would suggest to set the Backgroundcolor using a saved status, so stuff like AppThemeBinding should still work |
|
Woot! That fix worked for us. Thanks! |
|
@vhugogarcia , |
ghost
locked as resolved and limited conversation to collaborators
samhouts
added
the
fixed-in-8.0.0-preview.1.7762
Description
On iOS Simulator with Shell.FlyoutBehavior="Flyout" and Tabs, Shell.TitleView is disappearing on tab change.
Steps to Reproduce
Create new .Net MAUI project.
Add couple ContentPages.
Add "AppTitleView" ContentView
Edit AppShell.xaml to set Shell.FlyoutBehavior="Flyout"
Create couple FlyoutItem with Tab elements.
Add
<Shell.TitleView> <shellTitleView:AppTitleView /> </Shell.TitleView>to Content Pages
Run application, switch from "Tab 1" to "Tab 2"
Pages on the "Tab 1" will not show "Shell.TitleView", but if you named that TitleView control it still accesable from code behind.
Simple project to demostrate the behavior:
https://github.com/belmonmi/ShellTitleView
Version with bug
6.0.408
Last version that worked well
Unknown/Other
Affected platforms
iOS, I was not able test on other platforms
Affected platform versions
iOS 15.5
Did you find any workaround?
No
Relevant log output
The text was updated successfully, but these errors were encountered: