image.png
利用代码来搭建界面。
image.png
plist文件内容
可见视图所需要的属性
* 左上的button
@property (nonatomic , strong) UIButton *leftUpButton;
* 右上的button
@property (nonatomic , strong) UIButton *rightUpButton;
* 左下的button
@property (nonatomic , strong) UIButton *leftDownButton;
* 右下的button
@property (nonatomic , strong) UIButton *rightDownButton;
* 右上方显示金币图片及数量的button
@property (nonatomic , strong) UIButton *iconButton;
* 最上方显示张数 / 总数的label
@property (nonatomic , strong) UILabel *indexLabel;
* 标题label
@property (nonatomic , strong) UILabel *titleLabel;
* 答案视图
@property (nonatomic , strong) UIView *answerView;
* 选项视图
@property (nonatomic , strong) UIView *optionView;
* 图片button
@property (nonatomic , strong) UIButton *imageButton;
* 存放解析各种数据
@property (nonatomic , strong) NSMutableArray *dataArray;
* 按钮计数器
@property (nonatomic , assign) NSInteger index;
* 帮助计数器
@property (nonatomic , assign) NSInteger helpIndex;
* 覆盖类的视图
@property (nonatomic , strong) CoverView *funcView;
* 滚动类图片
@property (nonatomic , strong) UIScrollView *changeView;
* 多图页数控制
@property (nonatomic , strong) UIPageControl *pageControl;
* 设置定时器
@property (nonatomic , strong) NSTimer *timer;
解析plist文件，创建模型
AppModel.h
@property(nonatomic,copy)NSString * answer;
@property(nonatomic,copy)NSString * icon;
@property(nonatomic,strong)NSArray * options;
@property(nonatomic,copy)NSString * title;
//外部调用接口
+(instancetype)appModelWithDic:(NSDictionary *)dic;
//存放答案
@property (nonatomic , strong) NSArray *answerArray;
AppModel.m
-(instancetype)initWithDic:(NSDictionary *)dic
{
if (self = [super init]) {
_answer = dic[@"answer"];
_title = dic[@"title"];
_options = dic[@"options"];
_icon = dic[@"icon"];
_answerArray = [self cutWithAnswer:dic[@"answer"]];
}
return self;
}
+(instancetype)appModelWithDic:(NSDictionary *)dic
{
return [[self alloc] initWithDic:dic];
}
- (NSString *)description
{
return [NSString stringWithFormat:@"icon === %@", _icon];
}
//剪切并放入数组
-(NSArray *)cutWithAnswer:(NSString *)answer{
NSMutableArray *arr = [NSMutableArray array];
for (int i = 0; i < answer.length; i++) {
[arr addObject:[answer substringWithRange:NSMakeRange(i, 1)]];
}
return arr;
}
懒加载解析plist文件
-(NSMutableArray *)dataArray
{
if (!_dataArray) {
_dataArray = [NSMutableArray array];
NSArray * temp = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"questions" ofType:@"plist"]];
for (NSDictionary * dic in temp) {
AppModel * model = [AppModel appModelWithDic:dic];
[_dataArray addObject:model];
}
}
return _dataArray;
}
来搭建视图
- (void)viewDidLoad
{
[super viewDidLoad];
//背景色
self.view.backgroundColor = [[UIColor alloc] initWithPatternImage:[UIImage imageNamed:@"bj"]];
//总数label
_indexLabel = [[UILabel alloc] initWithFrame:CGRectMake(self.view.frame.size.width / 2 - 25, 20, 50, 15)];
_indexLabel.text = @"1/7";
_indexLabel.textAlignment = NSTextAlignmentCenter;
_indexLabel.textColor = [UIColor whiteColor];
[self.view addSubview:_indexLabel];
//金币button
_iconButton = [[UIButton alloc] initWithFrame:CGRectMake(self.view.frame.size.width - 95, 20, 90, 15)];
[_iconButton setImage:[UIImage imageNamed:@"coin"] forState:UIControlStateNormal];
[_iconButton setTitle:@"10000" forState:UIControlStateNormal];
[self.view addSubview:_iconButton];
//标题
_titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 75, self.view.frame.size.width, 20)];
_titleLabel.text = @"电影图片";
_titleLabel.lineBreakMode = 0;
_titleLabel.textAlignment = NSTextAlignmentCenter;
_titleLabel.textColor = [UIColor whiteColor];
[self.view addSubview:_titleLabel];
//图片button
_imageButton = [[UIButton alloc] initWithFrame:CGRectMake(self.view.frame.size.width / 2 - 100, 150, 200, 200)];
[_imageButton setBackgroundImage:[UIImage imageNamed:@"center_img"] forState:UIControlStateNormal];
[_imageButton setImage:[UIImage imageNamed:@"movie_zghhr"] forState:UIControlStateNormal];
UIEdgeInsets inset = {1,1,1,1};
[_imageButton setImageEdgeInsets:inset];
[self.view addSubview:_imageButton];
//答案View
_answerView = [[UIView alloc] initWithFrame:CGRectMake(0, _imageButton.frame.origin.y + _imageButton.frame.size.height + 25, self.view.frame.size.width, 40)];
_answerView.backgroundColor = [UIColor clearColor];
[self.view addSubview:_answerView];
//选项视图
_optionView = [[UIView alloc] initWithFrame:CGRectMake(0, _answerView.frame.origin.y + _answerView.frame.size.height + 25, self.view.frame.size.width, self.view.frame.size.height - (_answerView.frame.origin.y + _answerView.frame.size.height + 25) - 25)];
_optionView.backgroundColor = [UIColor clearColor];
[self.view addSubview:_optionView];
/****************/
[self addButton];
[self loadData];
addButton（应该封装一个方法创建，暂时没写）
-(void)addButton
{
_leftUpButton = [[UIButton alloc] initWithFrame:CGRectMake(5, 150 + 5, 50,17)];
[_leftUpButton setImage:[UIImage imageNamed:@"icon_tip"] forState:UIControlStateNormal];
[_leftUpButton setTitle:@"提示" forState:UIControlStateNormal];
_leftUpButton.titleLabel.font = [UIFont systemFontOfSize:14];
[_leftUpButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[_leftUpButton setBackgroundImage:[UIImage imageNamed:@"btn_left"] forState:UIControlStateNormal];
[_leftUpButton setBackgroundImage:[UIImage imageNamed:@"btn_left_highlighted"] forState:UIControlStateHighlighted];
[self.view addSubview:_leftUpButton];
_rightUpButton = [[UIButton alloc] initWithFrame:CGRectMake(self.view.frame.size.width - 55, 150 + 5, 50, 17)];
[_rightUpButton setImage:[UIImage imageNamed:@"icon_img"] forState:UIControlStateNormal];
[_rightUpButton setTitle:@"多图" forState:UIControlStateNormal];
[_rightUpButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
_rightUpButton.titleLabel.font = [UIFont systemFontOfSize:14];
[_rightUpButton setBackgroundImage:[UIImage imageNamed:@"btn_right"] forState:UIControlStateNormal];
[_rightUpButton setBackgroundImage:[UIImage imageNamed:@"btn_right_highlighted"] forState:UIControlStateHighlighted];
[self.view addSubview:_rightUpButton];
_leftDownButton = [[UIButton alloc] initWithFrame:CGRectMake(5, 150 + 200 - 17 - 5, 50, 17)];
[_leftDownButton setImage:[UIImage imageNamed:@"icon_help"] forState:UIControlStateNormal];
[_leftDownButton setTitle:@"帮助" forState:UIControlStateNormal];
[_leftDownButton setTintColor:[UIColor whiteColor]];
_leftDownButton.titleLabel.font = [UIFont systemFontOfSize:14];
[_leftDownButton setBackgroundImage:[UIImage imageNamed:@"btn_left"] forState:UIControlStateNormal];
[_leftDownButton setBackgroundImage:[UIImage imageNamed:@"btn_left_highlighted"] forState:UIControlStateHighlighted];
[self.view addSubview:_leftDownButton];
_rightDownButton = [[UIButton alloc] initWithFrame:CGRectMake(self.view.frame.size.width - 55 , 150 + 200 - 17 - 5, 50, 17)];
[_rightDownButton setTitle:@"下一题" forState:UIControlStateNormal];
_rightDownButton.titleLabel.textAlignment = NSTextAlignmentCenter;
_rightDownButton.titleLabel.font = [UIFont systemFontOfSize:14];
[_rightDownButton setBackgroundImage:[UIImage imageNamed:@"btn_right"] forState:UIControlStateNormal];
[_rightDownButton setBackgroundImage:[UIImage imageNamed:@"btn_right_highlighted"] forState:UIControlStateHighlighted];
[self.view addSubview:_rightDownButton];
[_leftUpButton addTarget:self action:@selector(buttonTip) forControlEvents:UIControlEventTouchUpInside];
[_leftDownButton addTarget:self action:@selector(buttonHelp) forControlEvents:UIControlEventTouchUpInside];
[_rightUpButton addTarget:self action:@selector(multipleImageButton) forControlEvents:UIControlEventTouchUpInside];
[_rightDownButton addTarget:self action:@selector(buttonRightDown) forControlEvents:UIControlEventTouchUpInside];
}
loadData
-(void)loadData
{
self.helpIndex = 0;
AppModel *model = self.dataArray[_index];
_indexLabel.text = [NSString stringWithFormat:@"%ld/%lu",_index + 1,self.dataArray.count];
_titleLabel.text = model.title;
_titleLabel.alpha = 0;
[_imageButton setImage:[UIImage imageNamed:model.icon] forState:UIControlStateNormal];
CGFloat x = (_answerView.frame.size.width - 40 * model.answer.length - marginWidth * (model.answer.length - 1)) / 2;
//答案按钮
for (int i = 0; i<model.answer.length; i++) {
UIButton * tempButton = [[UIButton alloc] initWithFrame:CGRectMake(x + i*(marginWidth + 40) , 5, 40, 40)];
[tempButton setBackgroundImage:[UIImage imageNamed:@"btn_answer"] forState:UIControlStateNormal];
[tempButton setBackgroundImage:[UIImage imageNamed:@"btn_answer_highlighted"] forState:UIControlStateHighlighted];
tempButton.tag = AnswerButton + i;
[_answerView addSubview:tempButton];
[tempButton addTarget:self action:@selector(answerViewButton:) forControlEvents:(UIControlEventTouchUpInside)];
}
//选择的按钮
CGFloat y =0;
NSInteger lineNumber = model.options.count/6 + 1;
if (lineNumber > 1) {
x = (_optionView.frame.size.width - 40 * 6 - marginWidth * (6 - 1)) / 2;
y = (_optionView.frame.size.height - 40 * lineNumber - marginWidth*(lineNumber-1))/2;
}else{
x = (_optionView.frame.size.width - 40*model.options.count - marginWidth*(model.options.count - 1))/2;
y = (_optionView.frame.size.height - 40)/2;
}
for (int i =0; i<lineNumber; i++) {
for (int j =0; j<6; j++) {
if ((i*6 +j +1)>model.options.count) {
break;
}
UIButton * tmpButton = [[UIButton alloc] initWithFrame:CGRectMake(x+j*(40+marginWidth), y + i*(40 + marginHeight), 40, 40)];
[tmpButton setBackgroundImage:[UIImage imageNamed:@"btn_option"] forState:(UIControlStateNormal)];
[tmpButton setBackgroundImage:[UIImage imageNamed:@"btn_option_highlighted"] forState:(UIControlStateHighlighted)];
[tmpButton setTitle:model.options[i*6 +j] forState:(UIControlStateNormal)];
[tmpButton setTitleColor:[UIColor blackColor] forState:(UIControlStateNormal)];
tmpButton.tag = OptionButton + i*6 +j;
[_optionView addSubview:tmpButton];
[tmpButton addTarget:self action:@selector(optionViewButtonClicked:) forControlEvents:(UIControlEventTouchUpInside)];
}
}
}
基本的视图搭建完成。下一章来搭建逻辑方面
