Web 2.0 : is a vertical webtoolbar possible (or planned)?

Targets Web
1

or do we have to use webcontainers to mimic a vertical navbar ?
thanks.

I would like to mimic something like this
image

also how to set a small logo at the top left ?
when I use an imageview, it gets recovered by the toolbar at runtime.

2

I think that the idea for the Toolbar is to automatically adjust to the device width, so I donā€™t think it will be a vertical option available. Maybe a different control for that.

For now the Toolbar is fixed at the top of the screen, I guess that is the only way it will work. You will need to put your small logo on the Toolbar.

Edit: when I said ā€˜put your small logo on the Toolbarā€™ I tried to say this:

3

the small logo over the toolbar does not work, it is covered at runtime by the toolbar !
if I move the toolbar to the right, it extends to the left at runtime tooā€¦

4

Put the logo on the toolbar as a Title. Thereā€™s also an icon for the toolbar.

1 Like
5

Weā€™ve gotten a couple of verbal requests for a vertical toolbar. If you want to see such a control, put it in Feedback!

1 Like
6

the icon is too small.
to put it in the title, you mean I store the SVG format of the picture I want in the title property of the toolbar ?

7

it could be replaced with a TabPanel if you could put the labels on the left side ?

8

Ah, your logo isnā€™t square then. Usually when I think of icons, I immediately think of an app icon.

Ok, so then at the moment you wonā€™t be able to use the toolbar to display that because of a text encoding bug (thatā€™s already been fixed). Once itā€™s available, you might be able to use the tag to insert a non-square image instead of the caption.

1 Like
9

I did this with Web 1.0, seems like you could do the same in Web 2.0. Not it is not responsive.

851Ɨ623 155 KB

Itā€™s on Github, if you want to have a look.

10

@James_Dooley: Iā€™ve already seen this huge project of yours.
many thanks for giving it to the community !
I would like to start from scratch with web 2.0
in your project, the underground classes are quite huge also.

11

When there is a stable production ready version of 2.0 available, Iā€™ll look at doing an upgrade put not until them.

12

Creating a WebContainer with the FlexLayout is probably the easiest way to create a Vertical Toolbar Currently. And then you can do things the current toolbar doesnā€™t support like having nested WebContainers in the toolbar as controls

1 Like
13

Iā€™d love to see the toolbar be able to become a menu icon in the upper left hand screen when used on a phone or other small screenā€¦ I could theoretically do that with a lot of programming and CSS and building the menu twice :wink: But the whole idea of ā€œresponsiveā€ design should make it automatic with the controlā€¦

14

It actually already does this. It turns into a hamburger menu

1 Like
15

You know this already existsā€¦automatically.

1 Like
16

does any of you have an example project for this ?

17

I used a rectangle logo and it automatically scaled but at 30 pixels wide its just too small to be readable. I havenā€™t successfully been able to figure out how to make the Toolbar taller in the Bootstrap CSS or the Iconwidth/height bigger than 30 pixels. The few CSS editors that I have found are not very good at saving a usable file. Iā€™m starting with https://bootswatch.com/spacelab/ and many of the editors spit out garbage .min.css that doesnā€™t run correctly in Xojo. I played with this stuff a large part of the weekend and the only positive results Iā€™ve gotten is from manually editing, but stuff I change often doesnā€™t seem to change the resulting behavior.

1 Like