Procedura dettagliata: Aggiornare l'applicazione Scribble MFC (parte 2)

Parte 1 di questa procedura dettagliata è stato illustrato come aggiungere una barra multifunzione Office fluent all'applicazione classico Scribble.In questa parte come aggiungere pannelli e i controlli della barra multifunzione che gli utenti possono utilizzare invece dei menu e i controlli.

Prerequisiti

Esempi di Visual C++

Sezioni

In questa parte della procedura dettagliata presenta le seguenti sezioni:

  • Aggiunta di nuovi pannelli della barra multifunzione

  • Aggiunta di un pannello della guida alla barra multifunzione

  • Aggiunta di un pannello della penna alla barra multifunzione

  • Aggiunta di un pulsante di colore alla barra multifunzione

  • Aggiunta di un membro di colore alla classe di documento

  • Inizializzare penne e salvare preferenze

Aggiunta di nuovi pannelli della barra multifunzione

Mostrano questi passi come aggiungere un pannello Visualizza che contiene due caselle di controllo che consentono di controllare la visibilità della barra degli strumenti e la barra di stato e un pannello Finestra contenente un pulsante di menu combinato verticalmente orientato che controlla la creazione e la disposizione delle finestre MDI (MDI).

Per aggiungere un pannello della finestra e la schermata di visualizzazione della barra della barra multifunzione

  1. Creare un pannello denominato visualizzazione, che dispone di due caselle di controllo che superano la barra di stato e la barra degli strumenti.

    1. Da Casella degli strumenti, trascinare Pannello alla categoria Pagina iniziale .Quindi trascinare due Check Boxes al pannello.

    2. Fare clic sul pannello per modificarne le proprietà.Didascalia Di modifica a visualizzazione.

    3. Fare clic sulla prima casella di controllo per modificare le proprietà.ID Di modifica a ID_VIEW_TOOLBAR e Didascalia a Barra degli strumenti.

    4. Fare clic sulla seconda casella di controllo per modificare le proprietà.ID Di modifica a ID_VIEW_STATUS_BAR e Didascalia a barra di stato.

  2. Creare un pannello denominato finestra con un pulsante di menu combinato.Quando un utente fa clic sul pulsante di menu combinato, tramite un menu di scelta rapida tre controlli che sono già definiti nell'applicazione Scribble.

    1. Da Casella degli strumenti, trascinare Pannello alla categoria Pagina iniziale .Trascinare Pulsante al pannello.

    2. Fare clic sul pannello per modificarne le proprietà.Didascalia Di modifica a finestra.

    3. Fare clic sul pulsante.Didascalia Di modifica a finestre, Chiavi a w, Large Image Index a 1e Split Mode a False.Fare clic sui puntini di sospensione () accanto a Menu Items per aprire la finestra di dialogo Editor elementi .

    4. Fare clic Aggiungi tre volte su per aggiungere tre pulsanti.

    5. Fare clic sul primo pulsante e quindi Didascalia di modifica a nuova finestrae ID a ID_WINDOW_NEW.

    6. Fare clic sul secondo pulsante e quindi Didascalia di modifica a sovrapposizionee ID a ID_WINDOW_CASCADE.

    7. Fare clic sul terzo pulsante e quindi Didascalia di modifica a sezionee ID a ID_WINDOW_TILE_HORZ.

  3. Salvare le modifiche e quindi compilare ed eseguire l'applicazione.I pannelli Finestra e Visualizza da visualizzare.Fare clic sui pulsanti per confermare che funzionano correttamente.

[Sezioni]

Aggiunta di un pannello della guida alla barra multifunzione

A questo punto, è possibile assegnare due voci di menu definite nell'applicazione Scribble ai pulsanti della barra multifunzione che vengono denominati Argomenti della Guida e About Scribble.I pulsanti vengono aggiunti a un pannello nuovo denominato Guida.

Per aggiungere un pannello della guida

  1. Da Casella degli strumenti, trascinare Pannello alla categoria Pagina iniziale .Quindi trascinare due Pulsanti al pannello.

  2. Fare clic sul pannello per modificarne le proprietà.Didascalia Di modifica a guida.

  3. Fare clic sul primo pulsante.Didascalia Di modifica a Argomenti della Guidae ID a ID_HELP_FINDER.

  4. Fare clic sul secondo pulsante.Didascalia Di modifica a Su Scribble…e ID a ID_APP_ABOUT.

  5. Salvare le modifiche e quindi compilare ed eseguire l'applicazione.Un pannello Guida che contiene due pulsanti della barra multifunzione deve essere visualizzato.

    Nota importanteImportante

    Quando si fa clic sul pulsante Argomenti della Guida , l'applicazione Scribble apre un elemento HTML compresso (estensione CHM your_project_namedenominato file della Guida chm.Di conseguenza, se il progetto non è denominato Scribble, è necessario rinominare il file della Guida al nome del progetto.

[Sezioni]

Aggiunta di un pannello della penna alla barra multifunzione

A questo punto, aggiungere un pannello per visualizzare pulsanti che controllano lo spessore e il colore della penna.Tale riquadro contiene una casella di controllo che passa penne tra spesse e difficili.La funzionalità è simile a quella della voce di menu Thick Line nell'applicazione Scribble.

L'applicazione originale Scribble consente ai pesi della penna selezionati dall'utente da una finestra di dialogo visualizzata quando l'utente fa clic su Pen Widths scegliere dal menu.Poiché la barra della barra multifunzione presenta ampio spazio per i nuovi controlli, è possibile sostituire la finestra di dialogo utilizzando due caselle combinate della barra multifunzione.Una casella combinata regola la larghezza della penna gravi e l'altra casella combinata regola la larghezza della penna spessa.

Per aggiungere una penna pannello e caselle combinate alla barra multifunzione

  1. Da Casella degli strumenti, trascinare Pannello alla categoria Pagina iniziale .Trascinare Casella di controllo e due Combo Boxes al pannello.

  2. Fare clic sul pannello per modificarne le proprietà.Didascalia Di modifica a penna.

  3. Fare clic sulla casella di controllo.Didascalia Di modifica a utilizzo densamentee ID a ID_PEN_THICK_OR_THIN.

  4. Fare clic sulla prima casella combinata.Didascalia Di modifica a Sottile la penna, ID a ID_PEN_THIN_WIDTH, Testo a 2, Tipo a Elenco di trascinamentoe Dati a 1; 2; 3; 4; 5; 6; 7; 8; 9;.

  5. Fare clic sulla seconda casella combinata.Didascalia Di modifica a penna spessa, ID a ID_PEN_THICK_WIDTH, Testo a 5, Tipo a Elenco di trascinamentoe Dati a 5; 6; 7; 8; 9; 10; 11; 12; 13; 14; 15; 16; 17; 18; 19; 20;.

  6. Le nuove caselle combinate non corrispondono ad alcune voci di menu esistenti.Pertanto, è necessario creare una voce di menu per ogni opzione della penna.

    1. Nella finestra Visualizzazione risorse , aprire la risorsa menu di IDR_SCRIBBTYPE.

    2. Scegliere Penna per aprire il menu pit .Scegliere il tipo di seguito e digitare la penna di Thi&n.

    3. Fare clic con il pulsante destro del mouse sul testo digitato per aprire la finestra Proprietà quindi modificare la proprietà ID a ID_PEN_THIN_WIDTH.

    4. È inoltre necessario creare un gestore eventi per ogni voce di menu della penna.Fare clic con il pulsante destro del mouse sulla voce di menu della penna di Thi&n appena creato e quindi aggiungi il gestore eventi.Creazione guidata gestore eventi Visualizzare.

    5. Nella casella Elenco classi nella procedura guidata, CScribbleDoc quindi fare clic su Add and Edit.In questo modo viene creato un gestore eventi denominato CScribbleDoc::OnPenThinWidth.

    6. Aggiungere il seguente codice a 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();  
      
  7. Successivamente, creare una voce di menu e gestori eventi per la penna spessa.

    1. Nella finestra Visualizzazione risorse , aprire la risorsa menu di IDR_SCRIBBTYPE.

    2. Scegliere Penna per aprire il menu della penna.Scegliere il tipo di seguito e digitare la penna di Thic&k.

    3. Fare clic con il pulsante destro del mouse sul testo dall'oggetto appena digitato per visualizzare la finestra Proprietà .Modificare la proprietà ID a ID_PEN_THICK_WIDTH.

    4. Fare clic con il pulsante destro del mouse sulla voce di menu Thick Pen appena creato e quindi fare clic Aggiungi gestore eventi.Creazione guidata gestore eventi Visualizzare.

    5. Nella casella Elenco classi della procedura guidata, CScribbleDoc quindi fare clic su Add and Edit.In questo modo viene creato un gestore eventi denominato CScribbleDoc::OnPenThickWidth.

    6. Aggiungere il seguente codice a 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();
      
  8. Salvare le modifiche e quindi compilare ed eseguire l'applicazione.I nuovi pulsanti e caselle combinate da visualizzare.Provare utilizzo di fattori della penna diversi da scribble.

[Sezioni]

Aggiunta di un pulsante di colore al pannello della penna

Successivamente, aggiungere un oggetto di CMFCRibbonColorButton che consente di scribble a colori.

Per aggiungere un pulsante di colore al pannello della penna

  1. Prima di aggiungere il pulsante di colore, creare una voce di menu per.Nella finestra Visualizzazione risorse , aprire la risorsa menu di IDR_SCRIBBTYPE.Fare clic sulla voce di menu Penna per aprire il menu della penna.Scegliere il tipo di seguito e digitare il &Color.Fare clic con il pulsante destro del mouse sul testo dall'oggetto appena digitato per visualizzare la finestra Proprietà .Impostare l'ID a ID_PEN_COLOR.

  2. Aggiungere quindi il pulsante di colore.Da Casella degli strumenti, trascinare Pulsante Colore al pannello Penna .

  3. Fare clic sul pulsante di colore.Didascalia Di modifica a colore, ID a ID_PEN_COLOR, SempliceCercare a True, Large Image Index a 1e Split Mode a False.

  4. Salvare le modifiche e quindi compilare ed eseguire l'applicazione.Il nuovo pulsante di colori devono essere visualizzati nel pannello Penna .Tuttavia, non può essere utilizzato in quanto non dispone di un gestore eventi.I punti riportati di seguito viene illustrato come aggiungere un gestore eventi per il pulsante di colore.

[Sezioni]

Aggiunta di un membro di colore alla classe di documento

Poiché l'applicazione originale Scribble non ha autori di colore, è necessario creare un'implementazione corrispondente.Per archiviare il colore della penna del documento, aggiungere un nuovo membro alla classe del documento, CscribbleDoc.

Per aggiungere un membro di colore al documento classe

  1. In scribdoc.h, nella classe di CScribbleDoc , individuare la sezione di // Attributes .Aggiungere le seguenti righe di codice dopo la definizione di membro dati di m_nThickWidth .

    // Current pen color
    COLORREF   m_penColor;
    
  2. Ogni documento contiene un elenco di rifornisce che l'utente ha già stato creato.Ogni tratto è definito da un oggetto di CStroke .La classe di CStroke non include informazioni sul colore della penna.Pertanto, è necessario modificare la classe.In scribdoc.h, nella classe di CStroke , aggiungere le seguenti righe di codice dopo la definizione di membro dati di m_nPenWidth .

    // Pen color for the stroke
    COLORREF   m_penColor;
    
  3. In scribdoc.h, aggiungere un nuovo costruttore di CStroke dei parametri specificano una larghezza e un colore.Aggiungere la seguente riga di codice dopo l'istruzione di CStroke(UINT nPenWidth); .

    CStroke(UINT nPenWidth, COLORREF penColor);
    
  4. In scribdoc.cpp, aggiungere l'implementazione di nuovo costruttore di CStroke .Aggiungere il codice seguente dopo l'implementazione del costruttore di CStroke::CStroke(UINT nPenWidth) .

    // 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();
    }
    
  5. Modificare la seconda riga del metodo di CStroke::DrawStroke come segue.

    if (!penStroke.CreatePen(PS_SOLID, m_nPenWidth, m_penColor))
    
  6. Impostare il colore della penna predefinito per la classe del documento.In scribdoc.cpp, aggiungere le seguenti righe a CScribbleDoc::InitDocument, dopo l'istruzione di m_nThickWidth = 5; .

    // default pen color is black
    m_penColor = RGB(0,0,0); 
    
  7. In scribdoc.cpp, modificare la prima riga del metodo di CScribbleDoc::NewStroke al seguente.

    CStroke* pStrokeItem = new CStroke(m_nPenWidth, m_penColor);
    
  8. Modificare l'ultima riga del metodo di CScribbleDoc::ReplacePen al seguente.

    m_penCur.CreatePen(PS_SOLID, m_nPenWidth, m_penColor);
    
  9. È stato aggiunto il membro di m_penColor in un passaggio precedente.A questo punto, creare un gestore eventi per il pulsante di colore che imposta il membro.

    1. Nella finestra Visualizzazione risorse , aprire la risorsa menu di IDR_SCRIBBTYPE.

    2. Fare clic con il pulsante destro del mouse sulla voce di menu Colore e fare clic Add Event Handler….Creazione guidata gestore eventi Viene visualizzato.

    3. Nella casella Elenco classi nella procedura guidata, CScribbleDoc quindi fare clic sul pulsante Add and Edit .In questo modo viene creato lo stub del gestore eventi di CScribbleDoc::OnPenColor .

  10. Sostituire lo stub per il gestore eventi di CScribbleDoc::OnPenColor con il codice seguente.

    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();
    }
    
  11. Salvare le modifiche e quindi compilare ed eseguire l'applicazione.È possibile premere il pulsante di colore e modificare il colore della penna.

[Sezioni]

Inizializzare penne e salvare preferenze

Successivamente, inizializzare il colore e lo spessore di autori.Infine, il salvataggio e il caricamento di un disegno di colore da un file.

Per inizializzare i controlli della barra multifunzione

  1. Inizializzare penne sulla barra della barra multifunzione.

    Aggiungere il seguente codice a scribdoc.cpp, nel metodo di CScribbleDoc::InitDocument , dopo l'istruzione di m_sizeDoc = CSize(200,200) .

    // 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);
    
  2. Salvare un colore che disegna in un file.Aggiungere la seguente istruzione a scribdoc.cpp, nel metodo di CStroke::Serialize , dopo l'istruzione di ar << (WORD)m_nPenWidth; .

    ar << (COLORREF)m_penColor;
    
  3. Infine, caricare un disegno di colore da un file.Aggiungere la seguente riga di codice, nel metodo di CStroke::Serialize , dopo l'istruzione di m_nPenWidth = w; .

    ar >> m_penColor;
    
  4. Ora scribble a colori e salvare il disegno in un file.

[Sezioni]

Conclusione

È stata aggiornata l'applicazione Scribble MFC.Utilizzare la procedura dettagliata come guida quando si modificano le applicazioni esistenti.

Vedere anche

Attività

Procedura dettagliata: Aggiornare l'applicazione Scribble MFC (parte 1)

Altre risorse

Procedure dettagliate (MFC)