This is an issue that a couple customers have run into and emailed us on, so we wanted to post more about it.
Scenario
The scenario is that you drag a Ribbon onto a Window and everything shows up fine at design-time. But when you go to run your application, you see a blank Window.
Why Did It Disappear?
What happened was that you probably clicked and dragged something somewhere in the Visual Studio designer that either:
- Set the Width or Height of the Ribbon to an explicit size (very bad)
- Set the Margin around the Ribbon to something that forces it to have a smaller than desired size
- Did the above things to a direct container of Ribbon that affects its size
At run-time a feature of Ribbon is to collapses when there is not enough space for it. You have full control over the threshold size at which this collapse occurs. But one of the items in the list above would have caused this collapse code to kick in because the Ribbon is being forced smaller than desired.
Resolution
To fix this problem, simply look at the XAML for your Ribbon tag and remove any Width/Height property settings. Also check to ensure that a Margin isn't set that could be causing this. Then run your application and everything should appear like you would expect since now the Ribbon is not being forced to a small size.
Why Does It Show at Design-Time?
In the designer we force Ribbon to stay expanded and ignore its normal run-time collapse behavior. This is done so that you can properly visually design the Ribbon.
Further Reading
We also have a section explaining this issue in the Ribbon control's Troubleshooting topic in the product documentation.