Toolbar, icon & App sizes

Targets macOS
1

I have used toolbars on a few of my older projects without a problem but as screen sizes have increased the toolbar remains the same size when I scale my app to the size of the screen and they look a little out of proportion.

DO most programmers fill the screen with their app or is there a rule on app sizes to follow?

2

Care to share a screen shot that display “they look a little out of proportion” ?
(eventually a second that appears OK if you think it is needed).

3

I guess my question is do the toolbar icons stay the same size or can they be bade to be larger?

4

Further to this what size icons are needed for Toolbars is it a specific size or do you just insert an image and then 2x and 3x and Xojo does the rest?

5

Here are some screen shots showing the Toolbar icons very pixelated yet the show crisp in Xojo

http://appdata.sallyfitzgibbons.com/AppData/Wizard/Toolbar1.png

http://appdata.sallyfitzgibbons.com/AppData/Wizard/Toolbar2.png

http://appdata.sallyfitzgibbons.com/AppData/Wizard/XojoIcons.png

http://appdata.sallyfitzgibbons.com/AppData/Wizard/System.png

6

Sorry about the 2x and 3x reference I got mixed up with IOS.

So the issue still is the poor quality toolbar images despite them looking ok in xojo ide

7

How do you set up the toolbar images? You need to create an image set, add the icons and assign the correct image set to your toolbar item.

And no, you can’t change the toolbar item size on the Mac.

8

(With Xojo 2015r1), Mac OS shrink the icon to the predefined size (if you use a larger image).

Warning: Windows display the set image even if the size is wrong (I do not tried 256 x 256 !)

9

I just used 128x128 png images and I tried with and without a mask

10

You need to use 32x32 + 64x64. I don’t think that Xojo uses a good interpolation algorithm. Scale the images down yourself and use the best available interpolation.

11

I think that helps but still a puzzle how crisp the images look in the Xojo IDE compared to the final App

12

Why do you care ? Can’t you consider that as a developer (you) visual feedback (in the IDE) and the application the final (for customer) view ?

Of course, I understand you, but if you want changes heres (from Xojo), you may wait until … Xojo 2118r3 :wink:

13

I searched a couple of minutes about the size of an icon (in a ToolBar) and found nothins (Dojo Docs).

Apple Docs is nearly the same (a real quest must be done to get that information), but a look there:

https://developer.apple.com/design/human-interface-guidelines/macos/windows-and-views/toolbars/

gives an idea of the icon size. A look to Apple own applications too.

Yes, working with the documentation is not easy task.

Fortunately, there is this forum (most of the time).

14

I searched inside the Safari application about icons and only found a few of them. As an example here’s one:

Error.png 16 x 16 Error@2x.png 32 x 32

So, resize down a copy of some of your icons and put hem in your project (using Apple’s Preview application for example). Is there’s a difference ?

15

Ok will try

16

I have written an IconResizer utility that will create very good reductions to meet most of the size needs of Xojo, Xcode, Android etc.

17

Hi Dave where do we find that?

18

just do a search on the forum…
I’m asking $10 donation… but if you want to send me 1/2 dozen icons I’ll convert them so you can see the results
Iconresizer works best with an INPUT icon of 512x512 or larger and it must be square… it will then produce sizes for all the platforms I mentioned above.

send me a PM and I’ll provide an email address

here is an example from a project I am now doing
this was the original (512x512)

1024x1024
256x256
128x128
64x64
32x32
16x16

Note : using simply DRAWPICTURE results in a much worse conversion

19

Hi Dave, will send you a direct msg

20

I just sent a zip back with all the samples you sent me… let me know if there is an issue getting it… it was a 20meg attachment