(五)超级猜图Demo引出的细节

第一部分:
1.按钮的细节,设置背景和前景图片后,要使得背景显示出来,可以设置内边距,影响内部内容。


显示 图片+文字,用button更简单。
问题是,如果不想按钮被点击,在属性面板取消勾选User Interaction Enabled.
 
2.状态栏的颜色控制(背景色深色,将状态栏调整为白色):

/**

 *  控制状态栏的样式

 *

 *  @return UIStatusBarStyle

 */

- (UIStatusBarStyle)preferredStatusBarStyle{

    return UIStatusBarStyleLightContent;

}


3.修改应用名称:

点击工程,改完后回车,点击rename,再选择manage scheme,修改,注意都是单击。


4.代码块的制作:

<#属性名#>可以生成可以填写的提示空位。


5.点击图片方法、背景变灰的实现:

因为点击阴影也会返回,因此阴影也是一张图片。

首先在UIView上盖一张阴影UIButton。然后把头像调整到阴影上面,然后放大挪动到中间(动画)。

将某个控件置于顶层:

[self.view bringSubviewToFront:self.iconBtn];


小Tip:发现图片大小无法调整,可能是由于autolayout。

/2用*0.5表示可以提高效率。

    //1.添加阴影

    UIButton *cover = [[UIButton allocinit];

    cover.frame = CGRectMake(00320480);

    cover.backgroundColor = [UIColor blackColor];

    cover.alpha = 0.7;

    [cover addTarget:self action:@selector(smallImg) forControlEvents:UIControlEventTouchUpInside];

    [self.view addSubview:cover];

    //2.更改阴影和头像位置

    [self.view bringSubviewToFront:self.iconBtn];

    //3.更改头像尺寸

    [UIView beginAnimations:nil context:nil];

    [UIView setAnimationDuration:0.5];

    CGFloat iconW = self.view.frame.size.width;

    CGFloat iconH = iconW;

    CGFloat iconX = 0;

    CGFloat iconY = (self.view.frame.size.height - iconH) * 0.5;

    self.iconBtn.frame = CGRectMake(iconX, iconY, iconW, iconH);

    [UIView commitAnimations];


6.删除已有的视图,实现图像复位,阴影消失。

调用控件的removeFromSuperview方法来删除。

做法1,给方法一个参数,使用addTarget参数设置监听:

[cover addTarget:self action:@selector(smallImg:) forControlEvents:UIControlEventTouchUpInside];

- (void)smallImg : (UIButton *)btn{

    [btn removeFromSuperview];

}

做法2,让cover是一个成员变量。

cover是一个成员变量的好处:让头像这个按钮有两种动作,放大和缩小

只要在按钮函数里面判断cover是否是nil,来调用放大和缩小。


监听动画结束:

[UIView setAnimationDelegate:self];

[UIView setAnimationDidStopSelector:@selector(deleteCover)];


使用block动画:

[UIView animateWithDuration:<#(NSTimeInterval)#> animations:<#^(void)animations#> completion:<#^(BOOL finished)completion#>]

第一个为动画持续时间,第一个block为动画代码,第二个block为动画结束的代码(block上敲回车可生成)。


推荐使用block动画。


7.取消按钮点击变灰(头像放大缩小不需要)

在属性面板取消Highlighted Adjust Image。



8.猜图的小图标排列技巧:

先加入一个长条的UI父控件,这样只需要调整父控件就可以调整所有子控件。

添加一个view,然后在上面操作。

注意在添加答案按钮前先清空所有按钮。

for (UIView *subview in self.answerView.subviews){

        [subview removeFromSuperview];

}


Tip:一个方法中不应该有太多的代码。

应该进行切割,把不同的功能放到不同的方法中去。

例如下面的代码,分割在三个方法内。

/**

 *  添加正确答案

 *

 *  @param question 问题模型Question

 */

- (void)addAnswer:(Question *)question{

    for (UIView *subview in self.answerView.subviews){

        [subview removeFromSuperview];

    }

    int length = question.answer.length;

    for (int i =0; i < length; i++){

        UIButton *answerBtn = [[UIButton allocinit];

        [answerBtn setBackgroundImage:[UIImage imageNamed:@"btn_answer"forState:UIControlStateNormal];

        [answerBtn setBackgroundImage:[UIImage imageNamed:@"btn_answer_highlighted"forState:UIControlStateHighlighted];

        CGFloat marginMedium = 10.0;

        CGFloat answerW = 35;

        CGFloat answerH = 35;

        CGFloat viewW = self.view.frame.size.width;

        CGFloat leftMargin = (viewW - length * answerW - (length - 1)*marginMedium) * 0.5;

        CGFloat answerX = leftMargin + i * (answerW + marginMedium);

        answerBtn.frame = CGRectMake(answerX, 0, answerW, answerH);

        [self.answerView addSubview:answerBtn];

    }


}

/**

 *  添加待选项

 *

 *  @param question 问题模型Question

 */

- (void)addOption:(Question *)question{

    

    int count = question.options.count;

    for (int i = 0; i < count; i++){

        UIButton *optionBtn = [[UIButton allocinit];

        [optionBtn setBackgroundImage:[UIImage imageNamed:@"btn_option"forState:UIControlStateNormal];

        [optionBtn setBackgroundImage:[UIImage imageNamed:@"btn_option_highlighted"forState:UIControlStateHighlighted];

        

        int row = i / 7;

        int col = i % 7;

        

        CGFloat marginX = 10;

        CGFloat marginY = 10;

        CGFloat optionW = 35;

        CGFloat optionH = 35;

        

        CGFloat viewW = self.view.frame.size.width;

        

        int countLine = 7;

        

        CGFloat leftMargin = (viewW - countLine * optionW - (countLine - 1) * marginX) * 0.5;

        CGFloat optionX = leftMargin + col * (optionW + marginX);

        CGFloat optionY = row * (optionH + marginY);

        

        optionBtn.frame = CGRectMake(optionX, optionY, optionW, optionH);

        [optionBtn setTitle:question.options[i] forState:UIControlStateNormal];

        [optionBtn setTitleColor:[UIColor blackColorforState:UIControlStateNormal];

        

        [self.optionView addSubview:optionBtn];

    }

}

/**

 *  设置控件数据

 *

 *  @param question 问题模型Question

 *  @param btn      触发事件的Button(下一题按钮)

 */

- (void)setData:(Question *)question andBtn:(UIButton *)btn{


    btn.enabled = self.index != self.questions.count - 1 ? YES : NO;

    

    self.titlelabel.text = question.title;

    self.nolabel.text = [NSString stringWithFormat:@"%d/%d",self.index + 1,self.questions.count];

    [self.iconBtn setImage:[UIImage imageNamed:question.iconforState:UIControlStateNormal];

}


- (IBAction)nextQuestion:(id)sender {

    self.index++;

    UIButton *btn = (UIButton *)sender;

    Question *question = self.questions[self.index];

    

    [self setData:question andBtn:btn];

    

    [self addAnswer:question];

    

    [self addOption:question];

    

}


第二部分:

待选按钮和答案的业务逻辑:

1.要让待选按钮消失,设置hidden属性为YES即可

2.应该让答案显示在从左边开始数,第一个没有问题的框。

3.注意按钮的文字颜色默认为白色。

4.点击正确答案框的时候还要退回选项。

5.按下提示键后应该清空内容,然后显示一个正确的字。

一些细节:
1.获取按钮的标题:

NSString *answerTitle = [answerBtn titleForState:UIControlStateNormal];

另一种方法:

NSString *answerTitle = answerBtn.currentTitle;


2.延时执行:

[self performSelector:@selector(nextQuestion:) withObject:nil afterDelay:0.5];


获取已有软件的素材:

使用mac版的iTools,可以备份出来软件,是一个ipa文件,打开软件包,找PayLoad,打开素材包即可。
还可以看到一个软件用到了哪些框架。

一般流程是先实现功能,再优化代码。

要清理一个View中的所有子控件,除了用for-in来遍历使用removeFromSuperview,还可以使用subviews的方法
makeObjectsPerformSelector来为所有subview添加响应事件removeFromSuperview。

[self.answerView.subviews makeObjectsPerformSelector:@selector(removeFromSuperview)];


一个技巧:

  为了点击提示的时候可以将已经输入的退回,要实现这一步一般的思路是执行遍历,另一个思路是调用答案框按钮的点击方法,将所有的按钮都点击一次

这就相当于是退回了所有的输入选项。同样,提示的第一个字,应该相当于点击了选项中的那个字。


要多进行类似的“这个操作比较麻烦,但是相当于…”这样的思路转化。


字符串的截取:

substringToIndex:index方法表示截取到index之前,例如index=3,表示截取0-2。

字符串的判等:

isEqualToString方法。




posted on 2015-02-04 22:01  张大大123  阅读(117)  评论(0编辑  收藏  举报

导航