Display text vertically in Swift?

Question

Before I begin, I have visited How to align text inside textView vertically? and How can you rotate text for UIButton and UILabel in Swift? and many other places, but none of the answers outlined in the above links (or any place I've been to) has address my problem. So here's how it goes:

I am trying to display text in a UILabel vertically after the device changes to landscape from portrait.

I've managed to (forcefully) stack them vertically by changing its frame size and setting numberOfLines = 0.

This sort of produces the result I want, except I get white spaces between each character after rotation, elongating the word greatly.

Please check the image below to get a better idea of what I am experiencing.

Spaces between Chars

Ideally, there would be no unnecessary white spaces after rotation, and it would be nice and compact like it is in Portrait.

Does anyone know how I can achieve this? In my example, I am using UILabel, but an answer using UITextView is also fine as long as it works. Below is my code:

import UIKit  

class ViewController: UIViewController {  

    var _W = CGFloat()  
    var _H = CGFloat()  

    var wordLabel: UILabel!  

    override func viewDidLoad() {  
        super.viewDidLoad()  
        _W = UIApplication.shared.statusBarOrientation.isPortrait ? view.frame.width : view.frame.height  
        _H = UIApplication.shared.statusBarOrientation.isPortrait ? view.frame.height : view.frame.width  
        wordLabel = UILabel()  
        wordLabel.text = "Text"  
        view.addSubview(wordLabel)  
        formatLabel(label: wordLabel, fontSize: 64, color: UIColor.magenta, tag: 1)  
    }  

    func formatLabel(label: UILabel, fontSize: CGFloat, color: UIColor, tag: Int) {  
        label.font = UIFont.boldSystemFont(ofSize: fontSize)  
        label.textColor = color  
        label.tag = tag  
        label.textAlignment = .center  
        label.adjustsFontSizeToFitWidth = true  
        label.numberOfLines = 0  
        positionView(label, isPortrait: UIApplication.shared.statusBarOrientation.isPortrait)  
    }  

    override func willTransition(to newCollection: UITraitCollection, with coordinator: UIViewControllerTransitionCoordinator) {  
        positionView(wordLabel, isPortrait: !UIApplication.shared.statusBarOrientation.isPortrait)  
   }

    func positionView(_ view: UIView, isPortrait: Bool) {  
        if (view.tag == 1) {  
            if (isPortrait) {  
                wordLabel.frame = CGRect(x: 0, y: 0, width: _W, height: 80)  
                wordLabel.center = CGPoint(x: _W/2, y: (_H - _W)/4)  
            } else {  
                wordLabel.frame = CGRect(x: 0, y: 0, width: 50, height: _W)  
                wordLabel.center = CGPoint(x: (_H - _W)/4, y: _W/2)  
            }  
        }  
    }  

} 

Answer 1

Update:

After a bit more investigation, line spacing was already zero, but the line height was actually the issue.

To solve this, adjust the line height in the formatLabel function.

func formatLabel(label: UILabel, fontSize: CGFloat, color: UIColor, tag: Int) {  
    label.font = UIFont.boldSystemFont(ofSize: fontSize)  
    label.textColor = color  
    label.tag = tag  
    label.textAlignment = .center  
    label.adjustsFontSizeToFitWidth = true  
    label.numberOfLines = 0  

    if let text = label.text {

        let attributedString = NSMutableAttributedString(string: text)

        let paragraphStyle = NSMutableParagraphStyle()

        let newLineHeight = (label.font.lineHeight / 3) * 2

        paragraphStyle.minimumLineHeight = newLineHeight
        paragraphStyle.maximumLineHeight = newLineHeight
        paragraphStyle.alignment = label.textAlignment

        attributedString.setAttributes([NSAttributedString.Key.paragraphStyle: paragraphStyle], range: NSRange(location: 0, length: text.count))

        label.attributedText = attributedString

    }

    positionView(label, isPortrait: UIApplication.shared.statusBarOrientation.isPortrait)  
}  

---

Original Answer:

When the label width is reduced, each letter is placed on its own line.

Line spacing is critical for reading sentences, but since these lines are part of the same word then adjusting the line spacing is needed to make the word look contiguous.

Answers on this question cover line spacing for UILabel.