Swift UI 4X 視圖布局

圖紙
實物
import UIKit

class ViewController: UIViewController {
    
    let W = UIScreen.mainScreen().bounds.width //屏幕寬度
    let H = UIScreen.mainScreen().bounds.height //屏幕高度
    
    let allView = 20 // 全部視圖個數(shù)
    
    let mainViewW:CGFloat = 70   //視圖寬度
    let mainViewH:CGFloat = 100 //視圖高度
    let totalloc = 4 //列數(shù)
    
    override func viewDidLoad() {
        super.viewDidLoad()
        let margin = (W - mainViewW * CGFloat(totalloc))/5 //邊緣
        
        for i in 0..<allView {
            
            let loc = i%totalloc //列數(shù)
            let row = i/totalloc //行數(shù)(1/3=0,2/3=0,3/3=1)
            
            let viewX = margin + (margin + mainViewW) * CGFloat(loc)
            let viewY = margin + (margin + mainViewH) * CGFloat(row)
             
            // 創(chuàng)建主視圖
            let mainView = UIView(frame: CGRect(x: viewX, y: viewY, width: mainViewW, height: mainViewH))
            self.view.addSubview(mainView)
            
            // 添加子視圖
            let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 70, height: 80))
             //imageView.image = UIImage(named: "")
            //imageView.contentMode = UIViewContentMode.ScaleAspectFit
            imageView.backgroundColor = UIColor(red: 126/255, green: 211/255, blue: 33/255, alpha: 1)
            mainView.addSubview(imageView)
            
            // 添加label
            let label = UILabel(frame: CGRect(x: 0, y: 80, width: 70, height: 20))
            label.text = "Label"
            label.textAlignment = .Center
            label.font = UIFont.systemFontOfSize(12)
            label.backgroundColor = UIColor(red: 216/255, green: 211/255, blue: 33/255, alpha: 1)
            mainView.addSubview(label)
        }
    }
如何增加及判斷組件的交互事件:詳情進入——>
最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末限府,一起剝皮案震驚了整個濱河市晒屎,隨后出現(xiàn)的幾起案子裹芝,更是在濱河造成了極大的恐慌构舟,老刑警劉巖,帶你破解...
    沈念sama閱讀 222,681評論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機瞬场,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,205評論 3 399
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來涧郊,“玉大人贯被,你說我怎么就攤上這事∽彼遥” “怎么了刃榨?”我有些...
    開封第一講書人閱讀 169,421評論 0 362
  • 文/不壞的土叔 我叫張陵,是天一觀的道長双仍。 經(jīng)常有香客問我枢希,道長,這世上最難降的妖魔是什么朱沃? 我笑而不...
    開封第一講書人閱讀 60,114評論 1 300
  • 正文 為了忘掉前任苞轿,我火速辦了婚禮,結果婚禮上逗物,老公的妹妹穿的比我還像新娘搬卒。我一直安慰自己,他們只是感情好翎卓,可當我...
    茶點故事閱讀 69,116評論 6 398
  • 文/花漫 我一把揭開白布契邀。 她就那樣靜靜地躺著,像睡著了一般失暴。 火紅的嫁衣襯著肌膚如雪坯门。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,713評論 1 312
  • 那天逗扒,我揣著相機與錄音古戴,去河邊找鬼。 笑死矩肩,一個胖子當著我的面吹牛现恼,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 41,170評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼叉袍,長吁一口氣:“原來是場噩夢啊……” “哼始锚!你這毒婦竟也來了?” 一聲冷哼從身側響起喳逛,我...
    開封第一講書人閱讀 40,116評論 0 277
  • 序言:老撾萬榮一對情侶失蹤疼蛾,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后艺配,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,651評論 1 320
  • 正文 獨居荒郊野嶺守林人離奇死亡衍慎,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,714評論 3 342
  • 正文 我和宋清朗相戀三年转唉,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片稳捆。...
    茶點故事閱讀 40,865評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡赠法,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出乔夯,到底是詐尸還是另有隱情砖织,我是刑警寧澤,帶...
    沈念sama閱讀 36,527評論 5 351
  • 正文 年R本政府宣布末荐,位于F島的核電站侧纯,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏甲脏。R本人自食惡果不足惜眶熬,卻給世界環(huán)境...
    茶點故事閱讀 42,211評論 3 336
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望块请。 院中可真熱鬧娜氏,春花似錦、人聲如沸墩新。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,699評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽海渊。三九已至绵疲,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間臣疑,已是汗流浹背最岗。 一陣腳步聲響...
    開封第一講書人閱讀 33,814評論 1 274
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留朝捆,地道東北人般渡。 一個月前我還...
    沈念sama閱讀 49,299評論 3 379
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親驯用。 傳聞我的和親對象是個殘疾皇子脸秽,可洞房花燭夜當晚...
    茶點故事閱讀 45,870評論 2 361

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,328評論 25 707
  • 發(fā)現(xiàn) 關注 消息 iOS 第三方庫、插件蝴乔、知名博客總結 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 12,124評論 4 61
  • 讀書的目的是什么薇正? 這是首先必須要確定的問題片酝。我們讀書的目的到底是為什么?我們絕大部分人讀的書基本上都是小說挖腰,這從...
    達芬奇X閱讀 248評論 1 0
  • 我曾經(jīng)愛過一個人雕沿,可從來沒有說過,更不敢正眼看過猴仑。 從幼稚園就被“同學”欺負审轮,自己又那么脆弱,只會在背后狠罵辽俗。當那...
    31d084a39701閱讀 752評論 0 0
  • 首先疾渣,說明一下什么是綜攝類比思維法。 這個方法概念是由美國麻省理工大學教授威廉·戈登提出的崖飘。其實生活中的許多的創(chuàng)新...
    未__央閱讀 1,772評論 0 0