Пошаговое руководство. Обновление приложения Scribble MFC (часть 1)

Замечание

Библиотека классов Microsoft Foundation (MFC) продолжает поддерживаться. Однако мы больше не добавляем функции или обновляем документацию.

В этом пошаговом руководстве показано, как изменить существующее приложение MFC для использования пользовательского интерфейса ленты. Visual Studio поддерживает ленты Office 2007 Ribbon и Windows 7 Scenic Ribbon. Дополнительные сведения об пользовательском интерфейсе ленты см. в разделе "Лента".

Это пошаговое руководство изменяет классический пример Scribble 1.0 MFC, который позволяет использовать мышь для создания рисунков линий. В этой части пошагового руководства показано, как изменить пример Scribble, чтобы отобразить панель ленты. Часть 2 добавляет дополнительные кнопки на панель ленты.

Предпосылки

Пример Scribble 1.0 MFC. Сведения о преобразовании в Visual Studio 2017 или более поздней версии см. в руководстве по переносу: Scribble MFC.

Разделы

В этой части пошагового руководства приведены следующие разделы:

Замена базовых классов
Добавление растровых карт в проект
Добавление ресурса ленты в проект
Создание экземпляра ленточной панели
Добавление категории ленты
Настройка внешнего вида приложения

Замена базовых классов

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

Замена базовых классов в приложении Scribble

В scribble.cpp убедитесь, что CScribbleApp::InitInstance включает вызов AfxOleInit.
Добавьте следующий код в файл pch.h (stdafx.h в Visual Studio 2017 и более ранних версиях):
```
#include <afxcontrolbars.h>
```
В scribble.h измените определение класса CScribbleApp таким образом, чтобы он был производным от класса CWinAppEx.
```
class CScribbleApp: public CWinAppEx
```
Scribble 1.0 был написан, когда приложения Windows использовали файл инициализации (.ini) для сохранения данных предпочтения пользователя. Вместо файла инициализации измените Scribble, чтобы сохранить настройки пользователей в реестре. Чтобы задать ключ реестра и базу, введите следующий код в CScribbleApp::InitInstance после оператора LoadStdProfileSettings().
```
SetRegistryKey(_T("MFCNext\\Samples\\Scribble2"));
SetRegistryBase(_T("Settings"));
```
Основной кадр для нескольких приложений интерфейса документов (MDI) больше не является производным от CMDIFrameWnd класса. Вместо этого он является производным от класса CMDIFrameWndEx .

В файлах mainfrm.h и mainfrm.cpp замените все ссылки CMDIFrameWnd на CMDIFrameWndEx.
В файлах childfrm.h и childfrm.cpp замените CMDIChildWnd на CMDIChildWndEx.

В дочернем фрейме. H-файл, замените CSplitterWnd на CSplitterWndEx.
Измените панели инструментов и панели состояния, чтобы использовать новые классы MFC.

В файле mainfrm.h:
1. Замените CToolBar на CMFCToolBar.
2. Замените CStatusBar на CMFCStatusBar.
В файле mainfrm.cpp:
1. Замените m_wndToolBar.SetBarStyle на m_wndToolBar.SetPaneStyle.
2. Замените m_wndToolBar.GetBarStyle на m_wndToolBar.GetPaneStyle.
3. Замените DockControlBar(&m_wndToolBar) на DockPane(&m_wndToolBar).

В файле ipframe.cpp закомментируйте следующие три строки кода.

m_wndToolBar.EnableDocking(CBRS_ALIGN_ANY);
pWndFrame->EnableDocking(CBRS_ALIGN_ANY);
pWndFrame->DockPane(&m_wndToolBar);

Сохраните изменения, а затем создайте и запустите приложение.

Добавление растровых карт в проект

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

Используйте редакторы ресурсов для создания собственных растровых карт. Или используйте редакторы ресурсов для сборки растровых изображений из переносимых сетевых графических изображений (.png), включенных в Visual Studio, и их можно скачать из библиотеки образов Visual Studio.

Однако пользовательский интерфейс Ribbon требует, чтобы некоторые растровые изображения поддерживали прозрачность. Прозрачные растровые изображения используют 32-разрядные пиксели, где 24 бита указывают красные, зеленые и синие компоненты цвета, а 8 бит определяют альфа-канал , указывающий прозрачность цвета. Текущие редакторы ресурсов могут просматривать, но не изменять растровые изображения с 32-разрядными пикселями. Следовательно, используйте внешний редактор изображений вместо редакторов ресурсов для управления прозрачными растровыми изображениями.
Скопируйте соответствующий файл ресурсов из другого приложения в проект и импортируйте растровые изображения из этого файла.

В этом пошаговом руководстве файлы ресурсов копируются из примера, созданного в Пошаговом руководстве: создание приложения ленты с помощью MFC.

Добавление растровых изображений в проект

Используйте Проводник файлов, чтобы скопировать следующие .bmp файлы из каталога ресурсов (res) примера Ribbon в каталог ресурсов (res) проекта Scribble.
1. Скопируйте main.bmp в проект Scribble.
2. Скопируйте filesmall.bmp и filelarge.bmp в проект Scribble.
3. Сделайте новые копии файлов filelarge.bmp и filesmall.bmp и сохраните эти копии в примере Ribbon. Переименуйте копии homesmall.bmp и homelarge.bmp, а затем переместите копии в проект Scribble.
4. Создайте копию файла toolbar.bmp, но сохраните копию в примере Ribbon. Переименуйте копию panelicons.bmp и переместите копию в проект Scribble.
Импортируйте растровое изображение для приложения MFC. В представлении ресурсов дважды щелкните узел scribble.rc , дважды щелкните узел bitmap и нажмите кнопку "Добавить ресурс". В появившемся диалоговом окне нажмите кнопку "Импорт". Перейдите к каталогу res , выберите файл main.bmp и нажмите кнопку "Открыть".

Растровое изображение main.bmp содержит изображение 26x26. Измените идентификатор растрового изображения на IDB_RIBBON_MAIN.
Импортируйте растровые изображения для меню файла, подключенного к кнопке "Приложение ".
1. Импортируйте файл filesmall.bmp, содержащий одиннадцать изображений 16x16 (16x176). Измените идентификатор растрового изображения на IDB_RIBBON_FILESMALL.
Замечание

Так как нам нужны только первые восемь 16x16 изображений (16x128), то при необходимости можно обрезать правую ширину этого растрового изображения от 176 до 128.
1. Импортируйте filelarge.bmp, содержащий девять изображений 32x32 (32x288). Измените идентификатор растрового изображения на IDB_RIBBON_FILELARGE.
Импортируйте растровые изображения для категорий и панелей ленты. Каждая вкладка на панели ленты — это категория, состоящая из текстовой метки и необязательного изображения.
1. Импортируйте растровое изображение homesmall.bmp, содержащее одиннадцать 16x16 изображений для маленьких кнопок. Измените идентификатор растрового изображения на IDB_RIBBON_HOMESMALL.
2. Импортируйте растровое изображение homelarge.bmp, которое содержит девять 32x32 изображения для больших растровых карт кнопок. Измените идентификатор растрового изображения на IDB_RIBBON_HOMELARGE.
Импортируйте растровые изображения для измененных панелей ленты. Эти растровые изображения или значки панели используются после операции изменения размера, если лента слишком мала, чтобы отобразить всю панель.
1. Импортируйте растровое изображение panelicons.bmp, содержащее восемь 16x16 изображений. В окне "Свойства" редактора растровых карт настройте ширину растрового изображения на 64 (16x64). Измените идентификатор растрового изображения на IDB_PANEL_ICONS.
Замечание

Так как нам нужны только первые четыре изображения 16x16 (16x64), то при необходимости можно обрезать правую ширину этого растрового изображения от 128 до 64.

Добавление ресурса ленты в проект

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

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

Добавление ресурса ленты в проект

При выборе проекта Scribble в обозревателе решений в меню "Проект " нажмите кнопку "Добавить ресурс".
В диалоговом окне Добавить ресурс выберите Лента и нажмите Создать.

Visual Studio создает ресурс ленты и открывает его в представлении конструктора. Идентификатор ресурса ленты — это IDR_RIBBON1, который отображается в представлении ресурсов. Лента содержит одну категорию и одну панель.
Вы можете настроить кнопку "Приложение ", изменив его свойства. Идентификаторы сообщений, используемые в этом коде, уже определены в меню Scribble 1.0.
В представлении конструктора нажмите кнопку "Приложение" , чтобы отобразить его свойства. Измените значения свойств следующим образом: Image на IDB_RIBBON_MAIN, Prompt на File, Keys на f, Large Images на IDB_RIBBON_FILELARGE, и Small Images на IDB_RIBBON_FILESMALL.
Следующие изменения создают меню, которое отображается, когда пользователь нажимает кнопку "Приложение ". Щелкните многоточие (...) рядом с основными элементами , чтобы открыть редактор элементов.
1. При выборе типа ЭлементКнопка, нажмите Добавить, чтобы добавить кнопку. Измените заголовок на &New, идентификатор на ID_FILE_NEW, изображение на 0, Изображение большого размера на 0.
2. Нажмите кнопку "Добавить ", чтобы добавить кнопку. Измените заголовок на &Save, ID на ID_FILE_SAVE, Image на 2, и Image Large на 2.
3. Нажмите кнопку "Добавить ", чтобы добавить кнопку. Измените заголовок на Save &As, ID на ID_FILE_SAVE_AS, Image на 3, и Image Large на 3.
4. Нажмите кнопку "Добавить ", чтобы добавить кнопку. Измените заголовок на &Print, ID на ID_FILE_PRINT, Image на 4, и Image Large на 4.
5. Измените тип элемента на разделитель и нажмите кнопку "Добавить".
6. Измените тип элемента на Button. Нажмите кнопку "Добавить ", чтобы добавить пятую кнопку. Измените заголовок на &Close, ID на ID_FILE_CLOSE, Image на 5, и Image Large на 5.
Следующие изменения создают подменю под кнопкой Печать, созданной на предыдущем шаге.
1. Нажмите кнопку "Печать ", измените тип элемента на "Метка" и нажмите кнопку "Вставить". Измените Подпись на Preview and print the document.
2. Нажмите кнопку "Печать ", измените тип элемента на "Кнопка" и нажмите кнопку "Вставить". Измените заголовок на &Print, ID на ID_FILE_PRINT, Image на 4, и Image Large на 4.
3. Нажмите кнопку "Печать " и нажмите кнопку "Вставить ", чтобы добавить кнопку. Измените заголовок на &Quick Print, ID на ID_FILE_PRINT_DIRECT, Image на 7, и Image Large на 7.
4. Нажмите кнопку "Печать " и нажмите кнопку "Вставить ", чтобы добавить другую кнопку. Измените заголовок на Print Pre&view, ID на ID_FILE_PRINT_PREVIEW, Image на 6, и Image Large на 6.
5. Теперь вы изменили основные элементы. Нажмите кнопку "Закрыть", чтобы выйти из редактора элементов.
В следующем изменении создается кнопка выхода, которая отображается в нижней части меню кнопки "Приложение ".
1. Выберите вкладку "Представление ресурсов " в обозревателе решений.
2. В окне "Свойства " щелкните многоточие (...) рядом с кнопкой , чтобы открыть редактор элементов.
3. При выборе типа ЭлементКнопка, нажмите Добавить, чтобы добавить кнопку. Измените Заголовок на E&xit, ID на ID_APP_EXIT, изображение на 8.
4. Вы изменили кнопки. Нажмите кнопку "Закрыть", чтобы выйти из редактора элементов.

Создание экземпляра панели ленты

Ниже показано, как создать экземпляр панели ленты при запуске приложения. Чтобы добавить панель ленты в приложение, объявите панель ленты в файле mainfrm.h. Затем в файле mainfrm.cpp напишите код для загрузки ресурса ленты.

Чтобы создать экземпляр панели ленты

В файле mainfrm.h добавьте элемент данных в защищенный раздел CMainFrame, определение класса для основного кадра. Этот элемент предназначен для ленточной панели управления.
```
// Ribbon bar for the application
CMFCRibbonBar m_wndRibbonBar;
```
В файле mainfrm.cpp добавьте следующий код перед окончательной инструкцией return в конце функции CMainFrame::OnCreate. Он создает экземпляр панели ленты.
```
// Create the ribbon bar
if (!m_wndRibbonBar.Create(this))
{
    return -1;   //Failed to create ribbon bar
}
m_wndRibbonBar.LoadFromResource(IDR_RIBBON1);
```

Настройка ресурса ленты

Теперь, когда вы создали кнопку "Приложение" , вы можете добавить элементы на ленту.

Замечание

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

Добавление домашней категории и панели "Изменить"

Для программы Scribble требуется только одна категория. В представлении конструктора дважды щелкните категорию , чтобы добавить ее и отобразить ее свойства. Измените значения свойств следующим образом: Заголовок на &Home, Крупные изображения на IDB_RIBBON_HOMELARGE, Небольшие изображения на IDB_RIBBON_HOMESMALL.
Каждая категория вкладок организована в именованных панелях. Каждая панель содержит набор элементов управления, которые выполняют связанные операции. Эта категория имеет одну панель. Щелкните панель и измените заголовок на Edit.
На панели "Изменить " добавьте кнопку, отвечающую за очистку содержимого документа. Идентификатор сообщения для этой кнопки уже определен в ресурсе IDR_SCRIBBTYPE меню. Укажите Clear All текст кнопки и индекс растрового рисунка, который украшает кнопку. Откройте панель элементов и перетащите кнопку на панель "Изменить ". Нажмите кнопку, а затем измените заголовок на Clear All, ID на ID_EDIT_CLEAR_ALL, индекс изображения на 0, индекс крупного изображения на 0.
Сохраните изменения, а затем создайте и запустите приложение. Приложение Scribble должно отображаться, и оно должно иметь панель ленты в верхней части окна вместо строки меню. Панель ленты должна иметь одну категорию, Главная, и Главная должна иметь одну панель, Редактировать. Добавленные кнопки ленты должны быть связаны с существующими обработчиками событий, а кнопки "Открыть", "Закрыть", " Сохранить", " Печать" и "Очистить все " должны работать должным образом.

Настройка внешнего вида приложения

Визуальный менеджер — это глобальный объект, который управляет всеми рисунками для приложения. Так как исходное приложение Scribble использует стиль пользовательского интерфейса Office 2000, приложение может выглядеть старомодным. Вы можете сбросить приложение для использования визуального диспетчера Office 2007, чтобы оно напоминало приложение Office 2007.

Настройка внешнего вида приложения

В функции CMainFrame::OnCreate введите следующий код перед инструкцией return 0;, чтобы изменить визуальный менеджер по умолчанию и стиль.
```
// Set the default manager to Office 2007
CMFCVisualManager::SetDefaultManager(RUNTIME_CLASS(CMFCVisualManagerOffice2007));
CMFCVisualManagerOffice2007::SetStyle(CMFCVisualManagerOffice2007::Office2007_LunaBlue);
```
Сохраните изменения, а затем создайте и запустите приложение. Пользовательский интерфейс приложения должен напоминать пользовательский интерфейс Office 2007.

Дальнейшие шаги

Вы изменили классический пример Scribble 1.0 на платформе MFC, чтобы использовать Ribbon Designer. Теперь перейдите к части 2.

См. также

пошаговое руководство
Пошаговое руководство. Обновление приложения Scribble MFC (часть 2)

Обратная связь

Были ли сведения на этой странице полезными?

Last updated on 2025-11-07

Пошаговое руководство. Обновление приложения Scribble MFC (часть 1)

Предпосылки

Разделы

Замена базовых классов

Замена базовых классов в приложении Scribble

Добавление растровых карт в проект

Добавление растровых изображений в проект

Добавление ресурса ленты в проект

Добавление ресурса ленты в проект

Создание экземпляра панели ленты

Чтобы создать экземпляр панели ленты

Настройка ресурса ленты

Добавление домашней категории и панели "Изменить"

Настройка внешнего вида приложения

Настройка внешнего вида приложения

Дальнейшие шаги

См. также

Обратная связь

Дополнительные ресурсы