Implementing a full Ribbon in a native application (more)

Here is my ribbon in my application:

modeler1_ribbon

The first item to create is the circle button that acts as the file menu. It is done using CMFCRibbonMainPanel class.

Then you create a category called Home using CMFCRibbonCategory class.

After this step, you have to create panels using CMFCRibbonPanel class.

Inside your panel, you can create button, combo box and galley using CMFCRibbonButton class, CMFCRibbonComboBox class, CMFCRibbonGallery  class.

Here is the whole source code:


void CMainFrame::InitMainButton()
{
m_MainButton.SetImage(IDB_RIBBON_MAIN);
m_MainButton.SetToolTipText(_T("File"));
m_MainButton.SetText(_T("\nf"));

CreateDocumentColors();

m_wndRibbonBar.SetApplicationButton(&m_MainButton, CSize(45, 45));

CMFCRibbonMainPanel* pMainPanel = m_wndRibbonBar.AddMainCategory(_T("File"), IDB_RIBBON_FILESMALL, IDB_RIBBON_FILELARGE);
pMainPanel->Add(new CMFCRibbonButton(ID_FILE_NEW, _T("&New"), 0, 0));
pMainPanel->Add(new CMFCRibbonButton(ID_FILE_OPEN, _T("&Open..."), 1, 1));
pMainPanel->Add(new CMFCRibbonButton(ID_FILE_OPEN_AS_XML, _T("Open As XML..."), 1, 1));
pMainPanel->Add(new CMFCRibbonButton(ID_FILE_SAVE, _T("&Save"), 2, 2));
pMainPanel->Add(new CMFCRibbonButton(ID_FILE_SAVE_AS, _T("Save &As..."), 3, 3));
pMainPanel->Add(new CMFCRibbonButton(ID_FILE_SAVE_AS_XML, _T("Save As &XML..."), 3, 3));
pMainPanel->AddSeparator();
pMainPanel->Add(new CMFCRibbonButton(ID_FILE_CLOSE, _T("&Close"), 8, 8));
pMainPanel->AddRecentFilesList(_T("Recent Documents"));
pMainPanel->AddToBottom(new CMFCRibbonMainPanelButton(ID_APP_EXIT, _T("E&xit"), 27));

CMFCRibbonCategory* pCategory = m_wndRibbonBar.AddCategory(_T("&Home"), IDB_RIBBON_WRITESMALL, IDB_RIBBON_WRITELARGE);
// Create "Design" panel
CMFCRibbonPanel* pPanelDesign = pCategory->AddPanel(_T("Design\nzd"), m_PanelImages.ExtractIcon(2));
pPanelDesign->Add(new CMFCRibbonButton(ID_DESIGN_SELECT, _T("Select\nc"), 2));
//pPanelDesign->Add(new CMFCRibbonButton(ID_DESIGN_RECTANGLE, _T("Rectangle\ng"), 2));
//pPanelDesign->Add(new CMFCRibbonButton(ID_DESIGN_LINE, _T("Line\ng"), 2));
//pPanelDesign->Add(new CMFCRibbonButton(ID_DESIGN_ELLIPSE, _T("Ellipse\ng"), 2));

CMFCRibbonButton* pInsertPictureBtn = new CMFCRibbonButton(ID_DESIGN_IMAGE, _T("Picture"), 4, 4);
pPanelDesign->Add(pInsertPictureBtn);

CMFCRibbonGallery *pInsertShapesBtn = new CMFCRibbonGallery(ID_DESIGN_SHAPES, _T("Shapes"), 6, 6);
pInsertShapesBtn->SetButtonMode();
pInsertShapesBtn->SetIconsInRow(12);
pInsertShapesBtn->AddGroup(_T("Recently Used Shapes"), IDB_SHAPE1, 20);
pInsertShapesBtn->AddGroup(_T("Lines"), IDB_SHAPE2, 20);
pInsertShapesBtn->AddGroup(_T("Basic Shapes"), IDB_SHAPE3, 20);
pInsertShapesBtn->AddGroup(_T("Block Arrows"), IDB_SHAPE4, 20);
pInsertShapesBtn->AddGroup(_T("Flowchart"), IDB_SHAPE5, 20);
pInsertShapesBtn->AddGroup(_T("Callouts"), IDB_SHAPE6, 20);
pInsertShapesBtn->AddGroup(_T("Stars and Banners"), IDB_SHAPE7, 20);
pInsertShapesBtn->AddSubItem(new CMFCRibbonButton(ID_DESIGN_SHAPES_NEW, _T("&New Drawing Canvas"), 29, -1));
pPanelDesign->Add(pInsertShapesBtn);

CMFCRibbonButton* pBtnDrawText = new CMFCRibbonButton(ID_DESIGN_TEXTBOX, _T("Draw Text Box\nx"), 15, 15);
pBtnDrawText->SetMenu(IDR_DRAW_TEXT_MENU);
pPanelDesign->Add(pBtnDrawText);
// Add hidden button
pCategory->AddHidden(new CMFCRibbonButton(ID_TEXT_LEFT, _T("&Bottom Border"), 28));
pCategory->AddHidden(new CMFCRibbonButton(ID_TEXT_CENTER, _T("Paste Special"), 29));
pCategory->AddHidden(new CMFCRibbonButton(ID_TEXT_RIGHT, _T("Paste Special"), 30));
pCategory->AddHidden(new CMFCRibbonButton(ID_TEXT_JUSTIFY, _T("Paste Special"), 31));

CRibbonListButton *pListBtnInfra = new CRibbonListButton(ID_DESIGN_SHAPESINFRA, _T("Infrastructure\nti"), 20, -1, FALSE);
pListBtnInfra->AddGroup(_T("Built-In"), IDB_SHAPES_INFRA, 64, m_arInfraShapes);
pListBtnInfra->SetIconsInRow(4);
pListBtnInfra->EnableMenuResize();
pPanelDesign->Add(pListBtnInfra);

CRibbonListButton *pListBtnDev = new CRibbonListButton(ID_DESIGN_SHAPESDEV, _T("Development\ntd"), 35, -1, FALSE);
pListBtnDev->AddGroup(_T("Built-In"), IDB_SHAPES_DEV, 64, m_arInfraDev);
pListBtnDev->SetIconsInRow(4);
pListBtnDev->EnableMenuResize();
pPanelDesign->Add(pListBtnDev);

// Create "Debug" panel
CMFCRibbonPanel* pPanelDebug = pCategory->AddPanel(_T("Debug\nzd"), m_PanelImages.ExtractIcon(2));
pPanelDebug->Add(new CMFCRibbonButton(ID_DEBUG_DUMP_OBJECTS, _T("Dump Objects\nc"), 2));

CMFCRibbonButtonsGroup * apFontGroup = new CMFCRibbonButtonsGroup();
CMFCRibbonFontComboBox* pFontCombo = new CMFCRibbonFontComboBox(ID_FONT_FONT);
pFontCombo->SetWidth(55, TRUE); // Width in "floaty" mode
pFontCombo->SelectItem(10);
apFontGroup->AddButton(pFontCombo);

CMFCRibbonComboBox* pFontSizeCombo = new CMFCRibbonComboBox(ID_FONT_FONTSIZE, FALSE, 39);
pFontSizeCombo->AddItem(_T("8"));
pFontSizeCombo->AddItem(_T("9"));
pFontSizeCombo->AddItem(_T("10"));
pFontSizeCombo->AddItem(_T("11"));
pFontSizeCombo->AddItem(_T("12"));
pFontSizeCombo->AddItem(_T("14"));
pFontSizeCombo->AddItem(_T("16"));
pFontSizeCombo->AddItem(_T("18"));
pFontSizeCombo->AddItem(_T("20"));
pFontSizeCombo->AddItem(_T("22"));
pFontSizeCombo->AddItem(_T("24"));
pFontSizeCombo->AddItem(_T("26"));
pFontSizeCombo->AddItem(_T("28"));
pFontSizeCombo->AddItem(_T("36"));
pFontSizeCombo->AddItem(_T("48"));
pFontSizeCombo->AddItem(_T("72"));
pFontSizeCombo->SetWidth(20, TRUE); // Width in "floaty" mode
pFontSizeCombo->SelectItem(3);
apFontGroup->AddButton(pFontSizeCombo);

pPanelDebug->Add(apFontGroup);

// Create "Show/Hide" panel:
CMFCRibbonPanel* pPanelShow = pCategory->AddPanel(_T("Show/Hide\nzs"), m_PanelImages.ExtractIcon(4));
pPanelShow->Add(new CMFCRibbonCheckBox(ID_VIEW_FILE_VIEW, _T("Solution View\nc")));
pPanelShow->Add(new CMFCRibbonCheckBox(ID_VIEW_CLASS_VIEW, _T("Class View\nc")));
pPanelShow->Add(new CMFCRibbonCheckBox(ID_VIEW_PROPERTIES, _T("Properties View\np")));

// Create "Action" panel
CMFCRibbonPanel* pPanelAction = pCategory->AddPanel(_T("Action\nzd"), m_PanelImages.ExtractIcon(2));
pPanelAction->Add(new CMFCRibbonButton(ID_ACTION_REMOVE, _T("Remove\nc"), 12));
pPanelAction->Add(new CMFCRibbonButton(ID_ACTION_LOAD_MODULE, _T("Import .NET Module\nin"), 35));

// Create "Format" panel
CMFCRibbonPanel* pPanelFormat = pCategory->AddPanel(_T("Format and Style\nzd"), m_PanelImages.ExtractIcon(2));
CMFCRibbonColorButton * pBtnFillColor = new CMFCRibbonColorButton(ID_FORMAT_FILLCOLOR, _T("Fill Color\nsf"), FALSE, 1, -1);
pBtnFillColor->SetDefaultCommand(FALSE);
pBtnFillColor->EnableAutomaticButton(_T("&Automatic"), RGB(128, 128, 128));
pBtnFillColor->EnableOtherButton(_T("&More Fill Colors..."), _T("More Fill Colors"));
pBtnFillColor->SetColumns(10);
pBtnFillColor->SetColorBoxSize(CSize(17, 17));
pBtnFillColor->AddColorsGroup(_T("Theme Colors"), m_lstMainColors);
pBtnFillColor->AddColorsGroup(_T(""), m_lstAdditionalColors, TRUE);
pBtnFillColor->AddColorsGroup(_T("Standard Colors"), m_lstStandardColors);
pBtnFillColor->AddSubItem(new CMFCRibbonButton(ID_FORMAT_NOFILL, _T("&No Fill\nn"), -1));
pBtnFillColor->SetColor((COLORREF)-1);
pPanelFormat->Add(pBtnFillColor);

CMFCRibbonColorButton * pBtnLineColor = new CMFCRibbonColorButton(ID_FORMAT_LINECOLOR, _T("Line Color\nso"), FALSE, 3, -1);
pBtnLineColor->SetDefaultCommand(FALSE);
pBtnLineColor->EnableAutomaticButton(_T("&Automatic"), RGB(0, 0, 0));
pBtnLineColor->EnableOtherButton(_T("&More Line Colors..."), _T("More Line Colors"));
pBtnLineColor->SetColumns(10);
pBtnLineColor->SetColorBoxSize(CSize(17, 17));
pBtnLineColor->AddColorsGroup(_T("Theme Colors"), m_lstMainColors);
pBtnLineColor->AddColorsGroup(_T(""), m_lstAdditionalColors, TRUE);
pBtnLineColor->AddColorsGroup(_T("Standard Colors"), m_lstStandardColors);
pBtnLineColor->AddSubItem(new CMFCRibbonButton(ID_FORMAT_NOLINE, _T("&No Line\nn"), 2));
pBtnLineColor->SetColor((COLORREF)-1);
pPanelFormat->Add(pBtnLineColor);

CStringArray sa;
sa.Add(_T("1 pt"));
sa.Add(_T("2 pt"));
sa.Add(_T("3 pt"));
sa.Add(_T("4 pt"));
sa.Add(_T("5 pt"));
sa.Add(_T("6 pt"));
sa.Add(_T("7 pt"));

CRibbonListButton * pBtnLineWeight = new CRibbonListButton(ID_FORMAT_LINEWIDTH, _T("Line Width\nsw"), 4, -1, IDB_LINEWEIGHT, 96, sa);
pBtnLineWeight->AddSubItem(new CMFCRibbonButton(ID_FORMAT_LINEWIDTH_MORE, _T("More &Lines..."), 5, -1));
pBtnLineWeight->EnableMenuResize(TRUE, TRUE); // Vertical only
pPanelFormat->Add(pBtnLineWeight);

CMFCRibbonColorButton * pBtnPageColor = new CMFCRibbonColorButton(ID_FORMAT_PAGECOLOR, _T("Page Color\npo"), TRUE, -1, 26);
pBtnPageColor->SetDefaultCommand(FALSE);
pBtnPageColor->EnableAutomaticButton(_T("&Automatic"), RGB(0, 0, 0));
pBtnPageColor->EnableOtherButton(_T("&More Line Colors..."), _T("More Line Colors"));
pBtnPageColor->SetColumns(10);
pBtnPageColor->SetColorBoxSize(CSize(17, 17));
pBtnPageColor->AddColorsGroup(_T("Theme Colors"), m_lstMainColors);
pBtnPageColor->AddColorsGroup(_T(""), m_lstAdditionalColors, TRUE);
pBtnPageColor->AddColorsGroup(_T("Standard Colors"), m_lstStandardColors);
pPanelFormat->Add(pBtnPageColor);

pPanelFormat->Add(new CMFCRibbonButton(ID_FORMAT_ZOOM_IN, _T("Zoom In\ni"), -1));
pPanelFormat->Add(new CMFCRibbonButton(ID_FORMAT_ZOOM_OUT, _T("Zoom Out\no"), -1));
CMFCRibbonComboBox *pBtnZoom = new CMFCRibbonComboBox(ID_FORMAT_ZOOM, FALSE, 50, _T("Zoom: "), -1);
pBtnZoom->AddItem(_T("100 %"));
pBtnZoom->AddItem(_T("150 %"));
pBtnZoom->AddItem(_T("200 %"));
pBtnZoom->AddItem(_T("400 %"));
pBtnZoom->AddItem(_T("25 %"));
pBtnZoom->AddItem(_T("50 %"));
pBtnZoom->AddItem(_T("75 %"));
pBtnZoom->SelectItem(0);
pPanelFormat->Add(pBtnZoom);

// Create "Position" panel
CMFCRibbonPanel* pPanelPosition = pCategory->AddPanel(_T("Position\nzd"), m_PanelImages.ExtractIcon(2));
pPanelPosition->Add(new CMFCRibbonButton(ID_POSITION_MOVETOFRONT, _T("Move to Front\nc"), -1, 22));
pPanelPosition->Add(new CMFCRibbonButton(ID_POSITION_MOVEFORWARD, _T("Move Forward\nc"), -1, 24));
pPanelPosition->Add(new CMFCRibbonButton(ID_POSITION_MOVEBACKWARD, _T("Move Backward\nc"), -1, 25));
pPanelPosition->Add(new CMFCRibbonButton(ID_POSITION_MOVETOBACK, _T("Move to Back\nc"), -1, 23));
}
<pre>

See more on codeplex here : https://ultrafluid.codeplex.com/SourceControl/latest#Modeler1/MainFrm.cpp

Advertisements

Tagged: ,

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: