Custom Controls in a Box ( - lbjoseph )

Making your own custom control with a graphicbox in Liberty BASIC.

Throughout the ages, mankind has sought after customization and personalization. Now, with the power of Liberty BASIC 4, you can create your very own custom control inside of a simple graphicbox. The following article expects you to be familiar with the Liberty BASIC language, as well as with Liberty BASIC's native drawing commands .

In this article, we will discuss the techniques that I ( - lbjoseph ) think are necessary to creating a good custom control.

Why a custom control?

Because you can. But there's more to it than that - by creating your own custom control, it's look and feel will stay consistent throughout all the various versions of windows. Secondly, you can make them to where it is a million times easier to use than the windows API controls. If you are well rounded in LB, you can make your control to where it doesn't require globalized "constants" at the start of the code, and doesn't require a huge wrapper of subs and functions to deal with the windows API calls, callbacks, messages, and so on.

Part the First: The Container

First of all, we need some sort of object that we can manipulate to turn into our own object. The Liberty BASIC graphicbox is just the thing. Not only does it let you draw on it with LB's native drawing commands, but it lets you set event handlers to branch labels or subs when it is clicked, etc. This allows you to make a click-able control that looks beautiful to the eyes (some sarcasm implied).

In this article we'll walk through custom control creation by creating a "fake" hyperlink control.

So, let's go ahead and create the basis of our program. We'll need a window with a graphicbox in place and a trapclose event setup so our program will actually close when someone hits the little red x.

 'Make a custom control hyperlink with a Liberty BASIC graphicbox. 
 '-----------------------------------------------------------------' 
 
 [SetupWindow] 
 NoMainWin 
 WindowWidth = 400 
 WindowHeight = 200 
 UpperLeftX = Int((DisplayWidth-WindowWidth)/2) 
 UpperLeftY = Int((DisplayHeight-WindowHeight)/2) 
 
 Link.Width = 180 
 Link.Height = 28 
 
 GraphicBox #Win.Link1, 4, 4, Link.Width+20, Link.Height+10 
 Stylebits #Win.Link1, 0, _WS_BORDER, 0, 0 
 
 Open "Hyperlink Custom Control" For Window As #Win 
 
 #Win, "TrapClose [Quit.Win]" 
 
 Wait 
 
 [Quit.Win] 
 Close #Win 
 End 
 

If you run the code above, things don't look too promising. However, this is just the foundation of our program.

There's a couple of things you need to note about the above code:

First, notice in the "GraphicBox" command that we added 20 to the width, and added 10 to the height. I'll explain why we do this a little later - for now, you just need to notice that we did that.

Secondly, we issued a " Stylebits " Command - we used the flag _WS_BORDER in the removeBits section. This removes the border of the graphicbox. This removes clutter which could mess up the way our control looks.