iPhone使用进度条计时器实现流畅的动画

Question

我试图在学习的精神上在iPhone上实现一个简单的测验应用程序,这个应用程序的一部分是一个计时器.

我希望我的计时器从10倒数到0.我有一个简单的NSTimer重复并每秒调用一个方法,在这个方法中我更新一个显示剩余时间的标签,这很好用.

现在我没有使用标签来显示计时器,而是想使用图形进度条,所以我创建了十个图像,一个完整的长度(代表10),下一个9/10的大小等等,以及我的重复计时器方法而不是更新标签我用适当的图像更新UIImage,所以随着时间的推移,进度条变得越来越小.

我的问题是,由于我实现进度条的方式,它每秒更新时看起来不是很顺畅.我还有另一种方法来开发这种功能吗？我听说您可以使用可伸缩的图像来获得更平滑的效果,但我看不到任何好的例子.

欢迎任何建议和代码示例,只是想在这里学习.

Answer 1

在研究了几个选项后,我决定使用UIProgressView(在评论中由sudo建议)加上NSTimer,每秒十次更新进度十秒,我使用此解决方案是因为:

1. 它是苹果提供的标准元素.
2. 此选项没有创建和加载100个图像的开销(正如Krypton在评论中所建议的那样).
3. 通过NSTimer,我可以在函数updateProgressBar中添加一个检查,以便在计时器达到低位时向用户添加一些反馈,ee振动最后三秒等(使用动画我认为我没有那个选项).

使用下面的代码假设我有一个名为'progressView'的UIProgressView变量,一个名为'timer'的NSTimer和一个名为'time'的浮点变量,然后:

-(void)updateProgressBar
{
    if(time <= 0.0f)
    {
        //Invalidate timer when time reaches 0
        [timer invalidate];
    }
    else
    {
        time -= 0.01;
        progressView.progress = time;
    }
}

-(void)animateProgressView2
{
    progressView.progress = 1;
    time = 1;
    timer = [NSTimer scheduledTimerWithTimeInterval: 0.1f
                                             target: self
                                           selector: @selector(updateProgressBar)
                                           userInfo: nil
                                            repeats: YES];
}

我调查的另一种方式(在看到Disco的评论之后)但决定不使用动画.在这个例子中,我创建了两个png图像,名为'redbar.png'和'greenbar.png',这个想法带来了它们将被放置在彼此之上(绿色条位于顶部/前景中),并且在整个过程中绿色条收缩的动画,露出背景中的红色条.

UIImage *green= [UIImage imageNamed:@"greenbar.png"];
UIImage *red= [UIImage imageNamed:@"redbar.png"];

redBar.image = red; // allocate the red image to the UIImageView
redBar.frame = CGRectMake(20,250,220,30);// set the size of the red image

greenBar.image = green; // allocate the green image to the UIImageView
greenBar.frame = CGRectMake(20,250,220,30);//set the size of the green image

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDelegate:self];
[UIView setAnimationDuration:10]; //the time you want the animation to last for
[UIView setAnimationDidStopSelector:@selector(animationFinished)];//the method to be called once the animation is finished
    //at the end of the animation we want the greenBar frame to disappear
    greenBar.frame = CGRectMake(20,250,0,30);
[UIView commitAnimations];

一个理想的解决方案是组合UIProgressView和UIAnimation块,但目前这不是一个选项(请参阅此问题动画UIProgressView的更改).

希望这可以帮助将来的某个人.

编辑::

我上面提到的理想解决方案现在可以在iOS5中使用,取自苹果参考站点:

setProgress:animated:调整接收器显示的当前进度,可选择设置更改动画.

• (void)setProgress :( float)进度动画:(BOOL)动画