code_monkey
code_monkey

Reputation: 225

Having trouble getting UILabel to display on top of UIView

I'm trying to create a custom view that consists of a UILabel on top of a UIView. The idea is for this to be a small pop up message with the label essentially being the same size as the view. However, whenever I try to add this custom view (represented by the small gray box at bottom of the screen in the screenshot)to another view, I can only get the UIView/dark gray background to show up, but not the label. Can someone please point me in the right direction as I'm a little confused as to why the code below doesn't work? Thanks.

Edit: I should probably point out that I can get the label to display in some form if I substitute .zero with CGRect(x: 0, y: 0, height: 100, width: 50), but I would have thought setting it to .zero would have been fine given the constraints?

Screen shot

import UIKit

class PopUp: UIView {
    var label: UILabel!
    var labelText: String!

    init(frame: CGRect, text: String) {
        super.init(frame: frame)

        self.labelText = text

        self.backgroundColor = .darkGray        

        self.label = UILabel(frame: .zero)
        self.label.textColor = UIColor.white
        self.label.text = self.labelText
        self.label.font = UIFont(name: "Times New Roman", size: 14.0)
        self.translatesAutoresizingMaskIntoConstraints = false // this should be "self.label.translatesAutoresizingMaskIntoConstraints"

        self.addSubview(self.label)
        self.bringSubview(toFront: self.label)

        NSLayoutConstraint.activate([
            self.label.topAnchor.constraint(equalTo: self.topAnchor),
            self.label.bottomAnchor.constraint(equalTo: self.bottomAnchor),
            self.label.leadingAnchor.constraint(equalTo: self.leadingAnchor),
            self.label.trailingAnchor.constraint(equalTo: self.trailingAnchor)
        ])
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError()
    }
}

Upvotes: 1

Views: 2737

Answers (4)

code_monkey
code_monkey

Reputation: 225

Sorry guys, I'm an idiot. I had been staring at this code for a few hours and couldn't figure out why things weren't working. I eventually realized there was a typo in my code. Fixing the typo seems to have done the trick. Thanks everyone for the help!

Original:

self.translatesAutoresizingMaskIntoConstraints

Fixed:

self.label.translatesAutoresizingMaskIntoConstraints

Upvotes: 1

Landon
Landon

Reputation: 359

Problem:

I did a little testing with your script, rewrote it from ground up, and caught your mistake.

The thing is, you didn't import the font "Times New Roman". In order to do this, you need to right-click on the yellow folder, press Command + Shift + G, and type this in:

/System/Library/Fonts/

Then, scroll down until you see a font that says "Times", and upload it into Swift.

I would also recommend changing the part where it says "Times New Roman" to just "Times"

Still not working?

If it's still not working, then it's a problem with your code. I was able to rewrite your script from the ground up, and it worked for me. If it still isn't working, try using this code:

import UIKit
class ViewController: UIViewController {
    var popupLabel = UILabel()
    var popupBox = UIView()
    override func viewDidLoad() {
        view.addSubview(popupBox)
        popupBox.addSubview(popupLabel)
        popupBox.isHidden = true
        popupLabel.isHidden = true
        showPopup(CGPoint(x: 250 /* Change X Position */, y: 125 /* Change Y Position */), CGSize(width: 250 /* Change Width */, height: 100 /* Change Height */), "Blah" /* Change displayed text */)
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }

func showPopup(_ rectPosition: CGPoint, _ rectSize: CGSize, _ popupDisplay: String) {
    popupBox.isHidden = false
    popupLabel.isHidden = false
    popupLabel.textColor = UIColor.white
    popupLabel.font = UIFont(name: "Times New Roman", size: 14.0)
    self.popupLabel.text = popupDisplay
    popupBox.frame.size = rectSize
    popupBox.center = rectPosition
    popupBox.backgroundColor = UIColor.darkGray
    popupLabel.frame.size = popupBox.frame.size
    popupLabel.textAlignment = .center
    popupLabel.center = popupBox.center
}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}
}

If you are going to use this code, place it in the ViewController.swift file, and consider removing the other class.

Upvotes: 0

Agent Smith
Agent Smith

Reputation: 2913

Set the text to the label after initializing it

self.label = UILabel(frame: .zero)
self.labelText = text

You are setting the text before it's initialized.

Upvotes: 0

leedex
leedex

Reputation: 1013

If you want to show the message as a popup, why not write your popup in a UIViewController extension and call it in your controller?

extension UIViewController {
     func showPopup(text: String) {

          let popupView: UIView = {
              let view = UIView()
              view.backgroundColor = .darkGray
              view.translatesAutoresizingMaskIntoConstraints = false
              return view
          }()

          let textLabel: UILabel = {
              let label = UILabel()
              label.text = self.text
              label.font = UIFont(name: "Times New Roman", size: 14.0)
              label.textColor = UIColor.white
              label.translatesAutoresizingMaskIntoConstraints = false
              return label
          }()
          self.view.addSubview(popupView) 
          // add anchors to your popupView relative to your viewController here

          self.popupView.addSubView(textLabel)
          self.textLabel.topAnchor.constraint(equalTo: popupView.topAnchor).isActive = true
          self.textLabel.bottomAnchor.constraint(equalTo: popupView.bottomAnchor).isActive = true
          self.textLabel.leftAnchor.constraint(equalTo: popupView.leftAnchor).isActive = true
          self.textLabel.rightAnchor.constraint(equalTo: popupView.rightAnchor).isActive = true
    }
}

and call the function in your view controller:

self.showPopup(text: "My popup message")

Upvotes: 0

Related Questions