悬停时动画 alpha 属性

Posted

技术标签:

【中文标题】悬停时动画 alpha 属性【英文标题】:Animate alpha property on hover over 【发布时间】:2011-07-26 01:27:17 【问题描述】:

我的屏幕上有六个座位对象(alpha 属性设置为 0 的 UIViews),我的玩家对象基本上放在它们上面。座位上可能有也可能没有球员。我现在拥有的是我已经对玩家的 touchesMoved 事件进行了编程,这样当我将玩家拖到座位对象的顶部时,座位的 alpha 属性将从 0 变为 0.6。然后在仍然拖动玩家的同时,如果我将他拖离座位,则 alpha 属性将回到 0。

相反,是否有一个内置的 UIView 动画会导致 alpha 属性在 .6 和 .2 之间来回波动?有种跳动的效果?这需要核心动画还是更高级的东西?

我在 Player 的 touchesMoved 方法中使用以下内容来拖动玩家并检测它是否在座位上方:

UITouch *aTouch = [touches anyObject];
self.center = [aTouch locationInView:[self.superview]];
Seat *seat = [controller seatAtPoint:[aTouch locationInView:self.superview]];

if (seat) 
self.hoverSeat = seat;
  seat.alpha = .6;
 else 
  self.hoverSeat.alpha = 0;

我的控制器中的seatAtPoint方法如下:

- (Seat *) seatAtPoint:(CGPoint)point 

NSMutableArray seats = [NSMutableArray arrayWithCapacity:6];

for (int i = 1; i <= 6; i++) 
  Seat *aSeat = (Seat*)[self.view viewWithTag:i];
  [seats addObject:aSeat];


for (Seat *seat in seats) 
 if (CGRectContainsPoint([seat frame], point)) 
  return seat;
 

return nil;

我使用 hoverSeat ivar 来固定玩家悬停的座位。然后如果返回的席位为 nil,则将该席位的 alpha 设置为 0。

我在这段代码中看到的一个错误是,如果我在屏幕上移动播放器的速度有点过快,有时 alpha 属性不会回到 0。任何人都可以想出一种更有效的方法来确保它正常运行回到0?

感谢您的任何建议。

【问题讨论】:

【参考方案1】:

我会考虑使用 CoreAnimation;使用起来并不难。下面是淡入淡出的样子:

[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:.5];
seat.alpha = 1;
[UIView commitAnimations];  

您可以查看此类方法用于创建某种脉冲动画 (Trigerring other animation after first ending Animation (Objetive-C)) 的回调,当与条件结合使用时,您可以将其设置为永远循环。另外值得注意的是,UIView 动画在运行时会禁用用户输入 (Infinitely looping animation)。

至于你提到的错误,如果它仍然发生,你可以设置一个计时器,当它被触发时,它会遍历所有座位并检查那些没有正确显示的座位。您可能希望将此间隔设置得非常少,以免中断或影响其他动画的性能。

【讨论】:

以上是关于悬停时动画 alpha 属性的主要内容,如果未能解决你的问题,请参考以下文章

禁用单击直到悬停动画完成

CSS:如何在另一个动画运行时保持悬停过渡平滑

悬停时播放 CSS 动画,悬停时暂停

在框中居中图标并应用动画比例悬停

退出悬停时反转动画

悬停时继续 CSS3 关键帧动画/悬停时停止重复