環境

  • Visual Studio 2015 Community
  • 使用したプロジェクトテンプレート:JavaScript\Apache Cordova Apps\空のアプリ(Apache Cordova)
  • アプリを開発している環境:Windows 10 Professional
  • アプリをデプロイしている環境:同PC
  • 使用しているプラグイン:cordova-plugin-media
  • 使用しているNuモジュール:WinJS、Processing.js

やりたいこと

上記環境で開発したアプリに配置するアプリに、以下のアイコンおよびスプラッシュスクリーンを設定したいと考えています。

  • タイル:アプリを示すアイコンを中央に表示、背景は透過(PCのシステム設定に依存した色)
  • スプラッシュスクリーン:画面全体が白色

そのためにやったこと

以下の質問を参考に、config.xmlにBackgroundColorを設定しました。


<platform name="windows">
  <icon src="res/icons/windows/Square150x150Logo.scale-100.png" width="150" height="150" />
  <icon src="res/icons/windows/Square150x150Logo.scale-240.png" width="360" height="360" />
  <icon src="res/icons/windows/Square30x30Logo.scale-100.png" width="30" height="30" />
  <icon src="res/icons/windows/Square310x310Logo.scale-100.png" width="310" height="310" />
  <icon src="res/icons/windows/Square44x44Logo.scale-240.png" width="106" height="106" />
  <icon src="res/icons/windows/Square70x70Logo.scale-100.png" width="70" height="70" />
  <icon src="res/icons/windows/Square71x71Logo.scale-240.png" width="170" height="170" />
  <icon src="res/icons/windows/StoreLogo.scale-100.png" width="50" height="50" />
  <icon src="res/icons/windows/StoreLogo.scale-240.png" width="120" height="120" />
  <icon src="res/icons/windows/Wide310x150Logo.scale-100.png" width="310" height="150" />
  <icon src="res/icons/windows/Wide310x150Logo.scale-240.png" width="744" height="360" />
  <preference name="BackgroundColor" value="0x00ffffff"/> <!-- 追加 -->
</platform>
<platform name="windows">
  <splash src="res/screens/windows/SplashScreen.scale-100.png" width="620" height="300" />
  <splash src="res/screens/windows/SplashScreen.scale-240.png" width="1152" height="1920" />
  <splash src="res/screens/windows/SplashScreenPhone.scale-240.png" width="1152" height="1920" />
  <preference name="BackgroundColor" value="0x00ffffff"/> <!-- 追加 -->
</platform>

しかし、最初のiconを指定している部分に指定したBackgroundColorが無視され、タイルアイコンもスプラッシュスクリーンもすべて白背景で描画されてしまいました。

問題事象のスクリーンショット

質問

スプラッシュスクリーンとタイルに異なる色を指定したい場合は、どのようにすればよいのでしょうか?
Apache Cordovaのリファレンスや、Monacaの開発ドキュメント、Visual StudioでHTML5アプリを開発するためのドキュメントを見た限り、解決策は見つかりませんでした。
もしご存じの方いらっしゃいましたら、アドバイスいただければと思います。