UIImageView和UIButton按鈕

UI第三天

UIImageView圖片

UIImageView它是繼承UIView的所以它有UIView的屬性和方法

創建一個放圖片的框框

//創建UIImageView對象
        let imageView = UIImageView.init(frame: CGRectMake(100, 100, 300, 600))
        //添加到視圖
        self.view.addSubview(imageView)
        //設置背景色
        imageView.backgroundColor = UIColor.greenColor()

添加圖片有兩種方式
比較通過圖片名和通過圖片地址創建圖片對象的兩種方法
(1)通過圖片名創建圖片對象在程序結束后才會被銷毀,只會創建一次;通過圖片地址創建的對象是在當前圖片對象不再使用的時候就銷毀
(2)使用圖片名創建圖片的情況,創建小圖標的時候,在工程會重復使用的圖片
(3)使用圖片地址創建圖片的時候,不會頻繁出現在多個界面的大圖


 //1. 如果圖片的格式是png,圖片后綴可以省略,但是其他格式不能省
        imageView.image = UIImage.init(named: "luffy.jpg")
        //通過圖片路徑去創建一個圖片對象
        //將文件(除了swift文件)放到工程中,實質是放到了當前應用程序的包文件中
        //想要拿到工程中的圖片路徑先要獲取包文件
        //拿到包中的指定文件
        let imagePath = NSBundle.mainBundle().pathForResource("luffy", ofType: "jpg")
        imageView.image = UIImage.init(contentsOfFile: imagePath!)
        //圖片和框的位置,可以填滿可以在最頂可以在最底
        imageView.contentMode = .ScaleToFill

創建一個播放幀動畫的方式

var imageView = UIImageView()
func creatImageView(){
        
        //1.創建一個UIImageView對象
        //通過圖片去創建一個imageView
        //直接創建不用那個框了
         imageView = UIImageView.init(image: UIImage.init(named:"DOVE 1.png"))
        //2.顯示在界面上
        self.view.addSubview(imageView)
        //3.使用UIImageView播放幀動畫
        //a.設置幀動畫數組
        //通過for循環創建18張圖片
        var imageArray = [UIImage]()
        for item in 1...18{
            //拼接圖片名
            let imageName = "DOVE \(item).png"
            //創建對應的圖片
            let image = UIImage.init(named: imageName)
            imageArray.append(image!)
        }
        imageView.animationImages = imageArray
        //設置動畫時間,單位秒
        imageView.animationDuration = 1
        //動畫執行的次數
        //imageView.animationRepeatCount = 10
        //開始動畫
        imageView.startAnimating()
        //imageView.stopAnimating()
        //設置動畫重復次數
    }

時間控制器刷新頁面來讓圖片在整個頁面運動

var timer:NSTimer!
//創建一個定時器并且自動開啟
        //參數1:定時時間
        //參數2:調用方法的對象
        //參數3:存儲定時時間到了需要調用的方法
        //參數4:給當前的NStimer的userInfo屬性賦值
        //參數5:是否重復
        //功能:每隔0.1秒,self去調用一次timerAction的方法
    timer = NSTimer.scheduledTimerWithTimeInterval(0.1, target: self, selector: "timerAction:", userInfo: nil, repeats: true)
    func timerAction(timer:NSTimer) {
        //print("定時器到時")
        //每刷新一次圖片的frame里面X右移動
        self.imageView.frame.origin.x += 10
        //判斷小鳥是否飛到了屏幕邊緣
        if self.imageView.frame.origin.x >= self.view.bounds.width - self.imageView.bounds.width{
            //暫停定時器
            timer.fireDate = NSDate.distantFuture()
            //讓定時器繼續
            //timer.fireDate = NSDate.distantPast()
        }
    }

UIButton按鈕

UIButton:UIcontrol:UIView
按鈕也是繼承了UIView的所以他也可以使用UIView的屬性
從UIView哪里繼承的屬性創建了按鈕沒啥卵用

let titleBtn = UIButton.init(frame: CGRectMake(100, 100, 60, 25))
        self.view.addSubview(titleBtn)
        titleBtn.backgroundColor = UIColor.grayColor()

在按鈕上添加文字

//設置按鈕上顯示的文字
        //參數1:想要在按鈕上顯示的文字
        //參數2:按鈕狀態 .Normal->正常狀態 .Highlighted->被點擊沒彈起的狀態 .Selected->選中狀態 .Disabled ->不可用狀態(不能被點擊)
        titleBtn.setTitle("正常", forState: .Normal)
        titleBtn.setTitle("高亮", forState: .Highlighted)
        //設置當前按鈕是否被選中 默認為false
        titleBtn.selected = false
        titleBtn.setTitle("選中", forState: .Selected)
        //設置按鈕可不可用 默認為true
        titleBtn.enabled = true
        titleBtn.setTitle("不可用", forState: .Disabled)
        
        //設置文字顏色
        titleBtn.setTitleColor(UIColor.redColor(), forState: .Normal)
        titleBtn.setTitleColor(UIColor.greenColor(), forState: .Highlighted)
        //按鈕上的文字和文字顏色,必須通過對應的set方法去根據狀態去設置。其他和文字相關屬性可以通過titleLable去設置
        //設置按鈕上的字體
        titleBtn.titleLabel?.font = UIFont.systemFontOfSize(19)
        //設置安妞上文字的對齊方式
        titleBtn.titleLabel?.textAlignment = .Right

在按鈕上添加圖片

let  imageBtn = UIButton.init(frame: CGRectMake(100, 200, 100, 100))
        self.view.addSubview(imageBtn)
        //參數一:圖片
        //參數二:狀態
        imageBtn.setImage(UIImage.init(named: "DOVE 1"), forState: .Normal)
       // imageBtn.setImage(UIImage.init(named: "back2.jpg"), forState: .Highlighted)

圖片和文字都顯示在按鈕上但是默認的是圖片在左文字在右邊

let Btn1  = UIButton.init(frame: CGRectMake(150, 400, 200, 100))
        self.view.addSubview(Btn1)
        //同時設置title屬性和image屬性
        //顯示圖片在左文字在右
        Btn1.setTitle("標題", forState: .Normal)
        Btn1.setTitleColor(UIColor.redColor(), forState: .Normal)
        //是沒有辦法在這里讓按鈕上的文字居中的
        Btn1.titleLabel?.textAlignment = .Center
        //設置背景圖片
        Btn1.setBackgroundImage(UIImage.init(named: "luffy.jpg"), forState: .Normal)
        Btn1.setImage(UIImage.init(named: "DOVE 1"), forState: .Normal)

自定義圖片和文字的位置

首先創建一個類(這個類是繼承UIButton)去計算文字和圖片在按鈕的具體哪個位置,然后我們創建按鈕的時候,就直接用這個類創建

class YTButton: UIButton {
    //圖片高度是整個高度的五分之四
    //文字的高度是整個高度的為分之一
    
    //設置BUtton上的坐標和功能
    //參數1:當前按鈕的范圍(只需要大小)
    //返回值:重新設置的圖片的坐標和大小
    //這是圖片和按鈕位置的計算方法
    override func imageRectForContentRect(contentRect: CGRect) -> CGRect {
        let x:CGFloat = 0
        let y:CGFloat = 0
        let w:CGFloat = contentRect.size.width
        let h:CGFloat = contentRect.size.height/5*4
        return CGRectMake(x, y, w, h)
    }
    
    //設置BUtton上的坐標和功能
    //參數1:當前按鈕的范圍(只需要大小)
    //返回值:重新設置的圖片的坐標和大小
    //這是文字和按鈕位置的計算方法
    override func titleRectForContentRect(contentRect: CGRect) -> CGRect {
        let x:CGFloat = 0
        let y:CGFloat = contentRect.size.height/5*4
        let w:CGFloat = contentRect.size.width
        let h:CGFloat = contentRect.size.height/5
        return CGRectMake(x, y, w, h)
        
    }
//實現這個自定義的按鈕
override func viewDidLoad() {
        super.viewDidLoad()
        //用自定義的類創建一個按鈕
        let Btn = YTButton(frame:CGRectMake(100,100,20,20))
        //在按鈕上添加文字
        Btn.setTitle("文字", forState: .Normal)
        //設置文字的顏色
        Btn.setTitleColor(UIColor.redColor(), forState: .Normal)
        //設置文字的位置
        Btn.titleLabel?.textAlignment = .Center
        //在按鈕上添加圖片
        Btn.setImage(UIImage.init(named: "luffy1"), forState: .Normal)
        //把按鈕添加到視圖上
        self.view.addSubview(Btn)
        //給按鈕添加事件
        Btn.addTarget(self, action: "btnAction", forControlEvents: .TouchDown)
        
    }
    func btnAction(){
        print("點了一下")
    }
}

給按鈕添加時間,這個是主要的

        //參數1:調用方法的對象
        //參數2:指定事件發生后參數1要去調用的方法(可以不帶參,如果帶參只能帶一個UIButton類型)
        //參數3:事件 
        //.TouchDown->按下事件
        //功能:當按鈕被按得時候,self會去調用btnAction方法
        //.TouchUpInside->按下彈起會調用
        //當按鈕被按下彈起來的時候self會去調用btnAction方法
        titleBtn.addTarget(self, action: "btnAction:", forControlEvents: .TouchDown)
        //按鈕點擊
        //這里實現的是給按鈕一個隨機背景色
    func btnAction(btn:UIButton){
        btn.backgroundColor = UIColor.init(red:CGFloat(Double  (arc4random_uniform(255)+1)/255), green:CGFloat( Double(arc4random_uniform(255)+1)/255), blue: CGFloat( Double(arc4random_uniform(255)+1)/255), alpha: 1)
    }

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 發現 關注 消息 iOS 第三方庫、插件、知名博客總結 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 12,245評論 4 61
  • 21
    暢哥哥呀閱讀 151評論 0 4
  • 最近小丸子在看一些前端方面的書籍,推薦一些給大家,大家一起學習,一起進步,有很多網站可以下載到這些書籍,大家可以自...
    櫻桃小丸子兒閱讀 7,126評論 55 407
  • 和大家分享我學PPT過程中的一些心得與體會吧。 一、背景介紹 ?一名二本普通學校大三理科生,從來沒有接觸過設計這一...
    偉崇PPT閱讀 777評論 3 6