Procédure pas - à - pas : Mettre à jour l'application scribble MFC (partie 1)

Cette procédure pas - à - pas montre comment modifier une application MFC existante d'utiliser l'interface utilisateur de ruban.Visual Studio prend en charge le ruban Office 2007 et le ruban scénique Windows 7.Pour plus d'informations sur l'interface utilisateur de ruban, consultez rubans sur le site Web MSDN.

Cette procédure pas - à - pas modifie l'exemple scribble MFC classique de scribble 1,0 qui vous permet d'utiliser la souris pour créer des dessins constitués de traits.Cette partie de la procédure pas - à - pas indique comment modifier l'exemple scribble afin qu'il affiche une barre de ruban.partie ajoute d'autres boutons de la barre de ruban.

Composants requis

Exemples Visual C++

Sections

Cette partie de la procédure pas - à - pas présente les sections suivantes :

substitution des classes de base
Ajouter des images au projet
Ajouter une ressource de ruban au projet
créer une instance de la barre de ruban
ajouter une catégorie ruban
Définition de l'apparence de l'application

substitution des classes de base

Pour convertir une application qui prend en charge un menu à une application qui prend en charge un ruban, vous devez dériver l'application, la fenêtre frame, et les classes ToolBars des classes de base mises à jour.(Nous vous suggérons que vous n'avez pas l'exemple d'origine scribble ; à la place, nettoyer le projet scribble, copiez -le dans un autre répertoire, puis modifiez la copie.)

Pour remplacer les classes de base dans l'application scribble

Dans scribble.cpp, vérifiez qu' CScribbleApp::InitInstance inclut un appel à AfxOleInit.
Ajoutez le code suivant au fichier stdafx.h.
```
#include <afxcontrolbars.h>
```
Dans scribble.h, modifiez la définition de la classe d' CScribbleApp afin d'être dérivée de CWinAppEx, classe.
```
class CScribbleApp: public CWinAppEx
```
Scribble 1,0 a été entré lorsque les applications Windows ont utilisé un fichier d'initialisation (.ini) pour enregistrer des données sur les préférences de l'utilisateur.Au lieu d'un fichier d'initialisation, modifiez scribble pour stocker les préférences de l'utilisateur dans le Registre.Pour définir la clé de Registre et la base, tapez le code suivant dans CScribbleApp::InitInstance après l'instruction d' LoadStdProfileSettings() .
```
SetRegistryKey(_T("MFCNext\\Samples\\Scribble2"));
SetRegistryBase(_T("Settings"));
```
Le frame principal d'une application d'interface multidocument (MDI) n'est plus dérivé de la classe d' CMDIFrameWnd .À la place, il est dérivé de la classe de CMDIFrameWndEx .

dans les fichiers de mainfrm.h et de mainfrm.cpp, remplacez toutes les références à CMDIFrameWnd par CMDIFrameWndEx.
dans les fichiers de childfrm.h et de childfrm.cpp, remplacez CMDIChildWnd par CMDIChildWndEx.

dans le childfrm.le fichier de h, remplacez CSplitterWnd par CSplitterWndEx.
modifiez les barres d'outils et les barres d'état pour utiliser les nouvelles classes MFC.

dans le fichier de mainfrm.h :
1. remplacez CToolBar par CMFCToolBar.
2. remplacez CStatusBar par CMFCStatusBar.
dans le fichier de mainfrm.cpp :
1. remplacez m_wndToolBar.SetBarStyle par m_wndToolBar.SetPaneStyle
2. remplacez m_wndToolBar.GetBarStyle par m_wndToolBar.GetPaneStyle
3. remplacez DockControlBar(&m_wndToolBar) par DockPane(&m_wndToolBar)

dans le fichier d'ipframe.cpp, commentez les trois lignes de code suivantes.

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

Si vous avez l'intention d'attacher votre application de manière statique, ajoutez le code suivant au début du fichier de ressources du projet (.rc).
```
#include "afxribbon.rc"
```
Le fichier d'afxribbon.rc contient les ressources requises au moment de l'exécution.Assistant Application MFC inclut ce fichier automatiquement lorsque vous créez une application.
Enregistrez les modifications puis générez et exécutez l'application.

[Sections]

Ajouter des images au projet

Les quatre étapes de cette procédure pas - à - pas requièrent des ressources bitmap.Vous pouvez obtenir les bitmaps appropriées de plusieurs façons :

Utilisez Éditeurs de ressources pour inventer vos propres bitmaps.Ou utilisez les éditeurs de ressources pour assembler des bitmaps des images portables des graphiques de réseau (.png) incluses avec Visual Studio.ces images sont dans le répertoire d' VS2008ImageLibrary.

Toutefois, l'interface utilisateur de ruban exige que certaines bitmaps prennent en charge des images transparentes.Les bitmaps transparentes utilisent les pixels de 32 bits, 24 bits spécifient les composantes rouge, vert, et bleu de la couleur, et 8 bits définissent un canal alpha qui spécifie la transparence de la couleur.Les éditeurs de ressources actuels peuvent afficher, mais pas modifier les bitmaps avec les pixels de 32 bits.Par conséquent, utilisez un éditeur d'image externe au lieu des éditeurs de ressources pour manipuler les bitmaps transparentes.
Copiez un fichier de ressources approprié d'une autre application à votre projet puis importez les bitmaps à partir de ce fichier.

Cette procédure pas - à - pas copier les fichiers de ressources d'une application dans le dossier exemples.

Pour ajouter des images au projet

Utilisez l'Explorateur de fichiers pour copier les fichiers suivants .bmp du répertoire de ressources (res) de l'exemple RibbonGadgets :
1. Copiez main.bmp à votre projet scribble.
2. Copiez filesmall.bmp et filelarge.bmp à votre projet scribble.
3. Effectuez les nouvelles copies des fichiers de filelarge.bmp et de filesmall.bmp, mais enregistrer des copies dans l'exemple RibbonGadgets.Renommez les copies homesmall.bmp et homelarge.bmp puis déplacez les copies à votre projet scribble.
4. Effectuez une copie du fichier de toolbar.bmp, mais enregistrez la copie dans l'exemple RibbonGadgets.Renommez la copie panelicons.bmp puis déplacez la copie à votre projet scribble.
Importez la bitmap pour une application MFC.Dans Affichage des ressources, double-cliquez sur le nœud de *** scribble.rc *** , double-cliquez sur le nœud de Bitmap , puis cliquez sur Ajouter une ressource.Dans la boîte de dialogue qui s'affiche, cliquez sur Importer.Accédez au dossier d' res , sélectionnez le fichier de main.bmp, puis cliquez sur Ouvrir.

la bitmap de main.bmp contient une image 26x26.Modifiez l'ID de la bitmap en IDB_RIBBON_MAIN.
Importez les bitmaps du menu fichier associé à la touche application.
1. Importez le fichier de filesmall.bmp, qui contient dix 16x16 images (16x160).Étant donné que nous avons uniquement besoin de huit 16x16 images (16x128), utilisez Affichage des ressources pour modifier la largeur de cette bitmap de 160 par 128.Modifiez l'ID de la bitmap en IDB_RIBBON_FILESMALL.
2. importez le filelarge.bmp, qui contient huit images 32x32 (32x256).Modifiez l'ID de la bitmap en IDB_RIBBON_FILELARGE.
Importez les bitmaps pour les catégories ruban et les panneaux.Chaque onglet dans la barre de ruban est une catégorie, et se compose d'une étiquette de texte et d'une image facultative.
1. Importez la bitmap de homesmall.bmp, qui contient huit 16x16 images pour les petites bitmap de bouton.Modifiez l'ID de la bitmap en IDB_RIBBON_HOMESMALL.
2. Importez la bitmap de homelarge.bmp, qui contient huit images 32x32 pour les grandes bitmap de bouton.Modifiez l'ID de la bitmap en IDB_RIBBON_HOMELARGE.
Importez les bitmaps pour les panneaux redimensionnés de ruban.Ces bitmaps, ou icônes de panneau, sont utilisées après qu'une opération de redimensionner si le ruban est trop petit pour afficher le panneau entier.
1. Importez la bitmap de panelicons.bmp, qui contient huit 16x16 images.Dans la fenêtre de Propriétés de Éditeur de bitmaps, ajuster la largeur de la bitmap à 64 (16x64).Modifiez l'ID de la bitmap en IDB_PANEL_ICONS.

[Sections]

Ajouter une ressource de ruban au projet

Lorsque vous convertissez une application qui utilise des menus à une application qui utilise un ruban, vous ne devez pas supprimer ou désactiver les menus existants.À la place, vous créez une ressource de ruban, ajoutez des boutons de ruban, puis associez les nouveaux boutons avec les éléments de menu existants.Bien que les menus ne sont plus visibles, les messages de la barre de ruban sont routés via les menus.en outre, les raccourcis de menu continuent à fonctionner.

un ruban comprend la touche application, qui est le grand bouton du côté supérieur gauche du ruban, et un ou plusieurs onglets de catégorie.Chaque onglet de catégorie contient un ou plusieurs panneaux qui agissent comme conteneurs pour les boutons et des contrôles de ruban.La procédure suivante montre comment créer une ressource de ruban puis personnaliser la touche application.

Pour ajouter une ressource de ruban au projet

Dans le menu de Projet , cliquez sur Ajouter une ressource.
Dans la boîte de dialogue de Ajouter une ressource , Ruban sélectionnez et cliquez sur Nouveau.

Visual Studio crée une ressource de ruban et l'ouvre en mode Design.L'ID de ressource de ruban est IDR_RIBBON1, qui s'affiche dans Affichage des ressources.le ruban contient une catégorie et un panneau.
vous pouvez personnaliser la touche application en modifiant ses propriétés.Les ID de message qui sont utilisés dans ce code sont déjà définis dans le menu pour scribble 1,0.
En mode Design, cliquez sur la touche application pour afficher ses propriétés.Modifiez les valeurs de propriété comme suit : Image à IDB_RIBBON_MAIN, Invite à Fichier, Clés à f, *** Les images *** à IDB_RIBBON_FILELARGE, et *** Les images *** à IDB_RIBBON_FILESMALL.
Les modifications suivantes créent le menu qui s'affiche lorsque l'utilisateur clique sur la touche application.Cliquez sur le bouton de sélection (*** … ***) en regard de *** éléments principaux *** pour ouvrir Éditeur d'éléments.
1. cliquez sur *** ajoutez *** pour ajouter un bouton.Modifiez Légende par &New, ID à ID_FILE_NEW, Image à 0, Grande image à 0.
2. cliquez sur *** ajoutez *** pour ajouter un deuxième bouton.Modifiez Légende par &Save, ID par ID_FILE_SAVE, Image par 2, et Grande image par 2.
3. cliquez sur *** ajoutez *** pour ajouter un troisième bouton.Modifiez Légende par Enregistrez les &As, ID par ID_FILE_SAVE_AS, Image par 3, et Grande image par 3.
4. cliquez sur *** ajoutez *** pour ajouter un quatrième bouton.Modifiez Légende par &Print, ID par ID_FILE_PRINT, Image par 4, et Grande image par 4.
5. Modifiez le type de item par Séparateur puis cliquez sur *** ajoutez ***.
6. Modifiez le type de item par Button.cliquez sur *** ajoutez *** pour ajouter un cinquième bouton.Modifiez Légende par &Close, ID par ID_FILE_CLOSE, Image par 5, et Grande image par 5.
Les modifications suivantes créent un sous-menu sous la touche " imprimer " créée à l'étape précédente.
1. Cliquez sur le bouton de Imprimer , remplacez le type de item par Étiquette, puis cliquez sur Insérer.Modifiez Légende par Afficher un aperçu de et imprimer le document.
2. Cliquez sur le bouton de Imprimer , remplacez le type de item par Button, puis cliquez sur Insérer.Modifiez Légende par &Print, ID par ID_FILE_PRINT, Image par 4, et Grande image par 4.
3. Cliquez sur le bouton de Imprimer puis cliquez sur Insérer pour ajouter un bouton.Modifiez Légende par copie de &Quick, ID par ID_FILE_PRINT_DIRECT, Image par 7, et Grande image par 7.
4. Cliquez sur le bouton de Imprimer puis cliquez sur Insérer pour ajouter un autre bouton.Modifiez Légende par copie Pre&view, ID par ID_FILE_PRINT_PREVIEW, Image par 6, et Grande image par6.
5. vous avez maintenant modifié *** éléments principaux ***.Cliquez sur Fermer pour quitter Éditeur d'éléments.
La modification suivante crée un bouton de sortie qui apparaît en bas du menu de touche application.
1. Dans la fenêtre de Propriétés , cliquez sur le bouton de sélection (*** … ***) en regard de Button pour ouvrir Éditeur d'éléments.
2. cliquez sur *** ajoutez *** pour ajouter un bouton.Modifiez Légende par E&xit, ID à ID_APP_EXIT, Image à8.

[Sections]

créer une instance de la barre de ruban

Les étapes suivantes indiquent comment créer une instance de la barre de ruban lorsque votre application démarre.Pour ajouter une barre de ruban à une application, déclarez la barre du ruban dans le fichier de mainfrm.h.Puis, dans le fichier de mainfrm.cpp, écrivez le code pour charger la ressource de ruban.

pour créer une instance de la barre de ruban

dans le fichier de mainfrm.h, ajoutez une donnée membre à la section protégée d' CMainFrame, la définition de classe pour le frame principal.ce membre représente la barre de ruban.
```
// Ribbon bar for the application
CMFCRibbonBar  m_wndRibbonBar;
```
Dans le fichier de mainfrm.cpp, ajoutez le code suivant avant l'instruction finale d' return à la fin de la fonction d' CMainFrame::OnCreate .Cela crée une instance de la barre de ruban.
```
// Create the ribbon bar
if (!m_wndRibbonBar.Create(this))
{
return -1;   //Failed to create ribbon bar
}
m_wndRibbonBar.LoadFromResource(IDR_RIBBON1);
```

[Sections]

Personnaliser la ressource de ruban

maintenant que vous avez créé la touche application, vous pouvez ajouter des éléments au ruban.

[!REMARQUE]

Cette procédure pas - à - pas utilise la même icône de panneau pour tous les panneaux.Toutefois, vous pouvez utiliser d'autres index de liste d'images pour afficher d'autres icônes.

Pour ajouter une catégorie et un panneau d'accueil de modification

Le programme scribble requiert une seule catégorie.En mode Design, cliquez sur Catégorie pour afficher ses propriétés.Modifiez les valeurs de propriété comme suit : Légende à &Home, *** Les images *** à IDB_RIBBON_HOMELARGE, *** Les images *** à IDB_RIBBON_HOMESMALL.
Chaque catégorie ruban est organisée en les panneaux nommés.Chaque panneau contient un ensemble de contrôles qui exécutent des opérations connexes.cette catégorie a un panneau.Cliquez sur Volet, puis modifiez Légende par modification et *** Index d'image *** par 0.
Dans le panneau de *** modification *** , ajoutez un bouton qui est chargé de supprimer le contenu du document.L'ID de message pour ce bouton a déjà été défini dans la ressource menu en IDR_SCRIBBTYPE.Spécifiez Effacer tout comme texte du bouton et index de la bitmap qui décore le bouton.Ouvrez Boîte à outils, puis faites glisser Button dans le panneau de *** modification *** .Cliquez sur le bouton puis modifiez Légende par Effacer tout, ID à ID_EDIT_CLEAR_ALL, *** Index d'image *** à 0, *** Plusieurs index d'image *** à 0.
Enregistrez les modifications, puis générez et exécutez l'application.L'application scribble doit être affichée, et elle doit avoir une barre de ruban en haut de la fenêtre au lieu d'une barre de menus.La barre de ruban doit avoir une catégorie, Accueil, et Accueil doit avoir un panneau, *** modification ***.Les boutons de ruban que vous avez ajoutés doivent être associés aux gestionnaires d'événements existants, et le Ouvrir, Fermer, Enregistrer, Imprimer, et des boutons de Effacer tout doivent fonctionner comme prévu.

[Sections]

Définition de l'apparence de l'application

Un gestionnaire visuel est un objet global qui vérifie tout le dessin d'une application.Étant donné que l'application d'origine scribble utilise le style de l'interface utilisateur (UI) Office 2000, l'application peut présenter l'old-fashioned.Vous pouvez réinitialiser l'application pour utiliser le gestionnaire visuel Office 2007 afin qu'elle ressemble à une application Office 2007.

Pour définir l'apparence de l'application

Dans la fonction d' CMainFrame::OnCreate , tapez le code suivant pour modifier le pilote et le style visuels par défaut.

// Set the default manager to Office 2007 
CMFCVisualManager::SetDefaultManager(RUNTIME_CLASS(CMFCVisualManagerOffice2007));
CMFCVisualManagerOffice2007::SetStyle(CMFCVisualManagerOffice2007::Office2007_LunaBlue);

Enregistrez les modifications, puis générez et exécutez l'application.L'interface utilisateur de l'application doit ressembler à Office 2007 interface utilisateur.

[Sections]

Étapes suivantes

Vous avez modifié l'exemple scribble MFC classique de scribble 1,0 pour utiliser le concepteur de ruban.allez maintenant à partie.

Voir aussi

Tâches

Procédure pas - à - pas : Mettre à jour l'application scribble MFC (partie 2)

Autres ressources

Procédures pas - à - pas (MFC)

Last updated on 2013-06-07

Procédure pas - à - pas : Mettre à jour l'application scribble MFC (partie 1)

Composants requis

Sections

substitution des classes de base

Pour remplacer les classes de base dans l'application scribble

Ajouter des images au projet

Pour ajouter des images au projet

Ajouter une ressource de ruban au projet

Pour ajouter une ressource de ruban au projet

créer une instance de la barre de ruban

pour créer une instance de la barre de ruban

Personnaliser la ressource de ruban

Pour ajouter une catégorie et un panneau d'accueil de modification

Définition de l'apparence de l'application

Pour définir l'apparence de l'application

Étapes suivantes

Voir aussi

Tâches

Autres ressources

Ressources supplémentaires