配置用 Visual Studio Tools for Apache Cordova 生成的应用

这篇文章介绍了用于 Apache Cordova 的 Visual Studio 工具,是一个预发布的软件。所述功能呈现在预览版中,并可能会发生更改。你可以从 Microsoft 下载中心下载预览版。

每个项目中包含的 config.xml 文件会提供你的应用的大部分配置,例如应用的显示名称和起始页。 你可以在“解决方案管理器”中双击此文件以在配置设计器中将其打开,配置设计器是针对此文件的 Visual Studio 界面。 或者你可以从“上下文”菜单中选择**“查看代码”**来直接编辑文件。 有关此文件的详细信息,请参阅 Apache Cordova 文档中的 config.xml 文件。 有关在 Visual Studio 中配置此文件的信息,请参阅这些主题:

警告

如果你直接编辑 config.xml 文件,请确保你的 XML 元素和属性是有效的。XML 文件中的无效内容会在你创建应用引发错误。

Visual Studio 还提供了其他方法来配置你的应用以支持特定于平台的内容:

  • 特定于平台的视觉资产(在此主题中)

  • 特定于平台的内容(在此主题中)

  • 特定于平台的配置文件(在此主题中)

配置你的 Windows 目标版本

默认情况下,当使用适用于 Apache Cordova 的 Visual Studio Tools 为 Windows 生成 Cordova 应用时,你将为 Windows 8.0 生成应用。 你可以在配置设计器中将目标版本更改为 8.1,在 Windows 选项卡(“Windows 目标版本”)下。

在配置设计器中配置 Windows

在更改 Windows 目标版本时,将对 config.xml 文件中的以下行进行修改:

<preference name="windows-target-version" value="8.1" />

平台特有的视觉资产

你可以使用项目中的**“res”**文件夹来根据设备分辨率和平台指定视觉资产,例如图标和初始屏幕。 如果你没有在项目中看见此文件夹,你可以手动在“解决方案管理器”中重新创建。

  • res\icons\platform 包含了用于每个平台的应用图标。

  • res\screens\platform 包含了用于每个平台的初始屏幕。

每个资源的文件名提供了关于资产的一些信息。 例如,res\icons\screens\android 文件夹中的 screen-ldpi-portrait.png 文件为竖屏状态下的 Android 设备提供了一个低分标率屏幕(ldpi,或 426x320)的初始屏幕。

下表提供了在你要支持具体的设备和屏幕分辨率时所需要的初始屏幕和图标的完整列表。 有关这些资产的更多信息,请参阅 Apache Cordova 文档中的图标和初始屏幕

用于 Android 的图标和初始屏幕

解决方法

res/icons/android/icon-36-ldpi.png

36x36

res/icons/android/icon-48-mdpi.png

48x48

res/icons/android/icon-72-hdpi.png

72x72

res/icons/android/icon-96-xhdpi.png

96x96

res/screens/android/screen-xhdpi-landscape.png

720x960

res/screens/android/screen-xhdpi-portrait.png

960x720

res/screens/android/screen-hdpi-landscape.png

480x640

res/screens/android/screen-hdpi-portrait.png

640x480

res/screens/android/screen-mdpi-landscape.png

320x470

res/screens/android/screen-mdpi-portrait.png

470x320

res/screens/android/screen-ldpi-landscape.png

320x426

res/screens/android/screen-ldpi-portrait.png

426x320

用于 iOS 的图标和初始屏幕

解决方法

res/icons/ios/icon-57-2x.png

114x114(Retina 显示屏)

res/icons/ios/icon-57.png

57x57

res/icons/ios/icon-72-2x.png

144x144(Retina 显示屏)

res/icons/ios/icon-72.png

72x72

res/icons/ios/icon-40.png

40x40

res/icons/ios/icon-40-2x.png

80x80(Retina 显示屏)

res/icons/ios/icon-50.png

50x50

res/icons/ios/icon-50-2x.png

100x100(Retina 显示屏)

res/icons/ios/icon-60@3x.png

180x180(Retina 显示屏)

res/icons/ios/icon-76.png

76x76

res/icons/ios/icon-76-2x.png

152x152(Retina 显示屏)

res/icons/ios/icon-small.png

29x29

res/icons/ios/icon-small-2x.png

58x58(Retina 显示屏)

res/screens/ios/screen-ipad-landscape.png

1024x768

res/screens/ios/screen-ipad-landscape-2x.png

2048x1536

res/screens/ios/screen-ipad-portrait.png

768x1024

res/screens/ios/screen-ipad-portrait-2x.png

1536x2048

res/screens/ios/screen-iphone-landscape-736h.png

2208x1242

res/screens/ios/screen-iphone-portrait-2x.png

640x960

res/screens/ios/screen-iphone-portrait.png

320x480

res/screens/ios/screen-iphone-portrait-667h.png

750x1334

res/screens/ios/screen-iphone-portrait-736h.png

1242x2208

res/screens/ios/screen-iphone-568h-2x.png

640x1136

用于 Windows Phone 8 的图标和初始屏幕

解决方法

res/icons/wp8/ApplicationIcon.png

62x62

res/icons/wp8/Background.png

173x173

res/screens/wp8/SplashScreenImage.png

480x800

用于 Windows Phone 8.1 的图标和初始屏幕

解决方法

res/icons/windows/Square150x150Logo.scale-240.png

360x360

res/icons/windows/Square44x44Logo.scale-240.png

106x106

res/icons/windows/Square71x71Logo.scale-240.png

170x170

res/icons/windows/StoreLogo.scale-240.png

120x120

res/icons/windows/Wide310x150Logo.scale-240.png

744x360

res/screens/windows/SplashScreen.scale-240.png

1152x1920

用于 Windows 的图标和初始屏幕

解决方法

res/icons/windows/logo.png

150x150

res/icons/windows/smalllogo.png

30x30

res/icons/windows/storelogo.png

50x50

res/screens/windows/splashscreen.png

620x300

Android 支持名为 NinePatch 的可扩展类型的图像,该图像可用作你的初始屏幕。

若要在 Android 上使用 NinePatch 初始屏幕图像

  1. 更改 config.xml 中的以下行:

    <preference name="SplashScreen" value="screen" />
    

    更改为

    <preference name="SplashScreen" value="splash" />
    
  2. 将 NinePatch 图像放在以下位置:res\native\android\res\drawable-nodpi\splash.9.png

    在生成时,图像将复制到所需的输出文件夹中。

平台特有的内容

你可以在项目的**“合并项”文件夹中加入平台特有的 HTML、CSS 和 JavaScript 文件。 你添加到此文件夹中的文件会将内容添加到你的应用的平台特有版本中,或者替代使用相同文件名的非平台特有内容。 有关使用“合并项”**文件夹的详细信息,请参阅 Apache Cordova 文档中的“使用合并项来自定义每个平台”一节。

如果你没有在解决方案资源管理器中看到你项目的**“合并项”文件夹,请在解决方案资源管理器中打开项目的快捷菜单,选择“添加”,然后选择“添加平台特有的代码”**来添加“合并项”文件夹。

特定于平台的配置文件

在生成应用时,你可以使用项目中的 res/native 文件夹将内容插入由 Cordova 生成的本地项目中。 这在你需要配置应用以支持某些 Cordova 本身未公开的内容时非常有用。 (添加到项目的插件也将自动修改这些配置文件的自定义版本。)

警告

如有可能,我们建议避免添加特定于平台的配置文件。

下表提供了每个平台的特定信息。

平台

备注

Android

将自定义的 AndroidManifest.xml 文件放置在 res/native/android 文件夹中以配置设置(如自定义的目的)。 在生成针对 Android 的项目的调试配置之后,使用 bld/Debug/platforms/android 文件夹中文件的生成版本。

iOS

将自定义的 Info.plist 文件放置在 res/native/ios/config.xml display name 文件夹中以重写设置(如初识屏幕或图标)。 必须按以下方式重命名 Info.plist 文件名:config.xml 显示名称-Info.plist。 你可以在 cordova-ios GitHub 存储库中找到这些文件的示例版本,或者在build number/cordovaApp 文件夹下,从 Mac(使用远程代理时)上的生成文件夹中使用应用的生成版本。

Windows

将自定义的 package.windows80.appxmanifest (Windows 8.0)、package.windows.appxmanifest (Windows 8.1) 或 package.phone.appxmanifestfile (Windows Phone 8.1) 放置在 res/native/windows 文件夹中以重写各种配置设置。 在生成针对 Windows 或 Windows Phone(通用版)的项目的调试配置之后,使用 bld/Debug/platforms/windows 文件夹中文件的生成版本。

Windows Phone 8

将自定义的 WMAppManifest.xml 文件放置在 res/native/wp8/Properties 文件夹中。 在生成针对 Windows Phone 8 的项目调试配置之后,使用 bld/Debug/platforms/wp8/Properties 文件夹中文件的生成版本。

请参见

概念

管理用 Visual Studio Tools for Apache Cordova 生成的应用的插件

将用 Visual Studio Tools for Apache Cordova 生成的应用打包

Visual Studio Tools for Apache Cordova 入门

其他资源

常见问题