PhoneGap 兼容IOS上移20px(包括启动页,拍照)
引自:http://stackoverflow.com/questions/19209781/ios-7-status-bar-with-phonegap
情景:在ios7下PhoneGap app会上移20px从而被状态栏挡住,查找了些方法后可以解决这问题,但是拍照完返回界面后仍然会出现上移20px的情况,参考了链接后,最终解决方法如下:
in AppDelegate.m //兼容启动页上移20px
- (BOOL)application:(UIApplication*)application didFinishLaunchingWithOptions:(NSDictionary*)launchOptions
{
CGRect screenBounds = [[UIScreen mainScreen] bounds]; #if __has_feature(objc_arc)
self.window = [[UIWindow alloc] initWithFrame:screenBounds];
#else
self.window = [[[UIWindow alloc] initWithFrame:screenBounds] autorelease];
#endif
self.window.autoresizesSubviews = YES; #if __has_feature(objc_arc)
self.viewController = [[MainViewController alloc] init];
#else
self.viewController = [[[MainViewController alloc] init] autorelease];
#endif
self.viewController.useSplashScreen = YES; // Set your app's start page by setting the <content src='foo.html' /> tag in config.xml.
// If necessary, uncomment the line below to override it.
// self.viewController.startPage = @"index.html"; // NOTE: To customize the view's frame size (which defaults to full screen), override
// [self.viewController viewWillAppear:] in your view controller. self.window.rootViewController = self.viewController;
[self.window makeKeyAndVisible];
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7)
{
[application setStatusBarStyle:UIStatusBarStyleLightContent];
self.window.clipsToBounds = YES;
self.window.frame = CGRectMake(0, 20, self.window.frame.size.width, self.window.frame.size.height-20);
} return YES;
}
In MainViewController.h:
@interface MainViewController : CDVViewController
@property(atomic)BOOL viewSizeChanged;
@property(atomic)int number;
@end
In MainViewController.m:
@implementation MainViewController
@synthesize viewSizeChanged;
@synthesize number;
[...]
- (id)init
{
self = [super init];
if (self) {
self.viewSizeChanged=NO;
self.number=0;
// Uncomment to override the CDVCommandDelegateImpl used
// _commandDelegate = [[MainCommandDelegate alloc] initWithViewController:self];
// Uncomment to override the CDVCommandQueue used
// _commandQueue = [[MainCommandQueue alloc] initWithViewController:self];
}
return self;
} [...]
- (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.
//Lower screen 20px on ios 7
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= && !self.viewSizeChanged) {
if (self.number==1) {
CGRect viewBounds = [self.webView bounds];
viewBounds.origin.y = ;
viewBounds.size.height = viewBounds.size.height - ;
self.webView.frame = viewBounds;
self.viewSizeChanged = YES;
} self.number=1;
}
[super viewWillAppear:animated];
}
Now for the viewport problem, in your deviceready event listener, add this (using jQuery):
if (window.device && parseFloat(window.device.version) >= 7) {
$(window).on('orientationchange', function () {
var orientation = parseInt(window.orientation, 10);
// We now the width of the device is 320px for all iphones
// Default height for landscape (remove the 20px statusbar)
var height = 300;
// Default width for portrait
var width = 320;
if (orientation !== -90 && orientation !== 90 ) {
// Portrait height is that of the document minus the 20px of
// the statusbar
height = document.documentElement.clientHeight - 20;
} else {
// This one I found experimenting. It seems the clientHeight
// property is wrongly set (or I misunderstood how it was
// supposed to work).
// Dunno if it's specific to my setup.
width = document.documentElement.clientHeight + 20;
}
document.querySelector('meta[name=viewport]')
.setAttribute('content',
'width=' + width + ',' +
'height=' + height + ',' +
'initial-scale=1.0,maximum-scale=1.0,user-scalable=no');
})
.trigger('orientationchange');
}
Here is the viewport I use for other versions:
<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0" />
测试结果:完美解决。
PhoneGap 兼容IOS上移20px(包括启动页,拍照)的更多相关文章
- 用Flutter开发的跨平台项目,完美运行在Android和IOS上,Material简洁风格,包括启动页、引导页、注册、登录、首页、体系、公众号、导航、项目,还有漂亮的妹子图库,运行极度流畅,结构清晰,代码规范,值得拥有
Flutter学习资源汇总持续更新中...... Flutter官方网站 Flutter中文网 wendux的Flutter实战 Flutter官方exampleflutter_gallery 阿里巴 ...
- [摘抄]iOS App icon、启动页、图标规范
以下内容都是我在做App时通过自己的经验和精品的分析得来的,希望会帮助到你.但是有时个别情况也要个别分析,要活学活用. 一. App Icon 在设计iOS App Icon时,设计师不需要切圆角, ...
- phonegap ios默认启动页
phonegap创建的项目默认的启动界面是phonegap的图标,想去掉这个图标,有两个方法,第一就是将resourece下面的splash文件下面的图片改成自己想要的启动页面,名字要相同,替换掉它默 ...
- 【IOS】模仿"抽屉新热榜"动态启动页YFSplashScreen
IOS最好要设置系统默认启动页面,不然进入应用就会突然闪现黑色画面 下图是我们要实现的效果: 总体思路:设置一个系统默认启动页面,在进入didFinishLaunchingWithOptions时, ...
- iOS启动页设置
点击项目->TARGETS->App Icons and Launch Images->Launch Images Source->Use Asset Catalog...-& ...
- [iOS]利用Appicon and Launchimage Maker生成并配置iOSApp的图标和启动页
一.先来研究下这个软件->Appicon and Launchimage Maker 首先打开你电脑上的AppStore,然后搜索:AppIcon 然后回车: 这里我们先使用免费版的点击下载.( ...
- iOS LaunchScreen设置启动图片,启动页停留时间
[新建的iOS 项目启动画面默认为LaunchScreen.xib] 如果想实现一张图片作为启动页,如下图
- iOS开发 关于启动页和停留时间的设置
引言: 在开发一款商业App时,我们大都会为我们的App设置一个启动页. 苹果官方对于iOS启动页的设计说明: 为了增强应用程序启动时的用户体验,您应该提供一个启动图像.启动图像与应用程序的首屏幕看起 ...
- iOS LaunchScreen设置启动图片 启动页停留时间
问题:想实现类似微信启动页一样 设置为一个整页面的图片 问题二:iOS启动页面怎样设置多停留一会 新建的iOS 项目启动画面默觉得LaunchScreen.xib 假设想实现一张图片作为启动页,例如以 ...
随机推荐
- 一次httpserver优化的经验和教训(silverlight游戏 - 金庸群侠传X0.5上线记)
金X因为被推荐到ACFUN游戏排行第一名.并同一时候在17YY.7K7K.U77.17173等各大小游戏站点上线.迎来了在线用户数量的爆炸式增长.眼下各大站点使用外链方式.也就是实际链接到金X官网的s ...
- zombie process
僵尸进程:子进程退出后,父进程还没有回收子进程的资源,那么这个子进程就处于僵尸状态.Q1:“资源”是些什么?Q2:父进程如何回收子进程的资源? 内核为每个终止子进程保存了一定量的信息,所以当终止进程的 ...
- 微信小程序下拉按钮动画
有些时候要求下拉按钮需要动画效果,但又不需要引入插件. 这时需要手动写一个动画. 主要思路: 动态切换class 默认与动画转向的样式编写 上图是默认给出的按钮向下的样式, 上图是动画转向后的样式 上 ...
- codeblocks如何watch指针
如果这个指针是指向一个一维数组,那么在watch窗口中右击并选择Dereference,会看到数组的第一个元素 如果这个指针是指向一个struct,那么在watch窗口中右击并选择Dereferenc ...
- jquery中Uncaught TypeError: $(...).ajaxUpload is not a function(…)错误解决方法
错误原因:该函数不是jquery的核心函数,所以需要外部引入ajaxfileupload.js文件,可能是没有引入,或者引入的js文件互相冲突 解决方法:每次进入一个函数之前打印该函数所有的js文件, ...
- centos修改启动顺序,登录后提示,启动级别,主机名,免密登录
修改启动顺序 # vim /etc/inittab ....... d:3:initdefault: #找到这一行,d:3:initdefault:最小化启动 d:5:initdefault:图形界 ...
- Say goodbye to 重复代码---Eclipse代码模板的使用
我们在开发过程中,有些代码是经常重复编写的,而且是必要的,如单例模式,观察者模式. 每次都是重复重复再重复. 那么如何提高我们的效率呢? 要记住,我们使用的是IDE,不是文本编辑器.善用工具,事半功倍 ...
- winform 的 checklistbox动态绑定并选中值
绑定的代码:这里绑定的是一个泛型 BLL.PowerBLL powerbll = new BLL.PowerBLL(); checkpower.DataSource = powerbll.GetAll ...
- hdu 4704(费马小定理)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4704 思路:一道整数划分题目,不难推出公式:2^(n-1),根据费马小定理:(2,MOD)互质,则2^ ...
- android Service 保持不被杀死
Android开发的过程中,每次调用startService(Intent)的时候,都会调用该Service对象的onStartCommand(Intent,int,int)方法,然后在onStart ...