Swift - 使用UIView给页面添加4×4方格

1，下面是一个利用UIView来给页面上绘制灰色方块的例子，效果图如下：

  

代码如下：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52

import UIKit   class ViewController: UIViewController {       //游戏方格维度     var dimension:Int = 4       //数字格子的宽度     var width:CGFloat = 50     //格子与格子的间距     var padding:CGFloat = 6           //保存背景图数据     var backgrounds:Array<UIView>!           override func viewDidLoad()     {         super.viewDidLoad()         self.backgrounds = Array<UIView>()         //改成主视图背景白色背景         self.view.backgroundColor = UIColor.whiteColor()         setupGameMap()     }           func setupGameMap()     {         var x:CGFloat = 50         var y:CGFloat = 150                   for i in 0..<dimension         {             println(i)             y = 150             for j in 0..<dimension             {                 //初始化视图                 var background = UIView(frame:CGRectMake(x, y, width, width))                 background.backgroundColor = UIColor.darkGrayColor()                 self.view.addSubview(background)                 //将视图保存起来，以备后用                 backgrounds.append(background)                 y += padding + width             }             x += padding+width         }     }       override func didReceiveMemoryWarning() {         super.didReceiveMemoryWarning()         // Dispose of any resources that can be recreated.     } }

2，进阶版 - 继承UIView实现自定义方块组件（有颜色和数字）

  

方块组件：TileView.swift

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46

import UIKit class TileView:UIView{           //颜色映射表，不同的数字颜色不同     let colorMap = [         2:UIColor.redColor(),         4:UIColor.orangeColor(),         8:UIColor.yellowColor(),         16: UIColor.greenColor(),         32:UIColor.brownColor(),         64:UIColor.blueColor(),         128:UIColor.purpleColor(),         256:UIColor.cyanColor(),         512:UIColor.lightGrayColor(),         1024:UIColor.magentaColor(),         2048:UIColor.blackColor()     ]           //在设置值时，更新视图的背景和文字     var value:Int = 0{         didSet{             backgroundColor = colorMap[value]             numberLabel.text="\(value)"         }     }           var numberLabel:UILabel!     //初始化视图     init(pos:CGPoint, width:CGFloat, value:Int)     {         numberLabel = UILabel(frame:CGRectMake(0,0, width, width))         numberLabel.textColor = UIColor.whiteColor()         numberLabel.textAlignment = NSTextAlignment.Center         numberLabel.minimumScaleFactor = 0.5         numberLabel.font = UIFont(name:"微软雅黑", size:20)         numberLabel.text = "\(value)"         super.init(frame:CGRectMake(pos.x, pos.y, width, width))         addSubview(numberLabel)         self.value = value         backgroundColor = colorMap[value]     }           required init(coder aDecoder: NSCoder) {         super.init(coder : aDecoder)     } }

使用：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51

import UIKit   class ViewController: UIViewController {       //游戏方格维度     var dimension:Int = 4     //数字格子的宽度     var width:CGFloat = 50     //格子与格子的间距     var padding:CGFloat = 6     //保存背景图数据     var backgrounds:Array<TileView>!       override func viewDidLoad()     {         super.viewDidLoad()         self.backgrounds = Array<TileView>()         //改成主视图背景白色背景         self.view.backgroundColor = UIColor.whiteColor()         setupGameMap()     }           func setupGameMap()     {         var x:CGFloat = 50         var y:CGFloat = 150                   for i in 0..<dimension         {             println(i)             y = 150             for j in 0..<dimension             {                 //随机2的1～11次方                 var val:Int = 2<<Int(arc4random_uniform(10))                 //初始化视图                 var background = TileView(pos: CGPoint(x:x,y:y), width: self.width, value: val)                 self.view.addSubview(background)                 //将视图保存起来，以备后用                 backgrounds.append(background)                 y += padding + width             }             x += padding+width         }     }       override func didReceiveMemoryWarning() {         super.didReceiveMemoryWarning()         // Dispose of any resources that can be recreated.     } }