Swift开发iOS--仿微信朋友圈(2)--搭建整体框架
像朋友圈里的状态数据,一般是从服务器的接口返回的数据,所以本例中,使用数组模拟服务器返回的json数据。先看一下完整的数组。
var dataItem = [
[
"name":"胖大海",
"avator":"22",
"content":"航班延误,泰国机场工作人员强行驱赶中国游客,中国游客集体唱起了国歌。这次事件,不是泰国对我们游客不尊重,而且不把中国放在眼里。UC优视科技 用户研究与体验设计中心(简称RED设计中心),接受投稿和应聘,请私信!UC优视科技 用户研究与体验设计中心(简称RED设计中心),接受投稿和应聘,请私信!UC优视科技 用户研究与体验设计中心(简称RED设计中心),接受投稿和应聘,请私信!UC优视科技 用户研究与体验设计中心(简称RED设计中心),接受投稿和应聘,请私信!UC优视科技 用户研究与体验设计中心(简称RED设计中心),接受投稿和应聘,请私信!UC优视科技 用户研究与体验设计中心(简称RED设计中心),接受投稿和应聘,请私信!UC优视科技 用户研究与体验设计中心(简称RED设计中心),接受投稿和应聘,请私信!",
"imageUrls":[
"http://ww2.sinaimg.cn/thumb150/9e428bc1gw1eiv7pev1osj2050050wei.jpg",
"http://image.tianjimedia.com/uploadImages/2012/236/878HE0W687U6.jpg",
"http://img3.3lian.com/2013/c2/66/d/81.jpg",
"http://pic2.ooopic.com/12/32/24/38bOOOPIC6f_1024.jpg",
"http://img1.3lian.com/2015/w7/85/d/6.jpg",
"http://pic38.nipic.com/20140217/10361790_010857615000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://img3.3lian.com/2013/c2/66/d/81.jpg"
]
],
[
"name":"Park",
"avator":"22",
"content":"UC优视科技 用户研究与体验设计中心(简称RED设计中心),接受投稿和应聘,请私信!",
"imageUrls":[
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://img3.3lian.com/2013/c2/66/d/81.jpg"
]
],
[
"name":"Tom",
"avator":"22",
"content":"一个普通程序员,独立思考者。不惧权威,尊重知识,热爱生活。",
"imageUrls":[
"http://img1.3lian.com/2015/w7/85/d/6.jpg",
"http://pic38.nipic.com/20140217/10361790_010857615000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://img3.3lian.com/2013/c2/66/d/81.jpg"
]
],
[
"name":"Jerry",
"avator":"22",
"content":"国际体验设计协会(IXDC)是由20多家中国知名公司和大学联合支持在2010成立的非盈利机构。向社会推广体验创新价值的理念是首要职责,搭建展示和交流的国际平台是重要任务。工作宗旨在于: 一、提倡应用体验设计为企业和社会创造价值。 二、推广和表扬杰出的体验设计及人物。 三、教育相关的专业人员和社会大众,提升其专业能力与创新思维。",
"imageUrls":[
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://img3.3lian.com/2013/c2/66/d/81.jpg"
]
],
[
"name":"Jet",
"avator":"22",
"content":"包子带着爷爷天天出门找狐球",
"imageUrls":[
"http://img3.3lian.com/2013/c2/66/d/81.jpg",
"http://pic2.ooopic.com/12/32/24/38bOOOPIC6f_1024.jpg",
"http://img1.3lian.com/2015/w7/85/d/6.jpg",
"http://pic38.nipic.com/20140217/10361790_010857615000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://img3.3lian.com/2013/c2/66/d/81.jpg"
]
],
[
"name":"Jark",
"avator":"22",
"content":"筋筋就是这么可爱!",
"imageUrls":[
"http://img3.3lian.com/2013/c2/66/d/81.jpg",
"http://pic2.ooopic.com/12/32/24/38bOOOPIC6f_1024.jpg",
"http://img1.3lian.com/2015/w7/85/d/6.jpg",
"http://pic38.nipic.com/20140217/10361790_010857615000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://img3.3lian.com/2013/c2/66/d/81.jpg"
]
],
[
"name":"李林",
"avator":"22",
"content":"潺晓才不是知识咨询洞呢哼",
"imageUrls":[
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://img3.3lian.com/2013/c2/66/d/81.jpg"
]
],
[
"name":"王",
"avator":"22",
"content":"相信大家在看完第六话之后都被黑猫酱的表白给萌住了吧。。。那么到现在为止~大家是支持黑猫还是桐乃呢~???每周六记得关注更新噢~",
"imageUrls":[
"http://pic73.nipic.com/file/20150724/21321671_195726581000_2.jpg",
"http://img3.3lian.com/2013/c2/66/d/81.jpg"
]
]
]
数据源说明:
name:名字
avator:头像图片
content:朋友圈文字
imageUrls:朋友圈图片数组
可能有些同学看到数据源会感到头疼,没关系,我会在以后的文章中从0开始写这些数据源,接下来我们来搭建第一步所需要的文件。
一、Xcode版本
由于Swift3.0还没有正式发布,所以我们先使用swift2.0+,所以使用Xcode版本为7.3.
二、新建.swift文件
打开Xcode选择新建项目,语言为Swift,在我做项目的过程中,喜欢使用SB与代码相结合的方式编码,一些简单的TabView,用SB创建非常快,但有些布局用SB就比较麻烦,所以我使用代码布局,在本例中我使用代码布局主视图,使用SB新建几个视图控制器。建好工程后,新建一个tableview文件继承ViewController,作为主视图;然后新建一个tableviewcell文件继承UITableViewCell,作为cell文件。在SB中新建一个viewcontroller 然后关联第一个TableviewController。
Paste_Image.png然后在SB中为ViewController添加导航控制器。
Paste_Image.png这样基本的文件就搭建好了。我将会在后面的文章中继续讲微信朋友圈布局。效果展示,如果需要源码或有问题的私信我即可。
网友评论