Dela via


Genomgång: Uppdatera MFC Scribble-programmet (del 1)

Den här genomgången visar hur du ändrar ett befintligt MFC-program för att använda menyfliksområdets användargränssnitt. Visual Studio stöder både menyfliksområdet Office 2007 och menyfliksområdet Windows 7 Scenic. Mer information om användargränssnittet för menyfliksområdet finns i Menyfliksområdet.

Den här genomgången ändrar det klassiska Scribble 1.0 MFC-exemplet som gör att du kan använda musen för att skapa linjeritningar. Den här delen av genomgången visar hur du ändrar Scribble-exemplet så att det visar ett ribbonfält. Del 2 lägger till fler knappar i menyfliksområdet.

Förutsättningar

Scribble 1.0 MFC-exemplet. Mer information om hur du konverterar till Visual Studio 2017 eller senare finns i Porteringsguide: MFC Scribble.

Sektioner

Den här delen av genomgången innehåller följande avsnitt:

Ersätta basklasserna

Om du vill konvertera ett program som stöder en meny till ett program som stöder ett menyfliksområde måste du härleda klasser för program, ramfönster och verktygsfält från uppdaterade basklasser. (Vi föreslår att du inte ändrar det ursprungliga Scribble-exemplet. Rensa Scribble-projektet istället, kopiera det till en annan katalog och ändra sedan kopian.)

Så här ersätter du basklasserna i Scribble-programmet

  1. I scribble.cpp kontrollerar du att CScribbleApp::InitInstance det innehåller ett anrop till AfxOleInit.

  2. Lägg till följande kod i filen pch.h (stdafx.h i Visual Studio 2017 och tidigare):

    #include <afxcontrolbars.h>
    
  3. Ändra definitionen för klassen i scribble.h så att den CScribbleApp härleds från CWinAppEx-klassen.

    class CScribbleApp: public CWinAppEx
    
  4. Scribble 1.0 skrevs när Windows-program använde en initieringsfil (.ini) för att spara användarinställningsdata. I stället för en initieringsfil ändrar du Scribble för att lagra användarinställningar i registret. Om du vill ange registernyckeln och basen skriver du följande kod i CScribbleApp::InitInstance efter -instruktionen LoadStdProfileSettings() .

    SetRegistryKey(_T("MFCNext\\Samples\\Scribble2"));
    SetRegistryBase(_T("Settings"));
    
  5. Huvudramen för ett MDI-program (Multiple Document Interface) härleds inte längre från CMDIFrameWnd klassen. I stället härleds den från klassen CMDIFrameWndEx .

    I filerna mainfrm.h och mainfrm.cpp ersätter du alla referenser till CMDIFrameWnd med CMDIFrameWndEx.

  6. I filerna childfrm.h och childfrm.cpp ersätter du CMDIChildWnd med CMDIChildWndEx.

    I childfrm. h-fil, ersätt CSplitterWnd med CSplitterWndEx.

  7. Ändra verktygsfält och statusstaplar så att de nya MFC-klasserna används.

    I filen mainfrm.h:

    1. Ersätt CToolBar med CMFCToolBar.

    2. Ersätt CStatusBar med CMFCStatusBar.

  8. I filen mainfrm.cpp:

    1. Ersätt m_wndToolBar.SetBarStyle med m_wndToolBar.SetPaneStyle

    2. Ersätt m_wndToolBar.GetBarStyle med m_wndToolBar.GetPaneStyle

    3. Ersätt DockControlBar(&m_wndToolBar) med DockPane(&m_wndToolBar)

  9. I filen ipframe.cpp kommenterar du ut följande tre rader med kod.

    m_wndToolBar.EnableDocking(CBRS_ALIGN_ANY);
    pWndFrame->EnableDocking(CBRS_ALIGN_ANY);
    pWndFrame->DockPane(&m_wndToolBar);
    
  10. Spara ändringarna och skapa och kör sedan programmet.

Lägga till bitmappar i projektet

De kommande fyra stegen i den här genomgången kräver bitmappsresurser. Du kan hämta lämpliga bitmappar på olika sätt:

  • Använd resursredigerarna för att uppfinna dina egna bitmappar. Eller använd resursredigerarna för att montera bitmappar från de bärbara nätverksgrafikbilderna (.png) som ingår i Visual Studio och som kan laddas ned från Visual Studio-bildbiblioteket.

    Dock kräver användargränssnittet menyfliksområdet att vissa bitmappar stöder transparenta bilder. Transparenta bitmappar använder 32-bitars bildpunkter, där 24 bitar anger de röda, gröna och blå komponenterna i färgen, och 8 bitar definierar en alfakanal som anger färgens genomskinlighet. De aktuella resursredigerarna kan visa, men inte ändra bitmappar med 32-bitars bildpunkter. Använd därför en extern bildredigerare i stället för resursredigerarna för att manipulera transparenta bitmappar.

  • Kopiera en lämplig resursfil från ett annat program till projektet och importera sedan bitmappar från filen.

Den här genomgången kopierar resursfiler från exemplet som skapades i Genomgång: Skapa ett menyfliksprogram med hjälp av MFC.

Så här lägger du till bitmappar i projektet

  1. Använd Utforskaren för att kopiera följande .bmp-filer från resurskatalogen (res) i Ribbon-exemplet till resurskatalogen (res) i Scribble-projektet.

    1. Kopiera main.bmp till ditt Scribble-projekt.

    2. Kopiera filesmall.bmp och filelarge.bmp till ditt Scribble-projekt.

    3. Gör nya kopior av filelarge.bmp- och filesmall.bmp-filerna, men spara kopiorna i menyfliksområdets exempel. Byt namn på kopiorna homesmall.bmp och homelarge.bmp och flytta sedan kopiorna till ditt Scribble-projekt.

    4. Gör en kopia av filen toolbar.bmp, men spara kopian i menyfliksområdets exempel. Byt namn på kopian panelicons.bmp och flytta sedan kopian till ditt Scribble-projekt.

  2. Importera bitmappen för ett MFC-program. Dubbelklicka på noden scribble.rc i resursvyn, dubbelklicka på bitmappsnoden och klicka sedan på Lägg till resurs. I dialogrutan som visas klickar du på Importera. Bläddra till res katalogen, välj filen main.bmp och klicka sedan på Öppna.

    Den main.bmp bitmappen innehåller en 26x26-bild. Ändra ID:t för bitmappen till IDB_RIBBON_MAIN.

  3. Importera bitmapparna för filmenyn som är kopplad till programknappen.

    1. Importera filen filesmall.bmp, som innehåller elva 16x16-avbildningar (16x176). Ändra ID:t för bitmappen till IDB_RIBBON_FILESMALL.

    Anmärkning

    Eftersom vi bara behöver de första åtta 16x16-bilderna (16x128) kan du beskära den högra bredden på den här bitmappen från 176 till 128.

    1. Importera filelarge.bmp, som innehåller nio 32x32-bilder (32x288). Ändra ID:t för bitmappen till IDB_RIBBON_FILELARGE.
  4. Importera bitmapparna för menyfliksområdets kategorier och paneler. Varje flik i menyfliksområdet är en kategori och består av en textetikett och en valfri bild.

    1. Importera homesmall.bmp bitmapp, som innehåller elva 16x16-bilder för små knappbitmappar. Ändra ID:t för bitmappen till IDB_RIBBON_HOMESMALL.

    2. Importera homelarge.bmp bitmapp, som innehåller nio 32x32-bilder för stora knappbitmappar. Ändra ID:t för bitmappen till IDB_RIBBON_HOMELARGE.

  5. Importera bitmappar för de storleksanpassade menyflikspanelerna. Dessa bitmappar eller panelikoner används efter en storleksändringsåtgärd om menyfliksområdet är för litet för att visa hela panelen.

    1. Importera panelicons.bmp bitmappen, som innehåller åtta 16x16-bilder. I fönstret Egenskaper i bitmappsredigeraren justerar du bitmappens bredd till 64 (16 x 64). Ändra ID:t för bitmappen till IDB_PANEL_ICONS.

    Anmärkning

    Eftersom vi bara behöver de första fyra 16x16-bilderna (16x64) kan du beskära den högra bredden på den här bitmappen från 128 till 64.

Lägga till en menyfliksresurs i projektet

När du konverterar ett program som använder menyer till ett program som använder ett menyfliksområde behöver du inte ta bort eller inaktivera befintliga menyer. Skapa bara en menyfliksresurs, lägg till menyfliksknappar och associera sedan de nya knapparna med de befintliga menyalternativen. Även om menyerna inte längre visas dirigeras meddelanden från menyfliksområdet genom menyerna och menygenvägarna fortsätter att fungera.

Ett menyfliksområde består av knappen Program , som är den stora knappen längst upp till vänster i menyfliksområdet och en eller flera kategoriflikar. Varje kategoriflik innehåller en eller flera paneler som fungerar som containrar för menyfliksknappar och kontroller. Följande procedur visar hur du skapar en menyfliksresurs och sedan anpassar knappen Program .

Så här lägger du till en menyfliksresurs i projektet

  1. När du har valt klotterprojektet i Solution Explorer går du till Projekt-menyn och klickar på Lägg till resurs.

  2. I dialogrutan Lägg till resurs väljer du Flik och klickar sedan på Nytt.

    Visual Studio skapar en menyfliksresurs och öppnar den i designvyn. Menyfliksområdets resurs-ID är IDR_RIBBON1, som visas i resursvyn. Menyfliksområdet innehåller en kategori och en panel.

  3. Du kan anpassa programknappen genom att ändra dess egenskaper. Meddelande-ID:t som används i den här koden har redan definierats i menyn för Scribble 1.0.

  4. I designvyn klickar du på knappen Program för att visa dess egenskaper. Ändra egenskapsvärden enligt följande: Bild till IDB_RIBBON_MAIN, Fråga till File, Nycklar till f, Stora bilder till IDB_RIBBON_FILELARGEoch Små bilder till IDB_RIBBON_FILESMALL.

  5. Följande ändringar skapar menyn som visas när användaren klickar på knappen Program . Klicka på ellipsen (...) bredvid Huvudobjekt för att öppna objektredigeraren.

    1. När knappen Objekttypär markerad klickar du på Lägg till för att lägga till en knapp. Ändra Bildtext till &New, ID till ID_FILE_NEW, Bild till 0, Stor bild till 0.

    2. Klicka på Lägg till för att lägga till en knapp. Ändra Bildtext till &Save, ID till ID_FILE_SAVE, Bild till 2och Bild stor till 2.

    3. Klicka på Lägg till för att lägga till en knapp. Ändra Bildtext till Save &As, ID till ID_FILE_SAVE_AS, Bild till 3och Bild stor till 3.

    4. Klicka på Lägg till för att lägga till en knapp. Ändra Bildtext till &Print, ID till ID_FILE_PRINT, Bild till 4och Bild stor till 4.

    5. Ändra objekttypen till Avgränsare och klicka sedan på Lägg till.

    6. Ändra Objekttyp till Knapp. Klicka på Lägg till för att lägga till en femte knapp. Ändra Bildtext till &Close, ID till ID_FILE_CLOSE, Bild till 5och Bild stor till 5.

  6. Följande ändringar skapar en undermeny under knappen Skriv ut som du skapade i föregående steg.

    1. Klicka på knappen Skriv ut , ändra Objekttyp till Etikett och klicka sedan på Infoga. Ändra undertext till Preview and print the document.

    2. Klicka på knappen Skriv ut , ändra Objekttyp till Knapp och klicka på Infoga. Ändra Bildtext till &Print, ID till ID_FILE_PRINT, Bild till 4och Bild stor till 4.

    3. Klicka på knappen Skriv ut och klicka sedan på Infoga för att lägga till en knapp. Ändra Bildtext till &Quick Print, ID till ID_FILE_PRINT_DIRECT, Bild till 7och Bild stor till 7.

    4. Klicka på knappen Skriv ut och klicka sedan på Infoga för att lägga till en annan knapp. Ändra Bildtext till Print Pre&view, ID till ID_FILE_PRINT_PREVIEW, Bild till 6och Bild stor till 6.

    5. Nu har du ändrat huvudobjekten. Klicka på Stäng för att avsluta objektredigeraren.

  7. Följande ändring skapar en avslutsknapp som visas längst ned på menyn Programknapp .

    1. Välj fliken Resursvy i Solution Explorer.

    2. I fönstret Egenskaper klickar du på ellipsen (...) bredvid Knappen för att öppna objektredigeraren.

    3. När knappen Objekttypär markerad klickar du på Lägg till för att lägga till en knapp. Ändra Bildtext till E&xit, ID till ID_APP_EXIT, Bild till 8.

    4. Du har ändrat knapparna. Klicka på Stäng för att avsluta objektredigeraren.

Skapa en instans av menyfliksområdet

Följande steg visar hur du skapar en instans av menyfliksområdet när programmet startar. Om du vill lägga till ett bandfält i ett program deklarerar du menyfliksområdet i filen mainfrm.h. Skriv sedan kod i mainfrm.cpp-filen för att läsa in menyfliksområdets resurs.

Så här skapar du en instans av menyfliksområdet

  1. I filen mainfrm.h lägger du till en datamedlem i det skyddade avsnittet CMainFramei , klassdefinitionen för huvudramen. Den här medlemmen är för ribbonfältet.

    // Ribbon bar for the application
    CMFCRibbonBar m_wndRibbonBar;
    
  2. I filen mainfrm.cpp lägger du till följande kod före den slutliga return instruktionen i slutet av CMainFrame::OnCreate funktionen. Den skapar en instans av menyfliksområdet.

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

Anpassa menyfliksområdets resurs

Nu när du har skapat knappen Program kan du lägga till element i menyfliksområdet.

Anmärkning

Den här genomgången använder samma panelikon för alla paneler. Du kan dock använda andra bildlistindex för att visa andra ikoner.

Så här lägger du till en hemkategori och en redigeringspanel

  1. Scribble-programmet kräver bara en kategori. Dubbelklicka på Kategori i designvyn i verktygslådan för att lägga till en och visa dess egenskaper. Ändra egenskapsvärden enligt följande: Bildtext till &Home, Stora bilder till IDB_RIBBON_HOMELARGE, Små bilder till IDB_RIBBON_HOMESMALL.

  2. Varje flikkategori ordnas i namngivna paneler. Varje panel innehåller en uppsättning kontroller som slutför relaterade åtgärder. Den här kategorin har en panel. Klicka på Panel och ändra sedan Bildtext till Edit.

  3. I panelen Redigera lägger du till en knapp som ansvarar för att rensa innehållet i dokumentet. Meddelande-ID för den här knappen har redan definierats i menyresursen IDR_SCRIBBTYPE . Ange Clear All som knapptext och index för bitmappen som dekorerar knappen. Öppna verktygslådan och dra sedan en knapp till panelen Redigera . Klicka på knappen och ändra sedan Bildtext till Clear All, ID till ID_EDIT_CLEAR_ALL, Bildindex till 0, Stort bildindex till 0.

  4. Spara ändringarna och skapa och kör sedan programmet. Scribble-applikationen ska visas, och det ska ha en ribbonbar överst i fönstret i stället för en menyrad. Menyfliksområdet bör ha en kategori, Start och Start , bör ha en panel, Redigera. Knapparna i menyfliksområdet som du har lagt till bör associeras med befintliga händelsehanterare, och knapparna Öppna, Stäng, Spara, Skriv ut och Ta bort alla bör fungera som förväntat.

Ange programmets utseende

En visual manager är ett globalt objekt som styr all ritning för ett program. Eftersom det ursprungliga Scribble-programmet använder office 2000-användargränssnittsformatet (UI) kan programmet se gammaldags ut. Du kan återställa programmet så att det använder Office 2007 Visual Manager så att det liknar ett Office 2007-program.

Så här ställer du in utseendet på programmet

  1. CMainFrame::OnCreate I funktionen skriver du följande kod före -instruktionen return 0; för att ändra standardvisualiseringshanteraren och formatmallen.

    // Set the default manager to Office 2007
    CMFCVisualManager::SetDefaultManager(RUNTIME_CLASS(CMFCVisualManagerOffice2007));
    CMFCVisualManagerOffice2007::SetStyle(CMFCVisualManagerOffice2007::Office2007_LunaBlue);
    
  2. Spara ändringarna och skapa och kör sedan programmet. Programgränssnittet bör likna Office 2007-användargränssnittet.

Nästa steg

Du har modifierat det klassiska Scribble 1.0 MFC-exemplet så att det använder Ribbon Designer. Gå nu till del 2.

Se även

genomgångar
Genomgång: Uppdatera MFC Scribble-programmet (del 2)