iOS开发的UI制作中动态和静态单元格的基本使用教程

静态单元格的使用
一、实现效果与说明

说明:观察上面的展示效果,可以发现整个界面是由一个tableview来展示的,上面的数据都是固定的,且几乎不会改变。

要完成上面的效果,有几种方法:

(1)可以直接利用代码,返回三组,在判断每组有多少行,展示些什么数据,这样写“死”的代码建议绝不要使用。

(2)稍微灵活一些的,可以把plist文件一懒加载的方式,加载到程序中,动态获取。但是观察界面结构,很容易看出这样需要进行模型嵌套,很麻烦。

(3)storyboard提供了静态单元格这个功能,可以很方便的完成上面的界面展示效果。(提示:在实际的开发中很少这样使用)

二、使用静态单元格完成简单界面展示的过程

在类似的开发中,如果整个界面都是tableview,那么直接让控制器继承自UItableviewcontroller.

修改主控制器,让其继承自UItableviewcontroller

把storyboard中默认的uiview删掉,直接拖一个viewcontroller

当拖入一个viewcontroller的时候,它上面默认就会有一个cell,默认情况下,这个cell是动态的,也就是默认是看不见的。

把cell设置成静态的,在属性面板的content  中设置为static cell(静态cell)所见即所得  注意必须更改这里的这个属性。

让它和主控制器关联

接下来,可以依次设置显示的图片和文字。

设置标题有两种方式:

1是双击更改

2是点击子控件  lable修改

按照界面需要,设置辅助视图

设置有多少组,每组有多少行。
设置组:
点击tableview   设置属性面板的sections属性。

设置每组多少行:

小技巧:如果写的单元格千年不变,那么可以先写一组中的一行,再拷贝,稍作修改即可。
注意:静态单元格是实际开发中,很少用到,此处只当知识点介绍。

在UITableview的应用中使用动态单元格来完成app应用程序管理界面的搭建
一、实现效果

说明:该示例在storyboard中使用动态单元格来完成。

二、实现

1.项目文件结构和plist文件

2.实现过程以及代码

在tableview的属性选择器中选择动态单元格。

说明:在storyboard中直接使用其自带的动态单元格完成tableviewcell的定义,并创建了一个管理该cell的类,进行了连线。

实现代码:

数据模型部分:

YYappInfo.h文件

代码如下:

//
//  YYappInfo.h
//  01-使用动态单元格来完成app应用程序管理界面的搭建
//
//  Created by 孔医己 on 14-6-2.
//  Copyright (c) 2014年 itcast. All rights reserved.
//

#import <Foundation/Foundation.h>

@interface YYappInfo : NSObject
@property(nonatomic,copy)NSString *size;
@property(nonatomic,copy)NSString *download;
@property(nonatomic,copy)NSString *icon;
@property(nonatomic,copy)NSString *name;

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

YYappInfo.m文件

代码如下:

//
//  YYappInfo.m
//  01-使用动态单元格来完成app应用程序管理界面的搭建
//
//  Created by 孔医己 on 14-6-2.
//  Copyright (c) 2014年 itcast. All rights reserved.
//

#import "YYappInfo.h"

@implementation YYappInfo

-(instancetype)initWithDict:(NSDictionary *)dict
{
    if (self=[super init]) {
        //使用KVC
        [self setValuesForKeysWithDictionary:dict];
    }
    return self;
}

+(instancetype)appInfoWithDict:(NSDictionary *)dict
{

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

视图部分

YYappCell.h文件

代码如下:

//
//  YYappCell.h
//  01-使用动态单元格来完成app应用程序管理界面的搭建
//
//  Created by 孔医己 on 14-6-2.
//  Copyright (c) 2014年 itcast. All rights reserved.
//

#import <UIKit/UIKit.h>

@class YYappInfo,YYappCell;

@protocol YYappCellDelegate <NSObject>
-(void)btnDidClick:(YYappCell *)cell;

@end
@interface YYappCell : UITableViewCell

@property(nonatomic,strong)YYappInfo *app;
//@property(nonatomic,strong)YYViewController *controller;
@property(nonatomic,strong)id <YYappCellDelegate> delegate;

@end

YYappCell.m文件

代码如下:

//
//  YYappCell.m
//  01-使用动态单元格来完成app应用程序管理界面的搭建
//
//  Created by 孔医己 on 14-6-2.
//  Copyright (c) 2014年 itcast. All rights reserved.
//

#import "YYappCell.h"
#import "YYappInfo.h"

@interface YYappCell ()
@property (weak, nonatomic) IBOutlet UIImageView *appimg;

@property (weak, nonatomic) IBOutlet UILabel *apptitle;
@property (weak, nonatomic) IBOutlet UILabel *appdownload;
@property (weak, nonatomic) IBOutlet UIButton *appbtn;

@end

代码如下:

@implementation YYappCell

-(void)setApp:(YYappInfo *)app
{
    _app=app;
    self.apptitle.text=_app.name;
    self.appdownload.text=[NSString stringWithFormat:@"大小 %@ | 下载量 %@次",_app.size,_app.download];
    self.appimg.image=[UIImage imageNamed:_app.icon];
   
}

#pragma mark- 完成按钮点击事件

- (IBAction)btnOnclick:(UIButton *)sender
{
    //按钮被点击后,变为不可用状态
    sender.enabled=NO;
   
    //通知代理,完成提示下载已经完成的动画效果
    if ([self.delegate respondsToSelector:@selector(btnDidClick:)]) {
        //一般而言,谁触发就把谁传过去
        [self.delegate  btnDidClick:self];
    }
}

@end

主控制器

YYViewController.m文件

代码如下:

//
//  YYViewController.m
//  01-使用动态单元格来完成app应用程序管理界面的搭建
//
//  Created by 孔医己 on 14-6-2.
//  Copyright (c) 2014年 itcast. All rights reserved.
//

#import "YYViewController.h"
#import "YYappInfo.h"
#import "YYappCell.h"

@interface YYViewController ()<UITableViewDataSource,YYappCellDelegate>
@property(nonatomic,strong)NSArray *apps;
@property (strong, nonatomic) IBOutlet UITableView *tableview;

@end

代码如下:

@implementation YYViewController

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

#pragma mark- 使用懒加载先把plist文件中得数据加载进来
-(NSArray *)apps
{
    if (_apps==Nil) {
        NSString *fullpath=[[NSBundle mainBundle]pathForResource:@"apps_full.plist" ofType:Nil];
        NSArray *arrayM=[NSArray arrayWithContentsOfFile:fullpath];
       
        NSMutableArray *modles=[NSMutableArray arrayWithCapacity:arrayM.count];
        for (NSDictionary *dict in arrayM) {
            YYappInfo *appinfo=[YYappInfo appInfoWithDict:dict];
            [modles addObject:appinfo];
        }
        _apps=[modles copy];
    }
    return _apps;
}

#pragma mark- 设置tableview的数据源方法
//组
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return 1;
}
//行
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return self.apps.count;
}
//组-行-数据
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    //创建cell
    static NSString *identifier=@"app";
    YYappCell *cell=[tableView dequeueReusableCellWithIdentifier:identifier];
    //设置cell的数据
    YYappInfo *appinfo=self.apps[indexPath.row];
    //设置代理
    cell.delegate=self;
    cell.app=appinfo;
    //返回cell
    return cell;
}

#pragma mark- 设置代理
-(void)btnDidClick:(YYappCell *)cell
{
    //取出模型
    YYappInfo *app=cell.app;
    NSLog(@"daili");
    UILabel *lab=[[UILabel alloc]init];
    //提示的显示位置
    lab.frame=CGRectMake(60, 300, 200, 20);
    //设置提示文本
    lab.text=[NSString stringWithFormat:@"%@已经下载完成",app.name];
    //设置文本背景颜色
    [lab setBackgroundColor:[UIColor grayColor]];
    [self.view addSubview:lab];
    lab.alpha=1.0;
   
    //设置动画效果
    [UIView animateWithDuration:2.0 animations:^{
        lab.alpha=0.0;
    } completion:^(BOOL finished) {
        //把弹出的提示信息从父视图中删除
        [lab removeFromSuperview];
    }];
}

#pragma mark-隐藏状态栏
-(BOOL)prefersStatusBarHidden
{
    return YES;
}

@end

补充说明

  在程序中通过标示符取出对应的cell,是因为在storyboard中已经对cell打上了标示符(app)的标签。

代码如下:

//组-行-数据
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    //创建cell
    static NSString *identifier=@"app";
    YYappCell *cell=[tableView dequeueReusableCellWithIdentifier:identifier];
    //设置cell的数据
    YYappInfo *appinfo=self.apps[indexPath.row];
    //设置代理
    cell.delegate=self;
    cell.app=appinfo;
    //返回cell
    return cell;
}

(0)

相关推荐

  • iOS开发中ViewController的页面跳转和弹出模态

    ViewController 页面跳转 从一个Controller跳转到另一个Controller时,一般有以下2种: 1.利用UINavigationController,调用pushViewController,进行跳转:这种采用压栈和出栈的方式,进行Controller的管理.调用popViewControllerAnimated方法可以返回. 复制代码 代码如下: PickImageViewController *ickImageViewController = [[PickImageV

  • iOS App初次启动时的用户引导页制作实例分享

    应用程序APP一般都有引导页,引导页可以作为操作指南指导用户熟悉使用:也可以展现给用户,让用户了解APP的功能作用.引导页制作简单,一般只需要一组图片,再把图片组展现出来就可以了.展示图片组常用UIScrollView来分页显示,并且由UIPageControl页面控制器控制显示当前页.UIScrollView和UIPageControl搭配会更加完美地展现引导页的功能作用.下面我们来看具体的实例: 我们用NSUserDefaults类来判断程序是不是第一次启动或是否更新,在 AppDelega

  • IOS获取各种文件目录路径的方法

    iphone沙箱模型有四个文件夹,分别是什么,永久数据存储一般放在什么位置,得到模拟器的路径的简单方式是什么. documents,tmp,app,Library. (NSHomeDirectory()), 手动保存的文件在documents文件里 Nsuserdefaults保存的文件在tmp文件夹里 1.Documents 目录:您应该将所有de应用程序数据文件写入到这个目录下.这个目录用于存储用户数据或其它应该定期备份的信息. 2.AppName.app 目录:这是应用程序的程序包目录,包

  • iOS实现动态元素的引导图效果

    前言 最近越来越多的APP,已经抛弃掉第一次进入的3-4页的导入页面,而是另外采取了在功能页面悬浮一个动态效果来展示相应的功能点.这个模块主要是实现app首次进入时显示的动态的引导图,在用户进行右滑或者左滑的时候,屏幕上的一些元素做出相应的隐藏消失以及位置移动. 实现效果: 图片资源来自网络,侵权即删 先来看看是如何使用的,然后再介绍相关的方法及属性 NSMutableArray * elementsDataArr = [[NSMutableArray alloc] init]; /* 动画元素

  • iOS 引导页的镂空效果实例

    初衷 最近项目新功能更改较大,产品童鞋要求加入新功能引导,于是一口气花了两天的时间做了一个引导页,当然加上后面的修修补补的时间,就不只两天了,不过这事情其实是一劳永逸的事情,值得做.同时为了能够更好的复用,我把它做成了pod库,项目地址在这里:EAFeatureGuideView. EAFeatureGuideView能做什么 EAFeatureGuideView是UIView的一个扩展,用来做新功能引导提示,达到这样的效果: 局部区域高亮(可以设置圆角) 有箭头指向高亮区域 可以设置一段介绍文

  • ios动态设置lbl文字标签的高度

    复制代码 代码如下: txtlbl.font = [UIFont boldSystemFontOfSize:14.0f];     txtlbl.numberOfLines = 0;  NSString *str = @"        阿方决定设立科技特网络离开电视剧分w额两个大陆高科技了了不见了日i倒计时离开我说老师肯德基弗兰克萨江东父老将费德勒说阿方决定设立科技特网络离开电视剧分w额两个大陆高科技了了不见了日i倒计时离开我立科说老师肯德基弗兰克萨江东父老将费德勒说";    CG

  • iOS Runntime 动态添加类方法并调用-class_addMethod

    上手开发 iOS 一段时间后,我发现并不能只着眼于完成需求,利用闲暇之余多研究其他的开发技巧,才能在有限时间内提升自己水平.当然,"其他开发技巧"这个命题对于任何一个开发领域都感觉不找边际,而对于我来说,尝试接触 objc/runtime 不失为是开始深入探索 iOS 开发的第一步. 刚了解 runtime 当然要从比较简单的 api 开始,今天就罗列整理一下 class_addMethod 的相关点: 首先从文档开始. /** * Adds a new method to a cla

  • iOS毛玻璃效果的实现及图片模糊效果的三种方法

    App设计时往往会用到一些模糊效果或者毛玻璃效果,iOS目前已提供一些模糊API可以让我们方便是使用. 话说苹果在iOS7.0之后,很多系统界面都使用了毛玻璃效果,增加了界面的美观性,比如下图的通知中心界面; 但是其iOS7.0的SDK并没有提供给开发者实现毛玻璃效果的API,所以很多人都是通过一些别人封装的框架来实现,后面我也会讲到一个; 其实在iOS7.0(包括)之前还是有系统的类可以实现毛玻璃效果的, 就是 UIToolbar这个类,并且使用相当简单,几行代码就可以搞定. 下面是代码实现:

  • iOS开发中WebView的基本使用方法简介

    1.使用UIWebView加载网页 运行XCode 4.3,新建一个Single View Application,命名为WebViewDemo. 2.加载WebView 在ViewController.h添加WebView成员变量和在ViewController.m添加实现 复制代码 代码如下: #import <UIKit/UIKit.h> @interface ViewController : UIViewController {     UIWebView *webView; } @e

  • iOS实现动态的开屏广告示例代码

    一.实现效果图 二.实现思路: 用一个固定的png图片左启动图,应该和广告视图需要进行动画的期初的位置一致,当启动图消失的时候,呈现出图片,实际遇到的困难是,因为广告图片是从网络请求加载的,当时把广告视图放在了请求数据的块里面,广告出现的时候会闪一下,放在外面就没事了. 三.实现示例 1.广告的头文件 // XBAdvertView.h // scoreCount // // Created by 王国栋 on 15/12/22. // Copyright © 2015年 xiaobai. Al

随机推荐