An iOS like Tab/Toolbar for OSX/Windows :DOWNLOAD AVAILABLE

General
1

I have created this custom control, that mimics some of the look/feel of the iOS Tab/Toolbar.
The developer has control over the size of the icons, the normal, disabled and selected colors
and the cool thing (I think), is you don’t need to create “special” icons. You just draw a normal square graphic of any size, and the control will resize it if necessary, and automatically create a proper grayscale masked image,

You can add icons on the fly, you can hide icons, as well as programmtically select/enable or disable them. When you add/hide an icon, the control automatically recalculates the required padding/spacing, giving a very dynamic ability.

It basically has one EVENT (ValueChanged) which indicates the index of the selected icon

here is the code that created the above example

  //
  // if you want to alter icon or text size, you must
  // do it as the FIRST thing in OPEN event
  //
  me.iconSize=48
  me.textSize=22
  //
  me.AddItem(icon_start,"Start")
  me.AddItem(icon_print,"Print")
  me.AddItem(icon_info,"About")
  me.AddItem(icon_home,"Home")
  me.AddItem(icon_help,"Help")
  me.AddItem(icon_config,"Config")

Default iconSize is 32, and textsize is 0, in the example I left the “default” colors, but they can be overridden as well, including the background color

2

Updated to add an optional alphanumeric “badge”

see updated image above

  me.setBadge(3)="14"
  me.setEnabled(1)=false
  me.setBadge(1)="3"
3

is there supposed to be a link to download etc ?
I dont see one

4

Not yet… I wanted to see if anyone had input first

plus I wrote this between lunch and dinner today… so I need to test it a bit more first :slight_smile:

5

Looks good Dave!

6

I like the Badge option and the optional background colour.

7

Looks great! And in so little time is miraculous.

8

Great Dave!

9

Here is a link to the project (XML format) in a ZIP file… it has been tested with OSX 10.11.3 and with Windows 10

www.rdS.com/tabbar_project.zip

it includes the source code, and sample icons.

Here is a shot of the properties for this control

In regards to what kind of icons to use with this control…
Pretty much anything :slight_smile:

  • Any mask on the source icon is ignored
  • the control creates its own internal icon based on the image portion of the icon you supply.
  • the control will rescale the source icon as required, so best results are if you supply the exact size required for your needs

If you have any modifications or improvements to this control, please forward the information to me so that it can be included in future releases.

IF you would like to make an optional donation : http://www.rdS.com/donate.html

10

Let me know if anyone ever downloads/uses this… I would love some feedback

11

Downloaded this morning but haven’t had time to “play with it” yet. Will let you know.

12

Just downloaded. Thanks for your work. I will have a look at it in the next weeks.

13

Nice :slight_smile: I’ve only fiddled with the demo so far and it looks good flush against the bottom.

One little thing I noticed is that the icons jump in stages while resizing. Making x and pad Doubles in zReAlign makes that smoother.

14

Downloaded it and the demo works good. Started porting it to support operation in a Web application; if things go well I will send you the code to include with your download.

Thanks for getting this started.

15

Thanks for contributing this Dave. Tinkering with it now, and hope to use it in an upcoming project. :slight_smile:

16

Thanks for sharing Dave. Appreciated.

18

[quote=251248:@Will Shank]Nice :slight_smile: I’ve only fiddled with the demo so far and it looks good flush against the bottom.

One little thing I noticed is that the icons jump in stages while resizing. Making x and pad Doubles in zReAlign makes that smoother.[/quote]
Modified as you suggested, thanks, but I will wait a day or so before I upload it again, incase others see things I missed

in the meantime for those of you that have the code… make these simple changes

FUNCTION zRealign(g as graphics)
  // 05Mar16 : converted W,Pad and X to Double from Integer
  Dim i As Integer
  Dim w As Double=0
  Dim cnt As Integer=0
  Dim pad As Double=0
  Dim x As Double
.... rest of function