gpt4 book ai didi

javascript - 使用 jQuery Mobile 和 Cordova 调整 webview 大小时 iPhone 模拟器中的高度错误

转载 作者:塔克拉玛干 更新时间:2023-11-02 21:19:33 25 4
gpt4 key购买 nike

我尝试将 AdMob 添加到 Cordova 项目中,因此我在应用加载时修改了 webview 大小。

- (void)viewWillAppear:(BOOL)animated
{
// View defaults to full size. If you want to customize the view's size, or its subviews (e.g. webView),
// you can do so here.

/*add admob*/
CGSize sizeOfScreen = [[UIScreen mainScreen] bounds].size;
CGSize sizeOfView = self.view.bounds.size;
CGRect statusBarFrame = [[UIApplication sharedApplication] statusBarFrame];

if (UIInterfaceOrientationIsLandscape(self.interfaceOrientation))
{
//landscape view code
CGPoint origin = CGPointMake(0, sizeOfScreen.width - CGSizeFromGADAdSize(kGADAdSizeSmartBannerLandscape).height-statusBarFrame.size.width);
bannerView_ = [[[GADBannerView alloc]initWithAdSize:kGADAdSizeSmartBannerLandscape origin:origin] autorelease];
}else{
//portrait view code
CGPoint origin = CGPointMake(0, sizeOfScreen.height - CGSizeFromGADAdSize(kGADAdSizeSmartBannerPortrait).height-statusBarFrame.size.height);
bannerView_ = [[[GADBannerView alloc]initWithAdSize:kGADAdSizeSmartBannerPortrait origin:origin] autorelease];
}

bannerView_.adUnitID = MY_BANNER_UNIT_ID;
bannerView_.rootViewController = self;
[self.view addSubview:bannerView_];
GADRequest *request = [GADRequest request];

request.testing = YES;
[bannerView_ loadRequest:request];

/*resize webview*/
CGRect webViewFrame = [ [ UIScreen mainScreen ] applicationFrame ];
CGRect windowFrame = [ [ UIScreen mainScreen ] bounds ];

webViewFrame.origin = windowFrame.origin;

if (UIInterfaceOrientationIsLandscape(self.interfaceOrientation)){
webViewFrame.size.height = sizeOfScreen.width-CGSizeFromGADAdSize(kGADAdSizeSmartBannerLandscape).height-statusBarFrame.size.width;
webViewFrame.size.width = sizeOfScreen.height;

}else{
webViewFrame.size.height = windowFrame.size.height-CGSizeFromGADAdSize(kGADAdSizeSmartBannerPortrait).height-statusBarFrame.size.height;
webViewFrame.size.width = sizeOfScreen.width;
}

self.webView.frame = webViewFrame;

[super viewWillAppear:animated];
}

现在 webview 的大小应该是 320X410。但是,加载时页面底部有更多关于 10px 的空白 block 。同样的问题也出现在横向 View 中。

这是执行截图。 This is executed screenshots

此问题仅在 webview 调整大小时出现,并且内容超出屏幕没有问题。此问题将出现在 iphone 5.0 5.1 6.0 模拟器中,不会出现在 Retina 4 英寸纵向 View 中,也不会出现在 ipad 模拟器中。

这是html代码:

<!DOCTYPE html> 
<html>

<head>
<meta charset="utf-8">
<title>Single page template</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0-beta.1/jquery.mobile-1.3.0-beta.1.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0-beta.1/jquery.mobile-1.3.0-beta.1.min.js"></script>
</head>
<script type="text/javascript">
$(document).ready(function() {
alert($(window).height());
alert($(document).height());
alert($("body").height());
});
</script>
<body>

<div data-role="page">

<div data-role="header">
<h1>Single page</h1>
</div><!-- /header -->

<div data-role="content">
<p>This is a single page boilerplate template that you can copy to build your first jQuery Mobile page. Each link or form from here will pull a new page in via Ajax to support the animated page transitions.</p>
</div><!-- /content -->

</div><!-- /page -->

</body>
</html>

配置文件

<preference name="KeyboardDisplayRequiresUserAction" value="true" />
<preference name="SuppressesIncrementalRendering" value="false" />
<preference name="UIWebViewBounce" value="false" />
<preference name="TopActivityIndicator" value="gray" />
<preference name="EnableLocation" value="false" />
<preference name="EnableViewportScale" value="false" />
<preference name="AutoHideSplashScreen" value="true" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="MediaPlaybackRequiresUserAction" value="false" />
<preference name="AllowInlineMediaPlayback" value="false" />
<preference name="OpenAllWhitelistURLsInWebView" value="false" />
<preference name="BackupWebStorage" value="cloud" />

应用初始化

self.window = [[[UIWindow alloc] initWithFrame:screenBounds] autorelease];
self.window.autoresizesSubviews = YES;
self.viewController = [[[MainViewController alloc] init] autorelease];
self.viewController.useSplashScreen = NO;
self.viewController.wwwFolderName = @"www";
self.viewController.startPage = @"index.html";

Cordova 2.3.0Xcode 4.5.2jQuery Mobile 1.3.0 beta1, 1.2.0

我该如何解决这个问题?谢谢!

最佳答案

在html头部使用viewport标签

<meta name="viewport" content="user-scalable=yes, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densityDpi=device-dpi" />

还要确保 EnableViewportScale 必须为 true 才能启用缩放。

关于javascript - 使用 jQuery Mobile 和 Cordova 调整 webview 大小时 iPhone 模拟器中的高度错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14631292/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com