[IOS 开发] TableView、多个TableViewCell、自定义Cell、Cell上画画(故事板+代码方式)

第一步:

//UserTableViewCell.h这里定义第一种Cell
#import <UIKit/UIKit.h>
@interface UserTableViewCell : UITableViewCell
@property (weak, nonatomic) IBOutlet UIImageView *userviewcellicon;
@property (weak, nonatomic) IBOutlet UILabel *userviewcellname;
@end
//UserTableViewCell2.h这里定义第二种Cell,
#import <UIKit/UIKit.h>
@interface UserTableViewCell2 : UITableViewCell
@property (weak, nonatomic) IBOutlet UILabel *name;
@property (weak, nonatomic) IBOutlet UIImageView *userviewcell2image;
@end

故事板里的TableView和Cell的class和Cell的Identifier就不说了

2、设计好了这些东西后,开始进TableViewController里了:
//UserTableViewController.h
#import <UIKit/UIKit.h>

@interface UserTableViewController : UITableViewController

@property(nonatomic,strong) NSDictionary *UserViewCellDic;
@property (nonatomic, strong) NSArray *listGroupname;
@end
//UserTableViewController.m
#import “UserTableViewController.h“
#import “UserTableViewCell.h“
#import “UserTableViewCell2.h“
@interface UserTableViewController ()

@end

@implementation UserTableViewController

- (void)viewDidLoad
{
[super viewDidLoad];
self.tableView.separatorStyle = UITableViewCellAccessoryNone;//去除分割线
NSBundle *bundle = [NSBundle mainBundle];
NSString *plistpath = [bundle pathForResource:@”UserViewCell“ ofType:@”plist“];
self.UserViewCellDic = [[NSDictionary alloc]initWithContentsOfFile:plistpath];
self.listGroupname = [self.UserViewCellDic allKeys];
  
self.listGroupname = [self.listGroupname sortedArrayUsingSelector:@selector(compare:)];//排序
}

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView//返回有几个Section
{

return [self.listGroupname count];
}

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section//Section头名字设为空
{

NSString *groupName = @” “;
return groupName;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section//每个section的行数
{

NSString *groupName = [self.listGroupname objectAtIndex:section];
NSArray *listitem = [self.UserViewCellDic objectForKey:groupName];
return [listitem count];

}
#pragma mark – TableViewDataSource

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{

static NSString *UserViewCellIdentifier = @”UserTableViewCell“;
static NSString *UserViewCellIdentifier2 = @”UserTableViewCell2“;
NSUInteger section = [indexPath section];
NSUInteger row = [indexPath row];
NSString *groupName = [self.listGroupname objectAtIndex:section];
NSArray *listitem = [self.UserViewCellDic objectForKey:groupName];
NSDictionary *rowDict = [listitem objectAtIndex:row];

if (0 == section) {
UserTableViewCell2 *cell = [tableView dequeueReusableCellWithIdentifier:UserViewCellIdentifier2];
cell.name.text = [rowDict objectForKey:@”name“];
NSString *imagePath = [rowDict objectForKey:@”image“];
imagePath = [imagePath stringByAppendingString:@”.png“];
cell.userviewcell2image.image = [UIImage imageNamed:imagePath];
cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;//最后的箭头
//画线
UIView *view = [[UIView alloc]initWithFrame:CGRectMake(0, 79, 320, 1)];
UIView *leftview = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 3, 80)];
UIView *rightview = [[UIView alloc]initWithFrame:CGRectMake(317, 0, 3, 80)];
view.backgroundColor = [UIColor colorWithRed:43/255.0f green:43/255.0f blue:233/255.0f alpha:1];
leftview.backgroundColor = [UIColor colorWithRed:43/255.0f green:43/255.0f blue:233/255.0f alpha:1];
rightview.backgroundColor = [UIColor colorWithRed:43/255.0f green:43/255.0f blue:233/255.0f alpha:1];
[cell.contentView addSubview:view];
[cell.contentView addSubview:leftview];
[cell.contentView addSubview:rightview];

return cell;
}else{
UserTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:UserViewCellIdentifier];
cell.userviewcellname.text = [rowDict objectForKey:@”name“];
NSString *imagePath = [rowDict objectForKey:@”image“];
imagePath = [imagePath stringByAppendingString:@”.png“];
cell.userviewcellicon.image = [UIImage imageNamed:imagePath];
cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;//最后的箭头
//画线
UIView *view = [[UIView alloc]initWithFrame:CGRectMake(0, 39, 320, 1)];
UIView *leftview = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 3, 40)];
UIView *rightview = [[UIView alloc]initWithFrame:CGRectMake(317, 0, 3, 40)];
view.backgroundColor = [UIColor colorWithRed:43/255.0f green:43/255.0f blue:233/255.0f alpha:1];
//alpha是透明度
leftview.backgroundColor = [UIColor colorWithRed:43/255.0f green:43/255.0f blue:233/255.0f alpha:0.3];
rightview.backgroundColor = [UIColor colorWithRed:43/255.0f green:43/255.0f blue:233/255.0f alpha:1];
[cell.contentView addSubview:view];
[cell.contentView addSubview:leftview];
[cell.contentView addSubview:rightview];

return cell;
}

}

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath//Cell的高度
{
NSUInteger section = [indexPath section];
if (0 == section) {
return 80;
}else{
return 40;
}

}

这里附上Plist文件:

3、运行效果:

时间: 2024-08-05 17:48:24

[IOS 开发] TableView、多个TableViewCell、自定义Cell、Cell上画画(故事板+代码方式)的相关文章

IOS开发之TableView、多个TableViewCell、自定义Cell、Cell上画画(故事板+代码方式)

最近要做一个项目,有个账户设置界面,看了微博.微信.QQ,他们的账号设置都比较原生态没做什么处理.春雨医生的账号不错,做了许多处理.不说废话直接上代码. 第一步: //UserTableViewCell.h这里定义第一种Cell #import <UIKit/UIKit.h> @interface UserTableViewCell : UITableViewCell @property (weak, nonatomic) IBOutlet UIImageView *userviewcelli

IOS开发系列--TableView、多个TableViewCell、自定义Cell、Cell上画画(故事板+代码方式),ios7tableview索引

在此之前,我们已经创建了一个通过简单的表视图应用程序并显示预定义的图像.在本教程中,我们将继续努力,使应用程序变得更好,: >不同的行显示不同的图像 - 上个教程,我们的所有行显示相同的缩略图.那么不同的食物显示不同的图片不是更好么? >自定义视图单元-我们将展示我们自己的视图来替代默认表单元格样式 显示不同缩略图 在我们更改代码之前,让我们回顾显示缩略图的代码. 最后,我们增加了一个行代码指示UITableView每一行显示"creme_brelee.jpg"这张图片.显

iOS开发- TableView不显示没内容的Cell

有时候使用UITableView, 会遇到这样的情况: 底部没内容的cell也显示了.这样分割线很影响显示效果. 简单的加入如下语句: self.tableView.tableFooterView = [[UIView alloc] init]; 加上之后. 效果如下:

iOS开发UI篇—使用xib自定义UItableviewcell实现一个简单的团购应用界面布局

iOS开发UI篇—使用xib自定义UItableviewcell实现一个简单的团购应用界面布局 一.项目文件结构和plist文件 二.实现效果 三.代码示例 1.没有使用配套的类,而是直接使用xib文件控件tag值操作 数据模型部分: YYtg.h文件 // // YYtg.h // 01-团购数据显示(没有配套的类) // // Created by apple on 14-5-29. // Copyright (c) 2014年 itcase. All rights reserved. //

IOS开发UI篇--UITableView的自定义布局==xib布局

利用Xib进行实现 应用场景:像团购网站的列表数据显示,新闻列表显示等(由于该类的显示的数据单元格内容格式相同) (1)主控制器文件,在文件中实现了自己自定义的代理,加载数据, 1 #import "SLViewController.h" 2 #import "SLTgDatas.h" 3 #import "SLTableViewCell.h" 4 #import "SLFooterView.h" 5 #import &quo

IOS开发UI篇--UITableView的自定义布局==纯代码布局

UITableView中除了利用系统的UItableViewCell不能完成需求进行布局时,还可以进行自定义布局: 自定义布局分为两类:(1)利用代码进行创建 (2)利用xib进行实现: 下面对利用代码进行创建分析: 应用场景:像微博,等列表数据展示(由于微博的每个单元格的数据大小不一致,所以得计算每个单元格的大小) 分析:前提是获取列表数据,然后建立每个单元格的模型(建立单元格模型应继承UITableViewCell)复写 - (id)initWithStyle:(UITableViewCel

学习IOS开发UI篇--UITableView/数据模型嵌套/UITableViewCell/Cell的重用

1.UITableView ================================================== UITableView有两种格式:group和plain 2.UITableView如何展示数据 ================================================== UITableView需要一个数据源(dataSource)来显示数据 凡是遵守UITableViewDataSource协议的OC对象,都可以是UITableView的

iOS开发tableView去掉顶部上部空表区域

tableview中的第一个cell 里上部 有空白区域,大概64像素 在viewDidLoad中加入如下代码 self.automaticallyAdjustsScrollViewInsets = NO; 原文地址:iOS开发tableView去掉顶部上部空表区域

ios开发之根据内容行数调整cell 高度,与label高度

设置cell高度 - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { NoticeMessage* msg = [arrayNoticeMessage objectAtIndex:indexPath.section];//取出对应的section或者cell UIFont *msgFont = [UIFont fontWithName:@"arial&qu