** DISCLAIMER:  I know this can be done via the Interface. I am talking about a built-in ability here.  **

The new TButton FontIcon feature is very useful!

Having spent the past 2 hours using a TBasicPanel and TLabel to create a tag feature (see SAMPLE 1 in the attached ftb01.png), I found myself wondering if a few additional TButton enhancements would be useful for the modern UI users have come to expect. And, an EWB component would save us all so much time.

(1) Color Properties for the button color including hover and when pressed.

(2) Referring to SAMPLE 2 in the attached file - a button that can include 1 or 2 areas on it. This area can host either an Icon, Image, or Unicode character.

(3) Relevant Events such as OnClickLeft, OnClickRight.... etc on the new right and left areas.

Hmmmm... this should be another component coming to think of it - a new TButtonEx.

Again, I know a user can create this themselves, but since the Button is such an important part of the UI it would be nice to be able to just drop TButtonEx on there, set a few properties and be on one's way.

'Github' just flashed thru my mind. I have never used it but to get stuff. I think I shall set up an area there for my existing EWB components that I already have on the forum.

So, with that in mind - over the coming weeks I shall work on creating what I just termed TButtonEx, now renamed TL27ButtonEx.

I am thinking the Interface for this new button would actually be 3 buttons in one? OR, would it be better to use 3 TBasicPanel components?

Pointers? Guidance? Ideas? Suggestions?

Trinione wrote:

> Pointers? Guidance? Ideas? Suggestions?

All I can say is it is easier than you might think. Take the TButton
code and interfaces, put them in a new directory, rename things, and
then get editing. There are nuances, but I managed to do a coloured
button just fine, and a custom list.

As for sharing, yes, I think this will be something we get to do a lot
more once we have some things to share that are worth sharing!

--

Matthew Jones

Trinione

I posted a TColorButton component in Component section - extend it more to do what you need and repost for all to share.

Walter

"Matthew Jones" wrote:
<< All I can say is it is easier than you might think. Take the TButton code and interfaces, put them in a new directory, rename things, and then get editing.

As for sharing, yes, I think this will be something we get to do a lot more once we have some things to share that are worth sharing! >>


Always hard to know what is Share Worthy though.

I went thru the GitHub Hello World guide earlier. Pretty straightforward stuff. Shall add the component I already wrote and have shared in this forum there. I expect it would be easier to locate there via web searches also.


Walter wrote:
<< I posted a TColorButton component in Component section - extend it more to do what you need and repost for all to share. >>

Thanks. I shall take a look at it when I get cracking with this.


Thinking through this though, I am wondering about how can the left and right side of the button be defined as clickable regions so that Events associated with it?

Trinione wrote:

> Thinking through this though, I am wondering about how can the left
> and right side of the button be defined as clickable regions so that
> Events associated with it?

This must be very possible - everything else does it. Looking at the
existing source, and perhaps watching the YouTube video on component
making would be a good step for understanding.

--

Matthew Jones

"Matthew Jones" wrote:

Trinione wrote:

> Thinking through this though, I am wondering about how can the left
> and right side of the button be defined as clickable regions so that
> Events associated with it?

>This must be very possible - everything else does it. Looking at the
existing source, and perhaps watching the YouTube video on component
making would be a good step for understanding.

There is a TColorButton in my book.  It's maybe a dozen lines of code you type once.

For right versus left clicking, just make a OnMouseDown handler and look at the state of
the mouse button, it's one of

MB_NONE = 0;
MB_LEFT = 1;
MB_MIDDLE = 2;
MB_RIGHT = 3

erickengelke wrote:

"Matthew Jones" wrote:

Trinione wrote:

> Thinking through this though, I am wondering about how can the left
> and right side of the button be defined as clickable regions so that
> Events associated with it?

>This must be very possible - everything else does it. Looking at the
existing source, and perhaps watching the YouTube video on component
making would be a good step for understanding.

<<
There is a TColorButton in my book.  It's maybe a dozen lines of code you type once.

For right versus left clicking, just make a OnMouseDown handler and look at the state of
the mouse button, it's one of

MB_NONE = 0;
MB_LEFT = 1;
MB_MIDDLE = 2;
MB_RIGHT = 3
>>

Erick:
I was actually referring to the region of the button that was clicked, not mouse clicking. So, how to tell it's say the left side of the button (< width / 2) or right side (>= width / 2). And then assigning Events and Properties based on that.

When I get around to this and take a deeper look in the code, I'll figure it out and/or ask for specific assistance on this thread.

Trinione wrote:

erickengelke wrote:

"Matthew Jones" wrote:

Trinione wrote:

> Thinking through this though, I am wondering about how can the left
> and right side of the button be defined as clickable regions so that
> Events associated with it?

>This must be very possible - everything else does it. Looking at the
existing source, and perhaps watching the YouTube video on component
making would be a good step for understanding.

<<
There is a TColorButton in my book.  It's maybe a dozen lines of code you type once.

For right versus left clicking, just make a OnMouseDown handler and look at the state of
the mouse button, it's one of

MB_NONE = 0;
MB_LEFT = 1;
MB_MIDDLE = 2;
MB_RIGHT = 3
>>

Erick:
>I was actually referring to the region of the button that was clicked, not mouse clicking. So, how to tell it's say the left side of the button (< width / 2) or right side (>= width / 2). And then assigning Events and Properties based on that.

>When I get around to this and take a deeper look in the code, I'll figure it out and/or ask for specific assistance on this thread.

When you process the onMouseDown event, you are passed the X.Y co-ordinates of the mouse... looks pretty doable.  Good luck.

Erick

<< When you process the onMouseDown event, you are passed the X.Y co-ordinates of the mouse... looks pretty doable.  Good luck. >>

Erick:
That would work. Thanks.

When I get this going I shall include and Share via GitHub. Just getting thru their 'Hello World' guide.

<< I am thinking the Interface for this new button would actually be 3 buttons in one? OR, would it be better to use 3 TBasicPanel components? >>

Look at how the TListBox implements list items, and you'll get a good idea of how to deal with this.  In general, you want to have the individual buttons *within* the control be independent control classes that enforce things like ownership/parenting within the main control during initialization.  But, because they are independent controls, they will have all UI events dispatched to themselves instead of to the main control.  However, you can still forward any events on to the main control if you don't want the sub-controls to handle them.  You can see how this occurs in the TGrid class with embedded controls - just search for "ForwardEvent" in the WebGrids unit.

So, the general design would be this:

Main control with two UI elements - Base and Client
Sub control(s) with one UI element - Base
Close button control on each sub-control, with one UI element - Base.

Check out the WebPages unit for information on how to have a simple control with a close button on it.  The TTab control works that way.  You'll be amazed at how simple such a thing is to implement.

As for layout, the only thing to really worry about is just setting the layout properties of the sub-controls so that they hug top-left and overflow properly when they're too large to fit on a given "line" of controls.

Tim Young
Elevate Software
www.elevatesoft.com