启用用户交互的 FadeIn 和 FadeOut UISlider

Posted

技术标签:

【中文标题】启用用户交互的 FadeIn 和 FadeOut UISlider【英文标题】:FadeIn & FadeOut UISlider with UserInteraction Enabled 【发布时间】:2015-12-24 15:02:22 【问题描述】:

我使用 UISlider 创建了一条视频时长线。它工作得很好;我可以得到滑块值的变化。然后,我尝试为其添加视觉效果(淡入和淡出),因此当用户点击屏幕时,滑块会淡入,如果没有进行其他交互则淡出。

为了实现淡入淡出效果,我在 0-1 之间调整了 alpha。但是,ios 显然不接受 alpha 0.5 以下元素的用户交互。因此,我无法用普通的animateWithDuration 实现这一点,因此我尝试添加一个计数秒数的计数器。

(更新: 显然,我想要实现的是,我有一个全屏视频,我想放置一个滑块来显示视频时间(当前时间 + 持续时间)。我想将滑块最初设置为不可见,当用户点击屏幕时,滑块变得可见。然后,用户在滑块上进行交互。但是,我想让滑块在上次点击后 5 秒后淡出.)

我尝试了什么...

 var durationSlider: UISlider!
 var timer = NSTimer()
 var counter = 0

 override func viewDidLoad() 
    super.viewDidLoad()

    durationSlider.minimumValue = 0
    durationSlider.maximumValue = 100
    durationSlider.continuous = true
    durationSlider.alpha = 0 
    durationSlider.addTarget(self, action: "sliderValueDidChange:", forControlEvents: .ValueChanged)
    self.view.addSubview(durationSlider)

    let tapGestureRecognizer: UITapGestureRecognizer = UITapGestureRecognizer(target: self, action: "handleTapGestureRecognizer:")
    tapGestureRecognizer.numberOfTapsRequired = 1
    self.player.view.addGestureRecognizer(tapGestureRecognizer)
 

 func scheduledTimerWithTimeInterval()
    timer = NSTimer.scheduledTimerWithTimeInterval(1, target: self, selector: Selector("updateCounting"), userInfo: nil, repeats: true)
 

 func updateCounting()
    counter = counter + 1
 

到这里为止,一切正常,如果我只使用淡入而不使用计数器,它就可以工作。

func handleTapGestureRecognizer(gestureRecognizer: UIGestureRecognizer) 
        UIView.animateWithDuration(0.2, delay: 0.2, options: [UIViewAnimationOptions.AllowUserInteraction], animations: 
        self.durationSlider.alpha = 1.0
        print("B")

    , completion: nil)


问题从这里开始

如果我尝试在补全中使用淡出,它会直接进入补全闭包内,因此它甚至不会给我一秒钟的时间来与滑块交互(alpha

    UIView.animateWithDuration(0.2, delay: 0.4, options: [UIViewAnimationOptions.AllowUserInteraction], animations: 
        self.durationSlider.alpha = 1.0
        print("B")

    , completion: completed in
        UIView.animateWithDuration(2.0, delay: 10.0, options: [], animations: 
            print("A")
            self.durationSlider.alpha = 0
        , completion: nil)

    )

当然,也尝试将它们分成两个单独的函数,但这会更直接地更改打印日志(所以 alpha):

    UIView.animateWithDuration(0.2, delay: 0.4, options: [UIViewAnimationOptions.AllowUserInteraction], animations: 
        self.durationSlider.alpha = 1.0
        print("B")

    , completion: nil)

    UIView.animateWithDuration(2.0, delay: 10.0, options: [], animations: 
        print("A")
        self.durationSlider.alpha = 0
    , completion: nil)

最后,设置计时器的想法突然出现在我的脑海中,所以我尝试了类似的方法,但也没有运气。它启动计数器并且它正在上升,但我认为这个逻辑在这里不起作用,因为它永远不会进入那个 if 条件。

 func handleTapGestureRecognizer(gestureRecognizer: UIGestureRecognizer) 
    counter = 0
    scheduledTimerWithTimeInterval()

    UIView.animateWithDuration(0.2, delay: 0.2, options: [UIViewAnimationOptions.AllowUserInteraction], animations: 
        self.durationSlider.alpha = 1.0
        print("B")

    , completion: nil)

    if counter > 6 
        UIView.animateWithDuration(2.0, delay: 5.0, options: [], animations: 
            print("A")
            self.durationSlider.alpha = 0
        , completion: nil)
    

实现我想要实现的目标的最佳方式是什么?通过在 UISlider 上启用用户交互来调整淡入和淡出的正确方法是什么?

【问题讨论】:

当 alpha 值小于 0.01 时,ios 不接受交互。您至少可以接收大于 0.02 的值 就在有问题的Until here, everything works just fine 部分下方,在func handleTapGestureRecognizer(gestureRecognizer: UIGestureRecognizer) 中,我将alpha 设置为1,它按我的预期工作。你什么意思?我想从 0 开始 alpha,点击时将其更改为 1,如果 6 秒内没有进行任何交互,则消失(alpha 回到 0) “实现我想要实现的目标的最佳方式是什么” 目前还不清楚您想要实现的什么。不要引用所有不“工作”的代码(无论这意味着什么),请准确地描述您想要发生的事情。 “没有互动”是什么?你是说你想让滑块淡入然后在用户滑动时淡出吗?然后,您是否希望滑块在用户滑动之后 淡出?如果用户滑动它怎么办?如果滑块不可见,用户如何召唤它?解释准确你想要什么,涵盖所有情况。 我想要实现的是,我有一个全屏视频,我想放置一个滑块来显示视频时间(当前时间+持续时间)。我想将滑块最初设置为不可见,当用户点击屏幕时,滑块变得可见。然后,用户在滑块上进行交互。但是,我想让滑块在上次点击后 5 秒后淡出。 【参考方案1】:

这些简单的步骤就可以做到:

    当用户点击以显示滑块时,设置一个 5 秒的计时器(并为滑块的淡入设置动画,相当快,例如 0.3 秒)。 [一个不错的变化可能是在滑块中淡入并在动画的完成处理程序中启动计时器。]

    在滑块的“值已更改”操作中,使计时器无效/取消并创建一个新的 5 秒计时器。 (如果用户从不更改滑块,则不会发生此步骤。不过没关系;已经有一个计时器在运行。)

    一种或另一种方式,您有一个计时器正在运行,它最终会触发(在您进行淡入后五秒,或在用户上次更改滑块后五秒)。当计时器触发时,淡出滑块。全部完成!

【讨论】:

我的 CancelableTimer 课程可能会帮助您:github.com/mattneub/Programming-iOS-Book-Examples/blob/… NSTimer 不能做的事情不多,但我发现它更易于管理。

以上是关于启用用户交互的 FadeIn 和 FadeOut UISlider的主要内容,如果未能解决你的问题,请参考以下文章

fadeIn 和 fadeOut 的 jquery 问题

jQuery.fadeIn 和 fadeOut 的 CSS3 替换

不透明度 FadeIn 和 FadeOut 问题 - FadeOut 仅失败 CSS

Flutter FadeIn/FadeOut 动画一起

如何使用 iphone sdk 使用 FadeIn 和 FadeOut 播放音乐

replaceWith() while 元素 fadeOut() 和 fadeIn() 在 JQuery