how to display the images of CcomboboxEx items at right side instead of the left side of text?

Question

The MFC control CcomboBoxEx always show images at the left side of text of each item, but my client requires the icon or image to show up at the right side of the text of each item in CcomboBoxEx control, how to do it?

Answer 1

Hi, @bingbing457
As RLWA32 said, you need to handle OwnerDraw.

Below is a quick test. Using Drop List type:

Header:

class MyBox : public CComboBoxEx {
 DECLARE_DYNAMIC(MyBox)
public: MyBox(); 
virtual ~MyBox(); 
protected: 
afx_msg void OnDrawItem(int nIDCtl, LPDRAWITEMSTRUCT lpDrawItemStruct);
afx_msg void OnMeasureItem(int nIDCtl, LPMEASUREITEMSTRUCT lpMeasureItemStruct); 
protected: DECLARE_MESSAGE_MAP() };

Cpp:

// MyBox.cpp : implementation file
//

#include "pch.h"
#include "MFCApplication1.h"
#include "MyBox.h"


// MyBox

IMPLEMENT_DYNAMIC(MyBox, CComboBoxEx)

MyBox::MyBox()
{

}

MyBox::~MyBox()
{
}


BEGIN_MESSAGE_MAP(MyBox, CComboBoxEx)
	ON_WM_DRAWITEM()
	ON_WM_MEASUREITEM()
END_MESSAGE_MAP()



// MyBox message handlers


void MyBox::OnDrawItem(int nIDCtl, LPDRAWITEMSTRUCT lpDrawItemStruct)
{
    if (nIDCtl == GetDlgCtrlID())
    {
        CDC dc;
        dc.Attach(lpDrawItemStruct->hDC);

        CString strText;
        GetLBText(lpDrawItemStruct->itemID, strText);

        CRect rectText = lpDrawItemStruct->rcItem;
        CRect rectImage = rectText;
        int iconWidth = 16; 
        int iconHeight = 16; 
        rectImage.left = rectText.right - iconWidth;

        COMBOBOXEXITEM item;
        item.mask = CBEIF_IMAGE;
        item.iItem = lpDrawItemStruct->itemID;
        GetItem(&item); 

        int imageIndex = item.iImage;
        CImageList* pImageList = GetImageList();

        if (pImageList && imageIndex >= 0)
        {
            CPoint ptImage(rectImage.left, rectImage.top + (rectImage.Height() - iconHeight) / 2);
            pImageList->Draw(&dc, imageIndex, ptImage, ILD_TRANSPARENT);
            rectText.right -= iconWidth; 
        }

        dc.DrawText(strText, rectText, DT_LEFT | DT_SINGLELINE | DT_VCENTER);

        dc.Detach();
    }
}


void MyBox::OnMeasureItem(int nIDCtl, LPMEASUREITEMSTRUCT lpMeasureItemStruct)
{
    if (nIDCtl == GetDlgCtrlID())
    {
       
        lpMeasureItemStruct->itemHeight = 20; 
    }
}

Best regards,

Minxin Yu

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Answer 2

The ComboBoxEx common control does not have built-in support for drawing the image to the right side of the text. Additionally, it uses owner draw with a child ComboBox control.

So to achieve your objective it seems to me that you can handle owner draw with a ComboBox control or subclass a ComboBoxEx control to handle WM_DRAWITEM.

I know that its not the desired answer but I don't see another way.

Answer 3

You could use WS_EX_LAYOUTRTL (but text also on right...)

In Control Spy :