Add an icon to RNTA on windows (#2003)

* fix: Replace placeholder icon/splashscreen images in windows app * Reduce image size * minor lint fix in README * Remove icon from readme for now. * fix * revert README * fix * fix * fix * cleanup the icon * Restore transparency * Include assets in the project files * compressed image
microsoft · May 8, 2024 · e4a9b7d · e4a9b7d
1 parent 83a19bd
commit e4a9b7d
Show file tree

Hide file tree

Showing 59 changed files with 74 additions and 28 deletions.
diff --git a/images/RNTA_full.png b/images/RNTA_full.png
diff --git a/images/RNTA_small.png b/images/RNTA_small.png
diff --git a/images/header.jpg b/images/header.jpg
diff --git a/test/pack.test.mjs b/test/pack.test.mjs
@@ -233,12 +233,27 @@ describe("npm pack", () => {
       "windows/UWP/App.h",
       "windows/UWP/App.idl",
       "windows/UWP/App.xaml",
-      "windows/UWP/Assets/LockScreenLogo.scale-200.png",
+      "windows/UWP/Assets/SplashScreen.scale-100.png",
       "windows/UWP/Assets/SplashScreen.scale-200.png",
+      "windows/UWP/Assets/SplashScreen.scale-400.png",
+      "windows/UWP/Assets/Square150x150Logo.scale-100.png",
       "windows/UWP/Assets/Square150x150Logo.scale-200.png",
+      "windows/UWP/Assets/Square150x150Logo.scale-400.png",
+      "windows/UWP/Assets/Square44x44Logo.altform-lightunplated_targetsize-16.png",
+      "windows/UWP/Assets/Square44x44Logo.altform-lightunplated_targetsize-256.png",
+      "windows/UWP/Assets/Square44x44Logo.altform-lightunplated_targetsize-48.png",
+      "windows/UWP/Assets/Square44x44Logo.altform-unplated_targetsize-16.png",
+      "windows/UWP/Assets/Square44x44Logo.altform-unplated_targetsize-256.png",
+      "windows/UWP/Assets/Square44x44Logo.altform-unplated_targetsize-48.png",
+      "windows/UWP/Assets/Square44x44Logo.scale-100.png",
       "windows/UWP/Assets/Square44x44Logo.scale-200.png",
-      "windows/UWP/Assets/Square44x44Logo.targetsize-24_altform-unplated.png",
-      "windows/UWP/Assets/StoreLogo.png",
+      "windows/UWP/Assets/Square44x44Logo.scale-400.png",
+      "windows/UWP/Assets/Square44x44Logo.targetsize-16.png",
+      "windows/UWP/Assets/Square44x44Logo.targetsize-256.png",
+      "windows/UWP/Assets/Square44x44Logo.targetsize-48.png",
+      "windows/UWP/Assets/StoreLogo.scale-100.png",
+      "windows/UWP/Assets/StoreLogo.scale-200.png",
+      "windows/UWP/Assets/StoreLogo.scale-400.png",
       "windows/UWP/Assets/Wide310x150Logo.scale-200.png",
       "windows/UWP/AutolinkedNativeModules.g.cpp",
       "windows/UWP/AutolinkedNativeModules.g.h",
@@ -257,12 +272,27 @@ describe("npm pack", () => {
       "windows/UWP/pch.h",
       "windows/Win32/AutolinkedNativeModules.g.cpp",
       "windows/Win32/AutolinkedNativeModules.g.h",
-      "windows/Win32/Images/LockScreenLogo.scale-200.png",
+      "windows/Win32/Images/SplashScreen.scale-100.png",
       "windows/Win32/Images/SplashScreen.scale-200.png",
+      "windows/Win32/Images/SplashScreen.scale-400.png",
+      "windows/Win32/Images/Square150x150Logo.scale-100.png",
       "windows/Win32/Images/Square150x150Logo.scale-200.png",
+      "windows/Win32/Images/Square150x150Logo.scale-400.png",
+      "windows/Win32/Images/Square44x44Logo.altform-lightunplated_targetsize-16.png",
+      "windows/Win32/Images/Square44x44Logo.altform-lightunplated_targetsize-256.png",
+      "windows/Win32/Images/Square44x44Logo.altform-lightunplated_targetsize-48.png",
+      "windows/Win32/Images/Square44x44Logo.altform-unplated_targetsize-16.png",
+      "windows/Win32/Images/Square44x44Logo.altform-unplated_targetsize-256.png",
+      "windows/Win32/Images/Square44x44Logo.altform-unplated_targetsize-48.png",
+      "windows/Win32/Images/Square44x44Logo.scale-100.png",
       "windows/Win32/Images/Square44x44Logo.scale-200.png",
-      "windows/Win32/Images/Square44x44Logo.targetsize-24_altform-unplated.png",
-      "windows/Win32/Images/StoreLogo.png",
+      "windows/Win32/Images/Square44x44Logo.scale-400.png",
+      "windows/Win32/Images/Square44x44Logo.targetsize-16.png",
+      "windows/Win32/Images/Square44x44Logo.targetsize-256.png",
+      "windows/Win32/Images/Square44x44Logo.targetsize-48.png",
+      "windows/Win32/Images/StoreLogo.scale-100.png",
+      "windows/Win32/Images/StoreLogo.scale-200.png",
+      "windows/Win32/Images/StoreLogo.scale-400.png",
       "windows/Win32/Images/Wide310x150Logo.scale-200.png",
       "windows/Win32/Main.cpp",
       "windows/Win32/Main.h",

diff --git a/windows/UWP/Assets/LockScreenLogo.scale-200.png b/windows/UWP/Assets/LockScreenLogo.scale-200.png
diff --git a/windows/UWP/Assets/SplashScreen.scale-100.png b/windows/UWP/Assets/SplashScreen.scale-100.png
diff --git a/windows/UWP/Assets/SplashScreen.scale-200.png b/windows/UWP/Assets/SplashScreen.scale-200.png
diff --git a/windows/UWP/Assets/SplashScreen.scale-400.png b/windows/UWP/Assets/SplashScreen.scale-400.png
diff --git a/windows/UWP/Assets/Square150x150Logo.scale-100.png b/windows/UWP/Assets/Square150x150Logo.scale-100.png
diff --git a/windows/UWP/Assets/Square150x150Logo.scale-200.png b/windows/UWP/Assets/Square150x150Logo.scale-200.png
diff --git a/windows/UWP/Assets/Square150x150Logo.scale-400.png b/windows/UWP/Assets/Square150x150Logo.scale-400.png
diff --git a/windows/UWP/Assets/Square44x44Logo.altform-lightunplated_targetsize-16.png b/windows/UWP/Assets/Square44x44Logo.altform-lightunplated_targetsize-16.png
diff --git a/windows/UWP/Assets/Square44x44Logo.altform-lightunplated_targetsize-256.png b/windows/UWP/Assets/Square44x44Logo.altform-lightunplated_targetsize-256.png
diff --git a/windows/UWP/Assets/Square44x44Logo.altform-lightunplated_targetsize-48.png b/windows/UWP/Assets/Square44x44Logo.altform-lightunplated_targetsize-48.png
diff --git a/windows/UWP/Assets/Square44x44Logo.altform-unplated_targetsize-16.png b/windows/UWP/Assets/Square44x44Logo.altform-unplated_targetsize-16.png
diff --git a/windows/UWP/Assets/Square44x44Logo.altform-unplated_targetsize-256.png b/windows/UWP/Assets/Square44x44Logo.altform-unplated_targetsize-256.png
diff --git a/windows/UWP/Assets/Square44x44Logo.altform-unplated_targetsize-48.png b/windows/UWP/Assets/Square44x44Logo.altform-unplated_targetsize-48.png
diff --git a/windows/UWP/Assets/Square44x44Logo.scale-100.png b/windows/UWP/Assets/Square44x44Logo.scale-100.png
diff --git a/windows/UWP/Assets/Square44x44Logo.scale-200.png b/windows/UWP/Assets/Square44x44Logo.scale-200.png
diff --git a/windows/UWP/Assets/Square44x44Logo.scale-400.png b/windows/UWP/Assets/Square44x44Logo.scale-400.png
diff --git a/windows/UWP/Assets/Square44x44Logo.targetsize-16.png b/windows/UWP/Assets/Square44x44Logo.targetsize-16.png
diff --git a/windows/UWP/Assets/Square44x44Logo.targetsize-24_altform-unplated.png b/windows/UWP/Assets/Square44x44Logo.targetsize-24_altform-unplated.png
diff --git a/windows/UWP/Assets/Square44x44Logo.targetsize-256.png b/windows/UWP/Assets/Square44x44Logo.targetsize-256.png
diff --git a/windows/UWP/Assets/Square44x44Logo.targetsize-48.png b/windows/UWP/Assets/Square44x44Logo.targetsize-48.png
diff --git a/windows/UWP/Assets/StoreLogo.png b/windows/UWP/Assets/StoreLogo.png
diff --git a/windows/UWP/Assets/StoreLogo.scale-100.png b/windows/UWP/Assets/StoreLogo.scale-100.png
diff --git a/windows/UWP/Assets/StoreLogo.scale-200.png b/windows/UWP/Assets/StoreLogo.scale-200.png
diff --git a/windows/UWP/Assets/StoreLogo.scale-400.png b/windows/UWP/Assets/StoreLogo.scale-400.png
diff --git a/windows/UWP/Assets/Wide310x150Logo.scale-200.png b/windows/UWP/Assets/Wide310x150Logo.scale-200.png
diff --git a/windows/UWP/Package.appxmanifest b/windows/UWP/Package.appxmanifest
@@ -1,4 +1,4 @@
-<?xml version="1.0" encoding="utf-8"?>
+<?xml version="1.0" encoding="utf-8"?>
 <Package xmlns="http://schemas.microsoft.com/appx/manifest/foundation/windows10"
          xmlns:mp="http://schemas.microsoft.com/appx/2014/phone/manifest"
          xmlns:uap="http://schemas.microsoft.com/appx/manifest/uap/windows10"
@@ -27,7 +27,7 @@
                           BackgroundColor="transparent">
         <uap:DefaultTile Wide310x150Logo="Assets\Wide310x150Logo.png">
         </uap:DefaultTile>
-        <uap:SplashScreen Image="Assets\SplashScreen.png" />
+        <uap:SplashScreen BackgroundColor="#151021" Image="Assets\SplashScreen.png" />
       </uap:VisualElements>
     </Application>
   </Applications>

diff --git a/windows/UWP/ReactTestApp.vcxproj b/windows/UWP/ReactTestApp.vcxproj
@@ -144,12 +144,25 @@
     </AppxManifest>
   </ItemGroup>
   <ItemGroup>
-    <Image Include="Assets\LockScreenLogo.scale-200.png" />
     <Image Include="Assets\SplashScreen.scale-200.png" />
+    <Image Include="Assets\Square150x150Logo.scale-100.png" />
     <Image Include="Assets\Square150x150Logo.scale-200.png" />
+    <Image Include="Assets\Square150x150Logo.scale-400.png" />
+    <Image Include="Assets\Square44x44Logo.altform-lightunplated_targetsize-16.png" />
+    <Image Include="Assets\Square44x44Logo.altform-lightunplated_targetsize-256.png" />
+    <Image Include="Assets\Square44x44Logo.altform-lightunplated_targetsize-48.png" />
+    <Image Include="Assets\Square44x44Logo.altform-unplated_targetsize-16.png" />
+    <Image Include="Assets\Square44x44Logo.altform-unplated_targetsize-256.png" />
+    <Image Include="Assets\Square44x44Logo.altform-unplated_targetsize-48.png" />
+    <Image Include="Assets\Square44x44Logo.scale-100.png" />
     <Image Include="Assets\Square44x44Logo.scale-200.png" />
-    <Image Include="Assets\Square44x44Logo.targetsize-24_altform-unplated.png" />
-    <Image Include="Assets\StoreLogo.png" />
+    <Image Include="Assets\Square44x44Logo.scale-400.png" />
+    <Image Include="Assets\Square44x44Logo.targetsize-16.png" />
+    <Image Include="Assets\Square44x44Logo.targetsize-256.png" />
+    <Image Include="Assets\Square44x44Logo.targetsize-48.png" />
+    <Image Include="Assets\StoreLogo.scale-100.png" />
+    <Image Include="Assets\StoreLogo.scale-200.png" />
+    <Image Include="Assets\StoreLogo.scale-400.png" />
     <Image Include="Assets\Wide310x150Logo.scale-200.png" />
     <!-- ReactTestApp asset items -->
   </ItemGroup>

diff --git a/windows/UWP/ReactTestApp.vcxproj.filters b/windows/UWP/ReactTestApp.vcxproj.filters
@@ -34,18 +34,9 @@
     <Image Include="Assets\SplashScreen.scale-200.png">
       <Filter>Assets</Filter>
     </Image>
-    <Image Include="Assets\Square150x150Logo.scale-200.png">
-      <Filter>Assets</Filter>
-    </Image>
     <Image Include="Assets\Square44x44Logo.scale-200.png">
       <Filter>Assets</Filter>
     </Image>
-    <Image Include="Assets\Square44x44Logo.targetsize-24_altform-unplated.png">
-      <Filter>Assets</Filter>
-    </Image>
-    <Image Include="Assets\StoreLogo.png">
-      <Filter>Assets</Filter>
-    </Image>
     <Image Include="Assets\Wide310x150Logo.scale-200.png">
       <Filter>Assets</Filter>
     </Image>

diff --git a/windows/Win32/Images/LockScreenLogo.scale-200.png b/windows/Win32/Images/LockScreenLogo.scale-200.png
diff --git a/windows/Win32/Images/SplashScreen.scale-100.png b/windows/Win32/Images/SplashScreen.scale-100.png
diff --git a/windows/Win32/Images/SplashScreen.scale-200.png b/windows/Win32/Images/SplashScreen.scale-200.png
diff --git a/windows/Win32/Images/SplashScreen.scale-400.png b/windows/Win32/Images/SplashScreen.scale-400.png
diff --git a/windows/Win32/Images/Square150x150Logo.scale-100.png b/windows/Win32/Images/Square150x150Logo.scale-100.png
diff --git a/windows/Win32/Images/Square150x150Logo.scale-200.png b/windows/Win32/Images/Square150x150Logo.scale-200.png
diff --git a/windows/Win32/Images/Square150x150Logo.scale-400.png b/windows/Win32/Images/Square150x150Logo.scale-400.png
diff --git a/windows/Win32/Images/Square44x44Logo.altform-lightunplated_targetsize-16.png b/windows/Win32/Images/Square44x44Logo.altform-lightunplated_targetsize-16.png
diff --git a/windows/Win32/Images/Square44x44Logo.altform-lightunplated_targetsize-256.png b/windows/Win32/Images/Square44x44Logo.altform-lightunplated_targetsize-256.png
diff --git a/windows/Win32/Images/Square44x44Logo.altform-lightunplated_targetsize-48.png b/windows/Win32/Images/Square44x44Logo.altform-lightunplated_targetsize-48.png
diff --git a/windows/Win32/Images/Square44x44Logo.altform-unplated_targetsize-16.png b/windows/Win32/Images/Square44x44Logo.altform-unplated_targetsize-16.png
diff --git a/windows/Win32/Images/Square44x44Logo.altform-unplated_targetsize-256.png b/windows/Win32/Images/Square44x44Logo.altform-unplated_targetsize-256.png
diff --git a/windows/Win32/Images/Square44x44Logo.altform-unplated_targetsize-48.png b/windows/Win32/Images/Square44x44Logo.altform-unplated_targetsize-48.png
diff --git a/windows/Win32/Images/Square44x44Logo.scale-100.png b/windows/Win32/Images/Square44x44Logo.scale-100.png
diff --git a/windows/Win32/Images/Square44x44Logo.scale-200.png b/windows/Win32/Images/Square44x44Logo.scale-200.png
diff --git a/windows/Win32/Images/Square44x44Logo.scale-400.png b/windows/Win32/Images/Square44x44Logo.scale-400.png
diff --git a/windows/Win32/Images/Square44x44Logo.targetsize-16.png b/windows/Win32/Images/Square44x44Logo.targetsize-16.png
diff --git a/windows/Win32/Images/Square44x44Logo.targetsize-24_altform-unplated.png b/windows/Win32/Images/Square44x44Logo.targetsize-24_altform-unplated.png
diff --git a/windows/Win32/Images/Square44x44Logo.targetsize-256.png b/windows/Win32/Images/Square44x44Logo.targetsize-256.png
diff --git a/windows/Win32/Images/Square44x44Logo.targetsize-48.png b/windows/Win32/Images/Square44x44Logo.targetsize-48.png
diff --git a/windows/Win32/Images/StoreLogo.png b/windows/Win32/Images/StoreLogo.png
diff --git a/windows/Win32/Images/StoreLogo.scale-100.png b/windows/Win32/Images/StoreLogo.scale-100.png
diff --git a/windows/Win32/Images/StoreLogo.scale-200.png b/windows/Win32/Images/StoreLogo.scale-200.png
diff --git a/windows/Win32/Images/StoreLogo.scale-400.png b/windows/Win32/Images/StoreLogo.scale-400.png
diff --git a/windows/Win32/Images/Wide310x150Logo.scale-200.png b/windows/Win32/Images/Wide310x150Logo.scale-200.png
diff --git a/windows/Win32/Package.appxmanifest b/windows/Win32/Package.appxmanifest
@@ -44,7 +44,6 @@
         DisplayName="ReactApp"
         Description="React Native app"
         BackgroundColor="transparent"
-        Square150x150Logo="Images\Square150x150Logo.png"
         Square44x44Logo="Images\Square44x44Logo.png"
       >
         <uap:DefaultTile Wide310x150Logo="Images\Wide310x150Logo.png" />

diff --git a/windows/Win32/ReactApp.Package.wapproj b/windows/Win32/ReactApp.Package.wapproj
@@ -51,13 +51,26 @@
     </AppxManifest>
   </ItemGroup>
   <ItemGroup>
-    <Content Include="Images\SplashScreen.scale-200.png" />
-    <Content Include="Images\LockScreenLogo.scale-200.png" />
-    <Content Include="Images\Square150x150Logo.scale-200.png" />
-    <Content Include="Images\Square44x44Logo.scale-200.png" />
-    <Content Include="Images\Square44x44Logo.targetsize-24_altform-unplated.png" />
-    <Content Include="Images\StoreLogo.png" />
-    <Content Include="Images\Wide310x150Logo.scale-200.png" />
+    <Image Include="Images\SplashScreen.scale-200.png" />
+    <Image Include="Images\Square150x150Logo.scale-100.png" />
+    <Image Include="Images\Square150x150Logo.scale-200.png" />
+    <Image Include="Images\Square150x150Logo.scale-400.png" />
+    <Image Include="Images\Square44x44Logo.altform-lightunplated_targetsize-16.png" />
+    <Image Include="Images\Square44x44Logo.altform-lightunplated_targetsize-256.png" />
+    <Image Include="Images\Square44x44Logo.altform-lightunplated_targetsize-48.png" />
+    <Image Include="Images\Square44x44Logo.altform-unplated_targetsize-16.png" />
+    <Image Include="Images\Square44x44Logo.altform-unplated_targetsize-256.png" />
+    <Image Include="Images\Square44x44Logo.altform-unplated_targetsize-48.png" />
+    <Image Include="Images\Square44x44Logo.scale-100.png" />
+    <Image Include="Images\Square44x44Logo.scale-200.png" />
+    <Image Include="Images\Square44x44Logo.scale-400.png" />
+    <Image Include="Images\Square44x44Logo.targetsize-16.png" />
+    <Image Include="Images\Square44x44Logo.targetsize-256.png" />
+    <Image Include="Images\Square44x44Logo.targetsize-48.png" />
+    <Image Include="Images\StoreLogo.scale-100.png" />
+    <Image Include="Images\StoreLogo.scale-200.png" />
+    <Image Include="Images\StoreLogo.scale-400.png" />
+    <Image Include="Images\Wide310x150Logo.scale-200.png" />
   </ItemGroup>
   <ItemGroup>
     <ProjectReference Include="ReactApp.vcxproj">