A scrollable stack of "Canvas"... a "Listbox" like control

  1. 5 days ago

    Dave S

    Jul 11 San Diego, California USA
    Edited 5 days ago

    For anyone who is interested..
    I have created a custom "listbox" like control.
    It is only ONE column (by design). each row can have its own row height (including 0 to make it "invisible)
    the displayed content of each row can be inset by a user specified amount (left and right), as well as setting a space between rows

    if has both Horizontal and Vertical scrollbars

    The control itself does not have a "datastore".... this is up to the developer to manage via the CellPaint event

    while it does support DarkMode.... its up to the developer to deal with the CellPaint content

    Events

    • cellClick(row as integer)
    • cellPaint(g as graphics, row) // unlike Listbox, the row must exist
    • Paint(g as graphics, areas() ) .... this is to allow developer to overlay the entire control, with other drawing

    Methods

    • addRow(height as integer) // add One Row ... unlike Listbox that adds "text"
    • addRows(count as integer,height as integer) // adds multiple rows at once
    • deleteAllRows // removes all existing rows
    • RowHeight(row as integer)=value // set the height of a specific row

    Properties

    • Border as Boolean
    • columnWidth as integer // defaults to control width unless this value is GREATER than that (hScroll)
    • leftMargin // amount to offset the left side of CellPaint content
    • rightMargin // amount to inset from the right
    • topMargin // amount to move down before the first drawn cell
    • ScrollPostion // the visible offset in pixels ... set by user or by vScroll
    • ScrollPositionX // the visible HORIZONTAL offset in pixels ... seby user or hScroll
    • Suspend as Boolean // suspend any redraw operations if doing a bunch of changes
    • textFont // default font to use in CellPaint
    • textSize // default font size to use in CellPaint
    • rowTag(row) as variant // same function as listbox rowtag
    • SepLine // draw a line horizontally between rows (uses same color as border)

    So far this looks like it will do what I want... (not bad for less than 4 hours work...probably less than 2)

    My intent is to use this as a TIMELINE display of Life Events in a Genealogy Program

    may still be a work in progress as I find various "bugs" or new features :)

    I will post the source code for this in a bit.
    Feel free to use it, but if you make an updates/changes etc... they should be forwarded back to me so they can be incorporated for the benefit of everyone else
    and you must give credit in your "About" and/or "documentation"

  2. Markus W

    Jul 11 Pre-Release Testers #JeSuisHuman New Zealand, Auc...

    Put it on GitHub?

  3. Dave S

    Jul 11 San Diego, California USA

    Once I test it a bit more, I'll post it on my own server and provide a link.

  4. 4 days ago

    Dave S

    Jul 12 San Diego, California USA

    Here is the source code and a demo of the "CanvasStack" control.
    Some of the features mentioned above have been renamed, and a few more have been added (expand and collapse row for example). The demo is a quick and dirty example of making a "timeline". This is actually the main reason I developed this... for use in a Genealogy program.

    It is free to use (as long as the embedded document remains intact), and a visible credit is provided in any app you use it in.

    And of course, if you would LIKE to make a donation :) http://www.rdsisemore.com/donate.html

    Source code link : http://www.rdsisemore.com/canvasStack.xojo_xml_project.zip

    This was developed using Xojo2019 on an iMac..... and minor testing for Windows was done using Win10

    If you have any suggestions, feature requests etc.... let me know

  5. 3 days ago

    Dave S

    Jul 13 San Diego, California USA
    Edited 3 days ago

    Here is a tiny example of what this control could be used for... as I said I developed it for a Genealogy app.

    The finished version of this screen will contain a lot more information than this sample
    -image-

    this sample consists of 4 rows or cells

    FYI.. the final version will replace that UUID with the demographics/name etc of the actual person

  6. Nathan W

    Jul 14 Pre-Release Testers, Xojo Pro Europe (UK, Jersey)
    Edited 3 days ago

    Looking forward to you releasing this @Dave S as I can already think of a way to use it in the project I am working on. Will it also have a Double Click event?

  7. Markus W

    Jul 14 Pre-Release Testers #JeSuisHuman New Zealand, Auc...

    @Nathan W Looking forward to you releasing this @Dave S as I can already think of a way to use it in the project I am working on. Will it also have a Double Click event?

    Blind fox! He has released it: Source code link : http://www.rdsisemore.com/canvasStack.xojo_xml_project.zip

  8. Nathan W

    Jul 14 Pre-Release Testers, Xojo Pro Europe (UK, Jersey)

    Thanks @Markus W downloaded and donation made, very pleased and know how I am going to use it.

  9. 2 days ago

    Dave S

    Jul 14 San Diego, California USA

    @Nathan W Will it also have a Double Click event?

    Thanks Nathan... I am probably going to add a DoubleClick... which will be "diffrent" than a listbox as in I will have it return the same info as a Single Click (why the Xojo List box doesn't do that I don't know)

  10. Nathan W

    Jul 14 Pre-Release Testers, Xojo Pro Europe (UK, Jersey)

    @Dave S Thanks Nathan... I am probably going to add a DoubleClick... which will be "diffrent" than a listbox as in I will have it return the same info as a Single Click (why the Xojo List box doesn't do that I don't know)

    That would be great.

or Sign Up to reply!