iOS开发③UIView

UILabel

Lable的作用是显示不可编辑的文字。

属性检查器

• Text：Label显示的文字

• Color：文字的颜色

• Font：字体和字号

• Alignment：文本的对齐方式

• Lines：设置Label中文本的行数，默认为1

• Line Breaks：设置文字的截断，当文本太长以至于Label不能显示全部的字体时，超长的部分会显示“...”，通常在以下三个选项中做选择。

  • Truncate Tail：截断尾部

  • Truncate Head：截断头部

  • Truncate Middle：保留头尾，截断中间

• Highlighted：设置高亮是文本的颜色

• Shadow：设置文本的阴影颜色

• Shadow Offset：设置标签文本的阴影偏移量

代码创建Lable

//代码创建Label
let lable = UILabel(frame: CGRect(x: 100, y: 100, width: 200, height: 200))
lable.text = "代码创建的Lable"
lable.font = UIFont.systemFont(ofSize: CGFloat(28))
lable.textColor = UIColor.red
view.addSubview(lable)

实现

//
//  ViewController.swift
//  LableDemo
//
//  Created by Michael on 2016/10/12.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    //storyboard
    @IBOutlet weak var mLabel: UILabel!
    override func viewDidLoad() {
        super.viewDidLoad()
        // 设置文本
        mLabel.text = "Hello ShenZhen"
        //设置字体对齐方式
        mLabel.textAlignment = .left
        mLabel.textColor = UIColor.red
        mLabel.backgroundColor = UIColor.green
        //设置字体大小
        mLabel.font = UIFont.boldSystemFont(ofSize: 25)
        //文本的行数
        mLabel.numberOfLines = 2
        
        //代码创建Label
        let lable = UILabel(frame: CGRect(x: 100, y: 100, width: 200, height: 200))
        lable.text = "代码创建的Lable"
        lable.font = UIFont.systemFont(ofSize: CGFloat(28))
        lable.textColor = UIColor.red
        view.addSubview(lable)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

示例图

UIButton

UIButton是ios中最基本的按钮控件

属性检查器

在StoryBoard中拖曳生成一个控件时，可以使用属性检查器来设置场景中控件的属性。如果使用的是代码生成的控件，则在代码中给控件的属性赋值来改变属性的属性。

属性检查器的内容如下：

• Type：按钮的样式，默认是System，也就是透明背景蓝色字体的按钮样式。

• State Config：默认为default，此外还有HighLight（触摸高亮）、Selected（选中状态）和Disable（禁用状态）

• Title：设置按钮显示的文字

• Font：设置后按钮字体和字号

• TextColor：设置字体颜色

• Shadow Color：设置文字的阴影颜色

• Image：设置按钮的图片格式，在这里设置图片会让按钮的文字消失

• Backgroud：设置按钮的背景图片，保留文字

代码创建按钮

//用代码添加一个Button到View中
let btn1 = UIButton(frame: CGRectMake(100,50,200,200))
btn1.setTitle("word", forState: .Normal)
btn1.backgroundColor = UIColor.blueColor()
//添加点击事件
btn1.addTarget(self, action: #selector(ViewController.show(_:)), forControlEvents: .TouchUpInside)
view.addSubview(btn1)

func show(button : UIButton) {
    print(button.currentTitle!)
}

实现

//
//  ViewController.swift
//  ButtonDemo
//
//  Created by Michael on 16/9/12.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    //实例
    @IBOutlet weak var myButton: UIButton!

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        //用代码添加一个Button到View中
        let btn1 = UIButton(frame: CGRectMake(100,50,200,200))
        btn1.setTitle("word", forState: .Normal)
        btn1.backgroundColor = UIColor.blueColor()
        //添加点击事件
        btn1.addTarget(self, action: #selector(ViewController.show(_:)), forControlEvents: .TouchUpInside)
        view.addSubview(btn1)

    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    func show(button : UIButton) {
        print(button.currentTitle!)
    }


    //StoryBoard点击事件
    @IBAction func click(sender: UIButton) {
        print(sender.currentTitle!)
        //设置文字
        sender.setTitle("hello", forState: .Normal)
        //设置文字颜色
        sender.setTitleColor(UIColor.darkTextColor(), forState: .Normal)
        //设置背景颜色
        sender.backgroundColor = UIColor.redColor()
        //设置圆角
        sender.layer.cornerRadius = 15
        //是否可见
        sender.hidden = false
    }
}

示例

UISwitch、UISilder、UISegmentedControl

UISWitch

Switch控件状态分为开启和关闭状态。

UISwitch的属性检查器的主要内容有：

• State：有On和Off两种状态

• On Tint：开关打开时的背景颜色

• Thumb Tint：滑块的颜色

UISlider

Slider控件通常用来指示进度，并且可以通过拖曳改变进度。

UISlider控件的属性检查器的主要内容有：

• Value：设置Value的最大值、最小值，以及通过设置Current的值来限定Slider初始化时滑块的位置

• Min Image和Max Image：Slider最大值和最小值处的图片

• Min Track Tint：滑块左侧轨道的颜色

• Max Track Tint：滑块右侧轨道的颜色

• Thumb Tint：滑块的颜色

• Events：有一个可选项Continuous Updates，勾选后再拖动滑块的过程中会不断触发事件

UISegmentedControl（分段控件）

UISegmentedControl的属性检查器的主要内容有：

• Style：样式

• State：

• Segments：设置分段的数量，默认的是2个，而且不能低于2个。

• Segment：设置当前编辑的分段

• Title：设置该分段所显示的文字，默认是First、Second等英文序数词

• Image：设置该分段的图片

• Behavior：Enabled表示该分段是否可用，Selected表示在初次加载时该分段是否被选中

• Content OffSet：设置分段中的Title的位置，如果对默认的位置不满意，则可以设置X和Y方向的偏移量来调整，可正可负

实现

//
//  ViewController.swift
//  OtherButtonDemo
//
//  Created by Michael on 2016/10/13.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var mSwitchButton: UISwitch!
    @IBOutlet weak var mBottomSwitch: UISwitch!
    @IBOutlet weak var mSegmentButton: UISegmentedControl!
    @IBOutlet weak var mLabel: UILabel!
    @IBOutlet weak var mSlideButton: UISlider!
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        mSlideButton.minimumValue = 0
        mSlideButton.maximumValue = 100
        mSlideButton.setValue(60, animated: true)
        mLabel.text = String(format: "SlideValue: %0.0f", mSlideButton.value)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
        

    }

    /**
    * UISwitch点击事件
    *
    */
    @IBAction func switchValueChange(_ sender: AnyObject) {
        //AnyObject转为UISwitch类型
        let witchSwitch = sender as! UISwitch
        print(witchSwitch.isOn)
        print(mSwitchButton.isOn)
        mBottomSwitch.setOn(mSwitchButton.isOn, animated: true)
    }
    
    //
    //UISegmentedControl点击事件
    //
    @IBAction func switchSegment(_ sender: AnyObject) {
        //选择的段
        NSLog("%ld", mSegmentButton.selectedSegmentIndex)
        if mSwitchButton.isHidden {
            self.mSwitchButton.isHidden = false;
        } else {
            self.mSwitchButton.isHidden = true;
        }
    }
    
    //USlider滑动事件
    @IBAction func slideValueChange(_ sender: AnyObject) {
        let slider = sender as! UISlider
        NSLog("\(slider.value)")
        mLabel.text = String(format: "SlideValue: %0.3f", slider.value)
    }
}

示例图

UITextField和UITextView

UITextField

UITextField文本框与UILabel的不同是文本框是可以编辑的。iOS用到的文本框的地方很多，比如搜索框、用户登录框等。

UITextField的属性检查器的主要内容有：

• Placeholder：默认显示在这里的文字，通常用来提示该文本框中需要输入的内容

• Border Style：选择文本框的样式

• Clear Button：设置清除输入的按钮

• Min Font Size：文本框被挤压时，文本框中字体的最小尺寸

• Capitalization：设置文本框是否自动转换大小写

• Spell Checking：检查是否有拼写错误

• KeyBoard Style：键盘的样式

• Return key：选择返回键的样式

UITextView

UITextView也是可以编辑文本内容的，适用于大段文本的编辑

实现

//
//  ViewController.swift
//  TextDemo
//
//  Created by Michael on 2016/10/12.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController,UITextFieldDelegate,UITextViewDelegate {

    @IBOutlet weak var mTextField: UITextField!
    @IBOutlet weak var mTextView: UITextView!
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        mTextField.delegate = self
        mTextView.delegate = self
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    @IBAction func onClick(_ sender: UIButton) {
        NSLog("TextFiled: %@", mTextField.text!)
        NSLog("TextView: %@", mTextView.text!)

    }
    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
        //关闭键盘
        mTextField.resignFirstResponder()
        NSLog("TextFiled 获得焦点")
        return true
    }
    
    func textFieldDidEndEditing(_ textField: UITextField) {
        NSLog("%@", textField.text!)
    }
    
    func textView(_ textView: UITextView, shouldChangeTextIn range: NSRange, replacementText text: String) -> Bool {
        if text == "\n" {
            NSLog("TextView 获得焦点")
            //关闭键盘
            mTextView.resignFirstResponder()
            return false
        }
        return true
    }

}

示例图

UIProgressView

ProgressView(进度条)可以用来显示式地表示某个操作处理的进度。

属性检查器

• Progress:当前进度条的进度值

• Progress Tint:已完成进度部分的颜色

• Track Tint：未完成部分的颜色

• Progress Image：使用图片填充以完成的部分

• Track Image“使用图片填充未完成的部分

实现

//
//  ViewController.swift
//  ProgressViewDemo
//
//  Created by Michael on 2016/10/18.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var mProgressView: UIProgressView!
    var timer:Timer!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        self.mProgressView.progress = 0;
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


    @IBAction func download(_ sender: AnyObject) {
        //执行定时任务
        self.timer = Timer.scheduledTimer(timeInterval: 1.0, target: self, selector: #selector(ViewController.download as (ViewController) -> () -> ()), userInfo: nil, repeats: true)
    }
    
    func download() {
        
        //更新进度值
        self.mProgressView.progress += 0.05
        
        if self.mProgressView.progress == 1.0 {
            //结束定时器
            self.timer.invalidate()
        }
        
    }
}

示例图

UIActivityIndicatorView

与UIProgressView相比，UIActivityIndicatorView不会显示具体的进度，只是用做提示的作用

属性检查器

• Style：样式有三种：Gray、White、Large White

• Color：ActivityIndicatorView的颜色

• Behavior：有两个选项：Animating表示ActivityIndicatorView的齿轮是否在转动；Hides When Stopped 表示当齿轮停止转动时是否将ActivityIndicatorView隐藏。

实现

//
//  ViewController.swift
//  IndicatorViewDemo
//
//  Created by Michael on 2016/10/18.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var mIndicatorView: UIActivityIndicatorView!

    override func viewDidLoad() {
        super.viewDidLoad()
        //活动指示器出于非活动状态时则会隐藏
        mIndicatorView.hidesWhenStopped = true
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        @IBAction func download(_ sender: AnyObject) {
        }
        // Dispose of any resources that can be recreated.
    }

    @IBAction func upLoad(_ sender: AnyObject) {
        if mIndicatorView.isAnimating {
            //停止旋转
            mIndicatorView.stopAnimating()
        } else {
            //开始旋转
            mIndicatorView.startAnimating()
        }
    }
}

示例图

UIStepper

UIStepper(步进器)的作用是按照约定的步长进行增减操作。Stepper上的+和-按钮对应Stepper所控制的数值的增减操作

属性检查器

• Value:Stepper所控制的值。Mininum表示最小值，Maximun表示最大值，Current表示初始化时的值，Step表示步长。

• Behavior：有三个复选框

  • Autorepeat：表示按住+和-的时候会不断地触发Stepper。

  • Continuous：勾选后系统实时触发ValueChanged事件，未勾选时系统只有当用户停止与Stepper交互时才触发ValueChanged事件。

  • Wrap：选择后当前当前Value值达到最大最小值时会继续增加或减少，value值会被复位成一个循环，比如最大值为100，最小值为0，当达到100后继续增加时Value的值就会变为0；如未选中，则达到最大或最小值时，Value会保持最大或最小值。

实现

//
//  ViewController.swift
//  StepperDemo
//
//  Created by Michael on 2016/10/19.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var mStepper: UIStepper!
    @IBOutlet weak var mCount: UILabel!
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        mStepper.stepValue = 1.0 //步长
        mStepper.minimumValue = 0.0
        mStepper.maximumValue = 10.0
        mStepper.value = 0.0 //当前值
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.

    }


    @IBAction func step(_ sender: AnyObject) {
        let text = String(format: "数量%d", Int(mStepper.value))
        mCount.text = text
    }
}    

示例图

UIImageView

UIImageView是用于展示图片的控件。

属性检查器

• Image:从工程的图片资源文件夹中选择一张图片作为UIImageVIew的填充，在Storyboard中使用图片名称来索引图片

• Highlighted：高亮状态下显示的图片

• State：可以设置UIImageView的初始状态，默认是非高亮状态

实现

//
//  ViewController.swift
//  ImageView
//
//  Created by Michael on 2016/10/19.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var mImage: UIImageView!
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        mImage.image = UIImage(named: "ic_welcome")! //代码添加图片
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

示例图

UIPickerView

UIPickerView是可以用来更灵活地显示滑轮要显示的内容，如选择省市区等。

属性检查器

Behavior：默认勾选，勾选后会高亮显示选中的选项

实现

//
//  ViewController.swift
//  PickerViewDemo
//
//  Created by Michael on 2016/10/20.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController,UIPickerViewDelegate,UIPickerViewDataSource {

    @IBOutlet weak var mPickerView: UIPickerView!
    @IBOutlet weak var mLable: UILabel!
    
    var pickerData: NSDictionary!
    var pickerProvinceData: NSArray!
    var pickerCityData: NSArray!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        //从资源文件夹获取plist文件内容
        let listPath = Bundle.main.path(forResource: "provinces_cities", ofType: "plist")
        let dict = NSDictionary(contentsOfFile: listPath!)
        self.pickerData = dict
        
        self.pickerProvinceData = self.pickerData.allKeys as! NSArray
        
        let provice = self.pickerProvinceData[0] as! String
        self.pickerCityData = self.pickerData[provice] as! NSArray
        
        //设置代理处理回调事件
        mPickerView.dataSource = self
        mPickerView.delegate = self
        
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    //确定选择器的拨轮的数目
    func numberOfComponents(in pickerView: UIPickerView) -> Int {
        return 2
    }
    
    //确定每个拨轮的条目数
    func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
        if component == 0 {
            return self.pickerProvinceData.count
        } else {
            return self.pickerCityData.count
        }
    }
    
    //为选择器某个拨轮的条目提供显示数据
    func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
        if component == 0 {
            return self.pickerProvinceData[row] as? String
        } else {
            return self.pickerCityData[row] as? String
        }
    }
    
    //选择选择器的某个拨轮的条目时调用
    func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
        if component == 0 {
            let provice = self.pickerProvinceData[row] as! String
            self.pickerCityData = self.pickerData[provice] as! NSArray
            self.mPickerView.reloadComponent(1)
        }
    }

    @IBAction func onClick(_ sender: UIButton) {
        let row1 = self.mPickerView.selectedRow(inComponent: 0)
        let row2 = self.mPickerView.selectedRow(inComponent: 1)
        let province = self.pickerProvinceData[row1] as! String
        let city = self.pickerCityData[row2] as! String
        let title = String(format: "%@,%@市", province,city)
        mLable.text = title
        
    }
}

示例图

UIDatePickerView

属性检查器

• Model:设置UIDatePicker的样式，有以下四种模式：

  • Date and Time：显示的是时间和日期

  • Date：只显示日期

  • Time：只显示时间

  • Count Down Timer：显示24小时制的倒计时模式

• Local：设置语言类型，默认是英文

• Interval：设置时间间隔，以分钟为单位

• Date：显示的日期，默认是当前的日期

• Constraints：设置UIDatePickerView的最大值和最小值

• Timer：设置Count Down Time模式下倒计时的秒数

实现

//
//  ViewController.swift
//  DatePickerViewDemo
//
//  Created by Michael on 2016/10/19.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var mDatePickerView: UIDatePicker!
    @IBOutlet weak var mDesc: UILabel!
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        mDesc.text =  mDatePickerView.date.description(with: Locale.current)

    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    @IBAction func datePick(_ sender: AnyObject) {
        let date = mDatePickerView.date
        let format = DateFormatter()
        format.dateFormat = "YYYY-MM-dd HH:mm:ss"
        let time = format.string(from: date)
       mDesc.text =  time
    }

    @IBAction func timeMode(_ sender: AnyObject) {
        //设置为Time模式
        mDatePickerView.datePickerMode = UIDatePickerMode.time
    }
    
    
    @IBAction func dateMode(_ sender: AnyObject) {
        mDatePickerView.datePickerMode = UIDatePickerMode.date
    }
    
    @IBAction func dateAndTimeMode(_ sender: AnyObject) {
        mDatePickerView.datePickerMode = UIDatePickerMode.dateAndTime
    }
    
    @IBAction func mCountDownTime(_ sender: AnyObject) {
        mDatePickerView.datePickerMode = UIDatePickerMode.countDownTimer
    }
    
}

示例图

• Date and Time模式

• Time模式

• Date模式

• Count Down Timer模式

UIAlertView&UIActionSheet

UIAlertView是用来显示的提示框的控件，只能在代码中创建.
UIActionSheet是用来显示操作表的控件，也只能在代码中创建。

使用步骤：

1. 创建一个UIAlertController的实例

2. 创建UIAlertAction的实例，可以有多个

3. 将UIAlertAction实例添加到UIAlertController中

4. 使用UIViewController的present显示UIAlertController

实现

//
//  ViewController.swift
//  AlertViewDemo
//
//  Created by Michael on 2016/10/18.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var mAlertBtn: UIButton!
    @IBOutlet weak var mActionBtn: UIButton!

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


    //弹出警告栏
    @IBAction func showAletView(_ sender: AnyObject) {
        
        let alertController = UIAlertController(title: "警告", message: "是否继续?", preferredStyle: UIAlertControllerStyle.alert)
        
        //取消
        let noAction = UIAlertAction(title: "否", style: UIAlertActionStyle.cancel) { (UIAlertAction) in
            NSLog("No")
        }
        
        //确认
        let yesAction = UIAlertAction(title: "是", style: UIAlertActionStyle.default) { (UIAlertAction) in
            NSLog("Yes")
        }
        let confirmAction = UIAlertAction(title: "是", style: UIAlertActionStyle.destructive) { (UIAlertAction) in
            NSLog("Yes")
        }
        //添加文本框
        alertController.addTextField { (UITextField) in
            UITextField.placeholder = "请输入密码"
        }
        alertController.addAction(noAction)
        alertController.addAction(yesAction)
        alertController.addAction(confirmAction)
        
        self.present(alertController, animated: true, completion: nil)
    }
    
    //弹出操作表
    @IBAction func showActionSheet(_ sender: AnyObject) {
        
        //默认是ActionSheet
        let actionSheet = UIAlertController()
        
        let cancelAction = UIAlertAction(title: "取消", style: UIAlertActionStyle.cancel) { (UIAlertAction) in
            NSLog("cancel")
        }
        
        let sina = UIAlertAction(title: "新浪微博", style: UIAlertActionStyle.destructive) { (UIAlertAction) in
            NSLog("weibo")
        }
        let wechat = UIAlertAction(title: "微信", style: UIAlertActionStyle.default) { (UIAlertAction) in
            NSLog("wechat")
        }
        
        let tecent = UIAlertAction(title: "QQ空间", style: UIAlertActionStyle.default) { (UIAlertAction) in
            NSLog("tecent")
        }
        
        actionSheet.addAction(cancelAction)
        actionSheet.addAction(sina)
        actionSheet.addAction(wechat)
        actionSheet.addAction(tecent)
        
        self.present(actionSheet, animated: true, completion: nil)
    }
}

示例图

• UIAlertView

• UIActionSheet

UIToolbar

属性检查器

• Style:工具栏的样式，浅色和深色

• Translucent：是否半透明

• Bar Tint：工具栏的颜色

实现

//
//  ViewController.swift
//  ToolBarDemoo2
//
//  Created by Michael on 2016/10/18.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var mDesc: UILabel!
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    @IBAction func save(_ sender: AnyObject) {
        mDesc.text = "存储"
    }

    @IBAction func done(_ sender: AnyObject) {
        mDesc.text = "完成"
    }
    
    @IBAction func edit(_ sender: AnyObject) {
        mDesc.text = "编辑"
    }
}

示例图

UISearchBar

UISearchBar是用于显示搜索框的控件

属性检查器

• Text：SearchBar中输入的文字

• PlaceHolder：占位符，通常用来提示用户输入的内容

• Prompt：SearchBar的标题，显示在输入框的上方

• Search Style：SearchBar的样式，可以选择边框加深还是搜索框加深

• Bar Style:整体的颜色，可选择深色和浅色

• Bar Tint:边框的颜色

• Background:设置背景图片

• Scope Bar:设置Scope Bar的背景图片

• Search Text：设置关键字的位置。默认是在左边

• Options：SearchBar的右侧可以配备一个功能按钮，比如查找搜索记录、清除已输入的内容。

实现

//
//  ViewController.swift
//  SearchBar
//
//  Created by Michael on 2016/10/21.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UIViewController,UISearchBarDelegate {
    @IBOutlet weak var mSearch: UISearchBar!

    @IBOutlet weak var mInfo: UILabel!
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        mSearch.delegate = self
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String) {
        mInfo.text = searchText
    }
    
    func searchBarCancelButtonClicked(_ searchBar: UISearchBar) {
        NSLog("searchBarCancelButtonClicked");
    }
    
    //按搜索键时调用
    func searchBarSearchButtonClicked(_ searchBar: UISearchBar) {
        NSLog("searchBarSearchButtonClicked");
    }
    
}

示例图

WebView

浏览网页需要先在配置文件Info.plist中增加App Transport Security Settings,并在此条目增加子条目Allow Arbitrary Loads并设置为YES,否则加载网页会失败

WKWebView

WKWebView不是UKit内容，它属于WebKit中的类，是在iOS8中引入的部分。WKWebView将浏览器的内存渲染进程从App转移到系统中进行，提高了性能；其次它拥有和Safari相同的JavaScript引擎；最后它拥有60fps的滚动刷新频率。

实现

//
//  ViewController.swift
//  WebViewDemo
//
//  Created by Michael on 2016/10/17.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit
import WebKit //引入库

class ViewController: UIViewController,WKNavigationDelegate {
    
    @IBOutlet weak var mButton: UIButton!
    var mWebView: WKWebView!
    @IBOutlet weak var mSafari: UIButton!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        mButton.layer.borderColor = UIColor.black.cgColor
        mButton.layer.borderWidth = 1
        
        //设置Button的边框颜色
        mSafari.layer.borderColor = UIColor.black.cgColor
        mSafari.layer.borderWidth = 1
     }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    @IBAction func openWeb(_ sender: AnyObject) {
        
        //打开网页
        mWebView = WKWebView(frame: view.frame)
        let mUrl = URL(string: "http://www.baidu.com")
        let request = URLRequest(url: mUrl!)
        mWebView.load(request)
        //注册网页加载过程代理
        mWebView.navigationDelegate = self
        view.addSubview(mWebView)
    }
    
    func webView(_ webView: WKWebView, didStartProvisionalNavigation navigation: WKNavigation!) {
        NSLog("开始加载")
    }
    
    func webView(_ webView: WKWebView, didCommit navigation: WKNavigation!) {
        NSLog("内容开始返回时回调")
    }
    
    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
        NSLog("加载完成")
    }
    
    func webView(_ webView: WKWebView, didFailProvisionalNavigation navigation: WKNavigation!, withError error: Error) {
        NSLog("加载失败")
    }
    
}

示例图

SFSafariViewController

SFSafariViewController是iOS9中加入的控制器，这样就可以直接使用Safari来打开网页，获得Safari的完整功能而不需要离开App。

实现

//
//  ViewController.swift
//  WebViewDemo
//
//  Created by Michael on 2016/10/17.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit
import SafariServices //引入库

class ViewController: UIViewController,WKNavigationDelegate {
    
    @IBOutlet weak var mSafari: UIButton!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        //设置Button的边框颜色
        mSafari.layer.borderColor = UIColor.black.cgColor
        mSafari.layer.borderWidth = 1
     }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    @IBAction func openSafari(_ sender: AnyObject) {
        //通过Safari打开网页
        let mUrl = URL(string: "http://www.baidu.com")
        let safari = SFSafariViewController(url: mUrl!)
        //展示视图
        present(safari, animated: true,completion: nil)
    }
    
    
}

示例图