Compartilhar via

Passo a passo: Atualizar o aplicativo do Rabisco MFC (parte 1)

  • Artigo

Esta explicação passo a passo demonstra como modificar um aplicativo MFC existente para usar a interface do usuário da faixa de opções.Visual Studio suporta a faixa de opções do Office 2007 e Windows 7 clip faixa.Para obter mais informações sobre a interface do usuário da faixa de opções, consulte faixas no site do MSDN.

Esta explicação passo a passo modifica o clássico exemplo de rabisco MFC 1.0 permite que você use o mouse para criar desenhos de linha.Nesta parte da explicação passo a passo mostra como modificar a amostra de rabisco para que ele exibe uma barra de faixa de opções.Parte 2 adiciona mais botões à barra de faixa de opções.

Pré-requisitos

Exemplos do Visual C++

Exemplos do Visual C++

Seções

Nesta parte da explicação passo a passo tem as seguintes seções:

  • Substituindo as Classes Base

  • Adicionar Bitmaps para o projeto

  • Adicionar um recurso de faixa de opções para o projeto

  • Criando uma instância da barra de faixa de opções

  • Adicionando uma categoria da faixa de opções

  • Definir a aparência do aplicativo

Substituindo as Classes Base

Para converter um aplicativo que ofereça suporte a um menu de um aplicativo que ofereça suporte a uma faixa de opções, você deve derivar o aplicativo, janela de quadro e classes de barra de ferramentas de classes base atualizadas.(Sugerimos que você não modifique o exemplo de rabisco original; em vez disso, Limpar projeto Rabisco, copie-o para outro diretório e então modificar a cópia.)

Para substituir as classes base do aplicativo do Rabisco

  1. Na scribble.cpp, verifique se CScribbleApp::InitInstance inclui uma chamada para AfxOleInit.

  2. Adicione o seguinte código no arquivo stdafx. h.

    #include <afxcontrolbars.h>

  3. No scribble.h, modifique a definição para o CScribbleApp para que ele é derivado da classe Classe CWinAppEx.

    class CScribbleApp: public CWinAppEx

  4. Rabisco 1.0 foi escrito quando aplicativos Windows usado um arquivo de inicialização (. ini) para salvar dados de preferência do usuário.Em vez de um arquivo de inicialização, modificar Rabisco para armazenar as preferências do usuário no registro.Para definir a chave do registro e base, digite o seguinte código no CScribbleApp::InitInstance depois de LoadStdProfileSettings() instrução.

    SetRegistryKey(_T("MFCNext\\Samples\\Scribble2"));
SetRegistryBase(_T("Settings"));

  5. O quadro principal para um aplicativo de interface (MDI) documento várias não é derivado de CMDIFrameWnd classe.Em vez disso, ele é derivado de CMDIFrameWndEx classe.

    Os arquivos mainfrm.h e mainfrm.cpp, substitua todas as referências a CMDIFrameWnd com CMDIFrameWndEx.

  6. Substitua os arquivos childfrm.h e childfrm.cpp, CMDIChildWnd com CMDIChildWndEx.

    Em childfrm.h arquivo, substitua CSplitterWnd com CSplitterWndEx.

  7. Modificar barras de ferramentas e barras de status para usar as novas classes MFC.

    No arquivo mainfrm.h:

    1. Substitua CToolBar por CMFCToolBar.

    2. Substitua CStatusBar por CMFCStatusBar.

  8. No arquivo mainfrm.cpp:

    1. Substituir m_wndToolBar.SetBarStyle comm_wndToolBar.SetPaneStyle

    2. Substituir m_wndToolBar.GetBarStyle comm_wndToolBar.GetPaneStyle

    3. Substituir DockControlBar(&m_wndToolBar) comDockPane(&m_wndToolBar)

  9. No arquivo ipframe.cpp, comente as seguintes três linhas de código.

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

  10. Se você pretende vincular seu aplicativo estaticamente, adicione o seguinte código para o início do arquivo de recurso (. rc) do projeto.

    #include "afxribbon.rc"

    O arquivo afxribbon.rc contém recursos que são necessários em tempo de execução.O MFC Application Wizard inclui este arquivo automaticamente quando você criar um aplicativo.

  11. Salvar as alterações e criar e executar o aplicativo.

[Seções]

Adicionar Bitmaps para o projeto

As quatro etapas nesta explicação passo a passo exigem recursos de bitmap.Você pode obter bitmaps apropriado de várias maneiras:

  • Use o Editores de recursos para inventar seus próprios bitmaps.Ou use os editores de recursos para montar bitmaps a partir de imagens portable network graphics (. png) que estão incluídas no Visual Studio.Essas imagens estão no VS2008ImageLibrary directory.

    No entanto, a interface do usuário da faixa de opções requer que alguns bitmaps suporte imagens transparentes.Bitmaps transparentes usar pixels de 32 bits, onde 24 bits especificar os componentes vermelhos, verdes e azuis da cor e 8 bits definem um canal alfa que especifica a transparência da cor.Os editores de recursos atual podem ver, mas não modificar bitmaps com pixels de 32 bits.Conseqüentemente, use um editor de imagem externo em vez dos editores de recursos para manipular bitmaps transparentes.

  • Copiar um arquivo de recurso apropriado de outro aplicativo para seu projeto e importar bitmaps de arquivo.

Esta explicação passo a passo copia arquivos de recurso de um aplicativo no diretório de exemplos.

Para adicionar bitmaps para o projeto

  1. Use o File Explorer para copiar os seguintes arquivos. bmp do diretório de recursos (res) do exemplo de RibbonGadgets:

    1. Copie main.bmp para seu projeto de rabisco.

    2. Cópia filesmall.bmp e filelarge.bmp ao seu projeto de rabisco.

    3. Fazer novas cópias dos arquivos filelarge.bmp e filesmall.bmp, mas salvar as cópias no exemplo de RibbonGadgets.Renomear cópias homesmall.bmp e homelarge.bmp e mova as cópias de seu projeto de rabisco.

    4. Faça uma cópia do arquivo toolbar.bmp, mas salvar a cópia no exemplo de RibbonGadgets.Renomeie panelicons.bmp copiar e mover a cópia para seu projeto de rabisco.

  2. Importe o bitmap para um aplicativo do MFC.Em Exibição de recurso, clique duas vezes o scribble.rc nó, clique duas vezes o Bitmap nó e clique Adicionar recurso.Na caixa de diálogo que aparece, clique em importação.Navegue até o res directory, selecione o arquivo main.bmp e clique em Abrir.

    Bitmap main.bmp contém uma imagem de 26 x 26.Altere a identificação do bitmap para IDB_RIBBON_MAIN.

  3. Importe bitmaps para o menu de arquivo anexado ao botão de aplicativo.

    1. Importar o arquivo filesmall.bmp, que contém dez 16 x 16 (16 x 160) imagens.Porque precisamos de imagens de 16 x 16 apenas oito (16 x 128), use o Exibição de recurso para alterar a largura desse bitmap de 160 para 128.Altere a identificação do bitmap para IDB_RIBBON_FILESMALL.

    2. Importar filelarge.bmp, que contém oito 32 x 32 (32 x 256) imagens.Altere a identificação do bitmap para IDB_RIBBON_FILELARGE.

  4. Importe bitmaps para categorias de faixa de opções e painéis.Cada guia na barra de faixa de opções é uma categoria e consiste em um rótulo de texto e uma imagem opcional.

    1. Importe o bitmap de homesmall.bmp, que contém oito 16 x 16 imagens de bitmaps de botão pequeno.Altere a identificação do bitmap para IDB_RIBBON_HOMESMALL.

    2. Importe o bitmap de homelarge.bmp, que contém oito 32 x 32 imagens de bitmaps de botão grande.Altere a identificação do bitmap para IDB_RIBBON_HOMELARGE.

  5. Importar bitmaps para os painéis da faixa de opções redimensionada.Esses bitmaps ou ícones do painel, são usados após uma operação de redimensionamento, se a faixa de opções é muito pequena para exibir o painel inteiro.

    1. Importe o bitmap de panelicons.bmp, que contém oito 16 x 16 imagens.No Propriedades janela do Editor de Bitmap, ajustar a largura do bitmap para 64 (16 x 64).Altere a identificação do bitmap para IDB_PANEL_ICONS.

[Seções]

Adicionar um recurso de faixa de opções para o projeto

Quando você converter um aplicativo que usa menus para um aplicativo que usa uma faixa de opções, é necessário remover ou desativar os menus existentes.Em vez disso, crie um recurso da faixa de opções, adicionar botões de faixa de opções e associar os novos botões com itens de menu existente.Embora os menus não estão mais visíveis, as mensagens da barra de faixa de opções são roteadas através dos menus.Além disso, os atalhos do menu continuam a trabalhar.

Uma faixa de opções consiste no botão do aplicativo, que é o grande botão no lado superior esquerdo da faixa de opções, e uma ou mais guias de categoria.Guia de cada categoria contém um ou mais painéis que atuam como contêineres para controles e botões de faixa de opções.O procedimento a seguir mostra como criar um recurso da faixa de opções e personalizar o botão do aplicativo.

Para adicionar um recurso de faixa de opções para o projeto

  1. Sobre o projeto menu, clique em Add Resource.

  2. No Add Resource caixa de diálogo, selecione fita e clique em nova.

    Visual Studio cria um recurso de faixa de opções e o abre no modo design.A identificação de recurso da faixa de opções é IDR_RIBBON1, que é exibido na Exibição de recurso.A faixa de opções contém uma categoria e um painel.

  3. Você pode personalizar o botão do aplicativo, modificando suas propriedades.As identificações de mensagem são usadas neste código já definidas no menu de rabisco 1.0.

  4. No modo design, clique no botão de aplicativo para exibir suas propriedades.Alterar valores de propriedade da seguinte forma: imagem para IDB_RIBBON_MAIN, Prompt para arquivo, chaves para f, Imagens grandes para IDB_RIBBON_FILELARGE, e Imagens pequenas para IDB_RIBBON_FILESMALL.

  5. As seguintes modificações Criar menu que aparece quando o usuário clica no botão do aplicativo.Clique nas reticências (...) ao lado de Principal itens para abrir o Editor de itens.

    1. Clique em Add para adicionar um botão.Change Caption to &New, ID to ID_FILE_NEW, Image to 0, Image Large to 0.

    2. Clique em Add para adicionar um segundo botão.Change Caption to &Save, ID to ID_FILE_SAVE, Image to 2, and Image Large to 2.

    3. Clique em Add para adicionar um terceiro botão.Change Caption to Save &As, ID to ID_FILE_SAVE_AS, Image to 3, and Image Large to 3.

    4. Clique em Add para adicionar um botão de quarto.Change Caption to &Print, ID to ID_FILE_PRINT, Image to 4, and Image Large to 4.

    5. Alterar o Item tipo separador e clique em Add.

    6. Alterar o Item tipo botão.Clique em Add para adicionar um quinto botão.Change Caption to &Close, ID to ID_FILE_CLOSE, Image to 5, and Image Large to 5.

  6. As modificações a seguintes criar um submenu do botão de impressão que você criou na etapa anterior.

    1. Clique o Print botão, altere o Item tipo rótuloe clique em Inserir.Alterar legenda para Visualizar e imprimir o documento.

    2. Clique o Print botão, altere o Item tipo botãoe clique em Inserir.Change Caption to &Print, ID to ID_FILE_PRINT, Image to 4, and Image Large to 4.

    3. Clique o Print botão e, em seguida, clique em Inserir para adicionar um botão.Alterar legenda para & impressão rápida, ID para ID_FILE_PRINT_DIRECT, imagem para 7, e imagem grande a 7.

    4. Clique o Print botão e, em seguida, clique em Inserir para adicionar outro botão.Alterar legenda para impressão & visualizar, ID para ID_FILE_PRINT_PREVIEW, imagem para 6, e Imagem grande para6.

    5. Modificado agora o Principal itens.Clique em Fechar para sair do Editor de itens.

  7. A modificação a seguir cria um botão Sair que aparece na parte inferior do menu do botão de aplicativo.

    1. No Propriedades janela, clique nas reticências (...) ao lado de botão para abrir o Editor de itens.

    2. Clique em Add para adicionar um botão.Change Caption to E&xit, ID to ID_APP_EXIT, Image to8.

[Seções]

Criando uma instância da barra de faixa de opções

As etapas a seguir mostram como criar uma instância da barra de faixa de opções quando seu aplicativo for iniciado.Para adicionar uma barra de faixa de opções para um aplicativo, declare a barra de faixa de opções no arquivo mainfrm.h.Em seguida, no arquivo mainfrm.cpp, escreva código para carregar o recurso da faixa de opções.

Para criar uma instância da barra de faixa de opções

  1. No arquivo mainfrm.h, adicionar um membro de dados para a seção protegida de CMainFrame, a definição de classe para o quadro principal.Este membro representa a barra de faixa de opções.

    // Ribbon bar for the application
CMFCRibbonBar  m_wndRibbonBar;

  2. No arquivo mainfrm.cpp, adicione o seguinte código antes do final return instrução no final de CMainFrame::OnCreate função.Isso cria uma instância da barra de faixa de opções.

    // Create the ribbon bar
if (!m_wndRibbonBar.Create(this))
{
return -1;   //Failed to create ribbon bar
}
m_wndRibbonBar.LoadFromResource(IDR_RIBBON1);

[Seções]

Personalizando o recurso da faixa de opções

Agora que você criou no botão do aplicativo, você pode adicionar elementos à faixa de opções.

ObservaçãoObservação

Esta explicação passo a passo usa o mesmo ícone de painel para todos os painéis.No entanto, você pode usar outros índices de lista de imagem para exibir outros ícones.

Para adicionar uma categoria de casa e editar painel

  1. O programa de rabisco requer apenas uma categoria.No modo design, clique em categoria de para exibir suas propriedades.Alterar valores de propriedade da seguinte forma: legenda para & Home, Imagens grandes para IDB_RIBBON_HOMELARGE, Imagens pequenas para IDB_RIBBON_HOMESMALL.

  2. Cada categoria de faixa de opções é organizada em painéis nomeados.Cada painel contém um conjunto de controles que realizam operações relacionadas.Essa categoria tem um painel.Clique em painele alterar legenda para Editar e Índice de imagem para 0.

  3. Para o Editar painel, adicionar um botão é responsável por limpar o conteúdo do documento.O ID da mensagem para este botão já foi definido no recurso de menu IDR_SCRIBBTYPE.Especificar Limpar tudo como o texto do botão e o índice do bitmap que decora o botão.Abrir o Toolboxe arraste um botão para o Editar painel.Clique no botão e altere legenda para Limpar tudo, ID para ID_EDIT_CLEAR_ALL, Índice de imagem para 0, Índice de imagem grande para 0.

  4. Salvar as alterações e criar e executar o aplicativo.O aplicativo Rabisco deve ser exibido e ele deve ter uma barra de faixa na parte superior da janela em vez de uma barra de menus.Barra de faixa de opções deve ter uma categoria, Home, e Home deve ter um painel Editar.Os botões de faixa de opções que você adicionou devem ser associados com manipuladores de eventos existentes e o Abrir, Fechar, Salvar, Print, e Limpar tudo botões devem funcionar como esperado.

[Seções]

Definir a aparência do aplicativo

A Gerenciador visual é um objeto global que controla todos os desenhos para um aplicativo.Como o aplicativo Rabisco original usa o estilo de interface (UI) de usuário do Office 2000, o aplicativo pode parecer antiga.Você pode redefinir o aplicativo para usar o Gerenciador visual do Office 2007 para que se pareça com um aplicativo do Office 2007.

Para definir a aparência do aplicativo

  1. No CMainFrame::OnCreate função, digite o seguinte código para alterar o estilo e o Gerenciador visual padrão.

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

  2. Salvar as alterações e criar e executar o aplicativo.A UI do aplicativo deverá ser semelhante a interface do usuário do Office 2007.

[Seções]

Próximas etapas

Você modificou o clássico exemplo de rabisco MFC 1.0 para usar o Designer de faixa de opções.Agora vá para parte 2.

Consulte também

Tarefas

Passo a passo: Atualizar o aplicativo do Rabisco MFC (parte 2)

Outros recursos

Explicações passo a passo (MFC)