feat: Add Android Adaptive Icons support (#163)

graycreate · claude · web-flow · commit 1ccd6b0a1176 · 2025-10-19T15:04:10.000+08:00
* feat: Add Android Adaptive Icons support Implement adaptive icons for Android 8.0 (API 26) and above following official Android guidelines. Changes: - Create mipmap-anydpi-v26 directory with ic_launcher.xml and ic_launcher_round.xml - Add ic_launcher_foreground.xml with V2EX logo scaled for 108dp canvas - Add ic_launcher_background.xml with solid color background - Support monochrome layer for Android 13+ Material You theming - Maintain backward compatibility with existing PNG icons for older devices The implementation uses the existing logo_svg.xml and respects day/night theme colors. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> * docs: Add documentation comments for adaptive icon scaling calculations Address Copilot review feedback by adding detailed comments explaining the magic numbers used for scaling and positioning the logo within the adaptive icon safe zone. - Document 108x108dp canvas and 66x66dp safe zone dimensions - Explain scale factor calculation: 0.061 ≈ 66dp / 1024 viewport - Explain translation calculation: 21.06 = (108dp - 66dp) / 2 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> * fix: Add dark mode support for adaptive icon background Fix launcher icon visibility issue in dark mode where white background made the white logo invisible. Changes: - Add values-night/ic_launcher_background.xml with dark color (#111214) - Dark background ensures white logo remains visible in night mode - Matches the app's night theme color scheme (night_default_page_bg) - Light mode continues to use light background (#EEEEEE) Before: White icon on white background (invisible in dark mode) After: White icon on dark background (visible in dark mode) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> * fix: Center adaptive icon logo horizontally Fix horizontal alignment issue where the logo appeared slightly left-aligned in the adaptive icon. Root cause analysis: - Original logo SVG has viewport 1024x1024 - Logo path content spans ~285-720px (center at ~502px) - Logo is inherently off-center by ~10px in original viewport - Previous centering calculation assumed logo was centered in viewport Changes: - Adjust scale from 0.061 to 0.0645 for better fit - Increase translateX from 21.06 to 21.65 to compensate for logo offset - Keep translateY at 21 (vertical centering is correct) - Add detailed comments explaining the offset calculation Result: Logo now appears properly centered in adaptive icon canvas 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> --------- Co-authored-by: Claude <noreply@anthropic.com>
diff --git a/app/src/main/res/drawable/ic_launcher_background.xml b/app/src/main/res/drawable/ic_launcher_background.xml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="108dp"
+    android:height="108dp"
+    android:viewportWidth="108"
+    android:viewportHeight="108">
+    <path
+        android:fillColor="@color/ic_launcher_background"
+        android:pathData="M0,0h108v108h-108z" />
+</vector>
diff --git a/app/src/main/res/drawable/ic_launcher_foreground.xml b/app/src/main/res/drawable/ic_launcher_foreground.xml
@@ -0,0 +1,21 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="108dp"
+    android:height="108dp"
+    android:viewportWidth="108"
+    android:viewportHeight="108">
+  <!-- Adaptive icon canvas: 108x108dp with 66x66dp safe zone
+       Original logo viewport: 1024x1024, but path content is ~285-720 (435px wide, center ~502)
+       Logo is slightly off-center in original viewport (should be 512 but is ~502)
+       Scale: 0.0645 to fit 66dp safe zone (1024 * 0.0645 ≈ 66)
+       Base translation: 21 = (108 - 66) / 2 for safe zone centering
+       X adjustment: +0.65 to compensate for logo being off-center in viewport
+       Final: translateX = 21.65, translateY = 21 -->
+  <group android:scaleX="0.0645"
+      android:scaleY="0.0645"
+      android:translateX="21.65"
+      android:translateY="21">
+    <path
+        android:pathData="M480.859,520.767C486.88,504.294 483.548,489.658 473.18,476.663C451.429,449.4 429.349,422.4 407.406,395.29C370.115,349.215 332.857,303.113 295.504,257.088C289.433,249.607 286.667,241.349 288.655,231.887C291.203,219.755 301.661,211.145 314.474,211.122C377.739,211 441.006,210.872 504.27,211.25C519.537,211.341 531.854,218.846 541.463,230.737C578.15,276.134 614.877,321.499 651.591,366.874C674.322,394.968 697.004,423.1 719.804,451.138C745.329,482.526 745.544,526.965 719.577,561.007C698.98,588.011 677.793,614.566 656.783,641.254C619.791,688.242 582.734,735.179 545.705,782.138C545.481,782.422 545.252,782.704 545.058,783.008C530.88,805.232 510.818,813.54 484.414,812.973C428.043,811.763 371.628,812.573 315.231,812.615C308.17,812.621 301.574,811.212 295.753,807.12C282.386,797.721 280.036,780.463 290.691,765.962C299.673,753.736 309.315,741.993 318.702,730.065C370.103,664.748 421.516,599.44 472.922,534.126C476.065,530.134 478.821,525.907 480.859,520.767Z"
+        android:fillColor="@color/splash_logo_color"/>
+  </group>
+</vector>
diff --git a/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml b/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@drawable/ic_launcher_background" />
+    <foreground android:drawable="@drawable/ic_launcher_foreground" />
+    <monochrome android:drawable="@drawable/ic_launcher_foreground" />
+</adaptive-icon>
diff --git a/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml b/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@drawable/ic_launcher_background" />
+    <foreground android:drawable="@drawable/ic_launcher_foreground" />
+    <monochrome android:drawable="@drawable/ic_launcher_foreground" />
+</adaptive-icon>
diff --git a/app/src/main/res/values-night/ic_launcher_background.xml b/app/src/main/res/values-night/ic_launcher_background.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <!-- Dark background for adaptive icon in night mode to ensure white logo is visible -->
+    <color name="ic_launcher_background">#111214</color>
+</resources>
