iosswiftexternal-display

Moving Labels within External Screen


I'm wanting to move my labels wherever I want on my external display. (eg. displayRunsLabel at the top and centered or perhaps 40px from right and top)

I have my labels showing on the screen. I'm currently using text alignment.

What's the best way to do this?

Here's my external display:

ExternalDisplayScreenshot

Screen shot

Here's the code:

 // CUSTOMISE VIEW
        secondScreenView.backgroundColor = UIColor.black
        displayWicketLabel.textAlignment = NSTextAlignment.left
        displayWicketLabel.font = UIFont(name: "Arial-BoldMT", size: 200.0)
        displayWicketLabel.textColor = UIColor.white
        displayWicketLabel.frame = secondScreenView.bounds
        secondScreenView.addSubview(displayWicketLabel)
        displayRunsLabel.textAlignment = NSTextAlignment.center
        displayRunsLabel.font = UIFont(name: "Arial-BoldMT", size: 200.0)
        displayRunsLabel.textColor = UIColor.white
        displayRunsLabel.frame = secondScreenView.bounds
        secondScreenView.addSubview(displayRunsLabel)
        displayOversLabel.textAlignment = NSTextAlignment.right
        displayOversLabel.font = UIFont(name: "Arial-BoldMT", size: 200.0)
        displayOversLabel.textColor = UIColor.white
        displayOversLabel.frame = secondScreenView.bounds
        secondScreenView.addSubview(displayOversLabel)
    }

Solution

  • The position of a label or any other UIView is the origin of its frame, which is a CGPoint representing its top left corner.

    So, you are currently saying:

        displayWicketLabel.frame = secondScreenView.bounds
        displayRunsLabel.frame = secondScreenView.bounds
        displayOversLabel.frame = secondScreenView.bounds
    

    Well, that's pretty silly, because you have given all three labels the same frame! Thus they overlay one another, and (as you rightly say) you can only read them by giving them different text alignments.

    Instead, give them each a different frame — one that puts the label where you want it. For example:

        displayWicketLabel.sizeToFit()
        displayWicketLabel.frame.origin = CGPoint(x:30, y:20) // or whatever
        displayRunsLabel.sizeToFit()
        displayRunsLabel.frame.origin = CGPoint(x:30, y:100) // or whatever
        displayOversLabel.sizeToFit()
        displayOversLabel.frame.origin = CGPoint(x:30, y:200) // or whatever
    

    Now, having said all that, a clear flaw in the code I just showed you is that we have hard-coded the positions arbitrarily, without taking account of what the size of the window is (the external display). For that reason, a much better way would be for you to learn about auto layout, which will let you lay the three labels out in nice positions automatically based on the size of the window.