iphone - 如何制作像 Glympse iphone 应用程序一样的介绍屏幕

Question

当您第一次启动时 Glympse iphone 应用程序，Glympse 显示介绍屏幕。当你从上到下滚动屏幕时，它会动态改变内容，动画非常流畅。您还可以在设置菜单中重播此介绍。

我想知道如何在 iphone 中构建这样一个屏幕位置感知动画页面。我什至怀疑这个屏幕是用html5+css3构建的吗？就像this page .

Answer 1

以下是我如何实现介绍序列:

由于 UIScrollViewDelegate 没有为我提供 ScrollView 内容的实际显示坐标，我创建了一个从 UIScrollView 派生的新类并覆盖了 setContentOffset .我还定义了一个委托(delegate)协议(protocol)，它在调用 setContentOffset 时触发，并通知监听器传递给 setContentOffset 方法的 contentOffset 值。 (理想情况下，这应该是 iOS 的 UIScrollViewDelegate 委托(delegate)的一部分)。

委托(delegate)的实现者现在能够在滚动发生时接收实际的内容偏移量。当 View 滚动并显示不同的内容时，我根据 contentOffset 的垂直坐标触发动画。这些触发器定义在一个垂直点数组(Y 值)中，每个垂直点与两个函数调用相关联，这两个函数调用动画 UI 元素进出 View 。

当 contentOffset Y 值大于触发点时，我将特定的 UI 元素动画化到 View 中并将动画设置为“已触发”。动画通常是淡入淡出或使用 Block-Based Animation 调整大小。 .当 Y 值小于触发点且之前已触发动画时，我使用不同的动画(例如淡出)将对象设置为动画，并标记为“未触发”

这是确定 UI 元素是否可见的关键计算:

    CGPoint point = [contentOffset CGPointValue];
    CGFloat visible = _scrollView.bounds.size.height + point.y;

    if ( _triggers[ndx].y < visible )
    {
        if ( !_triggers[ndx].triggered )
        {
            _triggers[ndx].triggered = true;
            // call trigger's function to animate item into view
        }
    }
    else
    {
        if (_triggers[ndx].triggered)
        {
            _triggers[ndx].triggered = false;
            // call trigger's function to animate item out of view
        }
    }