Making a master-detail view with a header bar per item group in a Virtual Treeview (TVirtualStringTree)

Question

I am trying to get a result that looks like this out of TVirtualStringTree:

I believe that it might be possible either directly with TVirtualStringTree (the main Virtual Treeview control by Mike Lischke), or by subclassing it and modifying the inherited control, or by going to a TVirtualDrawTree.

Here is what I can get, and shows the problem that I face:

The problem I have is that I can't seem to get the text for column 0 to take up the entire horizontal area of the virtual treeview control. There is a virtual treeview demo in the Advanced demo showing multiline text that appears to do what I need, but I am unable to figure out how to apply it in combination with the detail columns that I need below the header row (shown as Node,Node,Node in the picture).

Here is what I tried:

• Modify ContentRect.Right in BeforeCellPaint event:
• set toGridExtensions on in TreeOptions.MiscOptions.

Here is a code sample showing how I tried to change the contentRect:

procedure TForm1.VirtualStringTree1BeforeCellPaint(Sender: TBaseVirtualTree;
  TargetCanvas: TCanvas; Node: PVirtualNode; Column: TColumnIndex;
  CellPaintMode: TVTCellPaintMode; CellRect: TRect; var ContentRect: TRect);
var
   level:Integer;
begin
 level := VirtualStringTree1.GetNodeLevel(Node);
 if (level=0) then
    Inc( ContentRect.Right, 300);

end;

Update:

Using the answer accepted below, I get the following:

Answer 1

I think you want to use toAutoSpanColumns option (in TreeOptions.AutoOptions), possibly with OnGetCellIsEmpty event (shouldn't be needed if you return text only for the first column).

To get multiline nodes init them with ivsMultiline state (in OnInitNode event) or set vtree.MultiLine[Node] := boolean;