How to paint a larger TrackBar thumb which can move when the mouse drags it?

Question

I want to create my own TrackBar, and I want to paint a bigger thumb. Here is my code.

void __fastcall TTrackBar1::CrnNotify(TWMNotify &Message)
{
    LPNMCUSTOMDRAW lpDraw = (LPNMCUSTOMDRAW)Message.NMHdr;

    if(lpDraw->hdr.code == NM_CUSTOMDRAW)
    {
        try
        {
            m_pCanvas->Lock();
            m_pCanvas->Handle = lpDraw->hdc;
            if(!(lpDraw->dwDrawStage & CDDS_ITEM))
                Message.Result = CDRF_NOTIFYITEMDRAW;
            else
                CrnCustomDraw(Message);
        }
        __finally
        {
            m_pCanvas->Handle = NULL;
            m_pCanvas->Unlock();
        }
    }
}
//---------------------------------------------------------------------------
void __fastcall TTrackBar1::CrnCustomDraw(TWMNotify &Message)
{
    LPNMCUSTOMDRAW lpDraw = (LPNMCUSTOMDRAW)Message.NMHdr;

    if(!(lpDraw->dwDrawStage & CDDS_PREPAINT))
        return;

    TRect rct = lpDraw->rc;

    if(lpDraw->dwItemSpec == TBCD_THUMB)
    {
        TRect drct;

        if(Orientation == trVertical){
            drct.left = rct.left - 5;
            drct.right = rct.right + 5;
            drct.top = rct.top - 10;
            drct.bottom = rct.bottom + 10;
        }
        m_pCanvas->RoundRect(drct,2,2);
        ::Graphics::TBitmap *bmp= new ::Graphics::TBitmap;
        bmp->Transparent = true;
        bmp->LoadFromFile("UI//slider.bmp");
        m_pCanvas->CopyRect(drct, bmp->Canvas, TRect(0,0,bmp->Width,bmp->Height));
        delete bmp;
    }

I create a new TRect to copy my bmp to the thumb, but the problem is my thumb will not follow the Rect except the original area of thumb. Just like this.

As long as you select another form, it will repaint the image on the right position.

I want to know, how can I paint a TrackBar thumb which can move with the mouse correctly when dragged?