iOS微博显示界面Demo代码分析

1、微博内容数据结构WPStatus

//.h
#import <Foundation/Foundation.h>
//存储微博内容，包括icon路径、微博名字、是否vip，微博内容、图片附录路径
@interface WPStatus : NSObject
@property(nonatomic,copy)NSString* icon;
@property(nonatomic,copy)NSString* name;
@property(nonatomic,assign) BOOL vip;
@property(nonatomic,copy)NSString* text;
@property(nonatomic,copy)NSString* picture;

-(instancetype)initWithDict:(NSDictionary*)dict;
+(instancetype)statusWithDict:(NSDictionary*)dict;
@end

//.m
#import "WPStatus.h"
//使用字典解析获取plist文件内容
@implementation WPStatus

-(instancetype)initWithDict:(NSDictionary *)dict
{
    if (self = [super init])
    {
        [self setValuesForKeysWithDictionary:dict];
    }
    return self;
}
+(instancetype)statusWithDict:(NSDictionary *)dict
{
    return [[self alloc] initWithDict:dict];
}
@end

2、每条微博的布局框架

//.h
//设置每一条微博的内容占的框架

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>
@class WPStatus;

@interface WPStatusFrame : NSObject
@property(nonatomic,assign,readonly) CGRect iconF;//icon的位置和尺寸
@property(nonatomic,assign,readonly) CGRect nameF;//微博名字的位置和尺寸
@property(nonatomic,assign,readonly) CGRect vipF;//vip图片的位置和尺寸
@property(nonatomic,assign,readonly) CGRect textF;//微博内容的位置和尺寸
@property(nonatomic,assign,readonly) CGRect pictureF;//附图的位置和尺寸
@property(nonatomic,assign,readonly) CGFloat cellHeight;//本条微博的高度
@property(nonatomic,strong) WPStatus* status;//微博内容的数据类
@end

//.m
#import "WPStatusFrame.h"
#import "WPStatus.h"
@implementation WPStatusFrame

-(void)setStatus:(WPStatus *)status{
    _status=status;
    
    CGFloat padding=10;
    
    //icon的位置和尺寸
    CGFloat iconX=padding;
    CGFloat iconY=padding;
    CGFloat iconW=30;
    CGFloat iconH=30;
    _iconF=CGRectMake(iconX, iconY, iconW, iconH);
    
    //微博用户名的位置和尺寸
    CGFloat nameX=CGRectGetMaxX(_iconF)+padding;
    CGSize nameMaxSize=CGSizeMake(MAXFLOAT, MAXFLOAT);
    NSDictionary *nameAttr=@{NSFontAttributeName:[UIFont systemFontOfSize:14]};
    CGSize nameSize=[self.status.name boundingRectWithSize:nameMaxSize options:NSStringDrawingUsesLineFragmentOrigin attributes:nameAttr context:nil].size;
    CGFloat nameY=iconY+(iconH-nameSize.height)*0.5;//确保用户名位于icon的中间位置
    _nameF=CGRectMake(nameX, nameY, nameSize.width, nameSize.height);
    
    //vip Logo的位置和尺寸
    CGFloat vipX=CGRectGetMaxX(_nameF)+padding;
    CGFloat vipY=nameY;
    CGFloat vipW=14;
    CGFloat vipH=14;
    _vipF=CGRectMake(vipX, vipY, vipW, vipH);
    
    //微博正文的位置和尺寸
    CGFloat textX=iconX;
    CGFloat textY=CGRectGetMaxY(_iconF)+padding;
    CGSize textMaxSize=CGSizeMake(300, MAXFLOAT);
    NSDictionary *textAttr=@{NSFontAttributeName:[UIFont systemFontOfSize:15]};
    CGSize textSize=[self.status.text boundingRectWithSize:textMaxSize options:NSStringDrawingUsesLineFragmentOrigin attributes:textAttr context:nil].size;
    _textF=CGRectMake(textX, textY, textSize.width, textSize.height);
    
    //如果有附图
    if (self.status.picture) {
        //附图的位置和尺寸
        CGFloat pictureX=textX;
        CGFloat pictureY=CGRectGetMaxY(_textF)+padding;
        CGFloat pictureW=100;
        CGFloat pictureH=100;
        _pictureF=CGRectMake(pictureX, pictureY, pictureW, pictureH);
        
        _cellHeight=CGRectGetMaxY(_pictureF)+padding;
    }else{
        _cellHeight=CGRectGetMaxY(_textF)+padding;
    }
}

@end

3、TableViewCell

//.h
#import <UIKit/UIKit.h>
#import "WPStatusFrame.h"
//TableView的Cell，即一条微博的布局
@interface WPTableViewCell : UITableViewCell
@property(nonatomic,strong)WPStatusFrame* statusFrame;
+(instancetype)cellWithTableView:(UITableView*)tableView;
@end

//.m
#import "WPTableViewCell.h"
#import "WPStatus.h"
//icon、用户名、vip、微博正文、附图
@interface WPTableViewCell()
@property(nonatomic,weak) UIImageView* iconView;
@property(nonatomic,weak) UILabel* nameView;
@property(nonatomic,weak) UIImageView* vipView;
@property(nonatomic,weak) UILabel* textView;
@property(nonatomic,weak) UIImageView* pictureView;
@end

@implementation WPTableViewCell

-(instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
    if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier])
    {
        //icon，plist中获取
        UIImageView *iconView = [[UIImageView alloc] init];
        [self.contentView addSubview:iconView];
        self.iconView = iconView;
        
        //用户名，plist中获取
        UILabel* nameView = [[UILabel alloc] init];
        nameView.font = [UIFont systemFontOfSize:14];
        [self.contentView addSubview:nameView];
        self.nameView = nameView;
        
        //vip，直接获取
        UIImageView* vipView = [[UIImageView alloc] init];
        vipView.image = [UIImage imageNamed:@"vip"];
        [self.contentView addSubview:vipView];
        self.vipView = vipView;
        
        //微博正文，plist中获取
        UILabel* textView = [[UILabel alloc] init];
        textView.font = [UIFont systemFontOfSize:15];
        textView.numberOfLines = 0;
        [self.contentView addSubview:textView];
        self.textView = textView;
        
        //附图，plist中获取
        UIImageView* pictureView = [[UIImageView alloc] init];
        [self.contentView addSubview:pictureView];
        self.pictureView = pictureView;
    }
    return self;
}

+(instancetype)cellWithTableView:(UITableView *)tableView
{
    static NSString* ID = @"status";
    WPTableViewCell* cell = [tableView dequeueReusableCellWithIdentifier:ID];
    if (cell == nil)
    {
        cell = [[WPTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:ID];
    }
    return cell;
}

//设置微博框架
-(void)setStatusFrame:(WPStatusFrame *)statusFrame
{
    _statusFrame = statusFrame;
    [self settingData];
    [self settingFrame];
}

//设置微博内容
-(void)settingData
{
    WPStatus* status = self.statusFrame.status;
    self.iconView.image = [UIImage imageNamed:status.icon];
    self.nameView.text = status.name;
    if (status.vip)
    {
        self.vipView.hidden = NO;
    }else{
        self.vipView.hidden = YES;
    }
    self.textView.text = status.text;
    if (status.picture)
    {
        self.pictureView.hidden = NO;
        self.pictureView.image = [UIImage imageNamed:status.picture];
    }else{
        self.pictureView.hidden = YES;
    }
}

//设置布局
-(void)settingFrame
{
    self.iconView.frame = self.statusFrame.iconF;
    self.nameView.frame = self.statusFrame.nameF;
    if (self.statusFrame.status.vip)
    {
        self.vipView.frame = self.statusFrame.vipF;
    }
    self.textView.frame = self.statusFrame.textF;
    if (self.statusFrame.status.picture)
    {
        self.pictureView.frame = self.statusFrame.pictureF;
    }
}

4、ViewController，继承自UITableViewController

//.h
#import <UIKit/UIKit.h>

@interface ViewController : UITableViewController

@end

//.m
#import "ViewController.h"
#import "WPStatus.h"
#import "WPStatusFrame.h"
#import "WPTableViewCell.h"

@interface ViewController ()
@property(nonatomic,strong)NSArray* statusFrames;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
}

-(BOOL)prefersStatusBarHidden
{
    return YES;
}
//tableCell个数
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return self.statusFrames.count;
}
//①调用WPTableViewCell的setStatusFrame方法，设置每条微博的内容与布局
-(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    WPTableViewCell* cell = [WPTableViewCell cellWithTableView:tableView];
    cell.statusFrame = self.statusFrames[indexPath.row];//①
    return cell;
}
//设置每条cell的高度
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    WPStatusFrame* statusFrame = self.statusFrames[indexPath.row];
    return statusFrame.cellHeight;
}

-(NSArray*)statusFrames
{
    if (_statusFrames == nil)
    {
        NSString* path = [[NSBundle mainBundle]pathForResource:@"statuses.plist" ofType:nil];
        NSArray* statusArray = [NSArray arrayWithContentsOfFile:path];
        NSMutableArray* muArray = [[NSMutableArray alloc] init];
        for (NSDictionary* dict in statusArray)
        {
            WPStatus* status = [WPStatus statusWithDict:dict];
            WPStatusFrame* statusFrame = [[WPStatusFrame alloc] init];
            statusFrame.status = status;
            [muArray addObject:statusFrame];
        }
        _statusFrames = muArray;
    }
    return _statusFrames;
}
@end