在 iOS 中旋转设备时，Webview 内容设置不正确

Posted 2023-03-11

【中文标题】在 iOS 中旋转设备时，Webview 内容设置不正确

【英文标题】：Webview content not set properly when device is rotated in iOS

【发布时间】：2013-05-23 06:06:54

【问题描述】：

我有一个应用程序，其中我有一个 web 视图，我在 webview 中显示我的 html 页面。当 html 页面的内容超出 web 视图的框架时，我会将 web 视图框架之外的其余内容传递到新页面。这工作正常。

当网络视图以纵向模式启动时，当我将屏幕旋转为横向时，网络视图内容会正确显示。但是当我将网页视图的内容滚动到下一页然后旋转网页视图时，旋转无法正常工作。在网页视图上显示第一页的一半内容和第二页的一半内容。

这是我的代码：

- (void)viewDidLoad

    [super viewDidLoad];
    backbuttonclick=NO;
    textFontSize=100;
    pageControlBeingUsed = NO;
    pagecontrol = [[StyledPageControl alloc] initWithFrame:CGRectMake(208, 959, 358, 36)];
    if (orientation == UIInterfaceOrientationLandscapeLeft || orientation ==  UIInterfaceOrientationLandscapeRight) 

        //Landscape
        viewstatus =@"landscape";

        NSString *insertRule1 = [NSString stringWithFormat:@"addCs-s-rule('html', 'padding: 0px;margin-top:20px; height: %fpx; -webkit-column-gap: 0px; -webkit-column-width: %fpx;')", 680.0f, 1024.0f];
        [webview stringByEvaluatingjavascriptFromString:insertRule1];
        pagecontrol.frame =CGRectMake(300, 710, 150, 36);

    else

        //Portrait
        viewstatus =@"portrait";
        NSString *insertRule1 = [NSString stringWithFormat:@"addCs-s-rule('html', 'padding: 0px;margin-top:20px; height: %fpx; -webkit-column-gap: 0px; -webkit-column-width: %fpx;')", 905.0f, 768.0f];
        [webview stringByEvaluatingJavaScriptFromString:insertRule1];
        pagecontrol.frame =CGRectMake(208, 959, 358, 36);

    

    UITapGestureRecognizer* doubleTap = [[UITapGestureRecognizer alloc] initWithTarget:self action: @selector(handleDoubleTap:)];
    doubleTap.numberOfTouchesRequired = 2 ;
    [self.view addGestureRecognizer:doubleTap] ;
    UIScrollView* sv = nil;
    for(UIView* v in self.webview.subviews)
        if([v isKindOfClass:[UIScrollView class] ])
            sv = (UIScrollView*) v;
            [sv setZoomScale:9.0f animated:YES];
            sv.bounces = NO;
        
    

    [pagecontrol setAutoresizingMask:UIViewAutoresizingFlexibleWidth];
    [pagecontrol addTarget:self action:@selector(changePage:) forControlEvents:UIControlEventValueChanged];
    [self.view addSubview:pagecontrol];
    webview.scrollView.delegate=self;
    webview.scrollView.showsVerticalScrollIndicator=NO;
    webview.scrollView.bounces = NO;
    webview.scrollView.pagingEnabled = YES;

    NSURL *url = [NSURL fileURLWithPath:dataObject];
    NSURLRequest *requestObj = [NSURLRequest requestWithURL:url];
    [webview loadRequest:requestObj];

在 web 视图中完成加载我已经编写了 css 来将 html 内容分成页面，如果创建了内容大小然后是视图大小：

-(void)webViewDidFinishLoad:(UIWebView *)webView 
    CGFloat height = [[webview stringByEvaluatingJavaScriptFromString:@"document.body.scrollHeight"] floatValue];

    if (height<960)
    
        pagecount=1;
    
    if (height>960&&height<1920)
    
        pagecount=2;
    
    if (height>1920&&height<2880)
    
        pagecount=3;
    
    if (height>1024)
    
        NSString *varMySheet = @"var mySheet = document.styleSheets[0];";

        NSString *addCs-s-rule =  @"function addCs-s-rule(selector, newRule) "
        "if (mySheet.addRule) "
        "mySheet.addRule(selector, newRule);"                               // For Internet Explorer
        " else "
        "ruleIndex = mySheet.cssRules.length;"
        "mySheet.insertRule(selector + '' + newRule + ';', ruleIndex);"   // For Firefox, Chrome, etc.
        ""
        "";
        NSString *insertRule1 ;

        if([viewstatus isEqualToString:@"landscape"])
        
            insertRule1 = [NSString stringWithFormat:@"addCs-s-rule('html', 'padding: 0px;margin-top:10px; height: %fpx; -webkit-column-gap:0px; -webkit-column-width: %fpx;')",
680.0f, 1024.0f];
            [webview stringByEvaluatingJavaScriptFromString:insertRule1];
        
        if([viewstatus isEqualToString:@"portrait"])
        

            insertRule1 = [NSString stringWithFormat:@"addCs-s-rule('html', 'padding: 0px;margin-top:10px; height: %fpx; -webkit-column-gap: 0px; -webkit-column-width: %fpx;')",
905.0f, 768.0f];
            [webview stringByEvaluatingJavaScriptFromString:insertRule1];
        

        NSString *insertRule2 = [NSString stringWithFormat:@"addCs-s-rule('p', 'text-align: justify;')"];
        NSString *setHighlightColorRule = [NSString stringWithFormat:@"addCs-s-rule('highlight', 'background-color: yellow;')"];
        [webView stringByEvaluatingJavaScriptFromString:varMySheet];
        [webView stringByEvaluatingJavaScriptFromString:addCs-s-rule];
        [webView stringByEvaluatingJavaScriptFromString:insertRule1];
        [webView stringByEvaluatingJavaScriptFromString:insertRule2];
        [webView stringByEvaluatingJavaScriptFromString:setHighlightColorRule];
    

    int totalWidth = [[webview stringByEvaluatingJavaScriptFromString:@"document.documentElement.scrollWidth"] intValue];
    int hi = (int)((float)totalWidth/webview.bounds.size.width);
    self.pagecontrol.numberOfPages=hi;
    self.pagecontrol.hidesForSinglePage=YES;
    [self.pagecontrol setPageControlStyle:PageControlStyleStrokedCircle];
     

这是我的滚动方法：

-(void)scrollViewDidScroll:(UIScrollView *)scrollView

    if (!pageControlBeingUsed)
    
        self.webview.scrollView.showsHorizontalScrollIndicator=NO;
        CGFloat pageWidth = self.webview.scrollView.frame.size.width;
        int page = floor((self.webview.scrollView.contentOffset.x - pageWidth/2)/pageWidth)+1;
        NSLog(@"%d",page);
        self.pagecontrol.currentPage = page;
        [webview.superview setAutoresizesSubviews:YES];
        webview.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin|UIViewAutoresizingFlexibleRightMargin;
       return;
    

这是我的轮换方法：

- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration

    if(toInterfaceOrientation == 1 || toInterfaceOrientation == 2)
    
        viewstatus =@"portrait";
        [self.view bringSubviewToFront:pagecontrol];
        NSString *insertRule1 = [NSString stringWithFormat:@"addCs-s-rule('html', 'padding: 0px;margin-top:20px; height: %fpx; -webkit-column-gap: 0px; -webkit-column-width: %fpx;')", 905.0f, 768.0f];
        [webview stringByEvaluatingJavaScriptFromString:insertRule1];
        [webview.superview setAutoresizesSubviews:YES];
        webview.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin|UIViewAutoresizingFlexibleRightMargin;
        pagecontrol.frame =CGRectMake(230, 959, 600, 36);

    
    if(toInterfaceOrientation == 3 || toInterfaceOrientation == 4)
    
        viewstatus =@"landscape";
        [self.view bringSubviewToFront:pagecontrol];
        NSString *insertRule1 = [NSString stringWithFormat:@"addCs-s-rule('html', 'padding: 0px;margin-top:10px; height: %fpx; -webkit-column-gap: 0px; -webkit-column-width: %fpx;')", 680.0f, 1024.0f];
        [webview stringByEvaluatingJavaScriptFromString:insertRule1];
        [webview.superview setAutoresizesSubviews:YES];
        webview.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin|UIViewAutoresizingFlexibleRightMargin;
       pagecontrol.frame =CGRectMake(300, 710, 150, 36);

    

【问题讨论】：

你能贴一些代码吗？

@NiravPatel 我已经编辑了我的问题。请检查

哎呀，你写了很多代码......现在告诉我你有没有在 XIB 中使用 webview？

@NiravPatel 是的，我已经在 xib 中进行了网页查看

嗨@NiravPatel 已经检查了我的问题

【参考方案1】：

是的，如果您在 xib 中使用了 webview，那么为什么不让它自动调整大小？如下所示...