Image size shown big in toolbar

Question

I have set 3 images on a toolbar. It looks like so...

Here I added a toolbar, added barbutton items and set images to those buttons. The image type is 1x,2x,3x format and is rendered asa default image.

But the images shown above are shown large while it should have been small given like so...

What have I done wrong..?

EDIT 1: Screenshot of UI layout

You need to show your code as well so that can understand where is going wrong. — Deviyani Swami, Mar 18 '19 at 07:59
The 2nd image is the actual image(how the toolbar should be). But the 1st image is what I have achieved..@dahiya_boy — , Mar 18 '19 at 08:58
@asd2 Show me how you implemented it. Your storyboard/xib screenshot and UI components that you have taken for this tool. — dahiya_boy, Mar 18 '19 at 09:02

score 1 · Accepted Answer · answered Mar 18 '19 at 09:43

1

Your image resolution must be like below

Tool bar structure

Use barbutton not button

I tested it, its work properly

Output

answered Mar 18 '19 at 09:43

dahiya_boy

9,298
1
30
51

ok @dahiya_boy...so u r saying it is the image resolution that must be changed..? – Mar 18 '19 at 10:39
@asd2 Yeah and better in nav bar and tool bar you use barbutton. It can work like `UIImageView/UIButton/UILabel`. You img resolution will be 20px, 40px, 60 px (for now) – dahiya_boy Mar 18 '19 at 10:40

score 0 · Answer 2 · answered Mar 18 '19 at 08:05

0

Wherever you define you images you need to use this line:

let image = yourImage
image.size = CGSize(width: 40, height: 40)

If your image is in the storyboard click on the image and then go to the measurement attribute and change the values there.

Explanation: Our app doesn't know what size we want our image to be so it (by default) sets the image size from the image so we need to define our own size.

answered Mar 18 '19 at 08:05

Oscar

404
7
19

but when I try to change the button sizes in storyboard, it doesn't allow me to change.. – Mar 18 '19 at 08:56

score 0 · Answer 3 · answered Mar 18 '19 at 08:30

0

This because of your images too big. Downscale your image about twice. Good 1x size is 25x25; 2x - 50x50; 3x - 150x150. You could not put 1x images in your asset.

answered Mar 18 '19 at 08:30

Vladimir Konon

31
2

Your 3x image have 6x resolution. – dahiya_boy Mar 18 '19 at 09:12
Correct. 3x should be 75x75. – Vladimir Konon Mar 18 '19 at 10:58

Image size shown big in toolbar

3 Answers3