Databases
StackOverflow2013
Postsdbo
POHow do I bind a Ribbon control to my ViewModel?
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow do I bind a Ribbon control to my ViewModel?
    primarykey
    data
    text
    <p>I've been struggling since yesterday to build a (what I thought) simple Ribbon on WPF, using MVVM. I found quite a few links on the internet (and on Stack Overflow), but none could really solve my problem.</p> <p>In a nutshell my question is: <strong>Am I doing it wrong, or is it just plain impossible to bind a Ribbon to a ViewModel like I'm doing?</strong></p> <h2>In Details:</h2> <p>This is my model for the menu: Each <em>MenuGroup</em> should be rendered as a <em>RibbonGroup</em>, and <em>MenuGroup</em> contains a collection of <em>MenuItem</em> which should be rendered as a <em>RibbonButton</em> (inside their respective <em>RibbonGroup</em> of course).</p> <pre><code>using Caliburn.Micro; namespace MyCompany.Poc.Wpf.Models { public class MenuGroup { public MenuGroup() { Items = new BindableCollection&lt;MenuItem&gt;(); } public string Name { get; set; } public IObservableCollection&lt;MenuItem&gt; Items { get; set; } } } using System.Windows.Input; namespace MyCompany.Poc.Wpf.Models { public class MenuItem { public MenuGroup Group { get; set; } public string Name { get; set; } public string Link { get; set; } public ICommand OpenMenuUrl { get; set; } } } </code></pre> <p>My ViewModel just contains a collection of those MenuGroup, for the binding on the XAML:</p> <pre><code>public IObservableCollection&lt;MenuGroup&gt; LegacyMenuItems { get { return _legacyMenuItems; } } </code></pre> <p>The collection is populated (for the time being) as soon as the VM is instanciated, with fake data):</p> <pre><code>var group1 = new MenuGroup(); group1.Name = "Group 1"; var group2 = new MenuGroup(); group2.Name = "Group 2"; group1.Items.Add(new MenuItem {Group = group1, Link = "http://www.google.co.uk", Name = "Link 1", OpenMenuUrl = OpenMenuUrl}); group1.Items.Add(new MenuItem {Group = group1, Link = "http://www.google.co.uk", Name = "Link 2", OpenMenuUrl = OpenMenuUrl}); group2.Items.Add(new MenuItem {Group = group2, Link = "http://www.google.co.uk", Name = "Link 3", OpenMenuUrl = OpenMenuUrl}); group2.Items.Add(new MenuItem {Group = group2, Link = "http://www.google.co.uk", Name = "Link 4", OpenMenuUrl = OpenMenuUrl}); LegacyMenuItems.Add(group1); LegacyMenuItems.Add(group2); </code></pre> <p>Now the XAML:</p> <pre><code>&lt;my:Ribbon DockPanel.Dock="Top"&gt; &lt;my:RibbonTab Header="Legacy A.I." ItemsSource="{Binding LegacyMenuItems}"&gt; &lt;my:RibbonTab.ItemTemplate&gt; &lt;DataTemplate&gt; &lt;my:RibbonGroup Header="{Binding Name}" ItemsSource="{Binding Items}"&gt; &lt;my:RibbonGroup.ItemTemplate&gt; &lt;DataTemplate&gt; &lt;my:RibbonButton Label="{Binding Name}" Command="{Binding OpenMenuUrl}" CommandParameter="{Binding Link}"&gt;&lt;/my:RibbonButton&gt; &lt;/DataTemplate&gt; &lt;/my:RibbonGroup.ItemTemplate&gt; &lt;/my:RibbonGroup&gt; &lt;/DataTemplate&gt; &lt;/my:RibbonTab.ItemTemplate&gt; &lt;/my:RibbonTab&gt; &lt;my:RibbonTab Header="Static"&gt; &lt;my:RibbonGroup Name="Administration" Header="Admin"&gt; &lt;my:RibbonButton Label="Stuffs" Command="{Binding Path=OpenMenuUrl}" CommandParameter="http://www.mycompany.com/somelink"&gt;&lt;/my:RibbonButton&gt; &lt;my:RibbonButton Label="Google" Command="{Binding Path=OpenMenuUrl}" CommandParameter="http://www.google.co.uk"&gt;&lt;/my:RibbonButton&gt; &lt;/my:RibbonGroup&gt; &lt;/my:RibbonTab&gt; &lt;/my:Ribbon&gt; </code></pre> <p>And what it renders: <img src="https://i.stack.imgur.com/lvJKh.png" alt="Doesn&#39;t look right, does it..."> <img src="https://i.stack.imgur.com/rcl5Z.png" alt="Statically loaded, works like a charm..."></p> <p>As you can see, the "Static" tab works well and the "title" for the ribbon group ("Admin") is displayed at the right place.</p> <p>Now, the "Legacy A.I." tab, <strong>has no buttons</strong> (there should be 2 buttons in each group), and the RibbonGroup titles are displayed funny (<strong>below where they should be</strong>).</p> <p>If you have any clue on what I'm doing wrong here, please tell me :) I'm very new on the WPF world, so I obviously don't understand templating properly...</p> <p>A few facts to help you make a call: - The Model is loaded correctly, since we can see "Group 1" and "Group 2" which are part of the fake data loaded in the ViewModel - I tried Telerik's RadRibbon and it behaves exactly the same! So unless they are BOTH wrong at the same place, the problem must comes from me</p> <p>Good night and good luck :)</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USWill
    1. USAntoine Jaussoin
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POHow do I bind a Ribbon control to my ViewModel?
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POHow do I bind a Ribbon control to my ViewModel?
      1. USAntoine Jaussoin
      1. VTFavorite
    3. VO
      singulars
      1. POHow do I bind a Ribbon control to my ViewModel?
      1. USWietze
      1. VTFavorite
    1. COFirst thing you need to do is turn up debug messages for databinding: http://i.stack.imgur.com/MF8i5.png Next, re-run and check the output window and see what errors are there.
      singulars
      1. POHow do I bind a Ribbon control to my ViewModel?
      1. USWill
    2. CO@Will: looking forward to seeing your answer then.
      singulars
      1. POHow do I bind a Ribbon control to my ViewModel?
      1. USDen
    3. CO@Den: Sorry, I'm not able to answer as much as I used to. I have to spend what little time I have dealing with flags, you know. If you're wondering why posting full solutions on other sites is discouraged, I suggest you ask about it on [meta].
      singulars
      1. POHow do I bind a Ribbon control to my ViewModel?
      1. USWill
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload