iPhone：如何在UIWebView上方显示视图？

Question

我正在开发一个浏览器应用程序，UIWebView 上方有一个地址栏。在 MobileSafari 中，如果向下滚动，地址栏开始向上移动，超出屏幕，而 UIWebView 不会滚动。只有当地址栏完全消失时，它才开始滚动。我也希望在我的应用程序中实现这种效果。

最好的实现方式是什么？

谢谢

- Alex1987

---

我敢肯定它们都在UIScrollView中... - Aurum Aquila

但是将UIWebView放入scrollView中可能会干扰WebView的滚动吗？ - Alex1987

我会假设您设置了滚动视图的contentSize，然后滚动视图是移动的东西。理论上，WebView的大小设置为页面的大小。 - Aurum Aquila

@AurumAquila，使用iOS5非常容易，查看我的回答吧;-) - PeakJi

Answer 1

实现该功能的唯一方法需要 iOS 5。 在 iOS 5 中，UIWebView 有一个名为 UIScrollView 的子视图。

使用以下代码：

设置地址栏的区域：

[[myWebView scrollView] setContentInset:UIEdgeInsetsMake(64, 0, 0, 0)];

使用scrollview代理移动地址栏：

- (void)scrollViewDidScroll:(UIScrollView *)scrollView{

        if(scrollView.contentOffset.y>=-64&&scrollView.contentOffset.y<30)
        {
            topBar.frame=CGRectMake(0,-44-scrollView.contentOffset.y, 320, 44);

        }
        else if(scrollView.contentOffset.y<-64)
            topBar.frame=CGRectMake(0,20, 320, 44);//Lock the position
}

- PeakJi

---

谢谢，这真的解决了我的问题。你也可以通过以下方式获取scrollView：for (UIView *view in [webView subviews]){if ([view isKindOfClass:[UIScrollView class]]){UIScrollView *theScrollView = (UIScrollView *)view;return theScrollView;}} 你还需要将顶部栏添加到UIWebView作为子视图。 - Alex1987

@PeakJi 终于有一个解决方案可以解决这个问题了！我找了好久才找到它。谢谢！ - Crystal

我在iOS 6中完成了这个，但我发现一个问题是当网页加载或其他情况时，Web视图的顶部会自动位于状态栏或手机顶部下方，有没有办法修复它，使其成为导航栏呢？ - Maximilian Litteral

@MaxHasADHD 对不起，我的回复太晚了... 是的，UIWebview在'didFinishLoading'时会重置其内容偏移量。也许我们可以尝试一些“抖动”的方法来解决这个问题（我不知道这些是否有效）：a.使用计时器来“锁定”偏移量；b.延迟'didFinishLoading'后重置偏移量；c.暂时删除内容插入。试试看吧;-P - PeakJi

我遇到了一个问题，即在将子视图添加到Web视图的滚动视图后，半个网页将无法被点击。我通过将该子视图插入到位置0（因此在视图层次结构中处于最后）来解决它，不确定为什么它能起作用，但确实可以。 - Fonix

Answer 2

有一种方法，但我不确定它是否有点过于hacky。首先在webview中搜索scrollview，然后更改contentInset，最后将searchbar（例如）添加到scrollview中。以下代码仅为示例，我没有正确设置任何框架，40只是searchbar的虚构高度。我不确定这是否适用于每个iOS版本。

UIWebView * myWebView = [[UIWebView alloc] init]
UISearchBar * mySearchBar = [[UISearchBar alloc] init];
for (NSObject * aSubView in [myWebView subviews]) {
   if ([aSubView isKindOfClass:[UIScrollView class]]) {
      UIScrollView * theScrollView = (UIScrollView *)aSubView;
      theScrollView.contentInset = UIEdgeInsetsMake(40, 0, 0, 0);
      [theScrollView addSubview:mySearchBar];
   }
}

- Nick Weaver

---

我在4.2上尝试了这个，它可以工作。webview包含“Scroller”类吗？ - Nick Weaver

4.3版本仍然有一个UIScrollView子视图。除非苹果故意使用不同的名称创建类似功能的类，否则我怀疑他们会改变它。 - Moshe

Answer 3

想一想，这只是一个带有顶部地址栏的滚动视图，同时网页视图和地址栏始终一起移动。现在，假设您创建了一个滚动视图并添加了两个子视图：地址栏和网页视图（一个在另一个下方）。需要注意的是，在页面加载后（在webViewDidFinishLoad:中），网页视图的高度已确定并固定。

因此，这只是一个滚动视图，其contentSize等于栏的高度加上网页视图的高度。默认情况下，网页视图允许滚动，因为它具有滚动视图作为子视图。由于只有外部滚动视图应该滚动，因此需要关闭网页视图的滚动。为此，请获取第一个子视图（即滚动视图）并使用以下方法禁用其滚动：

(UIScrollView*)[myWebView.subviews objectAtIndex:0].scrollEnabled = NO;

- Akshay

---

你实际上已经实现了这个效果吗？顺便问一下，当滚动时滚动条仅出现在UIWebView中时，地址栏如何包含在UIScrollView中？ - Alex1987

不，我自己没有实现过这个。另外，你是否需要完全模拟Safari的UI？我提到的功能上是一样的。重要的是地址栏应该从屏幕上滚动出去，而不是占据永久空间，这样更多的房地产就可以用于网页。 - Akshay

这个问题困扰了我一段时间。Appstore上有其他应用程序（如Downloads Lite）完全模拟了这种行为...所以我不禁想知道它是如何实现的。 - Alex1987

Answer 4

PeakJi的解决方案有效但有点卡顿。更好的解决方案是向UIScrollView的content offset添加观察者，类似于：

[scrollview addObserver:self forKeyPath:@"contentOffset" 
                                    options:NSKeyValueObservingOptionNew context:nil];

您可以在以下网址找到有关NSKeyValueObserving协议的更多文档：

https://developer.apple.com/library/ios/#documentation/Cocoa/Reference/Foundation/Protocols/NSKeyValueObserving_Protocol/Reference/Reference.html

- Mars Lan