Mac style UI in Windows Program

Just google for “realbasic create custom control” and you"ll find plenty. They are based on the canvas control so you could also google with that.

From the old forum: http://forums.realsoftware.com/viewtopic.php?t=29901

Add a new class to the IDE, rename it for now CustomButton and change the super to Canvas.

Add the three properties textcolor as color, buttoncolor as color, buttontext as string to the CustomButton class.

If you are on RS: Select on of the 3 properties, right click and select “Property List Behavior…” and then under “Behavior” check all 3 buttons and click Ok.

If you are on Xojo: select the custom class, right click and select “Property List Behavior…” and then under “Behavior” check all 3 buttons and click Ok.

Open the new class CustomButton and add this to the paint event:

g.forecolor = buttoncolor g.fillrect (0, 0, me.width, me.height) g.forecolor = textcolor g.drawstring buttontext, (me.width/2-g.stringwidth(buttontext)/2), g.stringheight(buttontext, 80)
Go to the Window side and add a canvas and change the super to CustomButton and make the width = 80 and height = 20. When you select the canvas you see at the right side under “Behavior” the 3 properties which we add to the class.

Add some text to buttontext, make buttoncolor black, and textcolor white.
Canvas1.MouseEnter:

me.textcolor = rgb(255, 0, 0) me.refresh

Canvas1.MouseExit:

me.textcolor = rgb(255, 255, 255) me.refresh

Canvas1.MouseDown:

// add here your code what should happen if you click on it // for now just add beep beep return true

Of course this is not a complete button and I use the code and steps above just for demonstration. The goal is that you understand how it works circa and then add a lot of other things like pictures, etc. and different code to the class.

The principle is that you have a class. Allways when you add a new canvas to the window you use the class as super.

P.S. One thing to look out for: In the IDE the custom canvas will just be a blank rectangle which is somewhat disconcerting. So I run it, take a screenshot of the control only, and use that picture as a backdrop of the canvas. That way I can see in the IDE how it looks like when running.

[quote=31288:@Joseph Cole]Karen, I don’t think I understand your point.

Geoff disagrees with me which is fine… it’s his company. I do agree with him that functionality should be the same across platforms - to me that should be a given. He goes on to state the look and feel should be native to the platform and he sees no benefit to having the same look and feel on multiple platforms. If there is no benefit to this, then why does Xojo look like it does on Windows, Linux, and I’m assuming a Mac (I don’t own a Mac). Following that line of logic, then Xojo should look like a regular Windows and Linux program on my machines.

I happen to like that they look exactly the same across platforms and would like to learn how to do that for myself.[/quote]

As a default, if you build the very same application for Mac and Windows, the Windows app will look like Windows, because Xojo uses the native controls.

Java does not, it uses custom controls.

If you want exactly the same UI as Mac on Windows, you will have to use custom controls. For a beginner, it maybe a chance to learn. Some controls are relatively easy. You can copy a button on Mac and use the picture in a canvas on PC, and use the MouseDown event to replace the Action event. Some other controls such as sliders, scrollbars, popupmenus, comboboxes, will definitely require much more work.