WilliamP WilliamP - 1 year ago 82
Swift Question

Why are programmatically created (bottom) toolbar button titles not displaying?

In Swift 3, I've programmatically created a (bottom) toolbar with custom buttons separated by a flexible spacer to separate the custom buttons, pushing one ("Previous") to the left edge and the other ("Next") to the right edge of the view. But I have not been able to get the button titles ("Previous" and "Next") to display. Please advise me. Thanks. Here is my code:

First, the class declaration and a few variables:

class TextsController: UIViewController,UIGestureRecognizerDelegate {

let textWebView = WKWebView(frame: .zero)
var toolbar:UIToolbar?


Next, in the viewDidLoad:

view = textWebView

// Create (bottom) toolbar:
let frame = CGRect(x: 0, y: UIScreen.main.bounds.size.height-44, width: UIScreen.main.bounds.size.width, height: 44)
toolbar = UIToolbar(frame: frame)
toolbar?.sizeToFit()
toolbar?.isHidden = true
self.view.addSubview(toolbar!)
self.toolbar?.isTranslucent = false // Required for setting tintColor & barTintColor below

toolbar?.tintColor = UIColor(red: 0.5, green: 0.0, blue: 1.0, alpha: 1.0) //purple for toolbar items
toolbar?.barTintColor = UIColor.white //white for toolbar color

let triangleLeftButton = UIBarButtonItem(image: UIImage(named: "triangleLeft_15x20"), style: .plain, target: self, action:#selector(showPrevious))
let flexibleSpacer = UIBarButtonItem(barButtonSystemItem:.flexibleSpace , target: self, action: nil)
let triangleRightButton = UIBarButtonItem(image: UIImage(named: "triangleRight_15x20"), style: .plain, target: self, action:#selector(showNext))

triangleLeftButton.title = "Previous"
triangleRightButton.title = "Next"

var items = [UIBarButtonItem]()
items.append(triangleLeftButton)
items.append(flexibleSpacer)
items.append(triangleRightButton)
toolbar?.items = items

Answer Source

Here is how I solved this.

I eliminated the two statements attempting to assign a title to each button (I do wonder why Xcode did not flag that and allow me to assign a title to each initially).

I rewrote (compare with the code in the question) the UIBarButtonItems as follows to now include two text items:

    // Create toolbar items (buttons and texts)
    let triangleLeftButton = UIBarButtonItem(image: UIImage(named: "triangleLeft_15x20"), style: .plain, target: self, action:#selector(showPrevious))
    let flexibleSpacer = UIBarButtonItem(barButtonSystemItem:.flexibleSpace , target: self, action: nil)
    let triangleRightButton = UIBarButtonItem(image: UIImage(named: "triangleRight_15x20"), style: .plain, target: self, action:#selector(showNext))let triangleLeftText = UIBarButtonItem(title: "Previous", style: .plain, target: nil, action: nil)
    let triangleRightText = UIBarButtonItem(title: "Next", style: .plain, target: nil, action: nil)

Then I appended everything, including the two new text items, to the array:

    var items = [UIBarButtonItem]()
    items.append(triangleLeftButton)
    items.append(triangleLeftText)
    items.append(flexibleSpacer)
    items.append(triangleRightText)
    items.append(triangleRightButton)
    toolbar?.items = items

This effectively places "Previous" adjacent to the left-pointing button and "Next" adjacent to the right-pointing button, with the flexible spacer affording a nice wide gap between.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download