Tutorial: Actualizar la aplicación scribble de MFC (Parte 1)
Este tutorial muestra cómo modificar una aplicación MFC existente para utilizar la interfaz de usuario de la cinta de opciones.Visual Studio admite la cinta de opciones de Office 2007 y la cinta de opciones de Windows 7 Scenic.Para obtener más información sobre la interfaz de usuario de la cinta de opciones, vea cintas de opciones en el sitio web de MSDN.
Este tutorial modifica el ejemplo clásico scribble de MFC 1,0 que permite utilizar el mouse para crear dibujar líneas.Esta parte del tutorial se muestra cómo modificar el ejemplo scribble de modo que muestra una barra de la cinta de opciones.parte 2 agrega más botones en la barra de la cinta de opciones.
Requisitos previos
Secciones
Esta parte del tutorial tiene las secciones siguientes:
Reemplazar las clases base
Mapas de bits al proyecto
Agregar un recurso de la cinta de opciones al proyecto
Crear una instancia de la barra de la cinta de opciones
Agregar una categoría de la cinta de opciones
Establecer la apariencia de la aplicación
Reemplazar las clases base
Para convertir una aplicación que admite un menú en una aplicación que admite una cinta de opciones, debe derivar la aplicación, la ventana de marco, y las clases de la barra de herramientas de clases base actualizadas.(Sugerimos que no modificar el ejemplo original scribble; en su lugar, limpiar el proyecto scribble, cópielo a otro directorio y, a continuación modifique la copia).
Reemplazar las clases base de la aplicación scribble
En scribble.cpp, compruebe que CScribbleApp::InitInstance incluya una llamada a AfxOleInit.
Agregue el código siguiente al archivo stdafx.h.
#include <afxcontrolbars.h>En scribble.h, modifique la definición de la clase de CScribbleApp para derivarla de CWinAppEx (Clase).
class CScribbleApp: public CWinAppExScribble 1,0 se escribió cuando las aplicaciones para Windows utilizan un archivo de inicialización (.ini) para guardar datos de preferencia del usuario.En lugar de un archivo de inicialización, modifique el método para almacenar las preferencias del usuario en el registro.Para establecer la clave del Registro y la base, escriba el código siguiente en CScribbleApp::InitInstance después del fragmento de LoadStdProfileSettings() .
SetRegistryKey(_T("MFCNext\\Samples\\Scribble2")); SetRegistryBase(_T("Settings"));El marco principal para una aplicación de (MDI) de interfaz de múltiples documentos se deriva no más de la clase de CMDIFrameWnd .En su lugar, se deriva de la clase de CMDIFrameWndEx .
En los archivos de mainfrm.h y de mainfrm.cpp, reemplace todas las referencias a CMDIFrameWnd con CMDIFrameWndEx.
En los archivos de childfrm.h y de childfrm.cpp, reemplace CMDIChildWnd con CMDIChildWndEx.
En el childfrm.el archivo de h, reemplaza CSplitterWnd con CSplitterWndEx.
Modifique las barras de herramientas y barras de estado para utilizar las nuevas clases MFC.
En el archivo de mainfrm.h:
Reemplace CToolBar con CMFCToolBar.
Reemplace CStatusBar con CMFCStatusBar.
En el archivo de mainfrm.cpp:
Reemplace m_wndToolBar.SetBarStyle con m_wndToolBar.SetPaneStyle
Reemplace m_wndToolBar.GetBarStyle con m_wndToolBar.GetPaneStyle
Reemplace DockControlBar(&m_wndToolBar) con DockPane(&m_wndToolBar)
En el archivo de ipframe.cpp, marque como comentario las tres líneas de código siguientes.
m_wndToolBar.EnableDocking(CBRS_ALIGN_ANY); pWndFrame->EnableDocking(CBRS_ALIGN_ANY); pWndFrame->DockPane(&m_wndToolBar);Si piensa vincular la aplicación estáticamente, agregue el código siguiente al principio del archivo de recursos del proyecto (.rc).
#include "afxribbon.rc"El archivo de afxribbon.rc contiene los recursos necesarios en tiempo de ejecución.Asistente para aplicaciones MFC incluye este archivo automáticamente al crear una aplicación.
Guarde los cambios y a continuación compile y ejecute la aplicación.
[Secciones]
Mapas de bits al proyecto
Los cuatro pasos de este tutorial requieren recursos bitmap.Puede obtener mapas de bits adecuados de varias maneras:
Utilice Editores de recursos para inventar mapas de bits.O utilizar los editores de recursos para ensamblar mapas de bits de las imágenes portables de gráficos de red (.png) que se incluyen con Visual Studio.Estas imágenes se encuentran en el directorio de VS2008ImageLibrary.
Sin embargo, la interfaz de usuario de cinta requiere que algunos mapas de bits admiten imágenes transparentes.Los mapas de bits transparentes utilizan píxeles de 32 bits, donde 24 bits especifican los componentes rojo, verde, y azul del color, y 8 bits definen un canal alfa que especifique la transparencia del color.Los editores de recursos actuales pueden ver, pero no modificar mapas de bits de los píxeles de 32 bits.Por consiguiente, utilice un editor de imágenes externo en lugar de los editores de recursos para manipular mapas de bits transparentes.
Copie un archivo de recursos adecuado de otra aplicación al proyecto y después importar los mapas de bits de ese archivo.
Este tutorial copia los archivos de recursos de una aplicación en el directorio de ejemplos.
Para agregar mapas de bits al proyecto
El Explorador de archivos de uso para copiar los siguientes archivos .bmp del directorio recursos (res) del ejemplo RibbonGadgets:
Copia main.bmp al proyecto scribble.
Copia filesmall.bmp y filelarge.bmp al proyecto scribble.
Haga las nuevas copias de los archivos de filelarge.bmp y de filesmall.bmp, pero guardar copias del ejemplo RibbonGadgets.Cambie las copias homesmall.bmp y homelarge.bmp y después mover las copias en el proyecto scribble.
Haga una copia del archivo de toolbar.bmp, pero guardar la copia en el ejemplo de RibbonGadgets.Cambie el nombre de la copia panelicons.bmp y después mueva la copia en el proyecto scribble.
Importe el mapa de bits para una aplicación MFC.En Vista de recursos, haga doble clic en el nodo de *** scribble.rc *** , haga doble clic en el nodo de Mapa de bits , y haga clic en Agregar recurso.En el cuadro de diálogo que aparece, haga clic en Importar.Vaya a res el directorio, seleccione el archivo de main.bmp, y haga clic en Abrir.
El mapa de bits de main.bmp contiene una imagen 26x26.Cambie el id. del mapa de bits en IDB_RIBBON_MAIN.
Importe los mapas de bits del menú archivo que se asocia al botón de la aplicación.
Importe el archivo de filesmall.bmp, que contiene diez imágenes 16x16 (16x160).Dado que necesitamos sólo ocho imágenes 16x16 (16x128), utilice Vista de recursos para cambiar el ancho del mapa de bits a partir de 160 a 128.Cambie el id. del mapa de bits en IDB_RIBBON_FILESMALL.
Importe el filelarge.bmp, que contiene ocho imágenes 32x32 (32x256).Cambie el id. del mapa de bits en IDB_RIBBON_FILELARGE.
Importe los mapas de bits de las categorías y los paneles de la cinta de opciones.Cada pestaña en la barra de la cinta de opciones es una categoría, y consta de una etiqueta de texto y una imagen opcional.
Importe el mapa de bits de homesmall.bmp, que contiene ocho imágenes 16x16 para pequeños mapas de bits del botón.Cambie el id. del mapa de bits en IDB_RIBBON_HOMESMALL.
Importe el mapa de bits de homelarge.bmp, que contiene ocho imágenes 32x32 para los mapas de bits del botón.Cambie el id. del mapa de bits en IDB_RIBBON_HOMELARGE.
Importe los mapas de bits de los paneles devolverán el tamaño de la cinta de opciones.Se utilizan estos mapas de bits, o iconos del panel, después de una operación de tamaño si la cinta de opciones es demasiado pequeña para mostrar todo el panel.
- Importe el mapa de bits de panelicons.bmp, que contiene ocho imágenes 16x16.En la ventana de Propiedades de Editor de mapas de bits, ajuste el ancho del mapa de bits en 64 (16x64).Cambie el id. del mapa de bits en IDB_PANEL_ICONS.
[Secciones]
Agregar un recurso de la cinta de opciones al proyecto
Al convertir una aplicación que utilice menús de una aplicación que utiliza una cinta de opciones, no tiene que quitar o deshabilitar menús existentes.En su lugar, se crea un recurso de la cinta de opciones, agregue los botones de la cinta de opciones y, a continuación asociar los nuevos botones con los elementos de menú existentes.Aunque los menús no estén visibles, los mensajes de la barra de la cinta de opciones se enrutan a través de los menús.Además, los accesos directos de menú siguen funcionando.
Una cinta consta del botón de la aplicación, que es el botón grande del lado superior izquierdo de la cinta de opciones, y una o más pestañas category.Cada pestaña de la categoría contiene uno o varios paneles que actúan como contenedores para los botones y los controles de la cinta de opciones.El procedimiento siguiente muestra cómo crear un recurso de la cinta de opciones y después personalizar el botón de la aplicación.
Para agregar un recurso de la cinta de opciones al proyecto
En el menú de Proyecto , haga clic en Agregar recurso.
En el cuadro de diálogo de Agregar recurso , Cinta seleccione y haga clic en Nuevo.
Visual Studio crea un recurso de la cinta de opciones y lo abre en la vista diseño.El Id. de recurso de la cinta de opciones es IDR_RIBBON1, que se muestra en Vista de recursos.La cinta de opciones contiene una categoría y un panel.
Puede personalizar el botón de la aplicación modificando sus propiedades.Los identificadores de mensaje que se utilizan en este código ya están definidos en el menú para scribble 1,0.
En la vista diseño, haga clic en el botón de la aplicación para mostrar sus propiedades.Valores de propiedad de cambio como sigue: Imagen a IDB_RIBBON_MAIN, Pedir datos a El archivo, Claves a f, *** imágenes grandes *** a IDB_RIBBON_FILELARGE, y *** pequeñas imágenes *** a IDB_RIBBON_FILESMALL.
Las modificaciones siguientes crean el menú que aparece cuando el usuario hace clic en el botón de la aplicación.Haga clic en los puntos suspensivos (*** … ***) junto a *** Elementos primarios *** para abrir Editor de elementos.
Haga clic en *** agregue *** para agregar un botón.Cambio Título a &New, Id. a ID_FILE_NEW, Imagen a 0, Imagen grande a 0.
Haga clic en *** agregue *** para agregar un segundo botón.Cambio Título a &Save, ID a ID_FILE_SAVE, Imagen a 2, y Imagen grande a 2.
Haga clic en *** agregue *** para agregar un tercer botón.Cambio Título a Save &As, ID a ID_FILE_SAVE_AS, Imagen a 3, y Imagen grande a 3.
Haga clic en *** agregue *** para agregar un cuarto botón.Cambio Título a &Print, ID a ID_FILE_PRINT, Imagen a 4, y Imagen grande a 4.
Cambie el tipo de Elemento a Separador y haga clic en *** agregue ***.
Cambie Elemento tipo a Button.Haga clic en *** agregue *** para agregar un quinto botón.Cambio Título a &Close, ID a ID_FILE_CLOSE, Imagen a 5, y Imagen grande a 5.
Las modificaciones siguientes crean un submenú del botón de impresión que creó en el paso anterior.
Haga clic en el botón de Imprimir , cambie Elemento tipo a Etiqueta, y haga clic en Insertar.Cambie Título a Obtener una vista previa e imprimir el documento.
Haga clic en el botón de Imprimir , cambie Elemento tipo a Button, y haga clic en Insertar.Cambio Título a &Print, ID a ID_FILE_PRINT, Imagen a 4, y Imagen grande a 4.
Haga clic en el botón de Imprimir y haga clic en Insertar para agregar un botón.Cambio Título a &Quick Print, ID a ID_FILE_PRINT_DIRECT, Imagen a 7, y Imagen grande a 7.
Haga clic en el botón de Imprimir y haga clic en Insertar para agregar otro botón.Cambio Título a Imprime Pre&view, a Id. a ID_FILE_PRINT_PREVIEW, a Imagen a 6, y a Imagen grande a6.
Se ha modificado *** Elementos primarios ***.Haga clic Cerrar salir Editor de elementos.
La modificación siguiente crea un botón de salida que aparece en la parte inferior del menú botón de la aplicación.
En la ventana de Propiedades , haga clic en los puntos suspensivos (*** … ***) junto a Button para abrir Editor de elementos.
Haga clic en *** agregue *** para agregar un botón.Cambio Título a E&xit, Id. a ID_APP_EXIT, Imagen a8.
[Secciones]
Crear una instancia de la barra de la cinta de opciones
Los pasos siguientes muestran cómo crear una instancia de la barra de la cinta cuando se inicia la aplicación.Para agregar una barra de la cinta en una aplicación, declare la barra de la cinta de opciones en el archivo de mainfrm.h.A continuación, en el archivo de mainfrm.cpp, escribir código para cargar el recurso de la cinta de opciones.
Para crear una instancia de la barra de la cinta de opciones
En el archivo de mainfrm.h, agregue un miembro de datos en la sección protected de CMainFrame, la definición de clase del marco principal.Este miembro representa la barra de la cinta de opciones.
// Ribbon bar for the application CMFCRibbonBar m_wndRibbonBar;En el archivo de mainfrm.cpp, agregue el código siguiente antes de que el fragmento final de return al final de la función de CMainFrame::OnCreate .Esto crea una instancia de la barra de la cinta de opciones.
// Create the ribbon bar if (!m_wndRibbonBar.Create(this)) { return -1; //Failed to create ribbon bar } m_wndRibbonBar.LoadFromResource(IDR_RIBBON1);
[Secciones]
Personalizar el recurso de la cinta de opciones
Ahora que ha creado el botón de la aplicación, puede agregar elementos a la cinta de opciones.
[!NOTA]
Este tutorial utiliza el mismo icono de panel en todos los paneles.Sin embargo, puede utilizar otros índices de la lista de imágenes para mostrar otros iconos.
Para agregar una categoría y un panel caseros de edición
El programa scribble sólo requiere una categoría.En la vista diseño, haga clic Categoría para mostrar sus propiedades.Valores de propiedad de cambio como sigue: Título a &Home, *** imágenes grandes *** a IDB_RIBBON_HOMELARGE, *** pequeñas imágenes *** a IDB_RIBBON_HOMESMALL.
Cada categoría de la cinta de opciones se organiza en paneles con nombre.Cada panel contiene un conjunto de controles que realizan operaciones relacionadas.Esta categoría tiene un panel.Haga clic Panel, y cambie Título a edición y *** índice de la imagen *** a 0.
El panel de *** edición *** , agregue un botón que es responsable de borrar el contenido del documento.Identificador del mensaje para este botón se ha definido en el recurso de menú de IDR_SCRIBBTYPE.Especifique Borrar todo como el texto del botón y el índice del mapa de bits que decora el botón.Abra Cuadro de herramientas, y luego arrastre Button al panel de *** edición *** .Haga clic en el botón y después cambie Título a Borrar todo, Id. a ID_EDIT_CLEAR_ALL, *** índice de la imagen *** a 0, *** índice grande de la imagen *** a 0.
Guarde los cambios y, a continuación compile y ejecute la aplicación.La aplicación scribble debe mostrar, y debe tener una barra de la cinta de opciones en la parte superior de la ventana en lugar de una barra de menús.La barra de la cinta de opciones debe tener una categoría, Inicio, y Inicio debe tener un panel, *** edición ***.Los botones de la cinta de opciones que agregó se deben asociar controladores de eventos existentes, y Abrir, Cerrar, Guardar, Imprimir, y los botones de Borrar todo deben funcionar como se espera.
[Secciones]
Establecer la apariencia de la aplicación
un administrador visual es un objeto global que controla todo el gráfico para una aplicación.Dado que la aplicación original scribble utiliza el estilo de (UI) de la interfaz de usuario de Office 2000, la aplicación puede parecer última de moda.Puede restaurar la aplicación para utilizar el administrador visual de Office 2007 de modo similar a una aplicación de Office 2007.
Para establecer la apariencia de la aplicación
En función de CMainFrame::OnCreate , escriba el código siguiente para cambiar el administrador y el estilo visuales predeterminados.
// Set the default manager to Office 2007 CMFCVisualManager::SetDefaultManager(RUNTIME_CLASS(CMFCVisualManagerOffice2007)); CMFCVisualManagerOffice2007::SetStyle(CMFCVisualManagerOffice2007::Office2007_LunaBlue);Guarde los cambios y, a continuación compile y ejecute la aplicación.La interfaz de usuario de la aplicación debe ser similar a la interfaz de usuario de Office 2007.
[Secciones]
Pasos siguientes
Ha modificado el ejemplo clásico scribble de MFC 1,0 para utilizar la cinta de opciones.Ahora vaya a parte 2.
Vea también
Tareas
Tutorial: Actualizar la aplicación scribble de MFC (Parte 2)