圖片展示：
列表展示
目錄結(jié)構(gòu)：
定義兩個模型：qq分組模型和qq好友模型
定義兩個視圖：好友展示的cell，和section的headerView
文件
主要代碼：
模型代碼
class QQFriend:NSObject {
var name:String?
var icon:String?
var intro:String?
var vip:NSNumber?
init(dic:NSDictionary) {
super.init()
self.setValuesForKeysWithDictionary(dic as! [String : AnyObject])
}
}
class QQFriendGroup:NSObject {
var name:String?
var friends:NSArray?
var online:NSNumber?
// 這個變量是控制分組是否打開的，如果打開則設(shè)定展示cell的個數(shù)
var isOpen:Bool? = false
init(withDic dic:NSDictionary) {
super.init()
self.setValuesForKeysWithDictionary(dic as! [String : AnyObject])
let arrayFriend:NSMutableArray = NSMutableArray()
for friendDic in self.friends! {
let friend :QQFriend = QQFriend.init(dic: friendDic as! NSDictionary)
arrayFriend.addObject(friend)
}
self.friends = arrayFriend
}
}
視圖代碼
// 自定義的cell
class QQFriendCell: UITableViewCell {
class func cellWithTableView(tableView:UITableView) -> QQFriendCell {
let cellID = "friend"
var cell = tableView.dequeueReusableCellWithIdentifier(cellID)
if cell == nil {
cell = QQFriendCell.init(style: UITableViewCellStyle.Subtitle, reuseIdentifier: cellID)
}
return cell as! QQFriendCell
}
// 每個cell展示的好友信息
var friendData:QQFriend? {
didSet {
self.imageView?.image = UIImage(named: friendData!.icon!)
self.textLabel?.text = friendData!.name!
self.textLabel?.textColor = friendData!.vip == true ? UIColor.redColor() : UIColor.blackColor()
self.detailTextLabel?.text = friendData!.intro!
}
}
override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
}
override func setSelected(selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
// Configure the view for the selected state
}
}
##// 自定義section的headerView
// 協(xié)議，點(diǎn)擊headerView的回調(diào)
protocol QQHeaderViewDelegate:NSObjectProtocol {
func headerViewDidClickedNameView(headerView:QQHeaderView)
}
class QQHeaderView: UITableViewHeaderFooterView {
weak var delegate:QQHeaderViewDelegate?
// 顯示在線的人數(shù)
var countView:UILabel? = {
let countView:UILabel = UILabel.init()
countView.textAlignment = .Center
countView.textColor = UIColor.grayColor()
return countView
}()
// 好友的姓名
var nameView:UIButton? = {
let nameView = UIButton.init(type: UIButtonType.Custom)
nameView.setBackgroundImage(UIImage(named: "buddy_header_bg"), forState: UIControlState.Normal)
nameView.setBackgroundImage(UIImage(named: "buddy_header_bg_highlighted"), forState: UIControlState.Highlighted)
// 設(shè)定那個group的小角
nameView.setImage(UIImage(named: "buddy_header_arrow"), forState: UIControlState.Normal)
nameView.setTitleColor(UIColor.blackColor(), forState: UIControlState.Normal)
nameView.contentHorizontalAlignment = .Left
nameView.titleEdgeInsets = UIEdgeInsetsMake(0, 10, 0, 0)
nameView.contentEdgeInsets = UIEdgeInsetsMake(0, 10, 0, 0)
nameView.imageView?.contentMode = .Center
nameView.imageView?.clipsToBounds = false
return nameView
}()
// headerView根據(jù)這個group進(jìn)行展示分組信息
var group:QQFriendGroup? {
didSet {
self.nameView?.setTitle(group!.name!, forState: UIControlState.Normal)
self.countView?.text = "\(group!.online!)" + "/" + "\(group!.friends!.count)"
didMoveToSuperview()
}
}
// 返回一個headerView
class func headerViewWithTableView(tableView:UITableView) -> QQHeaderView {
let headerID = "myHeader"
var header = tableView.dequeueReusableHeaderFooterViewWithIdentifier(headerID)
if header == nil {
header = QQHeaderView.init(reuseIdentifier: headerID)
}
return header as! QQHeaderView
}
override init(reuseIdentifier: String?) {
super.init(reuseIdentifier: reuseIdentifier)
self.nameView!.addTarget(self, action: #selector(QQHeaderView.nameClick), forControlEvents: UIControlEvents.TouchUpInside)
self.contentView.addSubview(nameView!)
self.contentView.addSubview(countView!)
}
func nameClick() {
self.group?.isOpen = !self.group!.isOpen!
// 刷新表格
if ((self.delegate?.respondsToSelector(Selector("headerViewDidClickedNameView:"))) != nil) {
self.delegate?.headerViewDidClickedNameView(self)
}
}
// 在父視圖上動哈哈
override func didMoveToSuperview() {
super.didMoveToSuperview()
if self.group!.isOpen == true {
self.nameView?.imageView?.transform = CGAffineTransformMakeRotation(CGFloat( M_PI_2))
}else {
self.nameView?.imageView?.transform = CGAffineTransformMakeRotation(0)
}
}
// 設(shè)置 nameView 和 在線人數(shù)countView 的frame
override func layoutSubviews() {
super.layoutSubviews()
self.nameView?.frame = self.bounds
let countH:CGFloat = self.frame.size.height
let countW:CGFloat = 150
let countY:CGFloat = 0
let countX:CGFloat = self.frame.size.width - 10 - countW
self.countView?.frame = CGRectMake(countX, countY, countW, countH)
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
視圖控制器代碼
class ViewController: UIViewController ,UITableViewDelegate, UITableViewDataSource, QQHeaderViewDelegate{
// 從本地獲取模擬數(shù)據(jù)
lazy var groups:NSArray? = {
let filePath = NSBundle.mainBundle().pathForResource("friends.plist", ofType: nil)
var dicArr:NSArray = NSArray.init(contentsOfFile:filePath!)!
var arr:NSMutableArray = NSMutableArray()
for dic in dicArr {
let group:QQFriendGroup = QQFriendGroup.init(withDic: dic as! NSDictionary)
arr.addObject(group)
}
return arr
}()
var tableView:UITableView!
override func viewDidLoad() {
super.viewDidLoad()
buildTableView()
}
override func prefersStatusBarHidden() -> Bool {
return true
}
// 構(gòu)建tableview
func buildTableView() {
self.tableView = UITableView.init(frame: self.view.bounds, style: UITableViewStyle.Plain)
self.tableView.delegate = self
self.tableView.dataSource = self
self.tableView.rowHeight = 50
self.tableView.sectionHeaderHeight = 44
self.view.addSubview(self.tableView)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
// tableView 代理方法
extension ViewController {
func numberOfSectionsInTableView(tableView: UITableView) -> Int {
return self.groups!.count
}
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
let group:QQFriendGroup = self.groups![section] as! QQFriendGroup
return group.isOpen == true ? group.friends!.count : 0
}
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let cell = QQFriendCell.cellWithTableView(tableView)
let group = self.groups![indexPath.section] as! QQFriendGroup
cell.friendData = group.friends![indexPath.row] as? QQFriend
return cell
}
func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let header:QQHeaderView = QQHeaderView.headerViewWithTableView(tableView)
header.delegate = self
header.group = self.groups![section] as! QQFriendGroup
return header
}
}
// QQ headerView 的代理方法
extension ViewController {
// 每次點(diǎn)擊headerView時，改變group的isOpen參數(shù)，然后刷新tableview，顯示或者隱藏好友信息
func headerViewDidClickedNameView(headerView: QQHeaderView) {
self.tableView.reloadData()
}
}
體會：
1 自定義cell的時候出了錯，返回cell的時候總是提示我為nil錯誤，原來是我在復(fù)用獲得cell的時候把cell強(qiáng)轉(zhuǎn)QQcell時出的錯，改正就是，先從復(fù)用池中獲得一個不管什么類型的cell，如果為nil，就使用我們自己的初始化方法搞出來一個，然后在return的時候強(qiáng)轉(zhuǎn)。
2這個小例子，主要都在headerView這塊，設(shè)置代理，根據(jù)獲得的數(shù)據(jù)改變小三角的指向，點(diǎn)擊更改group的isOpen的狀態(tài)，這些寫好了就能完成這個小demo了。
3在VC中主要就是展示tableview了。
