1

Swift

I want to create a custom icon downloaded from the internet for a UIBarButton. Do I have to do this programmatically or can I some how find a setting via storyboard? If I choose "custom" it doesn't lead to further choosing of custom icons or anything so I'm not really sure what to do here.

I see there is a "Bar Item: Image" section. Is this what I will use?

http://prntscr.com/5x7gn0

Thanks!

Matthew
  • 23
  • 2
  • 1
    Do a search before asking... http://stackoverflow.com/questions/2681321/uibarbuttonitem-with-custom-image-and-no-border – gotomanners Jan 26 '15 at 09:31
  • I've seen this before, I'm really new to programming (swift first language) and only been going at it for 2 months so it's hard for me to understand obj c syntax and logic into swift. sorry.. – Matthew Jan 26 '15 at 09:37

1 Answers1

1

Yes, the image (at the end of that link you posted) is where you would select your image. You need to put it into your project first though.

So steps to do:

  1. Drag the image (hopefully it's in PNG format?) into the sidebar in the left and tick the checkbox titled "Copy items if needed" and click finish. Now you should see the image in your project.
  2. Go to that place in interface builder that you have in the link (here: http://prntscr.com/5x7gn0) and select the image you added from the drop down list.

There is another way you can do this; programmatically, but it's slightly trickier. You still do step 1 but then instead of step 2, you can create an outlet to the Bar Button item and set its image like this:

barButtonItem.image = UIImage(named: "imageName.PNG")

If you need any clarification of what I've said, feel free to ask.

Loic

Loic Verrall
  • 985
  • 15
  • 25
  • Thanks for the comment, would you happen to know what size the items are supposed to be? My png's are too large :( – Matthew Jan 26 '15 at 13:23
  • Yeah, I believe they're 22 x 22 pixels (@1x). Are you familiar with the retina display images? You need to add a 44 x 44 pixel image for the retina devices (@2x) and if you're building for the iPhone 6 Plus you should even include @3x! This is the guide I'm using: https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/IconMatrix.html#//apple_ref/doc/uid/TP40006556-CH27-SW1 – Loic Verrall Jan 27 '15 at 14:16
  • You can use Preview to shrink the images down. Go Tools > Adjust Size – Loic Verrall Jan 27 '15 at 14:21