Pull to refresh

Выпущен релиз Microsoft Ribbon для WPF

Reading time 5 min
Views 12K
Original author: Pete Brown
Я рад известить вас о выпуске финальной версии Microsoft Ribbon для WPF.



Новый элемент управления совместим с WPF 3.5 SP1 и WPF 4. Он не является оберткой над неуправляемым кодом, а целиком написан на WPF, что означает полную совместимость с возможностями управления стилями WPF.


Шаблон приложения


Установщик содержит в себе новый шаблон приложения «WPF Ribbon Application» для Visual Studio.



После создания и запуска нового проекта, вы увидите заготовку для вашей ленты.



Вот так выглядит XAML код этой ленты:

<ribbon:Ribbon x:Name="Ribbon">

  <ribbon:Ribbon.ApplicationMenu>
    <ribbon:RibbonApplicationMenu SmallImageSource="Images\SmallIcon.png">
      <ribbon:RibbonApplicationMenuItem Header="Hello _Ribbon"
                       x:Name="MenuItem1"
                       ImageSource="Images\LargeIcon.png"/>
    </ribbon:RibbonApplicationMenu>
  </ribbon:Ribbon.ApplicationMenu>

  <ribbon:RibbonTab x:Name="HomeTab"
           Header="Home">
    <ribbon:RibbonGroup x:Name="Group1"
              Header="Group1">
      <ribbon:RibbonButton x:Name="Button1"
                 LargeImageSource="Images\LargeIcon.png"
                 Label="Button1" />
      <ribbon:RibbonButton x:Name="Button2"
                 SmallImageSource="Images\SmallIcon.png"
                 Label="Button2" />
      <ribbon:RibbonButton x:Name="Button3"
                 SmallImageSource="Images\SmallIcon.png"
                 Label="Button3" />
      <ribbon:RibbonButton x:Name="Button4"
                 SmallImageSource="Images\SmallIcon.png"
                 Label="Button4" />
      
    </ribbon:RibbonGroup>
    
  </ribbon:RibbonTab>
</ribbon:Ribbon>


* This source code was highlighted with Source Code Highlighter.


Окно содержащее ленту наследует от класса RibbonWindow. Этот класс позволяет работать с областью заголовка окна (которая не входит в ClientArea и является недоступной для отрисовки в обычном Window — прим. перев.) и отображать на ней такие контролы, как, например, панель быстрого доступа и заголовки контекстных вкладок. Вы можете не использовать этот класс, однако в таком случае вам будет недоступна работа с заголовком окна.

Новая лента содержит в себе все возможности, которые вы ожидали в ней найти: панель быстрого доступа, меню приложения, вспомогательные панели, расширенные подсказки, подсказки для быстрых клавиш, автоматическое изменение размеров и местоположения, вкладки, заголовки контекстных вкладок, поддержку aero и т.п.

Контекстные вкладки


Давайте добавим новую вкладки и вложим ее в группу контекстных вкладок (как, например, инструменты редактирования таблиц в Word). Вам необходимо добавить следующий код в XAML ленты:

<ribbon:RibbonTab x:Name="AwesomeTab"
         ContextualTabGroupHeader="Awesome Tools"
         Header="Really Awesome">
  <ribbon:RibbonGroup x:Name="Group2"
            Header="Group2">
    <ribbon:RibbonButton x:Name="Button21"
               LargeImageSource="Images\LargeIcon.png"
               Label="Button21" />
  </ribbon:RibbonGroup>

</ribbon:RibbonTab>
<ribbon:Ribbon.ContextualTabGroups>
  <ribbon:RibbonContextualTabGroup Header="Awesome Tools"
                   Visibility="Visible"
                   Background="Green" />
</ribbon:Ribbon.ContextualTabGroups>


* This source code was highlighted with Source Code Highlighter.




Обратите внимание на изменения в коде окна, для поддержки заголовка контекстной группы.

Панель быстрого доступа


Как вы и ожидали, лента поддерживает панель быстрого доступа. Код XAML:

<ribbon:Ribbon.QuickAccessToolBar>
  <ribbon:RibbonQuickAccessToolBar>
    <ribbon:RibbonButton x:Name="ButtonQ1"
               SmallImageSource="Images\SmallIcon.png"
               Label="ButtonQ1" />
    <ribbon:RibbonButton x:Name="ButtonQ2"
               SmallImageSource="Images\SmallIcon.png"
               Label="ButtonQ2" />
    <ribbon:RibbonButton x:Name="ButtonQ3"
               SmallImageSource="Images\SmallIcon.png"
               Label="ButtonQ3" />
  </ribbon:RibbonQuickAccessToolBar>
</ribbon:Ribbon.QuickAccessToolBar>

* This source code was highlighted with Source Code Highlighter.




На скриншоте видны две кнопки быстрого доступа и двойная стрелочка, сообщающая о том, что доступны еще несколько кнопок.

Команда разработчиков WPF Ribbon проделала большую работу при создании этого контрола. Он поддерживает дополнительные сценарии, необходимые при использовании его в широком круге задач. Также имеет место быть полная поддержка стиля пользовательских интерфейсов Windows 7. Приятно видеть что WPF Ribbon выпущен и доступен для использования в ваших проектах.

P.S. И да: RibbonButton поддерживает ICommand)

Ссылки:

Tags:
Hubs:
+49
Comments 28
Comments Comments 28

Articles