Fluent Ribbon Toolbars Layouts

<Fluent:RibbonToolBar>
<!--ToolBar Layout Definitions-->
<Fluent:RibbonToolBar.LayoutDefinitions>

  <!--Large Size of the RibbonToolBar-->
  <Fluent:RibbonToolBarLayoutDefinition Size="Large">
    <Fluent:RibbonToolBarRow>
      <Fluent:RibbonToolBarControlDefinition Target="spinner" Width="127"/>
    </Fluent:RibbonToolBarRow>
    <Fluent:RibbonToolBarRow>
      <Fluent:RibbonToolBarControlDefinition Target="buttonGreen" />
      <Fluent:RibbonToolBarControlDefinition Target="buttonGray" />
      <Fluent:RibbonToolBarControlDefinition Target="buttonYellow" />
      <Fluent:RibbonToolBarControlDefinition Target="buttonBrown" Size="Middle"/>
    </Fluent:RibbonToolBarRow>
  </Fluent:RibbonToolBarLayoutDefinition>


  <!--Large Size of the RibbonToolBar-->
  <Fluent:RibbonToolBarLayoutDefinition Size="Middle">
    <Fluent:RibbonToolBarRow>
      <Fluent:RibbonToolBarControlDefinition Target="spinner" Width="90"/>
    </Fluent:RibbonToolBarRow>
    <Fluent:RibbonToolBarRow>
      <Fluent:RibbonToolBarControlDefinition Target="buttonGreen" />
      <Fluent:RibbonToolBarControlDefinition Target="buttonGray" />
      <Fluent:RibbonToolBarControlDefinition Target="buttonYellow" />
      <Fluent:RibbonToolBarControlDefinition Target="buttonBrown"/>
    </Fluent:RibbonToolBarRow>
  </Fluent:RibbonToolBarLayoutDefinition>

  <!--Middle Size of the RibbonToolBar-->
  <Fluent:RibbonToolBarLayoutDefinition Size="Small">
    <Fluent:RibbonToolBarRow>
      <Fluent:RibbonToolBarControlDefinition Target="spinner" Width="45"/>
    </Fluent:RibbonToolBarRow>
    <Fluent:RibbonToolBarRow>
      <Fluent:RibbonToolBarControlDefinition Target="buttonGreen" />
      <Fluent:RibbonToolBarControlDefinition Target="buttonGray" />
    </Fluent:RibbonToolBarRow>
    <Fluent:RibbonToolBarRow>
      <Fluent:RibbonToolBarControlDefinition Target="buttonYellow" />
      <Fluent:RibbonToolBarControlDefinition Target="buttonBrown" />
    </Fluent:RibbonToolBarRow>
  </Fluent:RibbonToolBarLayoutDefinition>

</Fluent:RibbonToolBar.LayoutDefinitions>

<!--ToolBar Controls-->
<Fluent:Spinner x:Name="spinner" />
<Fluent:Button x:Name="buttonGreen" Header="Green" Icon="Images\Green.png” ... />
<Fluent:Button x:Name="buttonGray" Header="Gray" Icon="Images\Gray.png"  ... />
<Fluent:Button x:Name="buttonYellow" Header="Yellow" Icon="Images\Yellow.png" ../>
<Fluent:Button x:Name="buttonBrown" Header="Brown" Icon="Images\Brown.png" ... />
</Fluent:RibbonToolBar>