Question

所以我一直在进行phonegap开发一段时间，并在应用程序商店中制作了几个应用程序。我已经制作了iphone和ipad应用程序并将它们完全分开。我知道苹果允许提交可以为两种设备格式化的单个应用程序，我的问题是如何通过phonegap完成这项工作？我知道我可以编辑项目设置并为目标设备选择ipad / iphone。但是我在代码中如何才能使其正常工作？

因为它是html，我控制html（和jquery）中的大小调整。例如，在我的iPhone应用程序中，我可能有：

<img src="asdf.jpg" width="480">

然后那个相同的ipad应用程序将是：

<img src="asdf.jpg" width="1024">

如果我可以在我的www文件夹中有两个html文件，比如index.html和index-ipad.html，那将非常棒，然后它们共享常见的img，css和js文件夹。这可能吗？

我已经广泛检查了phonegap上的文档但找不到任何内容。有人能指点我做一个教程吗？我真的很讨厌在应用商店中为同一内容添加多个应用。

以下编辑评论

也许我不会在html中使用width属性，也许我会这样做：

<img src="asdf_ipad.jpg">

和

<img src="asdf_iphone.jpg">

其中两个图像已根据两个设备调整大小。无论如何，我可以处理html / js / css，我只需要知道如何实现一个“开关”，使ipad呈现与iphone不同。

Answer 1

您可以指定PhoneGap最初打开的文件。看一下应用程序：来自AppDelegate.m的didFinishLaunchingWithOptions

执行以下操作为iPad打开不同的索引页面：

if ([[[UIDevice currentDevice] model] containsString:@"iPad"]) {
    ...
    self.viewController = [[[MainViewController alloc] init] autorelease];
    self.viewController.wwwFolderName = @"www-ipad";
    self.viewController.startPage = @"index.html";
    ...
}

Answer 2

为什么不使用CSS媒体查询来识别您的目标设备并根据需要更新图像？例如，JqueryMobile这样做可以为Retina设备提供高分辨率图标......

Here's an article关于如何使用它们将不同的样式表应用于iPhone与iPad。

希望这有帮助！

Answer 3

一个选项：

<img src="asdf.png" class="asdf"/>

.ipad .asdf {
  width: 1024px;
}
.iphone .asdf {
  width: 480px;
}

$(function() {
  var deviceType = (device.platform=='iPhone' && screen.width==768) ? 'ipad' : 'iphone';
  $('body').addClass(deviceType);
});

注意deviceType逻辑非常简单（即iPad锁定在纵向），您需要扩展逻辑以处理方向，并可能添加更多逻辑来检测Retina设备以及未来更高分辨率的iPad。

Answer 4

好吧，我找到了一个解决方案，我只是使用javascript将页面转发到我的其他html页面，如下所示：

if(screen.width==768)
    window.location='index-ipad.html';

所以我只在index.html文件中有这个代码，然后，当然，我有一个不同的index-ipad.html文件。这让我可以自由地做任何我想做的事情，而不是仅限于轻微的风格变化。注意，这在jquery onload stuff $（function（）{}）中没有用;去图。

我宁愿用“服务器端”方法来解决这个问题，这意味着它所依赖的目标c层。但是，不幸的是，我在目标c中的技能还不尽如人意。如果有人能给我这个解决方案，我将不胜感激！

phonegap ipad / iphone，在这两款设备上都有一个应用程序

4 个答案: