iPhone 中单击/触摸时 UIWebView 上的自定义控件覆盖

Question

http://startupmeme.com/wp-content/uploads /2008/09/stanza-on-iphone.png

我想实现像著名的 Stanza 应用程序屏幕截图所示的功能。

1. 内容在 UIWebView 的帮助下以 html 格式显示

2. 单击 UIWebView 将显示两个覆盖控件（顶部和底部）< /p>

3. 底部工具栏由控件和控件组成。用于分页的滑块

请帮忙。

我如何通过以下方式实现上述目标：

1. 如何构建这些自定义控件？

2. 单击时，我将如何覆盖这些控件？

3. 如何组合 UIToolbar（包含控件）和 UIToolbar？滑块？

4. 还需要过渡幻灯片效果，顶部标题来自屏幕顶部，底部控件来自屏幕顶部。滑块来自屏幕底部。我将如何实现这一点？

请帮我详细解答（a）-（d）。一些代码指导会非常有帮助。

谢谢

Answer 1

我正在做你在我最近一直在做的一个项目中寻找的东西。

基本上，我在 UINavigationController 中有一个 UIWebView，其中有一个 UIToolbar 作为 UIWebView 的同级。我使用 IB 设置所有这些的布局，以创建链接到我的视图控制器类的笔尖。我假设您知道如何使用 IB 以及如何正确设置所有委托、IBOutlet 等，因此这里不再介绍。

您需要在视图控制器中实现适当的委托才能完成所有工作。这是我的视图控制器类的界面：

@interface MyViewController : UIViewController <UIWebViewDelegate, UIGestureRecognizerDelegate> {

}

@property (retain) IBOutlet UIWebView *webView;
@property (retain) IBOutlet UINavigationItem *navigationItem;
@property (retain) IBOutlet UIToolbar *toolbar;

- (void)handleTapFrom:(UITapGestureRecognizer *)recognizer;

// UIGestureRecognizerDelegate methods
- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer;
- (BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer;
- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldReceiveTouch:(UITouch *)touch;

// UIWebViewDelegate methods
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType;
- (void)webViewDidStartLoad:(UIWebView *)webView;
- (void)webViewDidFinishLoad:(UIWebView *)webView;
- (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error;

@end

从技术上讲，您所询问的内容只需要 UIGestureRecognizerDelegate 实现，但我认为您会在 webView 中做一些有趣的事情，因此也想实现 UIWebViewDelegate

我发现实现 UIWebViewDelegate 是至关重要的以下是这三个 UGestureRecognizer 委托方法，因为 UIWebView 也可以识别点击，所以这一切都可以工作：

- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer
{
    return YES;
}

- (BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer
{
    return YES;
}

- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldReceiveTouch:(UITouch *)touch
{
    return YES;
}

我在控制器的 viewDidLoad 方法内的 webView 上注册了一个 UITapGestureRecognizer：

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view from its nib.

    // I perform other appropriate initialization here like adding or removing items from the navigation bar or toolbar

    UITapGestureRecognizer *tapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleTapFrom:)];
    tapRecognizer.numberOfTapsRequired = 1;
    tapRecognizer.delegate = self;
    [self.webView addGestureRecognizer:tapRecognizer];
    [tapRecognizer release];
}

这是我的 handleTapFrom 回调：

- (void)handleTapFrom:(UITapGestureRecognizer *)recognizer
{
    CGPoint location = [recognizer locationInView:self.navigationController.topViewController.view];
    CGRect bounds = self.navigationController.topViewController.view.bounds;

    if (location.x < bounds.size.width / 5.0) {
        // This is in the left most quadrant

        // I implement code here to perform a "previous page" action
    } else if (location.x > bounds.size.width * 4.0 / 5.0) {
        // This is in the right most quadrant

        // I implement code here to perform a "next page" action
    } else if ((location.x > bounds.size.width / 3.0) && (location.x < bounds.size.width * 2.0 / 3.0)) {
        // This is in the middle third
        BOOL hidden = [self.navigationController isNavigationBarHidden];

        // resize the height of self.webView1, self.webView2, and self.webView3 based on the toolbar hiding / showing
        CGRect webViewControllerFrame = self.webView.frame;
        webViewControllerFrame.size.height += (hidden ? -44 : 44);
        self.webView.frame = webViewControllerFrame;

        // I hide all of the upper status bar and navigation bar, and bottom toolbar for a clean reading screen
        [[UIApplication sharedApplication] setStatusBarHidden:!hidden];
        [self.navigationController setNavigationBarHidden:!hidden animated:YES];
        self.toolbar.hidden = !hidden;

        // I perform content relayout here in the now modified webView screen real estate
    }
}

这个基本框架让我继续前进，希望能回答您的问题或者至少为你指明了正确的方向。

注意：

我还没有处理这样的事实：我可能会将点击解释为“显示/隐藏状态/导航/工具栏”，并且 UIWebView 可能会在同一个点击上充当单击的链接等。我正在计划研究很快……

您在 Stanza 屏幕截图中显示的透明度并不是什么大问题。您必须使用各种导航/工具栏上的 alpha 设置来完成此操作，并更改上面 UIWebView 上的调整大小代码。事实上，我会定期覆盖一个额外的半透明工具栏以用于临时状态、警报等，并且不会调整 UIWebView 的大小，以便它位于下方并且通过此警报工具栏仍然有些可见。

Answer 2

bg 清楚地了解 iPhone 机制，所以肯定+1，但我可能知道另一种方式。

将按钮（或视图）叠加到顶部。

根据需要注册一个点击捕捉器（识别器、以 [[事件触摸] tapCount] 或 IB 结束的触摸，或手动操作...基本上抓取点击）。

获得点击后，保存它所在的位置，调用一个函数来通知您的 Web 视图进行分割（或者如果它像节，则表示添加覆盖），然后通过“假装”触摸来通过视图发送触摸，类似对此： 有没有办法传递触摸通过 iPhone？

或创建您自己的目标操作方法并发送它（可能更容易）。

如果您了解 SDK，上面的内容应该对您有意义。特别是视图和所有相关内容（图形除外，您可以跳过该阅读）