第十九篇：猜图游戏UI完整代码

QJQuestions.h文件：

//  QJQuestions.h
//  04-猜图游戏
//
//  Created by 瞿杰 on 15/9/23.
//

#import <UIKit/UIKit.h>

@interface QJQuestion : NSObject

@property (nonatomic , copy)NSString * icon;
@property (nonatomic , copy)NSString * title;
@property (nonatomic , copy)NSString * answer;
@property (nonatomic , strong)NSArray * options;

+ (instancetype)qustionWithDictionary:(NSDictionary * )dic;
- (instancetype)initWithDictionary:(NSDictionary * )dic;

@end

QJQuestions.m文件：

//
//  QJQuestions.m
//  04-猜图游戏
//
//  Created by 瞿杰 on 15/9/23.
//

#import "QJQuestion.h"

@implementation QJQuestion

+ (instancetype)qustionWithDictionary:(NSDictionary *)dic{
    return [[self alloc]initWithDictionary:dic];
}
- (instancetype)initWithDictionary:(NSDictionary *)dic{
    
    if (self = [super init]) {
        self.icon = dic[@"icon"];
        self.title = dic[@"title"];
        self.answer = dic[@"answer"];
        self.options = dic[@"options"];
    }
    return self ;
}

@end

ViewController.h文件：

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController


@end

ViewController.m文件：

//
//  ViewController.m
//  04-猜图游戏
//
//  Created by 瞿杰 on 15/9/23.
//

#import "ViewController.h"
#import "QJQuestion.h"

@interface ViewController ()

@property (nonatomic , strong)NSArray * questions;
@property (nonatomic , assign)int index;

@property (weak, nonatomic) IBOutlet UILabel *iconLable;
@property (weak, nonatomic) IBOutlet UIButton *icon;
@property (weak, nonatomic) IBOutlet UILabel *iconTitle;
@property (weak, nonatomic) IBOutlet UIButton *score;
@property (weak, nonatomic) IBOutlet UIButton *next;
@property (weak, nonatomic) UIButton * cover;
@property (weak, nonatomic) IBOutlet UIView *answerView;
@property (weak, nonatomic) IBOutlet UIView *optionView;

/** 下一题设置 */
- (void)nextProblem:(UIButton *)btn;

/** 图片放大 */
- (IBAction)bigImg;

/** 添加答案按妞 */
- (void)addAnswerView;

/** 添加选项按妞*/
- (void)addOptionView;

/** 点击option选项按妞向answer中添加*/
- (void)optionBtnToAnswerBtn:(UIButton *)btn;

/** 点击answer中的按妞清除当前点击的按妞文字，并option中对应的文字显示出来*/
- (void)answerBtnToOptionBtu:(UIButton *)btn;

/**判断答案是否正确*/
- (void)checkAnswer;

/** 提示 */
- (IBAction)prompting;


@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    [self.score setTitle:@"1000" forState:UIControlStateNormal];
    [self.next addTarget:self action:@selector(nextProblem:) forControlEvents:UIControlEventTouchUpInside];
    [self nextProblem:self.next];
    //添加点击头象兼听事件
    [self.icon addTarget:self action:@selector(bigImg) forControlEvents:UIControlEventTouchUpInside];
    

}

/** 设置状态栏为白色，默认为黑色 */
- (UIStatusBarStyle)preferredStatusBarStyle{
    return UIStatusBarStyleLightContent;
}

/** 提示 */
- (IBAction)prompting {
    // 一次提示-500直到为0
    int tmpScore = [self.score.titleLabel.text intValue] - 500;
    if(tmpScore < 0) tmpScore = 0 ;
    // 设置得分
    [self.score setTitle:[NSString stringWithFormat:@"%d",tmpScore] forState:UIControlStateNormal];
    //清空answerBtn
    for(UIButton * btn in self.answerView.subviews){
        [btn setTitle:nil forState:UIControlStateNormal];
        btn.titleLabel.text = nil ;
    }
    
    QJQuestion * quest = self.questions[self.index-1];
    // 取出第一个字
    NSString * firstWord = [quest.answer substringToIndex:1] ;
    // 设置到第一个answerBtn中
    for(UIButton * btn in self.answerView.subviews){
        [btn setTitle:firstWord forState:UIControlStateNormal];
        [btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        break;
    }
    // 隐藏第一个与firstWord相同字的optionBtn
    for (UIButton * btn in self.optionView.subviews){
        if ([firstWord isEqualToString:btn.titleLabel.text]) {
            btn.hidden = YES ;
            break ;
        }
    }
}

/**判断答案是否正确*/
- (void)checkAnswer{
    
    QJQuestion * currentQuest = self.questions[self.index-1];
    NSMutableString * answer = [[NSMutableString alloc]init];
    for (UIButton * answerBtn in self.answerView.subviews){
        if (answerBtn.titleLabel.text == nil)
            break ;
        [answer appendString:answerBtn.titleLabel.text];
    }
    
    if ([currentQuest.answer isEqualToString:answer]){ // 答案正确
        // 加1000分
        int tmpScore = [self.score.titleLabel.text intValue];
        [self.score setTitle:[NSString stringWithFormat:@"%d",tmpScore+1000] forState:UIControlStateNormal];
        
        [UIView animateWithDuration:0.5 animations:^{
            //回答正确字体颜色变篮
            for (UIButton * answerBtn in self.answerView.subviews)
                [answerBtn setTitleColor:[UIColor blueColor] forState:UIControlStateNormal];
        } completion:^(BOOL finished) {
            // 回答正确后下一题
            [self nextProblem:self.next];
        }];
    }
    else if(currentQuest.answer.length == answer.length){ // 答案错误，并且answerBtn全部填满，字变红色
        for (UIButton * answerBtn in self.answerView.subviews)
            [answerBtn setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
    }
}


/** 点击option选项按妞向answer中添加*/
- (void)optionBtnToAnswerBtn:(UIButton *)btn{
    
    for (UIButton * tmpBtn in self.answerView.subviews) {
        if (tmpBtn.titleLabel.text == nil) {
            btn.hidden = YES ;
            [tmpBtn setTitle:btn.titleLabel.text forState:UIControlStateNormal];
            [tmpBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
            break ;
        }
    }
    [self checkAnswer];
}

/** 添加选项按妞*/
- (void)addOptionView{
    // 删除选项按妞
    [self.optionView.subviews makeObjectsPerformSelector:@selector(removeFromSuperview)];
    
    // 向optionView中添加选项按妞
    QJQuestion * quest = [self.questions objectAtIndex:self.index -1];
    int count = (int)quest.options.count;
    int colNumberBtn = 7;
    int rowNumberBtn = count / colNumberBtn ;
    CGFloat btnH = 50;
    CGFloat btnW = btnH ;
    CGFloat btnSpace = 10 ;
    CGFloat Wspace = (self.optionView.frame.size.width - colNumberBtn*(btnW + btnSpace)+btnSpace)*0.5;
    CGFloat Hspace = (self.optionView.frame.size.height - rowNumberBtn*(btnH + btnSpace)+btnSpace)*0.5;
    for (int i = 0; i < count; i++) {
        int x = i % colNumberBtn;
        int y = i / colNumberBtn;
        CGFloat btnX = Wspace + x * (btnSpace + btnW);
        CGFloat btnY = Hspace + y * (btnSpace + btnH);
        UIButton * btn = [[UIButton alloc]initWithFrame:CGRectMake(btnX , btnY, btnW, btnH)];
        
        [btn setBackgroundImage:[UIImage imageNamed:@"btn_option"] forState:UIControlStateNormal];
        [btn setBackgroundImage:[UIImage imageNamed:@"btn_option_highlighted"] forState:UIControlStateHighlighted];
        [btn setTitle:quest.options[i] forState:UIControlStateNormal];
        [btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        [btn addTarget:self action:@selector(optionBtnToAnswerBtn:) forControlEvents:UIControlEventTouchUpInside];
        [self.optionView addSubview:btn];
    }
}

/** 点击answer中的按妞清除当前点击的按妞文字，并option中对应的文字显示出来*/
- (void)answerBtnToOptionBtu:(UIButton *)btn{
    
    for (UIButton * tmpBtu in self.optionView.subviews){
        if (tmpBtu.hidden == YES && [tmpBtu.titleLabel.text isEqualToString:btn.titleLabel.text]) {
            tmpBtu.hidden = NO ;
            [btn setTitle:nil forState:UIControlStateNormal];
            btn.titleLabel.text = nil;
            break ;
        }
    }
    // 退回一个后answerBut设置成黑色
    for (UIButton * tmpBtu in self.answerView.subviews)
        [tmpBtu setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
}

/** 添加答案按妞 */
- (void)addAnswerView{
    //把answerView里的按妞先删除
    for(UIButton * btn in self.answerView.subviews){
        [btn removeFromSuperview];
    }
    //向answerView里添加按妞并每个按妞都有兼听事件
    QJQuestion * quest = [self.questions objectAtIndex:self.index-1];
    NSUInteger length = quest.answer.length;
    CGFloat btnH = self.answerView.frame.size.height;
    CGFloat btnW = btnH ;
    CGFloat btnSpace = 10 ;
    CGFloat space = (self.answerView.frame.size.width - length*(btnW + btnSpace)+btnSpace)*0.5;
    for (int i = 0; i < length; i++) {
        CGFloat btnX = space + i * (btnSpace + btnW);
        UIButton * btn = [[UIButton alloc]initWithFrame:CGRectMake(btnX , 0, btnW, btnH)];

        [btn setBackgroundImage:[UIImage imageNamed:@"btn_answer"] forState:UIControlStateNormal];
        [btn setBackgroundImage:[UIImage imageNamed:@"btn_answer_highlighted"] forState:UIControlStateHighlighted];
        [btn addTarget:self action:@selector(answerBtnToOptionBtu:) forControlEvents:UIControlEventTouchUpInside];
        [self.answerView addSubview:btn];
    }
}

/** 图片放大 */
- (IBAction)bigImg{
    //当不能放大时要关闭 控制器的 Use Auto Layout 属性
    if(self.cover == nil){
        //添加阴影
        UIButton * coverBtn = [[UIButton alloc]init];
        coverBtn.frame = self.view.frame;
        [coverBtn setBackgroundColor:[UIColor blackColor]];
        coverBtn.alpha = 0;
        [coverBtn addTarget:self action:@selector(smalleImg) forControlEvents:UIControlEventTouchUpInside];
        self.cover = coverBtn ;
        [self.view addSubview:self.cover];
        //调整位置
        [self.view bringSubviewToFront:self.icon];
        //放大图片
        CGFloat iconH = self.view.frame.size.width ;
        CGFloat iconW = self.view.frame.size.width ;
        CGFloat iconX = 0;
        CGFloat iconY = (self.view.frame.size.height-iconH) * 0.5 ;
        // 放大图片动画，持续时间0.5秒
        [UIView animateWithDuration:0.5 animations:^{
            coverBtn.alpha = 0.7;
            self.icon.frame = CGRectMake(iconX, iconY, iconW, iconH);
        }];
    }
    else
        [self smalleImg];
    
}
/** 缩小图片*/
- (void)smalleImg{
    [UIView animateWithDuration:0.5 animations:^{ // 动画
        self.icon.frame = CGRectMake(87, 93, 240, 240);
        self.cover.alpha = 0;
    } completion:^(BOOL finished) { // 动画结束后执行
        [self.cover removeFromSuperview];
        self.cover = nil ;
    }];
    
}

/** 下一题设置 */
- (void)nextProblem:(UIButton *)btn {
    
    if (self.index >= self.questions.count)
        return ;
    
    self.index++ ;
   
    QJQuestion * quest =self.questions[self.index-1];
     self.iconLable.text = [NSString stringWithFormat:@"%d/%lu",self.index,(unsigned long)self.questions.count];
    self.iconTitle.text = quest.title;
    [self.icon setImage:[UIImage imageNamed:quest.icon] forState:UIControlStateNormal];
    
    btn.enabled = self.index != self.questions.count;
    
    // 添加答案UIButton
    [self addAnswerView];
    [self addOptionView];
}

/** 获得questions.plist文件内容 并转成模型QJQuestion类型*/
- (NSArray *)questions{
    if (_questions == nil) {
        NSString * path = [[NSBundle mainBundle] pathForResource:@"questions" ofType:@"plist"];
        self.questions = [NSArray arrayWithContentsOfFile:path];
        NSMutableArray * mutArray = [NSMutableArray array];
        for(NSDictionary * dic in _questions){
            QJQuestion * quest = [QJQuestion qustionWithDictionary:dic];
            [mutArray addObject:quest];
        }
        _questions = mutArray ;
    }
    return _questions ;
}
@end

效果图：