为什么我使用 Apache Cordova 构建的 Windows 10 通用应用程序的任务栏图标大小小于其他应用程序

Question

我正在使用 Visual Studio 2015 和 Apache Cordova 制作我的 UWP 应用程序。但是我的应用程序的任务栏图标看起来比它旁边的所有其他应用程序都小。

我的应用显示最右边的图标。如您所见，它比放置在它左侧的所有其他图标都小（看起来像所有 4 个边都有填充版本）。

这是实际情况Square44x44Logo.scale-100.png，如下所示，我的图像中没有填充

我遵循了 Visual Studios 的 Apache Cordova 项目模板，这是我在 config.xml

中的图标声明

   <platform name="windows">
        <icon height="150" src="res/icons/windows/Square150x150Logo.scale-100.png" width="150" />
        <icon height="360" src="res/icons/windows/Square150x150Logo.scale-240.png" width="360" />
        <icon height="30" src="res/icons/windows/Square30x30Logo.scale-100.png" width="30" />
        <icon height="310" src="res/icons/windows/Square310x310Logo.scale-100.png" width="310" />
        <icon height="106" src="res/icons/windows/Square44x44Logo.scale-240.png" width="106" />
        <icon height="70" src="res/icons/windows/Square70x70Logo.scale-100.png" width="70" />
        <icon height="170" src="res/icons/windows/Square71x71Logo.scale-240.png" width="170" />
        <icon height="50" src="res/icons/windows/StoreLogo.scale-100.png" width="50" />
        <icon height="120" src="res/icons/windows/StoreLogo.scale-240.png" width="120" />
        <icon height="150" src="res/icons/windows/Wide310x150Logo.scale-100.png" width="310" />
        <icon height="360" src="res/icons/windows/Wide310x150Logo.scale-240.png" width="744" />
        <icon height="44" src="res/icons/windows/Square44x44Logo.scale-100.png" width="44" />
        <icon height="71" src="res/icons/windows/Square71x71Logo.scale-100.png" width="71" />
    </platform>

问题

如何使我的应用程序在任务栏上的图标与其左侧的所有其他图标相同。

有什么想法吗？

谢谢。

问题解决后编辑

只是想分享水果。 感谢@TruthSeeker，我的任务栏图标现在看起来像、

谢谢:)

Answer 1

默认情况下它使用镀层图标。您可以通过以下步骤为 windows 平台创建未镀图标：

从您的原始图像创建一个 48x48 图标图像。
将其复制到两个文件中："Square44x44Logo.targetsize-48.png" 和 "Square44x44Logo.targetsize-48_altform-unplated.png"。
将它们复制到项目文件夹->平台->windows->图像文件夹。
运行应用程序，你会看到变化。

windows平台的图标详情可以参考这个文档：Guidelines for tile and icon assets

Answer 2

直接将内容更改到 project folder->platforms->windows->images 文件夹可能可行，但我认为这不是一个好主意。相反，我们应该将我们的图像资源放入 res 文件夹，并让 visual studio 在 build.

期间将内容放入正确的位置

所以，试试这些步骤，

创建一个 48px x 48px png 版本的图标图像
另存为Square44x44Logo.targetsize-48.png和Square44x44Logo.targetsize-48_altform-unplated.png
将这两个文件复制到项目的 res\icons\windows 文件夹中
现在，是时候编辑 config.xml 文件了

将 2 个文件添加到您的 config.xml（无论您拥有什么，它都应该可以工作）

<icon src="res/icons/windows/Square44x44Logo.targetsize-48.png" target="Square44x44Logo"/>
<icon src="res/icons/windows/Square44x44Logo.targetsize-48_altform-unplated.png" target="Square44x44Logo" />

现在，构建并运行您的应用程序。

如果还是不行，请清空文件夹 project folder->platforms->windows->images，然后再次运行。现在您将能够看到未电镀的瓷砖。

希望对您有所帮助。

谢谢。

为什么我使用 Apache Cordova 构建的 Windows 10 通用应用程序的任务栏图标大小小于其他应用程序

Why is The size of Taskbar Icon of my Windows 10 Universal App built with Apache Cordova is Smaller than Other Apps

cordova

visual-studio-2015

uwp

windows-10-universal