Controls are not wrapped in UIViewController

I'm having a view hierarchy as follows. I'm a New Developer.


UIViewController->UIView->UIStackView->UIStackView-> (UILabel, UITextField, UIButton, etc.,). I'm creating everything programatically, execpt the UIViewController and UIView putting in storyboard. I'm using in a master-detail application. I've given constaints in storyboard. For my project Interface Builder is not enough, I need to handle everything programatically.


Using the above hierarchy, I'm putting lots of UILabels (A stack view in a table column to hold multiple UILabel). I can put other controls like UITextField, UIButton, etc., along side the UILabel's


I see the controls are going off the screen and it is not wrapping. In some case the UILabels are cut off without "..."


Please give or point me to a sample code to make the controlls wrapped!



// View refered from storyboard
@IBOutlet weak var customView: UIView!

// Main stack view holding a table
let tag: Int = 1
let stackView = UIStackView()
stackView.axis  = NSLayoutConstraint.Axis.vertical
stackView.distribution  = UIStackView.Distribution.fillProportionally
stackView.alignment = UIStackView.Alignment.leading
stackView.spacing   = 16.0
stackView.translatesAutoresizingMaskIntoConstraints = false
stackView.isUserInteractionEnabled = true
stackView.tag = tag
tag += 1

// Loop through the rows

// Loop through columns

// For each column I add a sub stack view
let stackSubView   = UIStackView()
stackSubView.axis  = NSLayoutConstraint.Axis.horizontal
stackSubView.distribution  = UIStackView.Distribution.fillProportionally
stackSubView.alignment = UIStackView.Alignment.leading
stackSubView.spacing   = 5.0
stackSubView.isUserInteractionEnabled = true
stackSubView.translatesAutoresizingMaskIntoConstraints = false
stackSubView.tag = tag
tag += 1

// Loop through the column items

// If Label type:
// Label
let label = UILabel(frame: CGRect(x: CGFloat(xAxis), y: CGFloat(yAxis), width: CGFloat(width), height: CGFloat(height)))
label.text = "text value"
// if light
label.font = UIFont(name: "Helvetica", size: CGFloat(size))
// if bold
label.font = UIFont(name: "Helvetica-Bold", size: CGFloat(size))
// I'm incrementing the labelTag as per number of unique controls
label.tag = tag
// Truncating Trail not working and "..." are coming.
// I want full text. "..." is not human friendly
label.lineBreakMode = .byTruncatingTail
stackSubView.addArrangedSubview(label) // Add single UILabel in each sub stack view cell
// End of if

// If Text Field type:
// Text Field
let textField = UITextField(frame: CGRect(x: CGFloat(xAxis), y: CGFloat(yAxis), width: CGFloat(width), height: CGFloat(height)))
textField.text = "text field value"
textField.borderStyle = .line
textField.placeholder = "text field value"
label.lineBreakMode = .byTruncatingTail
// I'm incrementing the textFieldTag as per number of unique controls
textField.tag = tag
stackSubView.addArrangedSubview(textField) // Add single UITextField in each sub stack view cell
// End of if

// If Button Type:
// Button
let button = UIButton(frame: CGRect(x: CGFloat(xAxis), y: CGFloat(yAxis), width: CGFloat(width), height: CGFloat(height)))
let value = "button value"
button.setTitle(value, for: .normal)
button.setTitleColor(UIColor.black, for: .normal)
button.isUserInteractionEnabled = true
// I'm incrementing the buttonTag as per number of unique controls
button.tag = tag
stackSubView.addArrangedSubview(button) // Add single UIButton in each sub stack view cell
// End of if
tag += 1

// End of column item loop

stackView.addArrangedSubview(stackSubView)

// End of column loop

// End of row loop


// View Controller
customView.addSubview(stackView)
self.view.addSubview(customView)

stackView.translatesAutoresizingMaskIntoConstraints = false
stackView.topAnchor.constraint(equalTo: view.topAnchor, constant: 20)
stackView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20).isActive = true
stackView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: 20).isActive = true

You define nowhere that labels must be truncated.


For each label, add


        uiLabel.lineBreakMode = .byTruncatingTail


For more help, please show the complete code (we don't see for instance how you create your controls)

Still it is going off the screen in iPhone in portrait mode mainly. iPad since it is big is ok.


Updated the question see there.

Are the labels OK now ?


Please show how you create the UIButtons, UITextFields.

I've updated the question to include UIButton and UITextField code. I must not see any controls text truncated. I cannot reduce text length. I want all text should be visible.

For multiline labels, you usually have to set the preferredMaxLayoutWidth property so UIKit knows where to break the lines. Some discussion here: stackoverflow.com/questions/34386528/multiline-label-in-uistackview


Similar for buttons and text views. They have to know their width. For text views, you also have to make sure they’re set as not scrollable, otherwise they don’t know how to calculate their intrinsic content size (height).

Who spoke of open source components ?


If xAxis or yAxis are too large, then controls will skip out of screen.

So, it depends how xAxis and yAxis are defined.

Hi, Thanks for pointing out! I've removed the open source terms.

Any Apple Technical people please help me it is not working!

Could you post the latest version of your code (if possible the complete ViewControlle) and explain what is the problem now:

- labels trucating ?

- controls badly placed

- other ?

Apple technical team please help!


Please download the sample XCode project containing the issue: https://github.com/kumarmuthaiah18/WrappingIssue/tree/master/WrappingIssue

I don't know what is happening in Apple side, atleast send me a feedback!

I don't know what is happening in Apple side, atleast send me a feedback! Two person have replied so far previously. Is they Apple person or from other ?

Apple has no commitment at all to answer on this forum, even not to give any feedback. Some Apple guys do it, but that is not required.

Most people here are non Apple (Apple people are labelled as such on the forum).


If you need to contact Apple, 2 ways:

- file a bug report (but answer may be very long to come)

- burn a DTS ticket, that's fast and efficient.


And what about the latest questions I asked ?

Accepted Answer

You are trying to use StackViews out of purpose: an horizontal stackView cannot wrap on second row as you want.


You should use CollectionViews, they are made for this.

Thanks Claude31 for your support. I’ve got help from Apple support. I’m sticking with horizontal and vertical scrolling for now due to less time. Collection view is good and will consider in future.

Controls are not wrapped in UIViewController
 
 
Q