使用swift 2只有頂部和底部邊框的文本字段

Question

我有一個忘記密碼的頁面。它只有一個文本字段，要求用戶填寫他們的電子郵件地址。設計師只設計了帶有頂部和底部邊框的文本字段。 我想答案從這裏UITextField Only Top And Bottom Border 但結果只顯示文本字段底部邊框。

像圖像中我想創建一個頂部和一個灰色邊框底部

Answer 1

感謝@El船長提出了寶貴的意見和漂亮的答案被@Bjorn滾裝即使是在Objective-C，我認爲。 而我的回答是（我使用swift 2 Xcode 7）

在您的swift文件中覆蓋函數viewDidLayoutSubviews（）。和守則同樣是

override func viewDidLayoutSubviews() { 
// Creates the bottom border 
     let borderBottom = CALayer() 
     let borderWidth = CGFloat(2.0) 
     borderBottom.borderColor = UIColor.grayColor().CGColor 
     borderBottom.frame = CGRect(x: 0, y: forgotPasswordEmailText.frame.height - 1.0, width: forgotPasswordEmailText.frame.width , height: forgotPasswordEmailText.frame.height - 1.0) 
     borderBottom.borderWidth = borderWidth 
     forgotPasswordEmailText.layer.addSublayer(borderBottom) 
     forgotPasswordEmailText.layer.masksToBounds = true 

// Creates the Top border 
     let borderTop = CALayer() 
     borderTop.borderColor = UIColor.grayColor().CGColor 
     borderTop.frame = CGRect(x: 0, y: 0, width: forgotPasswordEmailText.frame.width, height: 1) 
     borderTop.borderWidth = borderWidth 
     forgotPasswordEmailText.layer.addSublayer(borderTop) 
     forgotPasswordEmailText.layer.masksToBounds = true 

    } 

forgotPasswordEmailText是輸入電子郵件

文本字段

最終輸出看起來像這樣：用灰色邊框（iPhone 4S模擬器的屏幕截圖）

Answer 2

要能欣賞卸下戰鬥，你可以創建一個帶有的tableView包含文本字段的靜態電池。瞧做...頂部和底部邊框免費的午餐，你會使用標準的蘋果的東西:)

如果你真的想繪製層不是按照你的鏈接問題的步驟：

CALayer *topBorder = [CALayer layer]; 
topBorder.frame = CGRectMake(0, 0, self.frame.size.width, 1); 
topBorder.backgroundColor = [UIColor blackColor].CGColor; 
[myTextField.layer addSublayer:topBorder]; 

CALayer *bottomBorder = [CALayer layer]; 
bottomBorder.frame = CGRectMake(0, self.frame.size.height - 1, self.frame.size.width, 1); 
bottomBorder.backgroundColor = [UIColor blackColor].CGColor; 
[myTextField.layer addSublayer:bottomBorder]; 

在斯威夫特：

let topBorder = CALayer() 
topBorder.frame = CGRectMake(0, 0, bounds.size.width, 1) 
topBorder.backgroundColor = UIColor.grayColor() 
textField.layer.addSublayer(topBorder) 

let bottomBorder = CALayer() 
bottomBorder.frame = CGRectMake(0, bounds.size.height-1, bounds.size.width, 1) 
bottomBorder.backgroundColor = UIColor.grayColor() 
textField.layer.addSublayer(bottomBorder) 

Answer 3

爲程序化的解決方案好建議公佈爲止。但我想我會分享的InterfaceBuilder的解決方案....

1）在您的視圖控制器創建視圖集合

@IBOutlet private var borderViews: [UIView]? 

2）要在其中創建它們在Interface Builder 1px的高2個UIViews受限於周圍的文本字段

3）通過使用的setValue forKeyPath界面生成器的2次連接到borderViews IBOutlet中

4）自定義的兩個視圖外觀...例如，如果成功可能要邊框變綠

setValue(UIColor.green, forKeyPath: "borderViews.backgroundColor") 

Answer 4

在斯威夫特3使用擴展：

1. 從任何地方

   import UIKit 
   
   extension UITextField { 
   
       func setBottomBorder() { 
        self.borderStyle = .none 
        self.layer.backgroundColor = UIColor.white.cgColor 
        self.layer.masksToBounds = false 
        self.layer.shadowColor = UIColor.gray.cgColor 
        self.layer.shadowOffset = CGSize(width: 0.0, height: 1.0) 
        self.layer.shadowOpacity = 1.0 
        self.layer.shadowRadius = 0.0 
       } 
   } 
   

2. 調用Create斯威夫特文件：

   PasswordField.setBottomBorder(); 
   

Answer 5

這裏有一個處理意見調整，以及一個很好的和簡單的雨燕4實施:)

override func viewDidLayoutSubviews() { 
    super.viewDidLayoutSubviews() 

    viewToShadow.backgroundColor = .white 
    viewToShadow.layer.masksToBounds = false 

    viewToShadow.layer.sublayers? 
     .filter { layer -> Bool in 
      return layer.backgroundColor == UIColor.almostBlack.alpha(0.5).cgColor 
     } 
     .forEach { layer in 
      layer.removeFromSuperlayer() 
    } 

    [CGRect(x: 0.0, y: 0.0, width: viewToShadow.bounds.width, height: 0.5), 
    CGRect(x: 0.0, y: viewToShadow.bounds.height, width: viewToShadow.bounds.width, height: 0.5)] 
     .forEach { frame in 
      let layer = CALayer() 
      layer.frame = frame 
      layer.backgroundColor = UIColor.almostBlack.alpha(0.5).cgColor 
      viewToShadow.layer.addSublayer(layer) 
    } 
}