Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Updating shell Tab title doesn't work via Hot Reload / code behind #15659

Closed
Tracked by #14032
BretJohnson opened this issue Jun 14, 2023 · 2 comments · Fixed by #16593
Closed
Tracked by #14032

Updating shell Tab title doesn't work via Hot Reload / code behind #15659

BretJohnson opened this issue Jun 14, 2023 · 2 comments · Fixed by #16593
Assignees
Labels
area-controls-shell Shell Navigation, Routes, Tabs, Flyout area-tooling XAML & C# Hot Reload, XAML Editor, Live Visual Tree, Live Preview, Debugging delighter fixed-in-8.0.0-rc.1.9171 Look for this fix in 8.0.0-rc.1.9171 p/2 Work that is important, but is currently not scheduled for release partner/hot-reload-xaml Issues impacting XAML Hot Reload experiences t/bug Something isn't working
Milestone

Comments

@BretJohnson
Copy link
Member

Description

When using Tabs in Shell and updating the Title, the updates aren't reflected in the app using Hot Reload, not until something else triggers a refresh of the page.

@YBTopaz8 mentioned this on a customer call with me, as one of the features he sees that doesn't work with Hot Reload. It happens in his full app here: https://github.com/YBTopaz8/FlowHub-MAUI and I reproduced the problem with the steps below.

Steps to Reproduce

  1. Do File / New Project / MAUI App
  2. Open AppShell.xaml and replace the contents with following, to create multiple FlyoutItem Tabs
    <FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
        <Tab Title="Home"
             Shell.TabBarIsVisible="True">
            <ShellContent Title="Home Page"
                          ContentTemplate="{DataTemplate local:MainPage}" />

        </Tab>

        <Tab Title="Flow Outs">
            <ShellContent Title="Manage Expenditures"
                          ContentTemplate="{DataTemplate local:MainPage}" />
        </Tab>
    </FlyoutItem>
  1. Debug the app to use Hot Reload. I reproduced the problem on Windows, but I expect it happens on all platforms.
  2. Note that tabs display properly
  3. Update the tab titles, for example changing them to Home2 and Flow Outs2

Result:
The tab title updates are applied in the app. However, if you navigate to a new tab to refresh the UI, you see the updates.
Normally this behavior means that the property update was applied fine via Hot Reload, but there's an issue on the MAUI SDK side where it doesn't trigger the UI refresh for it. Normally, this type of problem also happens when changing the property via code behind (which does the same thing as the Hot Reload code) - I didn't actually test that to confirm, but it's the probably the case.

Link to public reproduction project repository

n/a

Version with bug

7.0.86

Last version that worked well

Unknown/Other

Affected platforms

I was not able test on other platforms

Affected platform versions

net7.0-windows10.0.19041.0, though likely all platforms are affected

Did you find any workaround?

No response

Relevant log output

No response

@BretJohnson BretJohnson added t/bug Something isn't working partner/hot-reload-xaml Issues impacting XAML Hot Reload experiences labels Jun 14, 2023
@YBTopaz8
Copy link

Hi Bret!
Thanks a lot for the mention, it was very informative talking to you!

As I read, you haven't been able to test of other platforms (yet), so I fired one of my other .NET MAUI projects on Android and tested this issue.
I can report that HOT RELOAD works very very well when changing title in AppShell on ANDROID.
Below is a video that can confirm what I'm saying.
Each time that I press CTRL+S, the UI (shell) refreshes entirely.

I Hope this helps guide the team when tackling this issue!
I can say that it seems to be an issue with Windows.
Unfortunately I don't have the means to test on iOS and Mac Catalyst.

Best,
Yvan Brunel

hr.ANDROID.mp4

@Eilon Eilon added the area-controls-shell Shell Navigation, Routes, Tabs, Flyout label Jun 16, 2023
@drasticactions
Copy link
Contributor

Yes, this is an MAUI bug.

image

image

The underlying WinUI Navigation item has a binding context to the abstracted MAUI control, and that is not updated until the tab view is reinvoked (so, navigating). You can replicate that with C# Code behind, and inspecting the MAUI view shows that the text was updated fine. So this is a MAUI bug.

@BretJohnson BretJohnson self-assigned this Jun 27, 2023
@samhouts samhouts added this to the .NET 8 GA milestone Jul 14, 2023
@samhouts samhouts added the area-tooling XAML & C# Hot Reload, XAML Editor, Live Visual Tree, Live Preview, Debugging label Jul 14, 2023
@spadapet spadapet added the p/2 Work that is important, but is currently not scheduled for release label Jul 21, 2023
@jsuarezruiz jsuarezruiz self-assigned this Aug 7, 2023
@jsuarezruiz jsuarezruiz moved this from Todo to In Progress in MAUI SDK Ongoing Aug 8, 2023
@github-project-automation github-project-automation bot moved this from In Progress to Done in MAUI SDK Ongoing Aug 25, 2023
@samhouts samhouts added the fixed-in-8.0.0-rc.1.9171 Look for this fix in 8.0.0-rc.1.9171 label Sep 12, 2023
@ghost ghost locked as resolved and limited conversation to collaborators Oct 12, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area-controls-shell Shell Navigation, Routes, Tabs, Flyout area-tooling XAML & C# Hot Reload, XAML Editor, Live Visual Tree, Live Preview, Debugging delighter fixed-in-8.0.0-rc.1.9171 Look for this fix in 8.0.0-rc.1.9171 p/2 Work that is important, but is currently not scheduled for release partner/hot-reload-xaml Issues impacting XAML Hot Reload experiences t/bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

7 participants