Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

In this Discussion

Using HTML embedded controls in TElXTree

I'm using Victor's improved HTML embedded controls in TElXTree to display progress bars. I have a few questions regarding their use.

1. Is there a way to auto-size the control to fill the cell's width?
2. Is there a way to set a layout/alignment so the control is automatically positioned in the centre/middle of the cell? If not, I know I can use the OnAdjustControlPosition event to set the position but I can't see how to find the tree item/cell that contains the control in order to find the item's height/cell's width so I can centre the control.
3. How do I adjust properties of the control (such as progress bar's position, error/paused state and marquee state)? Can I access the actual control and manipulate that or do I just keep changing the HTML in the cell and let the HTML renderer do the work?

Perhaps it would be worth making a tutorial on these HTML controls since they appear quite powerful but aren't documented anywhere.


  • 8 Comments sorted by Votes Date Added
  • Hi Richard,

    I am currently preparing a demo for HTML embedded controls in ElXTree.
    Meanwhile, here are quick answers:
    1. Yes, you can use OnAdjustControlPosition event. Sample code:

    procedure TForm2.ElXTree1AdjustControlPosition(Sender: TObject;
    aControlName: TLMDString; aData: Pointer; var X, Y: Integer);
    lCell: TElXTreeCell;
    lCell := TElXTreeCell(aData);
    TElXTreeItem(TElXTreeCell(aData).Owner).GetHTMLControlByName(aControlName).Width := lCell.Width;
    X := 2;
    Y := 2;

    2. Yes, you can use, again, the OnAdjustControlPosition event.

    3. All the HTML embedded controls are child controls of ElXTreeView object. Also, each item mantnais its own list of HTML embedded controls. You can use either

    ElXTree1.GetHTMLControlByName() method which looks for a given name among all treeview child controls, or ElXTreeItem.GetHTMLControlByName() method, which browses item's list of HTML embedded control.

    In order to address HTML embedded control by name, you have to set its name in HTML code. Also, you can set property values in html code:

  • Should the visible property work? Setting visible to false in either the HTML or directly on the control doesn't work.

    Also, at which point should I be able to access the control using the GetHTMLControlByName method? At the moment, I've got an event handler for the tree's OnItemPostDraw event that stores a pointer to the control so it can be accessed easily elsewhere. Is this event the best place to do this or is there a better way/place?

    I look forward to your demo.
  • Visible property has currently no effect, because it is used internally to hide/show controls when items are scrolled/collapsed/expanded. I'll have to apply some fixes to make Visible property functional for embedded HTML controls.

    As to GetHTMLControlByName - you should be able to use it as soon as HTML code containing controls has been rendered. You can use OnAdjustControlPosition as well to gather pointers to embedded controls.

    In previous post an HTML code sample is missing, so here is it:

    "In order to address HTML embedded control by name, you have to set its name in HTML code. Also, you can set property values in html code:

    <html><control vclclass="TProgressBar" name="p5" width="50" height="14" position="50"></html>
  • Update: in 2011.7, ElXTreeCell received HTMLControlsVisible property. It allows to hide all cell's embedded controls, if any. Also, OnAdjustControlPosition method was changed: aControlName: TLMDString param was substituted by aControl: TControl param, which eliminates need of searching control by name.
  • Thanks Victor. Sounds good. I'll look forward to the updated version.
  • Everything is going quite well with my HTML progress bar now. I do, however, have one question.

    When the mouse is over the HTML control, the tree item doesn't HotTrack nor show item hints. Is this something you can add support for?

    I see HotTracking while over HTML controls as expected behaviour since you're still hovering over the item itself. (The HTML control should essentially become part of the tree item.)

    As for the hints, perhaps the item hint could show through when the HTML control has ShowHint = False, or alternatively include an HTMLControlShowItemHint (or similar) property on the tree item.
  • This is subtle issue; thank you for your observation. I'll think about what fix would be best for hot track and item hint when hovering embedded html control in elxtree.
Sign In or Register to comment.