From 09312a70a80941fe5c05e8612105540a7f433fa9 Mon Sep 17 00:00:00 2001
From: Owen Carey <37121709+owenthcarey@users.noreply.github.com>
Date: Tue, 24 Mar 2026 15:29:38 -0700
Subject: [PATCH] fix(android): reapply tintColor when Image src changes

---
 apps/toolbox/src/pages/image-handling.ts  |  5 +++++
 apps/toolbox/src/pages/image-handling.xml | 13 +++++++++++++
 packages/core/ui/image/index.android.ts   | 11 +++++++++++
 3 files changed, 29 insertions(+)

diff --git a/apps/toolbox/src/pages/image-handling.ts b/apps/toolbox/src/pages/image-handling.ts
index 5feea4f469..cdf131ae33 100644
--- a/apps/toolbox/src/pages/image-handling.ts
+++ b/apps/toolbox/src/pages/image-handling.ts
@@ -10,11 +10,16 @@ export function navigatingTo(args: EventData) {
 
 export class DemoModel extends Observable {
 	addingPhoto = false;
+	tintTestSrc = 'res://icon';
 	symbolWiggleEffect = ImageSymbolEffects.Wiggle;
 	symbolBounceEffect = ImageSymbolEffects.Bounce;
 	symbolBreathEffect = ImageSymbolEffects.Breathe;
 	symbolRotateEffect = ImageSymbolEffects.Rotate;
 
+	toggleTintTestSrc() {
+		this.set('tintTestSrc', this.tintTestSrc === 'res://icon' ? 'res://add_to_fav' : 'res://icon');
+	}
+
 	pickImage() {
 		const context = create({
 			mode: 'single',
diff --git a/apps/toolbox/src/pages/image-handling.xml b/apps/toolbox/src/pages/image-handling.xml
index a90a7e194a..a91fdbf016 100644
--- a/apps/toolbox/src/pages/image-handling.xml
+++ b/apps/toolbox/src/pages/image-handling.xml
@@ -6,6 +6,19 @@
 
     <StackLayout class="p-20">
 
+        <Label text="tintColor + dynamic src" class="h2" />
+        <Label text="Tap the image to swap src between icon and add_to_fav. The red tint should persist after each swap." textWrap="true" />
+        <GridLayout columns="auto, *, auto" rows="auto" class="m-t-10 m-b-10">
+            <Image col="0" src="{{ tintTestSrc }}" tintColor="#E53935" width="80" height="80" tap="{{ toggleTintTestSrc }}" stretch="aspectFit" />
+            <StackLayout col="1" verticalAlignment="center" class="m-l-10">
+                <Label text="{{ 'src: ' + tintTestSrc }}" textWrap="true" />
+                <Label text="tintColor: #E53935" />
+                <Label text="(tap image to toggle)" class="footnote" />
+            </StackLayout>
+        </GridLayout>
+
+        <ContentView height="1" width="100%" backgroundColor="#efefef" margin="10" />
+
         <Label text="Test Memory leaks with image picking and saving to device. Best to profile from platform IDE like Xcode." textWrap="true" />
 
         <Button text="Pick and Save Image" tap="{{ pickImage }}" />
diff --git a/packages/core/ui/image/index.android.ts b/packages/core/ui/image/index.android.ts
index 26b2c73171..f64f6af182 100644
--- a/packages/core/ui/image/index.android.ts
+++ b/packages/core/ui/image/index.android.ts
@@ -37,6 +37,9 @@ function initializeImageLoadedListener() {
 			const owner = this.owner;
 			if (owner) {
 				owner.isLoading = false;
+				if (success) {
+					owner._reapplyTintColor();
+				}
 			}
 		}
 	}
@@ -78,6 +81,13 @@ export class Image extends ImageBase {
 		this.nativeViewProtected.setImageMatrix(new android.graphics.Matrix());
 	}
 
+	public _reapplyTintColor(): void {
+		const tintColor = this.style?.tintColor;
+		if (tintColor && this.nativeViewProtected) {
+			this.nativeViewProtected.setColorFilter(tintColor.android);
+		}
+	}
+
 	public _createImageSourceFromSrc(value: string | ImageSource | ImageAsset) {
 		const imageView = this.nativeViewProtected;
 		if (!imageView) {
@@ -181,6 +191,7 @@ export class Image extends ImageBase {
 			nativeView.setRotationAngle(0);
 			nativeView.setImageBitmap(null);
 		}
+		this._reapplyTintColor();
 	}
 
 	[srcProperty.getDefault](): any {