IOS開發學習實例之二LOL英雄列表

這個是我做的第二個IOS小實例,比上一個微信消息簡單了不少。但是使用的空間和原理有相似之處。

通過這個小實例的學習, 加深了對UITableView, UITableViewCell 的理解。

同時還了解了如何綁定plist文件中的數據。


先上個成果效果圖:



創建步驟:

1. 拖動一個UITableView進入storyboard

2. 調整它的尺寸爲4寸。拖入Hero.plist文件,並把需要用到的圖片文件夾拖入image.xcassets.

3. 選中左側tableview,單擊右鍵

4. 在彈出的菜單中拖動關聯datasource和delegate 去 ViewController.h。並且在ViewController.m中添加這些協議。

@interface ViewController () <UITableViewDataSource, UITableViewDelegate>

5. 創建Hero類, 創建Hero數據模型

6. 在Hero.h頭文件中,把列表中用到的數據定義成其屬性。

@property (nonatomic, copy) NSString *name;
@property (nonatomic, copy) NSString *intro;
@property (nonatomic, copy) NSString *icon;

-(instancetype)initWithDict:(NSDictionary *)dict;
+(instancetype)heroWithDict:(NSDictionary *)dict;

7. 在Hero.m實施文件中,填寫模型的實現方法

-(instancetype)initWithDict:(NSDictionary *)dict{
    
    if(self = [super init]){
        //way1:
//        self.icon = [dict[@"icon"] copy];
//        self.name = [dict[@"name"] copy];
//        self.intro = [dict[@"intro"] copy];
        //way2:
        [self setValuesForKeysWithDictionary:dict];
    }
    
    return self;
}
//模型實例創建的工廠方法
+ (instancetype)heroWithDict:(NSDictionary *)dict{

    return [[self alloc] initWithDict:dict];
}


8. 在ViewController.m中添加plist文件的讀取方法

//lazy load
- (NSArray *)heros
{
    
    if(!_heros){
        NSString *path = [[NSBundle mainBundle] pathForResource:@"heros" ofType:@"plist"];//使用NSBundle獲取文件路徑
        NSArray *arr = [NSArray arrayWithContentsOfFile:path];//使用文件創建數組
        NSMutableArray *arrm = [NSMutableArray arrayWithCapacity:arr.count];//創建一個可變數組用來接收Hero對象
        
        for (NSDictionary *dict in arr) {
            Hero *hero = [Hero heroWithDict:dict];
            [arrm addObject: hero];
        }
        _heros = [arrm copy];//可變數組的內容拷貝到數組
    }
    
    return _heros;
}

9. 實現UITableViewDataSource中的方法

#pragma mark - UITableViewDataSource
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return self.heros.count;//設置總行數
    
}

//the return defaut value is 1 even the method was not overrided這裏默認返回1,即使不重寫此方法。
//-(NSInteger)tableView:(UITableView *)tableView sectionForSectionIndexTitle:(NSString *)title atIndex:(NSInteger)index
//{
//    return 1;
//}
<span style="font-family: Arial, Helvetica, sans-serif;">//在列表中添加Cell。這裏用到了一個默認格式的Cell。其他場景可以自己製作Cell,並把它添加到這裏</span>
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *identifier = @"heroCell";//定義標示,防止重複使用
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:identifier];
    
    if (!cell) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:identifier];
    }
    //get the model of hero
    Hero *hero = self.heros[indexPath.row];
    cell.textLabel.text = hero.name;
    cell.detailTextLabel.text = hero.intro;
    cell.detailTextLabel.textColor = [UIColor orangeColor];
    cell.imageView.image = [UIImage imageNamed:hero.icon];
    //定義右側小圖標
    cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
    
    return cell;
}

10.在ViewController.m中添加UITableViewDelegate的幾個方法實現

#pragma mark - UITableViewDelegate
//the return value is 44 even the method is commented.
//設置每個Cell的高度。默認是44像素
- (CGFloat) tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return 60;
}
//設置頂部statusbar隱藏
- (BOOL)prefersStatusBarHidden
{
    return YES;
}

11. 完成。



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章