刚转行iOS的搬砖工人，在此记录下这条路上的点点滴滴，共勉
效果图：
QQ-好友动态
分析：
其实这个页面就是一个UITableView，但是在tableView的最上方添加了一插入了一张图片，所以看起来很有逼格。
So问题来了，这个效果怎么实现呢？
实现：
首先，新建一个工程，将.h文件的继承从UIViewController改成UITableViewController：
@interface ViewController : UITableViewController
接着，删除storyboard中原来的ViewController，添加一个TableViewController，在属性项中勾选上Is Initial View Controller（即启动程序后进入这个表视图）：
重新添加一个UITableViewController
然后，这里节省点时间，就直接在故事版中添加数据，选中的表视图的cell，添加标识符（Identifier）为，我这里命名的cell；再加入一个label，内容随便写：
在故事版中添加cell的内容
回到.m文件中，写入UITableView最基本的2个方法：
//要显示的行数
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return 10;
}
// 返回指定的row的cell（即在故事版中编辑的cell的内容）
-(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
UITableViewCell *cell =[tableView dequeueReusableCellWithIdentifier:@"cell"];
return cell;
}
最关键的来了（前面的都是废话，这里才是主题）：
新建一个方法myCustomImage（英语不好，轻喷），用来实现QQ好友动态最上方的背景图片的效果：
//自定义的方法，表视图最上方的添加一张图片的效果
- (void)myCustomImage{
//设置要显示的图片
UIImageView *customImageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"bg"]];
//图片位置大小
customImageView.frame = CGRectMake(0, 0, _table.frame.size.width,0);
//图片填充方式（很关键的地方。填充方式很多种，有兴趣的可以去了解下contentMode这个属性）
customImageView.contentMode = UIViewContentModeBottom;
//自动调整滚动视图的插图
self.automaticallyAdjustsScrollViewInsets = YES;
//显示在tableView上
_table.tableHeaderView = customImageView;
//出现位置（即我们看到的多少。第一个参数越大，即图片出现的位置越往下，我们看到的图片内容越多）
_table.contentInset = UIEdgeInsetsMake(200, 0, 0, 0);
}
运行效果：
启动后界面
下拉效果：
进行下拉操作
完整代码：
#import "ViewController.h"
@interface ViewController ()
@property (strong, nonatomic) IBOutlet UITableView *table;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
self.tableView.delegate = self;
self.tableView.dataSource = self;
//调用myCustomImage方法
[self myCustomImage];
//刷新tableView
[self.tableView reloadData];
}
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return 10;
}
-(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
UITableViewCell *cell =[tableView dequeueReusableCellWithIdentifier:@"cell"];
return cell;
}
- (void)myCustomImage{
//设置要显示的图片
UIImageView *customImageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"bg"]];
//图片位置大小
customImageView.frame = CGRectMake(0, 0, _table.frame.size.width,0);
//图片填充方式（很关键的地方。填充方式很多种，有兴趣的可以去了解下contentMode这个属性）
customImageView.contentMode = UIViewContentModeBottom;
//自动调整滚动视图的插图
self.automaticallyAdjustsScrollViewInsets = YES;
//显示在tableView上
_table.tableHeaderView = customImageView;
//出现位置（即我们看到的多少。第一个参数越大，即图片出现的位置越往下，我们看到的图片内容越多）
_table.contentInset = UIEdgeInsetsMake(200, 0, 0, 0);
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end
PS：感觉写的有点马虎了，也不知道有没有人看。但是坚持写下去吧，要对自己负责。
网友评论