Bạn có thể cung cấp đường viền UIStackView không?

Question

Tôi đang cố gắng cung cấp 5 riêng biệt UIStackViews trong biên giới ViewController của tôi. Tôi đã đưa cho mỗi người một số IBOutlet và sau đó gọi cho họ theo số viewDidLoad để sử dụng thuộc tính layer nhưng vô ích. Không thể cung cấp đường viền khung nhìn ngăn xếp, theo chương trình?

Code:

@IBOutlet weak var stackView1: UIStackView! 
@IBOutlet weak var stackView2: UIStackView! 
@IBOutlet weak var stackView3: UIStackView! 
@IBOutlet weak var stackView4: UIStackView! 
@IBOutlet weak var stackView5: UIStackView! 

override func viewDidLoad() { 
    super.viewDidLoad() 

    stackView1.layer.borderWidth = 5 
    stackView2.layer.borderWidth = 5 
    stackView3.layer.borderWidth = 5 
    stackView4.layer.borderWidth = 5 
    stackView5.layer.borderWidth = 5 
} 

Answer 1

Đáng tiếc là điều này không thể được thực hiện. UIStackView là không bình thường ở chỗ nó là một cái nhìn "không dựng hình" mà thực hiện bố trí (sử dụng các ràng buộc bố trí tự động) nhưng không hiển thị chính nó. Nó có một lớp giống như tất cả UIViews, nhưng nó bị bỏ qua.

Xem the Apple doc dưới "Quản lý Stack Xem lý lịch thành Appearance":

Các UIStackView là một lớp con của nonrendering UIView. Nó không cung cấp bất kỳ giao diện người dùng nào của riêng nó. Thay vào đó, nó chỉ quản lý vị trí và kích thước của các chế độ xem được sắp xếp của nó. Kết quả là, một số thuộc tính (như backgroundColor) không ảnh hưởng đến chế độ xem ngăn xếp. Tương tự như vậy, bạn không thể ghi đè layerClass, drawRect :, hoặc drawLayer: InContext:

Answer 2

thể của nó để làm điều này bằng cách xem bên trong xem chồng là biên giới. Điều này có thể là rất nhiều công việc và có thể có một số tình huống nhất định sẽ không hoạt động hoặc phải làm việc xung quanh để nó có thể không đáng để nỗ lực. Bạn sẽ cần lồng các khung nhìn ngăn xếp để bạn có thể cung cấp đường viền theo cả hướng ngang và dọc. Trong số Bordered Stack Views blog post của tôi, tôi đi vào chi tiết hơn về điều này. Nhưng về cơ bản tôi có quan điểm thường xuyên có một nền được thiết lập để màu sắc của lựa chọn của tôi và tôi cung cấp cho chiều cao hoặc chiều rộng hạn chế của 1 tùy thuộc vào sự chỉ đạo của trục xem của stack. Đây là hệ thống phân cấp đầy đủ của một lưới 2x2 được xây dựng trong xây dựng giao diện:

Hệ quả là kết quả này:

Here's a link to my github repo của ví dụ này, do đó bạn có thể xem các tập tin kịch bản này.

Answer 3

Bạn có thể nhúng stackView bên trong UIView, sau đó đặt đường viền của chế độ xem đó (màu, chiều rộng, v.v.) và sau đó hạn chế stackView với UIView như trên cùng, bên trái, bên phải, chiều cao.

Answer 4

Dưới đây là một đoạn tiện dụng mã tôi tìm thấy và sử dụng:

extension UIView { 
    func addTopBorderWithColor(color: UIColor, width: CGFloat) { 
     let border = CALayer() 
     border.backgroundColor = color.cgColor 
     border.frame = CGRect(x:0,y: 0, width:self.frame.size.width, height:width) 
     self.layer.addSublayer(border) 
    } 

    func addRightBorderWithColor(color: UIColor, width: CGFloat) { 
     let border = CALayer() 
     border.backgroundColor = color.cgColor 
     border.frame = CGRect(x: self.frame.size.width - width,y: 0, width:width, height:self.frame.size.height) 
     self.layer.addSublayer(border) 
    } 

    func addBottomBorderWithColor(color: UIColor, width: CGFloat) { 
     let border = CALayer() 
     border.backgroundColor = color.cgColor 
     border.frame = CGRect(x:0, y:self.frame.size.height - width, width:self.frame.size.width, height:width) 
     self.layer.addSublayer(border) 
    } 

    func addLeftBorderWithColor(color: UIColor, width: CGFloat) { 
     let border = CALayer() 
     border.backgroundColor = color.cgColor 
     border.frame = CGRect(x:0, y:0, width:width, height:self.frame.size.height) 
     self.layer.addSublayer(border) 
    } 

    func addMiddleBorderWithColor(color: UIColor, width: CGFloat) { 
     let border = CALayer() 
     border.backgroundColor = color.cgColor 
     border.frame = CGRect(x:self.frame.size.width/2, y:0, width:width, height:self.frame.size.height) 
     self.layer.addSublayer(border) 
    } 
} 

Đơn giản chỉ cần sử dụng trên bất kỳ quan điểm như thế này:

bottomControls.addMiddleBorderWithColor(color: buttonBorderColor, width: 3.0) 

Nguồn: How to add only a TOP border on a UIButton?