Delphi в Интернет, блог Delphi программистов

Начиная с RAD Studio 2009 в составе VCL Delphi появилась новая вкладка Ribbon Controls. На этой вкладке располагаются компоненты для создания относительно нового интерфейса для приложения, так называемого "ленточного" интерфейса к которому уже давно привыкли пользователи Microsoft Office 2007. Сегодня и мы, как разработчики, начнем процесс мучительного привыкания к новым компонентам на благо пользователей наших приложений.

На самом деле процесс освоения работы с новыми компонентами не такой уж и мучительный, если подойти к изучению этого вопроса с самого начала и не торопиться разработать интерфейс один-к-одному как у Office 2007 - за день такие вещи, к сожалению, не делаются.
Поэтому и мы начнем изучение Ribbon Controls с самого начала и будем создавать интерфейс приложения шаг за шагом, от простого к сложному, чтобы не упустить ни одной детали.

1. Устройство интерфейса Ribbon

В основе Ribbon лежат три вида элементов: вкладка, панель и элемент внутри панели (см. рисунок)
Вкладкам и панелям можно изменять порядок расположения в ленте Ribbon, а элементы на панелях могут иметь различную функциональную нагрузку (применяться в качестве кнопок, флажков, списков, галерей и т.д.), а также группироваться по определенным признакам. И, забегая немного вперед, скажу, что все функциональные возможности элементов Ribbon определяются с помощью одно-трех компонентов без применения каких-либо стандартный контролов, наподобие Button, CheckBox  и т.д.

Дополнительно, Ribbon может содержать кнопку главного меню и панель быстрого запуска.

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

Панель быстрого запуска может содержать копии любых элементов Ribbon для удобства их использования.

Теперь, вооружившись элементарными знаниями об устройстве Ribbon, попробуем построить свой собственный ленточный интерфейс.

2. Первые Ribbon интерфейс  - он самый сложный

Все элементы Ribbon располагаются на странице палитры компонентов Ribbon Controls

На первый взгляд, разработчики по жадничали и оставили нам в распоряжение всего пять элементов:
1. TRibbon - основа всего интерфейса (лента)
2. TRibbonComboBox
3. TRibbonSpinEdit
4. TRibbonScreenTipManager - менеджер всплывающих подсказок
5. TScreenTipsPopup - всплывающая подсказка
Но на самом деле, этих компонентов более чем достаточно для разработки полноценного интерфейса. Более того, не факт, что когда-либо Вам придётся использовать в работе второй и третий компоненты (TRibbonComboBox и TRibbonSpinEdit).

Дело в том, что Ribbon в Delphi работает только совместно с компонентом TActionManager со страницы Additional палитры компонентов. И этот компонент берет на себя львиную долю всей работы, в том числе, и работы с событиями элементов.

Теперь попробуем создать простенький интерфейс, рассмотрев попутно свойства компонентов Ribbon.

2.1. Работа с TRibbon

Откройте Delphi, создайте новое приложение и расположите на форме следующие элементы:

1. TActionManager (вкладка Additional)
2. TImageList (вкладка Win32)
3. TRibbon (вкладка Ribbon Controls)

В итоге Вы должны получить примерно следующую картинку:

Теперь выберите TRibbon и в свойстве ActionManager укажите наш ActionManager1.
В свою очередь, у компонента ActionManager1 в свойстве Images укажите ImageList1.
Предварительная настройка закончена - теперь TRibbon будет находится под управлением менеджера действий и каждая новая панель Ribbon будет автоматически добавляться в  список ActionManager1.
Прежде, чем переходить к расстановке вкладок, панелей и элементов на ленте, рассмотрим её константы и основные свойства.

У компонента TRibbon определены следующие константы:

Свойства компонента TRibbon:

Теперь, давайте добавим на нашу ленту первую вкладку. Для этого можно:

1. Воспользоваться контекстным меню компонента (опция Add Tab)
2. Воспользоваться опциями компонента в Object Inspector'e:



3. Использовать редактор свойства Tabs компонента

Теперь на вкладку можно добавлять новые группы. Сделать это можно либо через контекстное меню вкладки, либо, опять же воспользовавшись опциями в Object Inspector'е. Для примера, добавим на вкладку три группы:

В любой момент вы можете изменить положение групп на вкладке. Для этого необходимо воспользоваться опцией "Reorder Groups...".
У группы Ribbon появляются следующие дополнительные свойства:
DialogAction : TAction - действие, которое будет выполняться при клике на заголовке группы. Если это свойство определено, то вид заголовка группы измениться на следующий:

Rows : integer - свойство определяет на сколько строк будут занимать элементы панели. По умолчанию свойство имеет значение 3.

Теперь попробуем добавить обычную кнопку.

1. В свойствах ImageList устанавливаем значения свойств Height и Width равным 32 и загружаем в него любую картинку.
2. Двойным кликом по ActionManager открываем редактор и добавляем новое событие:



3. Редактируем свойства у нового действия (Action)

Теперь определим обработчик действия. Пусть при вызове действия открывается главная страница нашего блога. Располагаем на форме компонент TWebBrowser (вкладка Interet палитры компонентов), в редакторе Action Manager'а делаем двойной клик по действию и пишем обработчик:

procedure TForm2.OpenStartURLExecute(Sender: TObject);
begin
WebBrowser1.Navigate('http://www.webdelphi.ru');
end;

Теперь возьмие и перетащите мышкой действие из ActionManager на любую панель Ribbon. В результате должно получиться примерно следующее:

По умолчанию новое действие располагается в первой свободной строке (Row) панели. Для того, чтобы новая кнопка выглядела как полагается, т.е. сверху располагалась иконка 32x32 пикселя и снизу подпись, необходимо выбрать действие на панели, перейти в Object Inspector'е выбрать вкладку свойств CommandProperties и указать в свойстве ButtonSize значение bsLarge. При этом ширина панели Ribbon автоматически изменится и вид панели Ribbon станет следующим:

Теперь можете запустить приложение и проверить работу.

Кроме того, что Вы можете располагать на панели действия в виде кнопок различного размера, Вы также можете, используя ActionManager располагать действия как CheckBox'ы, RadioButton'ы и т.д.
Давайте, например на второй панели разместим 3 действия в виде радиокнопок.


Создаем в Action Manager'е три новых действия с именами RadioOption1, RadioOption2, RadioOption3 соответственно. Перетаскиваем их наа панель Ribbon и в свойстве CommandStyle указываем значение csRadioButton. Вид Ribbon должен быть следующим:

Видите, новые опции при запуске приложение оказались недоступными? Все дело в том, что, если Action не имеет обработчика, то в работающем приложении его свойство Enabled автоматически переходит в значение false. Напишем три простых обработчика:

procedure TForm2.Action1Execute(Sender: TObject);
begin
ShowMessage('RadioOption1 Executed');
Action1.Checked:=true;
end;

procedure TForm2.Action2Execute(Sender: TObject);
begin
ShowMessage('RadioOption2 Executed');
Action2.Checked:=true;
end;

procedure TForm2.Action3Execute(Sender: TObject);
begin
ShowMessage('RadioOption3 Executed');
Action3.Checked:=true;
end;

Для того, чтобы все три кнопки действовали как и полагается, чтобы в одно время могла быть нажата только одна кнопка, необходимо в ActionManager'е выставить у всех трех действий одинаковое свойство GroupIndex отличное от нуля.
Теперь снова запустите приложение и можете увидеть, что вторая панель Ribbon действует также как и обычный компонент TRadioGroup.
Все возможные формы представления действий на панелях Ribbon мы рассмотрим в следующей статье, а пока сосредоточимся на основах работы.
Переходим к созданию главного меню. Выбираем компонент TRibbon и в Object Inspector'е жмем опцию "Add Application Menu". Иконка кнопки главного меню берется из свойств проекта (Application Icon). По умолчанию в главное меню добавляется пустое действие ActionClientItem0, которое Вы можете изменить по своему усмотрению. Добавим в главное меню уже имеющееся у нас действие OpenStartURL. Просто перетащите действие из ActionManager'а на кнопку главного меню. В результате вид главного меню у работающего приложения будет следующим:

Аналогичным образом настраивается и панель быстрого запуска. Надеюсь, смысл работы с компонентом Ribbon в общих чертах Вам стал более-менее понятен. Поэтому переходим к следующему шагу разработки интерфейса - работе с всплывающими подсказками.

2.2. Работа с компонентом TScreenTipsManager

Ещё одной отличительной чертой интерфейса Ribbon являются красивые всплывающие подсказки. Эти подсказки (ScreenTips) помимо своей красоты и удобства являюся также и более информативными для пользователей нежели те же самые Hints.

За работу и управление подсказками отвечает компонент TScreenTipsManager. Располагаем его на форме и в свойстве  ScreenTips у компонента TRibbon указываем  ScreenTipsManager1. Теперь вы можете создавать подсказки программно или воспользоваться редактором. Так как сегодня мы делаем только  первый шаг в работе с Ribbon Controls, то рассмотрим работу визуального редактора.

Выбираем компонент ScreenTipsManager1, в Object Inspector'e вызываем редактор свойства LinkedActionLists, и добавляем в список кже имеющийся компонент ActionManager1:

Теперь в опциях Object Inspector выбираем действие "Generate Screen Tips". В итоге, если всё сделано правильно, то Вы должны получить сообщение следующего вида:

Это сообщение означает, что ScreenTipsManager создал для каждого действия из ActionManager свою подсказку. Для того, чтобы изменить вид подсказок нажмите в Object Inspector'е "Edit Screen Tips" и перед Вами откроется визуальный редактор подсказок:

Работа с редактором достаточно проста и удобна:

1. Выбираете в списке действие
2. Редактируете  текст подсказки
3. При необходимости загружаете картинку, вставляете/удаляете нижнюю подпись (Footer), верхнюю подпись (Header) и т.д.

По умолчанию за текст подсказки принимается значение свойства Hint у действия. Создадим подсказку для одного из наших действий.

Выбираем в редакторе действие OpenStartURL и заполняем текстовое поле:

Загружаем картинку для подсказки. Для этого делаем двойной клик по соответствующему полю и выбираем рисунок в формате bmp.
Так как у нашего приложения ещё нет своей встроенной справки, то желательно убрать Footer. Для этого снимаем флажок с опции Show Footer. В итоге у меня получилась вот такая подсказка:

Дополнительно для каждой подсказки вы можете установить радиус скругления для углов (свойство Corner Size), изменить текст Footer'а, отключить показ заголовка, клавиш быстрого вызова (ShortCuts), а также изменить рисунок для Footer (по умолчанию это рисунок в виде вопросительного знака).
А теперь самое важное - для того, чтобы все подсказки появлялись необходимо чтобы у главной формы приложения свойство ShowHint было равно True.
Теперь запустите приложение и наведите курсор мыши на кнопку. Через пару секунд появится всплывающая подсказка:

Кроме такого вида всплывающих подсказок, вы также можете использовать компонент TScreenTipsPopup.

2.3. Работа с компонентом TScreenTipsPopup

В отличие от предыдущего компонента TScreenTipsPopup является визуальным компонентом. Смысл работы примерно тот же, что и у ScreenTipsManager, но за одним замечательным различием - TScreenTipsPopup может быть ассоциирован с любым компонентом формы, даже с тем у которого нет действия, описанного в ActionManager'е. В нашем случае таким компонентом является WebBrowser1. Давайте создадим для него свой Screen Tip.
Расположите в любом удобном для Вас месте новый компонент TScreenTipsPopup.
Теперь перейдите в Object Inspector и откройте вкладку свойств Screen Tip. Задайте значения свойств Description и Header. Остальные свойства можно оставить незаполненными.
Ассоциируйте подсказку с компонентом WebBrowser. Для этого в выпадающем списке свойства Associate компонента выберите WebBrowser1, а в свойстве ScreenTipsManager укажите ScreenTipsManager1.
Запустите приложение и наведите указатель мыши на браузер:

Эта же подсказка появится и при наведении указателя мыши на сам компонент ScreenTipsPopup.
Вот пожалуй и все, что касается основ работы с компонентами Ribbon Controls.
Как видите, сегодня основной упор в статье был сделан именно на визуальную разработку интерфейса при минимальной работе с исходным кодом.
В следующий раз пройдем немного дальше и займемся программированием. Научимся создавать новые виды элементов, красивые PopUp-меню и так далее. В общем оставайтесь с нами и скучно не будет ;)

Пример приложения из этой статьи Вы можете скачать здесь

Мой блог находят по следующим фразам

• скан коды клавиатуры
• Agent.Control
• delphi 2010 idhttp ошибка
• RAD Studio 2010
• xml-rpc delphi
• ansistring delphi пример работы

Делись!	Загружай!	Плюсуй!
	Отправить PDF на

Комментарии (91)

• Алексей пишет:
  27 Окт 2009 в 10:33 пп

  Спасибо за статью. Я сейчас тоже юзаю Ribbon. Так увлекся, что не могу оторваться, почему-то очень понравились эти компоненты, хотя никогда не пользовался приложениями с таким интерфейсом, кроме Small Basic — там вроде тоже также сделано. :-)

• Vlad пишет:
  27 Окт 2009 в 10:42 пп

  Всегда пожалуйста. Это только первый шаг в моем изучении Ribbon. Дальше будет немного по-сложнее, когда надо делать Split-кнопки, менюшки и т.д. начинаешь тихо ненавидеть разработчиков Action Manager’а :) Хотя это скорее всего от того, что никогда им в жизни не пользовался поэтому кажется всё таким запутанным

• jkeks пишет:
  28 Окт 2009 в 2:17 пп

  Шикарно, если я тупо задам щас вопрос, то пожалуйста удалите этот коммент, но ответьте пожалуйста, где взять этот Delphi , дайте адрес пожалуйста.
  Спасибо.
  Автору огромное спасибо за инфу. Давно искал как делать современнеые интерфейсы на Дельфях.

• Vlad пишет:
  28 Окт 2009 в 2:20 пп

  насколько помню, на http://embarcadero.com лежала 30-ти дневная Trial-версия Delphi 2010, которую можно качать и свободно использовать. Ну, а по поводу Delphi+»лекарство»…на торрентах, видимо, уже давно лежат копии

• RemaGe пишет:
  28 Окт 2009 в 4:33 пп

  На торентах есть, скачал поюзал, но что бы написать что либо приличное, да и разобраться в 2010 нехватает времени, видимо так и буду сидеть на 7 -)

• Vlad пишет:
  28 Окт 2009 в 5:02 пп

  На самом деле разобраться с D2010 после 7-ки проще, чем с 2009 :) 2010 можно настроить «под 7ку», т.е. панели компонентов вынести вверх и т.д. Я сейчас под 2010 перешел и честно говоря — не жалею. Намного проще стало разрабатывать что-либо.

• V.I.R.U.S. пишет:
  28 Окт 2009 в 6:42 пп

  Респект автору статьи, да и вообще, этот сайт уже давно в закладках браузера!!! Так Держать, Влад! Все вместе с другими читателями, будем ждать новых материалов!!!

• RemaGe пишет:
  28 Окт 2009 в 8:07 пп

  В принципе и без заточки под д7 все понятно (чуть чуть потыкал, вроде все по старому), просто время нао выделить, а это уже проблема)

• Vlad пишет:
  28 Окт 2009 в 8:49 пп

  Это точно, если б было время…я тоже в Ribbon полез только потому что очень уж надо было…а теперь смотрю — вроде как народ интересуется, надо ещё чего-нибудь расписать)

• Sergey пишет:
  01 Ноя 2009 в 8:28 дп

  Статья супер, особенно для начинающих.
  У меня вопрос возник, я работаю в MS Office 2007, там при перемещении указателя мыши с одной (П) группы на другую (В)  подсветка П угасает медленно и подсветка В появляется тоже медленно. А в компоненте TRibbon — это происходит моментально, есть ли какие-нибудь настройки этого компонента, чтобы решить вопрос с подсветкой (чтоб было как в MS Office 2007)…
  Заранее спасибо!

• Vlad пишет:
  01 Ноя 2009 в 12:20 пп

  По поводу подсветки пока ничего сказать не могу т.к. ещё в исходниках Ribbon не копался. Но, думаю, что это вполне возможно реализовать

• Алексей Тимохин пишет:
  04 Ноя 2009 в 1:43 дп

  Спасибо за подробное описание.
  Меня больше всего заинтриговал компонент TScreenTipsManager. Настолько, что я подумываю, а не реализовать ли самому такой для старых версий Delphi и без привязки к Action-ам.

• Vlad пишет:
  04 Ноя 2009 в 1:53 дп

  Да, TScreenTipsManager штука хорошая и полезная. Компонент для старых Delphi думаю будет пользоваться успехом у пользователей семерки. Вот если б полностью Ribbon от ActionManager’а отвязать — вот это было бы просто супер :)
  Кстати, если все же надумаете писать свой компонент, то думаю Вам может пригодиться некоторая информация с этого сайта http://subritto.h1.ru/msagent/msa_balloon.php. Правда там автор дорабатывал BaloonHint под работу с MS Agent, но кое-что полезное там все же имеется

• Олег пишет:
  08 Дек 2009 в 8:08 пп

  Спасибо!
  А как в рунтайме удалять старые и добавлять новые элементы в RibbonGroup и самое важное — итемы к элементам, например, такие, которые выпадают в списке у кнопки ButtonType = btDropDown?

• Vlad пишет:
  09 Дек 2009 в 12:28 дп

  Сейчас я бОльшую часть времени работаю в Lazarus (требуется по работе), но судя по тому, что помню в Ribbon все на 100% завязано на использовании ActionManager’a. Соответственно все кнопки, менюшки, сплит-кнопки и т.д. добавляются именно через этот компонент и его свойства. Сам по себе Риббон в Delphi имеет не так уж и много компонентов. Можно, конечно, в группу Риббона добавить и простой TButton, но его внешний вид на панели будет несколько отличаться от «родной» кнопки. Не знаю, подойдет ли вам такой вариант — в дизайн тайме по максимум проработать интерфейс приложения, а в рантайме просто отображать или скрывать нужные компоненты? По-моему так будет наиболее просто.

• Олег пишет:
  09 Дек 2009 в 4:39 пп

  Спасибо, да, и такой вариант кое-в чём рассматриваю, но вот содержимое Items должно зависеть от конфигурационного файла. Ладно, будем думать, искать методы.
  Кстати, я не могу понять каким образом можно узнать и изменить текущий ItemIndex у риббон комбобокса. :? Он просто-напросто не имеет такого свойства. В RibbonActnCtrls.pas текст ItemIndex или что-то похожее на него тоже не встречается.

• Vlad пишет:
  09 Дек 2009 в 4:43 пп

  Так у Риббоновских комбобоксов нет ItemIndex, каждый элемент — это отдельно действие TAction :) Жесть конечно, но если долго помучиться — можно получить, что-то путнее

• Олег пишет:
  09 Дек 2009 в 6:15 пп

  О, блин.. всё через мягкое место.))
  Благо RibbonGroups могут быть контейнерами, поэтому буду использовать привычные компоненты вместо ленточных.
  В таком случае, надеюсь, вы позволите мне немного почти оффтопа. Не подскажете, где можно почитать о модификации стандартных компонентов, чтобы стиль (например, цвет подсветки при наведении мышки, при клике) приблизить к риббоновским?

• Vlad пишет:
  10 Дек 2009 в 4:43 дп

  SeregaAltmer в этом деле соображает (второй автор блога), но он чего-то пропал в неизвестном направлении. В Delphi есть модуль называется Themes, вроде бы с помощью него можно модифицировать, изменять и украшать стандартные компоненты. Посмотрите инфу по модулю.

• Олег пишет:
  10 Дек 2009 в 9:23 пп

  Спасибо, посмотрю.
  PS: Продолжайте писать, нам очень интересно.

• RozReg пишет:
  16 Дек 2009 в 5:47 пп

  Спасибо автору!
  У меня вопрос.
  Хочу поместить на панель Ribbon простую метку Label для просто для показа какой-то текущей информации. Это возможно? Что нужно выставить в свойстве CommandStyle?

• Vlad пишет:
  16 Дек 2009 в 8:09 пп

  Если необходимо вставить простой компонент TLabel, то никто не мешает этого делать — перетаскиваете метку на панель Риббона и работаете с ней как с простым компонентом. Но лучше этого не делать, т.к. при использовании стандартных компонентов на панели Ribbon возможны проблемы в оформлении, т.е. стандартные компоненты будут отличаться по виду от риббоновских

• RaiNNy пишет:
  10 Янв 2010 в 10:18 дп

  У меня очень странная проблема с риббоном: при добавлении картинки прозрачные области становятся черными. Пробовал разные изображения, не помогает. Может быть есть какое-то хитрое свойство, которое за это отвечает?

• Vlad пишет:
  10 Янв 2010 в 6:23 пп

  Картинки как добавляете? В ActionManager’e?

• RaiNNy пишет:
  11 Янв 2010 в 5:30 дп

  Изначально в ImageList, потом в ActionManager’е просто устанавливаю нужный ItemIndex.

• Vlad пишет:
  11 Янв 2010 в 5:46 дп

  Хм..тогда проблем быть вообще никаких не должно. Формат картинок : bmp? Вроде png тоже можно грузить, но с этим форматом глюков пока много. И разрешение, кстати, какой? 100% правильно работает с 96dpi
  И ещё оин момент — в ImageList прозрачным какой цвет выставлен?

• RozReg пишет:
  11 Янв 2010 в 3:31 пп

  «Перехватываю» вопрос, т.к. у меня такая же проблема. Пробовал вставлять сразу в формате png с прозрачным фоном. В этом случае в ImageList свойство Transparent Color недоступно. А на Ribbon’e картинка становится на черном фоне. Если вставляю в формате bmp, и указываю Transparent Color, то всё в порядке за исключением того, что по краям картинки нимб, рваные края, остатки от бэкграунда (картинка круглая).

• Vlad пишет:
  11 Янв 2010 в 8:29 пп

  Вот она и истина — прозрачный цвет чёрный, как я и говорил. Как раз сегодня рылся по msdn в поисках Ribbon, хочется разобраться как самому состряпать свой стиль. И наткнулся на требования к изображениям:
  Small Icon Large Icon
  96 dpi 16×16 pixels 32×32 pixels
  120 dpi 20×20 pixels 40×40 pixels
  144 dpi 24×24 pixels 48×48 pixels
  192 dpi 32×32 pixels 64×64 pixels
  При этом картинки в ImageList следует вставлять уже готовые, т.е. такие которые не требуется сжимать, уменьшать и т.д. Для нас наиболее важны параметры первой картинки, т.е. формат bmp 96 dpi. Кроме bmp Ribbon также довольно неплохо работает с иконками *.ico тех же размеров с прозрачным фоном.

• bambarmia пишет:
  11 Янв 2010 в 9:12 пп

  2Олег, про генерацию рибона в реал-тайме — глянь на https://forums.embarcadero.com/message.jspa?messageID=199857#199857
  2RaiNNy, про зачернение прозрачных областей — я тоже наступил на эти грабли, помогло только создание проекта заново, и перенос текста программы в него из старой версии, судя по всему это где-то в настройках дизайн-тайма что-то сбилось (правда обрати внимание на обязательную глубину цвета в cd32Bit, может просто у тебя cdDeviceDependent вместо него выставлен в ImageList).
  2Vlad, во-первых, спасибо за то, что Вы есть))), но осмелюсь тут повторить свой вопрос про ScreenTips из второй части статьи (адресовал туда, так как там больше про галерею описано). Кому (и как) удалось добавить эти подсказки к элементам галереи? и к DialogAction (такому маленькому квадратику в правом нижнем углу у RibbonGroup появляющемуся) ??

• bambarmia пишет:
  11 Янв 2010 в 9:17 пп

  чтобы вопрос был понятнее, снял несколько скриншотов:
  тут Tips есть http://img6.immage.de/10014b77adcshowtips.jpg
  тут — нету http://img6.immage.de/1001dontshowtips.jpg
  а, содержимое формы подробно выложил на https://forums.embarcadero.com/thread.jspa?threadID=30991&tstart=0

• Vlad пишет:
  11 Янв 2010 в 11:22 пп

  Судя по всему вам нужна такая подсказка?
  http://img-fotki.yandex.ru/get/4007/bvv36.0/0_4627f_79f2a2_L.jpg
  Вроде бы нормально смотрится :)
  Сейчас попробую немного напильничком обработать и выложу примерчик небольшой

  update
  ответ оформил отдельным постом
  http://www.webdelphi.ru/2010/01/ribbon-controls-shag-za-shagom-shag-3-%e2%80%93-rabota-so-screentips/ Надеюсь, такой вариант решения подойдет…другого пока не обнаружил

• bambarmia пишет:
  13 Янв 2010 в 1:39 пп

   
   
  2RaiNNy, про зачернение прозрачных областей: сегодня случайно эксперимент произвел, удалив res файл из проекта, при следующем открытии проекта появилось предупреждение «Cannot find resource file… Recreated.», жму ОК и вуаля — все бывшие прозрачности стали черными. Пришлось разбираться, так как с нуля опять клепать  проект не комильфо. Вот пяткой чую, что не «хитрое свойство» за прозрачки отвечает, а содержимое res файлов, только каким боком? Ведь там хранится лишь Icon\MAINICON и Manifest\1, тут-то собака и порылась! Если в res-файле удалить Manifest\1 содержащий
  <?xml version=»1.0″ encoding=»UTF-8″ standalone=»yes»?>
  <assembly xmlns=»urn:schemas-microsoft-com:asm.v1″ manifestVersion=»1.0″>
  <assemblyIdentity
  type=»win32″
  name=»CodeGear RAD Studio»
  version=»14.0.3615.26342″
  processorArchitecture=»*»/>
  <dependency>
  <dependentAssembly>
  <assemblyIdentity
  type=»win32″
  name=»Microsoft.Windows.Common-Controls»
  version=»6.0.0.0″
  publicKeyToken=»6595b64144ccf1df»
  language=»*»
  processorArchitecture=»*»/>
  </dependentAssembly>
  </dependency>
  <trustInfo xmlns=»urn:schemas-microsoft-com:asm.v3″>
  <security>
  <requestedPrivileges>
  <requestedExecutionLevel
  level=»asInvoker»
  uiAccess=»false»/>
  </requestedPrivileges>
  </security>
  </trustInfo>
  </assembly>
  то никаким электровеником не загнать нормальные прозрачности в свой проект! Восстановил этот Manifest\1 и вернулись прозрачности.
   

• Vlad пишет:
  13 Янв 2010 в 5:31 пп

  Спасибо за подробное пояснение…думал не придётся лезть так глубоко, чтоб разобраться. Теперь придётся весь msdn перерывать. Видел что-то подобное там

• Дмитрий пишет:
  22 Июн 2010 в 10:27 пп

  Доброе времени суток!! Помогите ришить одну проблему. Я поставил Билдер 2010, пробывал работать с етими обектами, статья очень понятная, но у меня не как не выходит вставить в главное меню картинки, может ктото с этим сталкивался

• Дмитрий пишет:
  22 Июн 2010 в 11:19 пп

  Я розобрался как картинки всавлять, а можно вставльт png картинки ну только чтобы они были прозрачны как ониесть?

• Дмитрий пишет:
  22 Июн 2010 в 11:20 пп

  Может кто знает где можно скачать всезначки от Microsoft Word 2007?

• Vlad пишет:
  22 Июн 2010 в 11:44 пп

  Дмитрий, что ж вы так флудите-то? :) Если коммент не появился в логе — значит я его ещё не прочитал. Рад, что разобрались, а чтоб вставить прозразный png надо сделать прозрачным чёрный цвет

• Дмитрий пишет:
  22 Июн 2010 в 11:48 пп

  А где именно?

• Vlad пишет:
  23 Июн 2010 в 12:22 дп

  изображение должно быть 96 на 96 dpi, прозрачный цвет — черный. Делается в том же фотошопе.

• Дмитрий пишет:
  23 Июн 2010 в 9:08 пп

  Vlad
  Я хочу поставить картинки png но она по контуру почемуто чорная и не прозрачна я не как не могу найти там прозрвчность чорного цвета выставить, подскажите пожайлусто, где именно выставить
  

• Vlad пишет:
  24 Июн 2010 в 4:28 пп

  Дмитрий, я обясняю вам ВТОРОЙ раз — если предыдущего комментария нет в блоге значит я его ещё НЕ ЧИТАЛ! Зачем Вы отсылаете по несколько комментов? Я прекрасно понимаю с первого раза. Статьи мои — иначе их здесь бы не было. Также второй раз говорю — если картинка в формате 96Х96 dpi и имеет в качетсве прозрачного чёрный цвет, то проблем никаких не должно быть. вот скрин программы в которой png с черным прозрачным цветом -«Ribbon c PNG» на Яндекс.Фотках
  Если проблема в ресурсах — читайте внимательно комментарии bambarmia к этой статье

• Дмитрий пишет:
  24 Июн 2010 в 4:08 пп

  Vlad, это вашы статьи?
  

• Дмитрий пишет:
  24 Июн 2010 в 5:13 пп

  А вы бы не могли написать еще несколько статей ка зделать (вставить) обект ComboBox і Edit?

• Vlad пишет:
  24 Июн 2010 в 5:26 пп

  ComboBox в Edit?? Зачем? Конкретизируйте, что вам надо?

• Дмитрий пишет:
  24 Июн 2010 в 5:37 пп

  Я раньше написал программу Текстовий редактор, и я хочу создать в RibbonGroup вибор размера текста и Вибор шрифта, мне главное узнать ка можно такие обекты поставить как у Microsoft Office Word 2007 есть RibbonGroup (Шрифт), от мне нужно такое зделать, включая всьо што там есть

• bambarmia пишет:
  25 Июн 2010 в 12:00 пп

  Дмитрий, в Word используется Fluent UI писанный не на Delphi, поэтому такие-же как у MS Office плюшки не получатся. Более того, дополнительное лицензионное соглашение ( http://www.developers.org.ua/forum/topic/1472 ) ограничивает полёт фантазии. Только пытаться использовать всё, что у них там есть, равно что пытаться в комментарии использовать все буквы русского алфавита, текст доходчивее не получится, но надеюсь программы то вы грамотнее пишите.

• Vlad пишет:
  25 Июн 2010 в 11:07 дп

  Дмитрий, так это вам ComboBox в Edit’ы пихать, а работать с компонентов TRibbonComboBox. Принцип работы примерно тотже, что и при работе с галереями.

• Дмитрий пишет:
  25 Июн 2010 в 8:14 пп

  мне нужно просто расположить компоненты чтобы вышло что то такое на подобие
  А код у меня есть

• Vlad пишет:
  25 Июн 2010 в 9:40 пп

  Скрин мелко, но понятно. Чтоб узнать как это делать надо:
  Зайти в «Документы«, Найти папку RAD Studio, В этой папке открыть папку 7.0 (если Delphi 2010), В папке 7.0. есть папка Demos, а Demos содержит папку DelphiWin31, которая опять же содержит папку VCLWin32, которая содержит папку RibbonControls. Вооот!
  Но это ещё не все. В папке RibbonControls надо открыть папку Ribbon Demo — и проект (с картинки) в вашем распоряжении. Там все доходчиво и понятно сделано, в т.ч. и панелька для выбора шрифта, галерей только вроде бы нормальных нет, но это можете и в блоге посмотреть.

• Дмитрий пишет:
  25 Июн 2010 в 7:33 пп

  Я с TRibbonComboBox розобрался у меня еше один фопрос, как мне иожно зделать как в MS Office 2007 типа панелюку там где Жирний шрифт и так далее, можно ли вапще такую поставить панельку?

• Vlad пишет:
  25 Июн 2010 в 7:40 пп

  1 в 1 врядли, а похожую легко — эта панелька ничто иное как теже самые Action’ы, расположенные в две строки (по умолчанию 1 строка). Чисто мышевозное программирование — никакого кода

• Дмитрий пишет:
  25 Июн 2010 в 7:42 пп

  А как именно это можно реализовать? За рание спасибо

• bambarmia пишет:
  25 Июн 2010 в 7:59 пп

  Сомневаюсь, что Дмитрий настолько глуп, что сам бы не разобрался как склепать аналог панели Главная/Шрифт, ведь судя по почерку это либо наш юный соотечественник (значит гениальный программист в будущем), либо индус (профессиональный программист в настоящем). Поэтому, скорее всего, вопрос то стоял про всплывающую при выделении фрагмента «панелюку», а тут без кода не обойтись.

• Дмитрий пишет:
  25 Июн 2010 в 10:03 пп

  Я 2010 удалил поставил 2009

• Дмитрий пишет:
  29 Июн 2010 в 7:28 пп

  Vlad, я нашол исходники от 2009 Билдера, это там свойствами задано маленькая панель где там Жирный, Курсивный, или кодом?

• Vlad пишет:
  29 Июн 2010 в 7:30 пп

  Свойствами. А как иначе-то? В исходнике же кода, отвечающего за прорисовку элементов на ленте нету ?

• Дмитрий пишет:
  29 Июн 2010 в 7:31 пп

  Щас буду пробывать!!!
  

• Дмитрий пишет:
  29 Июн 2010 в 7:42 пп

  Vlad я шо то пробую и не чего не выходит, может ты попробуеш?
  

• Дмитрий пишет:
  06 Июл 2010 в 4:41 пп

  Vlad привет ты не могби посмотреть как в групу зделать несколько кнопок, я не как не могу розобратса в том исходнике, ты мне хотяби свойства подскажи, В принципе я свойства знаю как начать группу кнопок и запкончить только не чего путьового не выходит, попробуй ты пожайлусто!!!!!!! А лучше статью написать надеюсь не меня одного это интерисует

• Vlad пишет:
  07 Июл 2010 в 9:42 пп

  Помогу. Только чуть по позже.
  З.Ы. От тебя комменты в спам летят. Ты нигде не спамил?

• Дмитрий пишет:
  09 Июл 2010 в 9:41 дп

  Vlad, привет я уже розобрался с групами кнопок, у меня еще один вопрос, я Хочу чтобы в комбо боксе била прокрутка (ScrollBars) как в Word 2007

• Vlad пишет:
  09 Июл 2010 в 6:37 пп

  Тут ответ http://www.webdelphi.ru/2010/07/tonkosti-raboty-s-ribbon-controls-v-delphi-2010/

• Дмитрий пишет:
  13 Июл 2010 в 8:12 пп

  Vlad, Привет как мне можно обратитса к кнопке из ActionManager1, к изображению которое туда загружаетса, я хочу запрограмировать цыет текста, при этом используя БитМап, но я не знаю как обратитса к кнопке, подскажы!

• Дмитрий пишет:
  14 Июл 2010 в 10:51 дп

  Vlad, Привет я запрограмировал кнопку СпидБуттон, можеш мне помочь єтот код перенисти в кнопку из ActionManager1.
  Вот код кнопки:
  void __fastcall TForm1::SpeedButton1Click(TObject *Sender)
  {
  Graphics::TBitmap *bmp = new Graphics::TBitmap();
  bmp->Height = 5;
  bmp->Width = 17;
  bmp->LoadFromFile(«F:\\Мой проэкт\\Значки на проект\\16\\Панель инструментов\\ColorText.bmp»); // загрузили
  bmp->Canvas->Pen->Color=clRed;
  bmp->Canvas->Brush->Color = clRed; // установили цвет
  bmp->Canvas->Rectangle(0,13,16,17); // дорисовали
  SpeedButton1->Glyph->Assign(bmp);
  delete bmp;
  bmp = NULL;
  }

• Vlad пишет:
  14 Июл 2010 в 10:56 дп

  Ты откуда это откопал?

• Дмитрий пишет:
  14 Июл 2010 в 11:01 дп

  Vlad, ти мне просто помоги этот код перенисти в кнопку из ActionManager1.  Я на С++ пишу

• Vlad пишет:
  14 Июл 2010 в 11:11 дп

  Как тебе перенести код на кнопку из ActionManager если ВСЕ кнопки Ribbon используют ActionManager для выполнения действий? Лезь на MSDN, читай что там пишут, учи матчасть по С++. Тем более что на MSDN море примеров именно на С++

• Дмитрий пишет:
  14 Июл 2010 в 11:30 дп

  Vlad, а ты не знаеш?

• Vlad пишет:
  14 Июл 2010 в 11:37 дп

  Не только не знаю, но даже и не понимаю зачем так извращать саму идею работы с Ribbon Controls

• Дмитрий пишет:
  14 Июл 2010 в 11:45 дп

  Vlad ты видил в ворде вибор цвета текста?, Вот там иконка кнопки — снизу иконки прямоугольний который показует цвет текста, Я вот попробывал зделать для SpeedButton1, и у меня вышло что я хотел, мне поросто нужно узнать как можно обратитса к изображению кнопки чтобы туда прописать этот код!!!

• Дмитрий пишет:
  02 Сен 2010 в 7:59 пп

  Vlad, привет у меня такой вопрос с подсказками я розобрался всьо выходит, но одно но у меня не отображаэтса подсказка RibbonGroup->DialogAction — событие в этом свойстве задано и подсказка для этого события тоже создана но не показывает, что делать?

• Дмитрий пишет:
  02 Сен 2010 в 8:37 пп

  Vlad, я розобрался спасибо, афегезные стати, побольше таких!!!!!!!!

• Agronom пишет:
  04 Сен 2010 в 6:30 пп

  Vlad, большое спасибо за статью! Практически все получилось, за исключением динамического создания кнопок с выпадающим списком (btDropDown и BtSplit). В выпадающем списке иконки «съезжают» вниз где-то на треть и частично отсекаются.
  Вот картинка
  Создаю кнопку так:

  
  // сначала добавляем кнопку с выпадающим списком
  aci:=abi.Items.Add; // aci (ActionClientItem) - abi - ActionBarItem
  // создаем экшн, присваиваем ему икону и заголовок задаем обработчик
  aci.action:=CreateNewAction(ActionManager1, caption1, imageindex1, process_function);
  Tbuttonproperties(aci.CommandProperties).ButtonType:=btDropDown;
  Tbuttonproperties(aci.CommandProperties).ButtonSize:=bsLarge; 

  // Теперь добавляем элементы выпадающего списка из заранее заготовленного массива
for i:=0 to elements.count-1 do
begin
acie:=aci.Items.Add;
acie.Action:=CreateNewAction(Actionmanager1,elements.items[i].caption,elements.items[i].imageindex,process_function);
end;


  Пожалуйста, подскажите, что я могу делать не так.
  При этом вариант создать все в design-time, а потом  прятать, не подходит, потому что интерфейс приложения будет создаваться пользователем.
   
  Заранее спасибо!

• Vlad пишет:
  06 Сен 2010 в 1:45 дп

  Судя по скрину могу предположить, что иконки не стандартного размера. Размер у них какой? По-моему, проблемы со «съезжающими» картинками я рассматривал в справочнике…

• Agronom пишет:
  09 Сен 2010 в 4:33 пп

  Иконки я делал в IcoFX, каждая иконка содержит один слайд 16*16 или 32*32 (про разрешение иконки IcoFX ничего не спросило). Иконки с одинаковым названием, но разного размера кладутся в 2 разные папки Ico16 и Ico32, а потом во время создания очередного элемента ActionClientItem добавляются в 2 ImageLista, которые создаются динамически со значениями свойств:

  
  // создаем ImageList
  rib_images := TImageList.Create(Owner);
  rib_images.Name := 'rib_images';
  rib_images.ColorDepth := cd32Bit;
  rib_images.DrawingStyle := dsTransparent;
  rib_images.Height := 16;
  rib_images.Width := 16;
  rib_largeimages := TImageList.Create(Owner);
  rib_largeimages.Name := 'rib_largeimages';
  rib_largeimages.ColorDepth := cd32Bit;
  rib_largeimages.DrawingStyle := dsTransparent;
  rib_largeimages.Height := 32;
  rib_largeimages.Width := 32;
  -----------------------

  acm.Images := rib_images; // acm:TActionManager
  acm.LargeImages := rib_largeimages;

  ----------------------
  // при добавлении элемента acie ActionItema aci
  acie:=aci.Items.Add;
  rib_images.AddIcon(ribe.ico16); // добавляем икону 16*16 //  ribe.Ico16:TIcon
  rib_largeimages.AddIcon(ribe.ico32); // добавляем икону 32*32 //  ribe.Ico32:TIcon
  acie.Action:=createnewaction(acm,ribe.caption,rib_images.count-1,process_function);
  // создали action и тут же ему указали номер иконы в Imagelist
  //функция CreateNewActionвыглядит так:
  function createnewaction(acm: TActionManager; caption: string;
  imageindex: integer; process_function: TNotifyEvent): TAction;
  var
  act: TAction;
  begin
  act := TAction.Create(acm);
  inc(lastaction);
  act.Name := 'action' + inttostr(lastaction);
  act.caption := caption;
  if imageindex &gt;= 0 then
  act.imageindex := imageindex;
  acm.AddAction(act, nil);
  act.OnExecute := process_function;
  result := act;
  end;

  Опять же, если создать то же самое вручную мышью с теми же иконками все рисуется нормально…
   

• Михаил пишет:
  18 Сен 2010 в 3:38 дп

  Уважаемый Влад!
  Большое спасибо за Ваш труд.
  Проблема (возможно ошибка в коде TRibbon): для кнопок, у которых ButtonSize = bsSmall, не удается создать группу — работает некорректно, «загораются» все кнопки одновременно. Если ButtonSize = bsLarge, то все OK. Попробуйте изменить ButtonSize с bsLarge на bsSmall для кнопок стиля в Embarcaderoвском примере RibbonDemo — переключение работать будет, но состояние кнопок отображаться будет неверно, все они «западут», а не будут , как положено, отскакивать.
  Допускаю, конечно, и своё непонимание. А как Вы считаете?

• Vlad пишет:
  18 Сен 2010 в 3:49 дп

  2Михаил, работал с кнопками во всех их проявлениях от мелких до крупных с btSplit и пр., но такого случая как описали Вы — не встречал. Проверьте, может быть у Action кнопок не дефолтное значение GroupIndex стоит? В этом случае они и должны западать. Проверил сейчас у себя — кинул на RibbonGroup 3 кнопки — ничего не «запало»…

• Михаил пишет:
  18 Сен 2010 в 4:55 дп

  Уважаемый Влад!
  Дополнительная информация для размышления. А как же в этом примере работают кнопки выравнивания текста — они же bsSmall? Они работают не по правилам. У них GroupIndex = 0. И корректно работают только в присутствии TRichEdit.

• Михаил пишет:
  18 Сен 2010 в 5:45 дп

  Уважаемый Влад!
  Проверил. Вроде порядок. Еще раз подтвердил: меняешь кнопки с маленьких на большие, начинает работать как надо. Можно ли выслать проект? Если да, то как?

• Михаил пишет:
  18 Сен 2010 в 1:07 пп

  Уважаемый Влад!
  Прошу простить за надоедливость.
  Продолжил эксперимент с родным примером TRibbon Embarcadero RibbonDemo. Переключение стилей. Если заменить большие кнопки на маленькие, то работает правильно. Но только если в обработчике команда на изменение стиля. Меняем команду (например, на Exit;), работает неправильно. Меняем теперь на большие кнопки – работает правильно (уже и с Exit;). Т.е. правильность работы должна обеспечиваться либо командой на изменение стиля, либо режимом больших кнопок. Продолжаю выяснения.

• Vlad пишет:
  22 Сен 2010 в 1:21 дп

  Михаил, ответ (предварительный) тут. Как появится больше времени — остараюсь разобраться более досканально

• Михаил пишет:
  23 Сен 2010 в 3:25 дп

  Уважаемый Влад! Верно, RibbonGroup1.RecreateControls проблему решает, если не считать подергиваний при перерисовке всех RibbonGroup, которые идут после RibbonGroup1. Спасибо за труд.

• Vlad пишет:
  23 Сен 2010 в 6:14 пп

  Михаил, следует помнить, что предложенный мной вариант — это не лекарство от болезни Ribbon’а. Это один из возможных временных вариантов решения проблемы. Для более детального решения (оно же — правильное) надо будет покопаться в механизме Ribbon. То, что большие кнопки пашут как надо БЕЗ RecreateControls уже наталкивает на некоторые мысли, но пока времени на разбор нет…

• Михаил пишет:
  24 Сен 2010 в 3:01 дп

  Уважаемый Влад! Это было понятно. Спасибо. Б

• Михаил пишет:
  24 Сен 2010 в 3:56 дп

  Ошибка вышла. Уважаемый Влад! Это было понятно. Спасибо. Будем надеяться.

• Пётр пишет:
  07 Окт 2010 в 12:17 дп

  А подскажите как скрыть RibbonPage, бьюсь нигде немо гу найти, говорят что вообще невозможно это сделать,
  т.е. есть 4 страницы, а нужно например скрыть 3-ю а потом её отобразить

• Vlad пишет:
  07 Окт 2010 в 5:58 пп

  На сколкько я понимаю подобные действия в Ribbon относятся к работе с контекстными вкладками (например, в Ворде есть контекстная вкладка для работы с таблицами — появляется только когда надо нарисовать таблицу, сменить оформление и т.д.) и применительно к Ribbon Controls, видимо народ прав — контекстных вкладок не предусмотрено.

• Андрей пишет:
  22 Мар 2011 в 4:33 дп

  Удивительно, но Риббон отказывается корректно работать с MDI-формами (. Это косяк, перечёркивающий весь смысл создания такого компонента в Дельфи. Ну нафига мне иметь возможность разместить множество команд удобно, если я не могу открывать документы с возможностью «слияния» двух риббонов )

• Sky пишет:
  24 Окт 2011 в 12:34 дп

  Вечер добрый. Подскажите как смогли решить проблему с MDI окнами, кнопки закрытия, сворачивания расположены не там где должны быть.

• Vlad пишет:
  24 Окт 2011 в 1:39 дп

  Sky, сейчас точно не скажу, т.к. было это давным-давно =), но в сети встречался небольшой самописный компонент MDIFix или как-то так — специально для решения проблем с MDI-окошками в Ribbon’е. Вот его и использовал

• Sky пишет:
  26 Окт 2011 в 2:05 дп

  Видел его, но тогда управление окошками (сворачивание/разворачивание/закрытие) придется выносить на панельку, т.к. тот компонент убирает кнопки системного меню, так?

Ваш ответ