BackStage flickering when opening

[QuantumDeveloper]

I faced with the issue when Backstage is flickering in left top corner during opening.
OS - Win 7
.Net 4.5
Ribbon lib - 3.4

[batzen]

What do you mean with "flickering"?
On my machines it works perfectly fine.
Could you post a video of that issue?

[QuantumDeveloper]

https://onedrive.live.com/?cid=650F345C1F75A314&id=650f345c1f75a314%21105

Please, pay attention to the top left corner.

[batzen]

Indeed, it does flicker a bit.
Anyone willing to invest time fixing this?

[batzen]

A had some time to try this on my machines and there is no flickering.
I can see the flickering in your video but not on my machines.
Anyone else seeing this? Maybe it's related to some missing Windows updates or outdated/different video drivers?
In fact the whole left blue part is a single rect...

[QuantumDeveloper]

@batzen this could be, but I see it in my work and home PC with different GPU (nvidia, AMD)

[batzen]

The problem is that i can't fix such an issue when i can't reproduce it...
It really looks like an WPF issue instead of a Ribbon issue.

[batzen]

No one willing to invest time fixing this or at least creating a reliable repro?

[QuantumDeveloper]

Do you have any ideas why it could be flickering exactly in that place?

[batzen]

I guess it's the animation and the titlebar, but I don't know what's really causing this issue... As soon as the backstage is opened the titlebar, or parts of it, react to that change. Maybe it's one of the changes done to the titlebar that causes the flickering. You could try to reproduce the issue when you set "IsQuickAccessToolBarVisible" on the ribbon to "false". If the issue disappears we got a direction to follow. Walking through your video, picture by picture, I can see that the flickering area is opaque when the animation has not started yet and is opaque again when the animation is done.

[QuantumDeveloper]

Just checked IsQuickAccessToolBarVisible. Its not the toolbar. No matter if I set visibility to true or false. Problem still exists. Do you also have such issue?

[batzen]

As I said earlier I sadly can't reproduce it thus making fixing it extremely difficult.

[batzen]

Just commited some changes to the backstage animation, maybe it's better now.
Could you verify if it got better?

[QuantumDeveloper]

I need to compile latest version from sources?

[batzen]

Will release version 3.4.2 later which contains the changes.

[QuantumDeveloper]

ok, as soon as you release it, I will update, check and let you know

[batzen]

Released.

[QuantumDeveloper]

Just tested. Issue is still present. It flickers only in part, which is over a Quckaccesstoolbar.

[QuantumDeveloper]

And if I set it under the ribbon, backstage will still flicker on the same place (on top). So, I think we can exclude the quckaccess itself

[batzen]

At least we found out that it's not the toolbar...

[batzen]

Could you try to change the width in the style to check if it's just that small area?
You would have to edit line 206 in Office2013\Controls\BackstageTabControl.xaml just increase width to 500 instead of Auto.

[QuantumDeveloper]

OK, I will test it

[QuantumDeveloper]

Seems I underatnd why it is flickering. I have the following code on backstage:

 <fluent:Backstage >
                  <fluent:BackstageTabControl>
                     <fluent:BackstageTabItem Header="Открыть" DataContext="{Binding Path=RibbonViewModel.FileBrowserOpenViewModel}">
                        <fluent:BackstageTabItem.Content>
                              <ribbon:FileBrowserView />
                        </fluent:BackstageTabItem.Content>
                     </fluent:BackstageTabItem>
                     <fluent:BackstageTabItem Header="Импорт" DataContext="{Binding Path=RibbonViewModel.FileBrowserImportViewModel}">
                        <fluent:BackstageTabItem.Content>
                              <ribbon:FileBrowserView />
                        </fluent:BackstageTabItem.Content>
                     </fluent:BackstageTabItem>
                  </fluent:BackstageTabControl>

               </fluent:Backstage>

If I remove items, it opens without flickering, but if at least one item is present, it will flicker. Maybe something is going on while my custom controls is loading?

But i dont know how it can cause this.

[batzen]

I would guess so. Any chance you can provide them for a repro?

[QuantumDeveloper]

It will be hard to present you a full repro, but I will try

[QuantumDeveloper]

Hi, here is my repro project for this issue. Could you please look at it?
https://onedrive.live.com/?id=650F345C1F75A314%21105&cid=650F345C1F75A314&group=0

[batzen]

That indeed flickers really heavy. Will try to find out what's causing it, but that will take some time as I am away for the weekend.

[QuantumDeveloper]

I hope you will fix this nasty bug

[batzen]

It's the datagrid. But I don't know why...

[QuantumDeveloper]

I know only one reason for flickering UI - its async UI updating.

[wstaelens]

i have the same issue, glad I'm not the only one! :-)

[wstaelens]

I have found that when the first BackstageTabItem is selected in the BackstageTabControl then it is flickering, when the second or other BackstageTabItem is selected when showing/hiding the backstage it is not flickering.

[QuantumDeveloper]

Its not the showcase. I think real problem is that what actually hides under the tabitems. In my case I have the same controls under first and second items and in both case I have flickering

[wstaelens]

(old thread: #29 )

[floele-ww]

I can see the same issue. I don't really understand the reason why it flickers, but it would work if you made the following changes (Office 2013 theme):

1. Reduce top offset in BackstageAdorner by TitlebarHeight (25)
2. Then remove negative margin of the sidebar grid in BackstageTabControl.xaml (as far as I can see the negative margin is the source of the issue)
3. Increase the top margin of the Grid that hosts the backstage content by TitlebarHeight (25) and set the background color to BackstageBackgroundBrush
4. Remove background color of "grid" (otherwise the title bar won't be visible)

That retains the look of the backstage area while removing the flicker.

[batzen]

Will have a look at your suggested changes.
Would be easier if you had created a PR for your changes and include changes for all themes.

[batzen]

Could you please post the changes you made? It's quite difficult to follow those instructions.
Feel free to just post the whole code and xaml file here.

[batzen]

Fixed with 909cf12