Ribbon buttons from the BackStage are not serialized with Ribbon.SerializeQuickAccessToolBarItems();

It seems that somehow it finds a content control as the parent of the backstage even though it should be the ApplicationMenu.

<ribbon:Ribbon.ApplicationMenu>
<tabs:Backstage />
</ribbon:Ribbon.ApplicationMenu>

So the path is like this:

ribbonButton -> BackStage -> ContentControl -> Grid -> AdornerDecorator -> null

Hello,

I don't believe the Ribbon code was ever intended to support Backstage buttons being placed in the quick access toolbar, so I'm not sure how this would have been working before.  Can you provide more information on what you were putting in the QAT from the Backstage as a source and how you achieved it?

In regards to control hierarchy, the Backstage control ends up getting hosted in an overlay layer in WindowChrome's Window template.  Overlays are presented within a ContentControl whose parent is a Grid and whose parent is an AdornerDecorator.  That hierarchy is within the WindowChrome Window template.

Hi!

I have something like this structure:

<ribbon:Ribbon>
  <ribbon:Ribbon.ApplicationMenu>
    <ribbon:Backstage>
      <ribbon:BackstageTab>
        <ribbon:TaskTabControl>
          <ribbon:TaskTabItem>
            <StackPanel>
              <ribbon:Button />
            </StackPanel>
          </ribbon:TaskTabItem>
        </ribbon:TaskTabControl>
      </ribbon:BackstageTab>
    </ribbon:Backstage>
  </ribbon:Ribbon.ApplicationMenu>
</ribbon:Ribbon>

That button can be seen in the Customize QAT, under the Application Menu category, it can be added to the QAT and is working from there. The only problem is that it will not be serialized. Only the serialization does not work. The problem seems to be when creating the path to the control because the ribbon is not a parent of the BackStage even though in code it looks to be.

Kind regards,

Daniel

In the Customizing the QAT sample project I can also see the Application menu buttons. I would assume that if I select buttons from there, those buttons should be serialized correctly when calling the Ribbon.SerializeQuickAccessToolBarItems(); method.

I found an older version which was using actipro packages version 19 and this was working. This is what it was serialized:

<RibbonControlPath Capacity="4">
  <RibbonControlPathItem Id="{assembly:Null}" Label="{assembly:Null}" Type="mwmsguivt:Backstage" />
  <RibbonControlPathItem Id="OptionsButton" Label="Options" Type="ribbon:Button" />
</RibbonControlPath>

so I would suppose this is a regression.

And for the button described above:

<RibbonControlPath Capacity="8">
  <RibbonControlPathItem Id="{assembly:Null}" Label="{assembly:Null}" Type="mwmsguivt:Backstage" />
  <RibbonControlPathItem Id="{assembly:Null}" Label="{assembly:Null}" Type="ribbon:BackstageTab" />
  <RibbonControlPathItem Id="{assembly:Null}" Label="{assembly:Null}" Type="ribbon:TaskTabControl" />
  <RibbonControlPathItem Id="{assembly:Null}" Label="{assembly:Null}" Type="ribbon:TaskTabItem" />
  <RibbonControlPathItem Id="{assembly:Null}" Label="{assembly:Null}" Type="av:Grid" />
  <RibbonControlPathItem Id="{assembly:Null}" Label="{assembly:Null}" Type="av:StackPanel" />
  <RibbonControlPathItem Id="{assembly:Null}" Label="{assembly:Null}" Type="av:DockPanel" />
  <RibbonControlPathItem Id="{assembly:Null}" Label="Create Presentation" Type="ribbon:Button" />
</RibbonControlPath>

One other small problem is related to the RibbonControlReference constructor. Somehow it loses the ImageSource.

On the customize QAT example when I press the add button it will create a clone button and add it inside the availableQatItemsListBox but over there it has no Image.

A workaround looks something like

// Clone the selected control and add it to the QAT items list
UIElement clonedControl = controlRef.Clone();
var newRibbonControlReference = new RibbonControlReference(clonedControl);

// Workaround - the image is not cloned for some reason
newRibbonControlReference.ImageSource = controlRef.ImageSource;

Hello,

There are several related things being discussed here so allow me to summarize them.

1) Backstage was never supposed to have its items supported in the QAT.  I checked v19.1 and did see that the menu items of a popup button did incorrectly allow the Add to QAT menu item to filter through on its context menu, but that option wasn't supposed to be there and in more recent versions does not show up.

2) Backstage is set via the Ribbon.ApplicationMenu property, but it's important to know that it is not the same as an ApplicationMenu control, and it has very different capabilities.  Backstage overlays the entire window, compared to ApplicationMenu, which is a more classic smaller popup.

3) ApplicationMenu (not Backstage) supports items being added to the QAT in both v19.1 and in today's version.  Those are the items you see in the "Application Menu" category in the Customizing the QAT sample.  When you add those items to the QAT, click Apply Changes, click Save QAT State, and then click Load QAT State, you see them reappear.  But again, per #1, this was not intended to be supported for controls on Backstage.  It's only meant for classic ApplicationMenu control items.

4) In your last reply, you mentioned images not showing up in the right-side ListBox for some items from the Application Menu category.  That is because the ImageSource property is only copied for controls with ImageSourceSmall defined.  A number of the items in that particular sample's Application Menu only have ImageSourceLarge defined and not ImageSourceSmall.  If you add an ImageSourceSmall property onto all those, you should see the images.

I hope that clarifies things.

Assuming I really need this working, it is somehow a way to make it work?

I would not want to remove functionalities which were working before the migration to the new libraries.

Hello,

Which exact v19.1 build were you using?  I tried putting a ribbon:Button on a Backstage tab in v19.1.0687 (latest v19.1 maintenance release) to see if I could add it to the QAT and there is no context menu option to do so in that version for me.  The only Add to QAT option in a context menu I can find in that version is for a menu item off a popup button, which was subsequently blocked in later versions since that wasn't supposed to be allowed.  Perhaps you can tell us how you are making Add to QAT functionality available for a standalone ribbon:Button on a Backstage tab in that version 19.1.0687?

Hi!

The version is indeed 19.1.0687 and I add the buttons via the Customize QAT like in the Sample Application.

I implemented the same as in the Customize QAT example. It finds all the ribbon buttons which are on the Backstage and add them in the Application Menu category and from there I can add them to the QAT. The serialization and deserialization also works corectly.

Kind regards,

Daniel

Fot the images not showing in the Customize QAT. I can see the image on the left collection (available qat items list box) but after I press the button to add on QAT, I can see the button on the left collection (QAT items list box) has no image. This seems to happen only for ribbon split buttons. For normal ribbon buttons the image seems to be there.

Kind regards,

Daniel

Hello,

Here is what I tried just now.  In v23.1, I opened the Customizing the QAT sample's MainControl.xaml and updated the Ribbon.ApplicationMenu to be:

<ribbon:Ribbon.ApplicationMenu>
    <ribbon:Backstage>
        <ribbon:BackstageTab>
            <ribbon:TaskTabControl>
                <ribbon:TaskTabItem>
                    <StackPanel>
                        <ribbon:Button ImageSourceSmall="/Images/Icons/Bold16.png" Label="Bold2" />
                    </StackPanel>
                </ribbon:TaskTabItem>
            </ribbon:TaskTabControl>
        </ribbon:BackstageTab>
        <ribbon:Button ImageSourceSmall="/Images/Icons/Italic16.png" Label="Italic2" />
    </ribbon:Backstage>
</ribbon:Ribbon.ApplicationMenu>

Then I ran the sample and did these steps:

• Changed category to "Application Menu".
• Added "Bold2" using "Add" button.
• Added "Italic2" using "Add" button.
• Clicked "Apply Changes" button.
• Clicked "Save QAT State" button.
• Removed "Bold2" and "Italic2" buttons from right list using "Remove" button.
• Clicked "Apply Changes" button.
• Clicked "Load QAT State" button and "Bold2" and "Italic2" reappeared as expected.

From those steps, it seems to work.  But that is because when the Ribbon isn't in a RibbonWindow, Backstage is still technically a child of the Ribbon.

Then I changed the sample to be in a RibbonWindow instead, which puts the Backstage in an overlay instead.  The overlay feature was part of v20.1 changes.  That is where the hierarchy is now different and the QAT serialization code didn't output the same thing.  We were able to update our code to work around this and get it to mimic the old way for QAT serialization.  That update will be in the next maintenance release v23.1.4.

For the images issue, if I scroll down in the "Home" category and add the "Underline" split button, I still see the Underline image in both lists.  Here we'd also need detailed steps to reproduce the issue if you still see one.  Thanks!

Hi!

Thank you!

About the images it seems that maybe the cloning is the issue.

UIElement clonedControl = controlRef.Clone();

The clonedControl has ImageSourceLarge and ImageSourceSmall null and also the HasImage flag is null for some reason.

The controlRef.Control ImageSourceLarge and ImageSourceSmall are not null.

For a ribbon button there is no problem, the only problem is for the ribbon SplitButton.

It might be that I am setting this values inside a Style?

Kind regards,

Daniel

Also the problem is only on the right collection, after the cloning, inside Customize QAT. If I save the QAT and open again the Customize QAT dialog, all the buttons will have correct images.

Hello,

Regarding the images, we still are not able to reproduce that issue in our Customizing the QAT sample.  Can you please give us exact steps in that sample to make it happen so that we can see what you see?  When we test, we see the image source properties being cloned properly in the unmodified sample.

Hi!

I seems that the problem was that all the image setters where behind data triggers. If I add a setter directly inside the Style it works.

Kind regards,

Daniel