web-dev-qa-db-ja.com

迅速にバーボタンの画像を設定するにはどうすればよいですか？

私は次のような画像を持っているためにバーボタンアイテムの画像を設定しようとしています：

enter image description here

解像度30 * 30ですが、この画像をバーボタンに割り当てると、次のようになります。

enter image description here

私はこの方法で画像を割り当てました：

enter image description here

そして、ボタンのIBOutletを作成するようにこの方法を試して、プログラムでImageを設定する場合 this 質問とそのコードは：

 // Outlet for bar button
 @IBOutlet weak var fbButton: UIBarButtonItem!

// Set Image for bar button
var backImg: UIImage = UIImage(named: "fb.png")!
fbButton.setBackgroundImage(backImg, forState: .Normal, barMetrics: .Default)

しかし、これでは何も起こりませんでした。

誰かが私が間違っていることを教えてもらえますか？

またはこれを行う打者の方法はどれですか？

iosswiftuiimageuibarbuttonitem
47
Dharmesh

私はこのコードでプログラム的にそれを達成しました：

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        //create a new button
        let button: UIButton = UIButton.buttonWithType(UIButtonType.Custom) as! UIButton
        //set image for button
        button.setImage(UIImage(named: "fb.png"), forState: UIControlState.Normal)
        //add function for button
        button.addTarget(self, action: "fbButtonPressed", forControlEvents: UIControlEvents.TouchUpInside)
        //set frame
        button.frame = CGRectMake(0, 0, 53, 31)

        let barButton = UIBarButtonItem(customView: button)
        //assign button to navigationbar
        self.navigationItem.rightBarButtonItem = barButton
    }

    //This method will call when you press button.
    func fbButtonPressed() {

        println("Share to fb")
    }
}

結果は次のようになります。

enter image description here

左側のボタンもこの方法で設定できます：

self.navigationItem.leftBarButtonItem = barButton

結果は次のようになります。

enter image description here

また、デフォルトの戻るボタンで戻るときにNavigation Controllerと同じトランザクションが必要な場合は、次のコードを使用してカスタムの戻るボタンでそれを実現できます。

func backButtonPressed(sender:UIButton) {
    navigationController?.popViewControllerAnimated(true)
}

Swift 3.0の場合：

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        //create a new button
        let button = UIButton.init(type: .custom)
        //set image for button
        button.setImage(UIImage(named: "fb.png"), for: UIControlState.normal)
        //add function for button
        button.addTarget(self, action: #selector(ViewController.fbButtonPressed), for: UIControlEvents.touchUpInside)
        //set frame
        button.frame = CGRect(x: 0, y: 0, width: 53, height: 51)

        let barButton = UIBarButtonItem(customView: button)
        //assign button to navigationbar
        self.navigationItem.rightBarButtonItem = barButton
    }

    //This method will call when you press button.
    func fbButtonPressed() {

        print("Share to fb")
    }
}

Swift 4.0の場合：

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        //create a new button
        let button = UIButton(type: .custom)
        //set image for button
        button.setImage(UIImage(named: "fb.png"), for: .normal)
        //add function for button
        button.addTarget(self, action: #selector(fbButtonPressed), for: .touchUpInside)
        //set frame
        button.frame = CGRect(x: 0, y: 0, width: 53, height: 51)

        let barButton = UIBarButtonItem(customView: button)
        //assign button to navigationbar
        self.navigationItem.rightBarButtonItem = barButton
    }

    //This method will call when you press button.
    @objc func fbButtonPressed() {

        print("Share to fb")
    }
}
82
Dharmesh

簡単な解決策は次のようになります

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

次に、Assets.xcassetsに移動して画像を選択し、属性インスペクターに移動して、オプションとして[元の画像]を選択します。

30
Anibal Rodriguez

受け入れられている解決策に似ていますが、置き換えることができます

let button: UIButton = UIButton.buttonWithType(UIButtonType.Custom) as! UIButton

と

let button = UIButton()

ここに完全なソリューションがあります、お楽しみください：（受け入れられているソリューションよりも少しきれいです）

let button = UIButton()
button.frame = CGRectMake(0, 0, 51, 31) //won't work if you don't set frame
button.setImage(UIImage(named: "fb"), forState: .Normal)
button.addTarget(self, action: Selector("fbButtonPressed"), forControlEvents: .TouchUpInside)

let barButton = UIBarButtonItem()
barButton.customView = button
self.navigationItem.rightBarButtonItem = barButton
19
jungledev

簡単なextension on UIBarButtonItemは次のとおりです。

extension UIBarButtonItem {
    class func itemWith(colorfulImage: UIImage?, target: AnyObject, action: Selector) -> UIBarButtonItem {
        let button = UIButton(type: .custom)
        button.setImage(colorfulImage, for: .normal)
        button.frame = CGRect(x: 0.0, y: 0.0, width: 44.0, height: 44.0)
        button.addTarget(target, action: action, for: .touchUpInside)

        let barButtonItem = UIBarButtonItem(customView: button)
        return barButtonItem
    }
}
15
Jovan Stankovic

これに必要なコードは2行のみです

Swift 3.

let closeButtonImage = UIImage(named: "ic_close_white")
        navigationItem.rightBarButtonItem = UIBarButtonItem(image: closeButtonImage, style: .plain, target: self, action:  #selector(ResetPasswordViewController.barButtonDidTap(_:)))

func barButtonDidTap(_ sender: UIBarButtonItem) 
{

}
9
Sreekumar .K

最新のSwift（2.1）を使用していますが、答え（Dharmesh Kheniとjungledev）が機能しません。画像の色はオフでした（IBで設定する場合は青で、UIButtonで直接設定する場合は黒でした）。次のコードで同じバー項目を作成できることがわかりました。

let barButton = UIBarButtonItem(image: UIImage(named: "menu"), landscapeImagePhone: nil, style: .Done, target: self, action: #selector(revealBackClicked))
self.navigationItem.leftBarButtonItem = barButton
9
BSharer App - Share Books

このコードは、カスタム画像で複数のバーボタンに使用できます：

self.navigationItem.leftBarButtonItem = nil

let button = UIButton(type: .custom)
button.setImage(UIImage (named: "ChatTab"), for: .normal)
button.frame = CGRect(x: 0.0, y: 0.0, width: 35.0, height: 35.0)
//button.addTarget(target, action: nil, for: .touchUpInside)
let barButtonItem = UIBarButtonItem(customView: button)

let button2 = UIButton(type: .custom)
button2.setImage(UIImage (named: "ActivityTab"), for: .normal)
button2.frame = CGRect(x: 0.0, y: 0.0, width: 35.0, height: 35.0)
//button.addTarget(target, action: nil, for: .touchUpInside)

let barButtonItem2 = UIBarButtonItem(customView: button2)
self.navigationItem.rightBarButtonItems = [barButtonItem, barButtonItem2]

結果は次のようになります：

enter image description here

5
Mr.Javed Multani

あなたの問題は、アイコンが作られた方法のためです-それはアップルのカスタムタブバーアイコンの仕様に準拠していません：

To design a custom bar icon, follow these guidelines:

Use pure white with appropriate alpha transparency.
Don’t include a drop shadow.
Use antialiasing.

ガイドラインから：

https://developer.Apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/BarIcons.html#//Apple_ref/doc/uid/TP40006556-CH21-SW1

可能なものは次のようになります。このようなアイコンは、ほとんどの無料のタブバーアイコンサイトで見つけることができます。

enter image description here

5
aparna

スイフト4。

@IBOutlet weak var settingBarBtn: UIBarButtonItem! {
    didSet {
        let imageSetting = UIImageView(image: UIImage(named: "settings"))
        imageSetting.image = imageSetting.image!.withRenderingMode(.alwaysOriginal)
        imageSetting.tintColor = UIColor.clear
        settingBarBtn.image = imageSetting.image
    }
}
3
Исмаил Хасбулатов

次のようにbarbuttonItemを初期化します。

let pauseButton = UIBarButtonItem(image: UIImage(named: "big"),
                                  style: .plain,
                                  target: self,
                                  action: #selector(PlaybackViewController.pause))
0
Eric Ford

UIBarButtonItemがストーリーボードのように既に割り当てられている場合。 （printBtn）

    let btn = UIButton(frame: CGRect(x: 0, y: 0, width: 30, height: 30))
    btn.setImage(UIImage(named: Constants.ImageName.print)?.withRenderingMode(.alwaysTemplate), for: .normal)
    btn.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(handlePrintPress(tapGesture:))))
    printBtn.customView = btn
0
Craig