Making such listbox involves the following steps(at-least which i did in my projects)
1) Create an array(containing the same number of elements which needs to be shown on screen) of rectangles(TRect's) equally divided(actually it depends whether the size of listbox items is equal or it can vary from item to item), e.g. RArray<TRect> iRectArray. Fill this array with TRect values for each element, containing the extent of each element.
So in brief,what does above code stands for : each listbox item will start from (5,10) position & will have a width : screensize-20 & height : 50 & this would be done in SizeChanged() method of the container, along with other things like setting image size etc. class.
for (iCount = 0; iCount <iListCount; iCount++)
iRectArray.Append(TRect(aRect.iTl.iX+5, aRect.iTl.iY+10, aRect.iBr.iX-20, aRect.iTl.iY + 60));
iRectArray.Append(TRect(aRect.iTl.iX+5, iRectArray[iCount-1].iBr.iY+10, aRect.iBr.iX-20, iRectArray[iCount-1].iBr.iY + 60));
iListCount--- > no of listbox elements to be shown on screen
iRectArray ----->RArray<TRect> iRectArray;
2) Drawing listbox items as per the filled up array which should be done in Draw() method of the container. Now, the listbox items may contain different elements like image, text etc as there are in the screenshot you shared. E.g:
for (TInt iCount = 1; iCount <= iListCount; iCount++)
gc.BitBltMasked(TPoint(iRectArray[iCount-1].iTl.iX + 20 , iRectArray[iCount-1].iTl.iY + 15),iSomeBitmap, iiSomeBitmapRect, iSomeBitmapMask,EFalse);draw some bitmap at the position you want inside the rectangle assigned for that listbox item
gc.DrawText(iTitle,TPoint(iRectArray[iCount-1].iTl.iX + 78,iRectArray[iCount-1].iTl.iY + 35)); // draw some text at the position you want inside the rectangle assigned for that listbox item
gc.DrawLine(TPoint(iRectArray[iCount-1].iTl.iX+8 , iRectArray[iCount-1].iBr.iY+5),TPoint(iRectArray[iCount-1].iTl.iX+8+iRectArray[iCount-1].Size().iWidth, iRectArray[iCount-1].iBr.iY+5)); //// the partition between listbox elements
running this for loop will result into the drawing of listbox as per the array of rectangle taken in SizeChanged() & will look like a real listbox drawn.
May be i didn't explained it quite well but it might be enough for you to at-least start & share your progress here. The scrolling part, i'll explain later when you have reached drawing the listbox.