MFC - C++ - CWnd derived control in markup

Message Topic Search Topic Options Post Reply Create New Topic Printable Version Translate Topic

I would like to present the way you can create your own XAML tag and put CWnd derived control inside markup. In my exaple I create edit box markup.

All you have to do is to create a class derived from CXTPMarkupFrameworkElement, register a new markup type and register some events, so you can interact with the control.

MarkupEdit.h

#pragma once
class MarkupEdit : public CXTPMarkupFrameworkElement
{
    DECLARE_MARKUPCLASS(MarkupEdit)

public:
    virtual CSize MeasureOverride(CXTPMarkupDrawingContext* pDC, CSize constraint);
    virtual void OnRender(CXTPMarkupDrawingContext* pDC);

    HWND GetEdit();  //returns HWND of the edit box control

protected:
    MarkupEdit() {}
    virtual ~MarkupEdit() {}

    void CreateControl(CRect rc);

protected:
    CXTPEdit mEdit; //the control we want to put into markup

public:
    static CXTPMarkupRoutedEvent* m_pCreateEvent; //an event we want to fire after the control is created
};

MarkupEdit.cpp

#include "stdafx.h"
#include "MarkupEdit.h"

CXTPMarkupRoutedEvent* MarkupEdit::m_pCreateEvent = NULL;

//This line bindes the markup control with its tag
IMPLEMENT_MARKUPCLASS(L"EditBox", MarkupEdit, CXTPMarkupFrameworkElement)

void MarkupEdit::RegisterMarkupClass()
{
    //register 'Create' event
    m_pCreateEvent = CXTPMarkupRoutedEvent::RegisterRoutedEvent(L"Create", CXTPMarkupRoutedEvent::routingBubble, MARKUP_TYPE(MarkupEdit));
}

CSize MarkupEdit::MeasureOverride(CXTPMarkupDrawingContext* /*pDC*/, CSize constraint)
{
    return constraint;
}

void MarkupEdit::OnRender(CXTPMarkupDrawingContext* pDC)
{
    if (!mEdit.GetSafeHwnd())
    {
        CRect rc = m_pMarkupContext->GetClientBoundingRect(this);
        CreateControl(rc);
    }
}

void MarkupEdit::CreateControl(CRect rc)
{
    if (m_pMarkupContext)
    {
        CWnd* wnd = CWnd::FromHandle(m_pMarkupContext->m_hContextWnd);
        if (wnd)
        {
            if (!mEdit.GetSafeHwnd())
            {
                mEdit.Create(ES_LEFT | ES_AUTOHSCROLL | WS_VISIBLE | WS_CHILD | WS_BORDER,
                    rc, wnd, 0);
                mEdit.SetFont(&XTAuxData().font);

                //fire 'Create' event
                CXTPMarkupRoutedEventArgs e(m_pCreateEvent, this);
                RaiseEvent(&e);
            }
        }
    }
}

HWND MarkupEdit::GetEdit()
{
    return mEdit.GetSafeHwnd();
}

Register new markup control:

    MarkupEdit::RegisterType();

You can do it for example in the constructor of CMarkupStatic class from Codejock sample.

Define method to handle control events:

    AddHandler(MarkupEdit::m_pCreateEvent, CreateMarkupClassDelegate(this, &CMarkupStatic::OnEditCreate));

Now you can put into XAML your tag:

...
<EditBox Tag='Edit1' Width='100' Height='26'/>
...

When the edit control is created inside markup, 'Create' event is fired and you can get the pointer or HWND of the control. If you put more edit boxes into markup, you can distighuish them by 'Tag' property.

void Avatar::OnEditCreate(CXTPMarkupObject* pSender, CXTPMarkupRoutedEventArgs* pArgs)
{
    if (pSender->IsKindOf(MARKUP_TYPE(MarkupEdit)))
    {
        pArgs->SetHandled();

        CXTPMarkupString* pTag = MARKUP_DYNAMICCAST(CXTPMarkupString, ((MarkupEdit*)pSender)->GetTag());
        if (pTag)
        {
            CString tag = (LPCTSTR)*pTag;
            if (tag == _T("Edit1"))
            {
                mEditHwnd = ((MarkupEdit*)pSender)->GetEdit();
            }
        }
    }
}

As long as markup exists, you can read whatever user entered into edit box.

    if (mEditHwnd)
    {
        CString text;
        ::GetWindowText(mEditHwnd, text.GetBufferSetLength(128), 128);
    }

Voila 

Comments, questions and improvements are welcome.