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

Artigo
02/25/2013

Parte 1 nesta explicação passo a passo mostrada como adicionar uma faixa de Opções Fluent do Office para o clássico aplicativo rabisco.Esta parte mostra como adicionar painéis da faixa de opções e controles que os usuários podem usar em vez de menus e comandos.

Pré-requisitos

Exemplos do Visual C++

Seções

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

A adição de novos painéis da faixa de opções
Adicionar um painel de ajuda para a faixa de opções
Adicionar um painel de caneta para a faixa de opções
Adicionando um botão de cor para a faixa de opções
Adicionar um membro de cor para a classe de documento
Inicializando canetas e salvar preferências

A adição de novos painéis da faixa de opções

Essas etapas mostram como adicionar um modo painel contém duas caixas de seleção para controlar a visibilidade da barra de ferramentas e barra de status e também um janela painel que contém um botão de divisão orientado verticalmente que controla a criação e a organização das janelas de interface de documentos múltiplos (MDI).

Para adicionar um painel de exibição e painel de janela na barra de faixa de opções

Criar um painel chamado modo, que tem duas caixas de seleção Ativar a barra de status e a barra de ferramentas.
1. Do Toolbox, arraste um painel para o Home categoria.Arraste dois caixas de seleção para o painel.
2. Clique em Painel de modificar suas propriedades.Alterar legenda para modo.
3. Clique na primeira caixa de seleção para modificar suas propriedades.Alterar ID para ID_VIEW_TOOLBAR e legenda para barra de ferramentas.
4. Clique na segunda caixa de seleção para modificar suas propriedades.Alterar ID para ID_VIEW_STATUS_BAR e legenda para Barra de Status.
Criar um painel chamado janela que tem um botão de divisão.Quando um usuário clica no botão de divisão, um menu de atalho exibe três comandos já definidos no aplicativo de rabisco.
1. Do Toolbox, arraste um painel para o Home categoria.Em seguida, arraste um botão para o painel.
2. Clique em Painel de modificar suas propriedades.Alterar legenda para janela.
3. Clique no botão.Change Caption to Windows, Keys to w, Large Image Index to 1, and Split Mode to False.Em seguida, clique nas reticências (...) ao lado de Itens do Menu para abrir o Editor de itens caixa de diálogo.
4. Clique em Add três vezes para adicionar três botões.
5. Clique no primeiro botão e altere legenda para Nova janela, e ID para ID_WINDOW_NEW.
6. Clique no segundo botão e altere legenda para cascata, e ID para ID_WINDOW_CASCADE.
7. Clique no terceiro botão e altere legenda para lado a lado, e ID para ID_WINDOW_TILE_HORZ.
Salvar as alterações e criar e executar o aplicativo.O modo e janela painéis devem ser exibidos.Clique nos botões para confirmar que eles funcionem corretamente.

[Seções]

Adicionar um painel de ajuda para a faixa de opções

Agora, você pode atribuir dois itens de menu que são definidas no aplicativo de rabisco para botões de faixa de opções que são nomeados Tópicos da Ajuda e Sobre o rabisco.Os botões são adicionados a um novo painel chamado Ajuda.

Para adicionar um painel de ajuda

Do Toolbox, arraste um painel para o Home categoria.Arraste dois botões para o painel.
Clique em Painel de modificar suas propriedades.Alterar legenda para Ajuda.
Clique no primeiro botão.Alterar legenda para Tópicos da Ajuda, e ID para ID_HELP_FINDER.
Clique no segundo botão.Alterar legenda para sobre rabisco..., and ID to ID_APP_ABOUT.

Salvar as alterações e criar e executar o aplicativo.A Ajuda painel contém dois botões de faixa de opções deve ser exibido.

Importante
Quando você clica no Tópicos da Ajuda botão, o aplicativo Rabisco abre um arquivo de ajuda HTML (. chm) compactado chamado your_project_name. chm.Conseqüentemente, se seu projeto não é nomeado Rabisco, deve renomear o arquivo de ajuda para o nome do projeto.

[Seções]

Adicionar um painel de caneta para a faixa de opções

Agora, adicione um painel para exibir botões que controlam a espessura e cor da caneta.Este painel contém uma caixa de seleção alterna entre canetas finas e grossas.Sua funcionalidade semelhante de Linha espessa item de menu no aplicativo de rabisco.

O aplicativo de rabisco original permite que o usuário selecione larguras de caneta na caixa de diálogo que aparece quando o usuário clica Larguras de caneta no menu.Como a barra de faixa de opções tem bastante espaço para novos controles, você pode substituir a caixa de diálogo usando duas caixas de combinação da faixa de opções.Uma caixa de combinação ajusta a largura da caneta fina e caixa de combinação ajusta a largura da caneta espessa.

Para adicionar um painel de caneta e combinação caixas à faixa de opções

Do Toolbox, arraste um painel para o Home categoria.Em seguida, arraste um caixa de seleção e dois Caixas de combinação para o painel.
Clique em Painel de modificar suas propriedades.Alterar legenda para caneta.
Clique na caixa de seleção.Alterar legenda para usar espessa, e ID para ID_PEN_THICK_OR_THIN.
Clique na primeira caixa de combinação.Change Caption to Thin Pen, ID to ID_PEN_THIN_WIDTH, Text to 2, Type to Drop List, and Data to 1;2;3;4;5;6;7;8;9;.
Clique na segunda caixa de combinação.Alterar legenda para grossa caneta, ID para ID_PEN_THICK_WIDTH, texto para 5, tipo para lista suspensa, e dados para 5; 6; 7; 8; 9; 10; 11; 12; 13; 14; 15; 16; 17; 18; 19; 20;.
As novas caixas de combinação não correspondem a quaisquer itens de menu existente.Portanto, você deve criar um item de menu para cada opção de caneta.
1. No Exibição de recurso janela, abra o recurso de menu IDR_SCRIBBTYPE.
2. Clique em caneta para abrir o pen menu.Clique em Digite aqui e digite Thi & n caneta.
3. Clique com o botão direito do texto que você acabou de digitar para abrir o Propriedades janela e alterar a identificação de propriedade para ID_PEN_THIN_WIDTH.
4. Você também deve criar um manipulador de eventos para cada item de menu de caneta.Com o botão direito do Thi & n caneta item de menu que você acabou de criar e clique em Adicionar manipulador de eventos.O Assistente de manipulador de eventos é exibida.
5. No lista de classe caixa do assistente, selecione CScribbleDoc e clique em Adicionar e editar.Isso cria um manipulador de evento chamado CScribbleDoc::OnPenThinWidth.
6. Adicione o seguinte código para CScribbleDoc::OnPenThinWidth.
```
// Get a pointer to the ribbon bar
CMFCRibbonBar* pRibbon = ((CMDIFrameWndEx*) AfxGetMainWnd())->GetRibbonBar();
ASSERT_VALID(pRibbon);
// Get a pointer to the Thin Width combo box
CMFCRibbonComboBox* pThinComboBox = DYNAMIC_DOWNCAST(
   CMFCRibbonComboBox, pRibbon->FindByID(ID_PEN_THIN_WIDTH));
//Get the selected value
int nCurSel = pThinComboBox->GetCurSel();
if (nCurSel >= 0)
{
   m_nThinWidth = atoi(pThinComboBox->GetItem(nCurSel));
}
// Create a new pen using the selected width
ReplacePen();  
```
Em seguida, crie um menu item e manipuladores de eventos para a caneta espesso.
1. No Exibição de recurso janela, abra o recurso de menu IDR_SCRIBBTYPE.
2. Clique em caneta para abrir o menu de caneta.Clique em Digite aqui e digite Thic & caneta k.
3. O texto que você acabou de digitar para exibir com o botão direito do Propriedades janela.Altere a propriedade ID para ID_PEN_THICK_WIDTH.
4. Com o botão direito do Grossa caneta item de menu que você acabou de criar e clique em Adicionar manipulador de eventos.O Assistente de manipulador de eventos é exibida.
5. No lista de classe caixa do assistente, selecione CScribbleDoc e clique em Adicionar e editar.Isso cria um manipulador de evento chamado CScribbleDoc::OnPenThickWidth.
6. Adicione o seguinte código para CScribbleDoc::OnPenThickWidth.
```
// Get a pointer to the ribbon bar
CMFCRibbonBar* pRibbon = ((CMDIFrameWndEx *) AfxGetMainWnd())->GetRibbonBar();
ASSERT_VALID(pRibbon);
CMFCRibbonComboBox* pThickComboBox = DYNAMIC_DOWNCAST(
   CMFCRibbonComboBox, pRibbon->FindByID(ID_PEN_THICK_WIDTH));
// Get the selected value
int nCurSel = pThickComboBox->GetCurSel();
if (nCurSel >= 0)
{
   m_nThickWidth = atoi(pThickComboBox->GetItem(nCurSel));
}
// Create a new pen using the selected width
ReplacePen();
```
Salvar as alterações e criar e executar o aplicativo.Novos botões e caixas de combinação devem ser exibidas.Tente usar as larguras de caneta diferente para rabisco.

[Seções]

Adicionar um botão de cor ao painel de caneta

Em seguida, adicione um CMFCRibbonColorButton objeto que permite ao usuário Rabisco em cores.

Para adicionar um botão de cor ao painel de caneta

Antes de adicionar o botão de cor, crie um item de menu para ele.No Exibição de recurso janela, abra o recurso de menu IDR_SCRIBBTYPE.Clique o caneta item de menu para abrir o menu de caneta.Clique em Digite aqui e digite & cor.O texto que você acabou de digitar para exibir com o botão direito do Propriedades janela.Alterar a identificação de ID_PEN_COLOR.
Agora adicione o botão de cor.Do Toolbox, arraste um Botão Cor para o caneta painel.
Clique no botão de cor.Change Caption to Color, ID to ID_PEN_COLOR, SimpleLook to True, Large Image Index to 1, and Split Mode to False.
Salvar as alterações e criar e executar o aplicativo.O novo botão de cor deve ser exibido no caneta painel.No entanto, ele não pode ser usado porque ele não tem um manipulador de eventos.As próximas etapas mostram como adicionar um manipulador de eventos para o botão de cor.

[Seções]

Adicionar um membro de cor para a classe de documento

Porque o aplicativo Rabisco original não tem canetas de cor, você deve escrever uma implementação para eles.Para armazenar a cor da caneta do documento, adicionar um novo membro à classe de documentoCscribbleDoc.

Para adicionar um membro de cor para a classe de documento

Em scribdoc.h, no CScribbleDoc classe, encontrar o // Attributes seção.Adicione as seguintes linhas de código após a definição de m_nThickWidth membro de dados.
```
// Current pen color
COLORREF   m_penColor;
```
Cada documento contém uma lista de traços que o usuário já tiver desenhado.Cada traço é definido por um CStroke objeto.O CStroke classe não inclui informações sobre a cor da caneta.Portanto, você deve modificar a classe.Em scribdoc.h, no CStroke da classe, adicione as seguintes linhas de código após a definição do m_nPenWidth membro de dados.
```
// Pen color for the stroke
COLORREF   m_penColor;
```
No scribdoc.h, adicione um novo CStroke construtor cujos parâmetros especificarem uma largura e cor.Adicione a seguinte linha de código após a CStroke(UINT nPenWidth); instrução.
```
CStroke(UINT nPenWidth, COLORREF penColor);
```

Scribdoc.cpp, adicione a implementação da nova CStroke construtor.Adicione o seguinte código após a implementação do CStroke::CStroke(UINT nPenWidth) construtor.

// Constructor that uses the document's current width and color
CStroke::CStroke(UINT nPenWidth, COLORREF penColor)
{
   m_nPenWidth = nPenWidth;
   m_penColor = penColor;
   m_rectBounding.SetRectEmpty();
}

Alterar a segunda linha do CStroke::DrawStroke método da seguinte maneira.
```
if (!penStroke.CreatePen(PS_SOLID, m_nPenWidth, m_penColor))
```
Defina a cor de caneta padrão para a classe de documento.No scribdoc.cpp, adicione as seguintes linhas para CScribbleDoc::InitDocument, após o m_nThickWidth = 5; instrução.
```
// default pen color is black
m_penColor = RGB(0,0,0); 
```
Na scribdoc.cpp, altere a primeira linha da CScribbleDoc::NewStroke o seguinte método.
```
CStroke* pStrokeItem = new CStroke(m_nPenWidth, m_penColor);
```
Alterar a última linha do CScribbleDoc::ReplacePen o seguinte método.
```
m_penCur.CreatePen(PS_SOLID, m_nPenWidth, m_penColor);
```
Você adicionou o m_penColor membro em uma etapa anterior.Agora, crie um manipulador de eventos para o botão de cor que define o membro.
1. No Exibição de recurso janela, abra o recurso de menu IDR_SCRIBBTYPE.
2. Com o botão direito do cor item de menu e clique em Adicionar evento Handler….O Assistente de manipulador de eventos aparece.
3. No lista de classe caixa do assistente, selecione CScribbleDoc e clique no Adicionar e editar botão.Isso cria o CScribbleDoc::OnPenColor stub do manipulador de eventos.

Substitua o stub para o CScribbleDoc::OnPenColor manipulador de eventos com o código a seguir.

void CScribbleDoc::OnPenColor()
{
// Change pen color to reflect color button's current selection
CMFCRibbonBar* pRibbon = ((CMDIFrameWndEx*) AfxGetMainWnd())->GetRibbonBar();
ASSERT_VALID(pRibbon);
CMFCRibbonColorButton* pColorBtn = DYNAMIC_DOWNCAST(
   CMFCRibbonColorButton, pRibbon->FindByID(ID_PEN_COLOR));
m_penColor = pColorBtn->GetColor();
// Create new pen using the selected color
ReplacePen();
}

Salvar as alterações e criar e executar o aplicativo.Você poderá pressionar o botão Cor e alterar a cor da caneta.

[Seções]

Inicializando canetas e salvar preferências

Em seguida, inicialize a cor e a largura das canetas.Por fim, salvar e carregar uma cor de um arquivo de desenho.

Para inicializar os controles na barra de faixa de opções

Inicialize as canetas na barra de faixa de opções.

Adicione o código a seguir para scribdoc.cpp, o CScribbleDoc::InitDocument método, após o m_sizeDoc = CSize(200,200) instrução.

// Reset the ribbon UI to its initial values
CMFCRibbonBar* pRibbon = 
   ((CMDIFrameWndEx*) AfxGetMainWnd())->GetRibbonBar();
ASSERT_VALID(pRibbon);
CMFCRibbonColorButton* pColorBtn = DYNAMIC_DOWNCAST(
   CMFCRibbonColorButton, 
   pRibbon->FindByID(ID_PEN_COLOR));
// Set ColorButton to black
pColorBtn->SetColor(RGB(0,0,0));  
CMFCRibbonComboBox* pThinComboBox = DYNAMIC_DOWNCAST(
   CMFCRibbonComboBox, 
   pRibbon->FindByID(ID_PEN_THIN_WIDTH));
// Set Thin pen combobox to 2
pThinComboBox->SelectItem(1); 
CMFCRibbonComboBox* pThickComboBox = DYNAMIC_DOWNCAST(
   CMFCRibbonComboBox, 
   pRibbon->FindByID(ID_PEN_THICK_WIDTH));
// Set Thick pen combobox to 5
pThickComboBox->SelectItem(0);

Salve uma cor para um arquivo de desenho.Adicionar a seguinte instrução para scribdoc.cpp, o CStroke::Serialize método, após o ar << (WORD)m_nPenWidth; instrução.
```
ar << (COLORREF)m_penColor;
```
Finalmente, carregar uma cor de um arquivo de desenho.Adicionar a seguinte linha de código, o CStroke::Serialize método, após o m_nPenWidth = w; instrução.
```
ar >> m_penColor;
```
Agora Rabisco em cores e salvar seu desenho em um arquivo.

[Seções]

Conclusão

Você atualizou o aplicativo MFC rabisco.Use este passo a passo como um guia ao modificar aplicativos existentes.

Compartilhar via

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

Pré-requisitos

Seções

A adição de novos painéis da faixa de opções

Para adicionar um painel de exibição e painel de janela na barra de faixa de opções

Adicionar um painel de ajuda para a faixa de opções

Para adicionar um painel de ajuda

Adicionar um painel de caneta para a faixa de opções

Para adicionar um painel de caneta e combinação caixas à faixa de opções

Adicionar um botão de cor ao painel de caneta

Para adicionar um botão de cor ao painel de caneta

Adicionar um membro de cor para a classe de documento

Para adicionar um membro de cor para a classe de documento

Inicializando canetas e salvar preferências

Para inicializar os controles na barra de faixa de opções

Conclusão

Consulte também

Tarefas

Outros recursos

Recursos adicionais