[Android] Fix improper rendering of ThumbimageSource in Slider

[NirmalKumarYuvaraj]

Note

Are you waiting for the changes in this PR to be merged?
It would be very helpful if you could test the resulting artifacts from this PR and let us know in a comment if this change resolves your issue. Thank you!

Root Cause

On Android, when a custom ThumbImageSource is set on a Slider, the image drawable is applied to the SeekBar at its native size. Because images are typically larger than the expected thumb diameter (20dp per Material Design spec), the thumb appears oversized.

Description of Change

Android only — this PR adds image scaling before applying custom thumb drawables to SeekBar.

Key changes in src/Core/src/Platform/Android/SliderExtensions.cs:

• UpdateThumbImageSourceAsync: Refactored to call two new helpers (SetThumbDrawable / SetDefaultThumb) instead of inlining the logic.
• SetThumbDrawable: New method that scales the provided drawable to 20dp × 20dp (Material Design thumb size) by rendering it to a fixed-size Bitmap then wrapping in a BitmapDrawable before calling SeekBar.SetThumb().
• SetDefaultThumb: New method that restores the platform default thumb drawable (abc_seekbar_thumb_material) and re-applies the theme accent color or custom ThumbColor. Also adds a ResolveAttribute return-value check (previously the result was ignored).
• Null checks: Updated != null patterns to is not null for consistency.

Note: iOS and MacCatalyst scaling is tracked separately in PR #34184.

Issues Fixed

Fixes #13258

Platforms Tested

• Android
• iOS (separate PR [iOS] Slider: Scale ThumbImageSource to match default thumb size #34184)
• Windows
• Mac

Previously closed PR - #27472

[Copilot]

Pull request overview

This PR updates MAUI Slider thumb image handling to avoid oversized custom thumb images (primarily on Android, and also iOS/macOS), and adds an Issue test case + updated snapshot baselines to validate the visual behavior.

Changes:

• Android: scale custom thumb drawables to a target dp size before applying to SeekBar.
• iOS: resize custom thumb images to match the platform default thumb size derived from UISlider geometry.
• Tests: add Issue13258 UI test page + UITest, and update/add snapshot baselines impacted by the change.

Reviewed changes

Copilot reviewed 4 out of 10 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
src/Core/src/Platform/Android/SliderExtensions.cs	Adds thumb scaling logic and refactors default-thumb restoration/tint behavior.
src/Core/src/Platform/iOS/SliderExtensions.cs	Resizes thumb images to the slider’s default thumb size; minor null-check refactors.
src/Controls/tests/TestCases.HostApp/Issues/Issue13258.cs	New HostApp reproduction page for thumb image sizing + runtime changes.
src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue13258.cs	New screenshot-based UITest for Issue13258.
src/Controls/tests/TestCases.Android.Tests/snapshots/android/SliderShouldChangeThumbImageAndResetIt.png	Updated/added Android snapshot baseline impacted by thumb sizing changes.
src/Controls/tests/TestCases.iOS.Tests/snapshots/ios/SliderShouldChangeThumbImageAndResetIt.png	Updated/added iOS snapshot baseline impacted by thumb sizing changes.
src/Controls/tests/TestCases.Mac.Tests/snapshots/mac/SliderThumbImageShouldBeScaled.png	Adds Mac snapshot baseline for the new Issue13258 test method.
src/Controls/tests/TestCases.Mac.Tests/snapshots/mac/SliderShouldChangeThumbImageAndResetIt.png	Updated/added Mac snapshot baseline impacted by thumb sizing changes.

[kubaflo]

Could you please split this PR into 2 separate ones - iOS and Android?

[NirmalKumarYuvaraj]

Could you please split this PR into 2 separate ones - iOS and Android?

@kubaflo , Created a new PR for iOS - #34184

[kubaflo]

🤖 AI Summary

📊 Expand Full Review

---

🔍 Pre-Flight — Context & Validation

---

📝 Review Session — Added missed images · 5e55ae4

---

Issue: #13258 - [Slider] MAUI Slider thumb image is big on android
PR: #34064 - [Android] Fix improper rendering of ThumbimageSource in Slider
Author: NirmalKumarYuvaraj (Syncfusion partner)
Platforms Affected: Android (PR was iOS changes moved to PR #34184)split
Files Changed: 5 files (2 fix, 3 test)

Issue Summary

The Slider ThumbImageSource renders with an oversized thumb on Android when a custom image is set. The image is applied at its original size instead of being scaled to match the Material Design guideline (20dp diameter).

Key Findings from Discussion

• Reviewer kubaflo requested the PR be split into separate Android and iOS PRs
• Author created PR [iOS] Slider: Scale ThumbImageSource to match default thumb size #34184 for iOS changes and updated this PR to be Android-only
• PR title updated to [Android]

Disagreements / Edge Cases

Topic	Detail
PR title now says [Android] but description still mentions iOS	Description not updated after split

Files Changed

Fix files:

• src/Core/src/Platform/Android/SliderExtensions.cs (+69/- Android thumb image scaling logic18)

Test files:

• src/Controls/tests/TestCases.HostApp/Issues/Issue13258.cs (+ New test page (Android-only)51)
• src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue13258.cs (+ New UI test (Android-only via #if TEST_FAILS_ON_WINDOWS && TEST_FAILS_ON_IOS && TEST_FAILS_ON_CATALYST)25)
• src/Controls/tests/TestCases.Android.Tests/snapshots/android/SliderThumbImageShouldBeScaled. New snapshotpng
• src/Controls/tests/TestCases.Android.Tests/snapshots/android/SliderShouldChangeThumbImageAndResetIt. Updated snapshot (existing Issue25939 test, now reflects properly-sized thumb)png

Fix Candidates

#	Source	Approach	Test Result	Files Changed	Notes
PR	PR #34064	Scale custom thumb to 20dp (Material 2) via Bitmap canvas PENDING (Gate)	SliderExtensions.cs (+69)	Original Android-only PR	drawing

Code Review Notes (Preliminary)

• using System; added but may be unused
• Double blank line in SetThumbDrawable method
• ReferenceEquals(seekBar.Thumb, thumbDrawable) optimization check is valid but may never be true since a new BitmapDrawable is created on each call
• Test only verifies state AFTER button click, not initial state
• Missing newline at end of both new test files

---

🚦 Gate — Test Verification

---

📝 Review Session — Added missed images · 5e55ae4

---

** BLOCKED (Environment)Result:**
Platform: android ( test is Android-only via #if TEST_FAILS_ON_WINDOWS && TEST_FAILS_ON_IOS && TEST_FAILS_ON_CATALYST)required
Mode: Full Verification attempted

Status

• Android SDK (adb) is not available on this host
• Test Issue13258.SliderThumbImageShouldBeScaled only runs on iOS/MacCatalyst/Windows are excluded by conditional compilationAndroid
• Could not run verify-tests-fail-without-fix script

Notes

Gate skipped due to environment blocker (no Android emulator/SDK). Proceeding to Report with code analysis only.

---

📋 Report — Final Recommendation

---

📝 Review Session — Added missed images · 5e55ae4

---

Final Recommendation: REQUEST CHANGES##

Summary

PR #34064 fixes the oversized slider thumb image on Android by scaling custom ThumbImageSource images to 20dp (Material Design 2 guideline). The core approach is sound, but there are code quality issues and a potential bug that should be addressed before merge.

Note: Gate verification was Android SDK (adb) is unavailable on this host. Code review analysis was performed instead.skipped

---

Root Cause

When a custom ThumbImageSource is set on a MAUI Slider, Android's SeekBar.SetThumb() receives the raw drawable at its natural size (which can be much larger than the 20dp default thumb). The PR fixes this by rendering the custom drawable into a 20dp 20dp bitmap before applying it as the thumb.

---

Fix Quality

What the PR does well:

• Correctly targets the 20dp Material Design 2 size
• Properly handles the null-image reset path (restores default thumb with color)
• Adds an IsAlive() check before setting the thumb (avoids crash after view disposal)
• Improves null checks to use is not null pattern
• Correctly checks ResolveAttribute return value before using the color (regression fix)

Issues requiring attention:

thumbDrawable.SetBounds() Mutates the Source Drawable1.

thumbDrawable.SetBounds(0, 0, thumbSize, thumbSize);
thumbDrawable.Draw(canvas);

This permanently modifies the bounds of the drawable returned from the image source service. If the service caches this drawable (which MAUI's image services often do), subsequent calls or other consumers of the same drawable will see incorrect bounds.

Fix: Save and restore original bounds, or use Drawable.mutate() to get a copy before modifying:

var originalDrawable = thumbDrawable.Mutate();  // returns a mutable copy
originalDrawable.SetBounds(0, 0, thumbSize, thumbSize);
originalDrawable.Draw(canvas);

ReferenceEquals Optimization is Dead Code2.

if (ReferenceEquals(seekBar.Thumb, thumbDrawable))
    return;

seekBar.Thumb creates a new C# managed peer wrapping the Java object each time it's accessed. thumbDrawable is also a different C# peer. ReferenceEquals always returns false for the early return never executes. Either remove this check or use a meaningful comparison.these

using System; was added but is unused in the file. Remove it.#### 3.

if (thumbSize <= 0)
{
    return;
}


using (Bitmap bitmap = ...

Two blank lines after the early should be one.return

Both src/Controls/tests/TestCases.HostApp/Issues/Issue13258.cs and src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue13258.cs are missing a newline at the end of the file.#### 5.

The PR description still describes iOS changes (scaling via UISlider track/thumb rects), but the iOS changes were moved to PR #34184. The description should be updated to accurately reflect that this is Android-only.#### 6.

---

Test Assessment

• The test SliderThumbImageShouldBeScaled only verifies state after the button is tapped (which sets coffee.png and clears shopping_cart.png)
• It doesn't directly verify that the initial avatar.png thumb (the primary bug scenario) is properly scaled
• The test does usefully verify the runtime change flow
• The existing SliderShouldChangeThumbImageAndResetIt snapshot (Issue25939) is correctly updated

---

Platform Notes

• PR fix is Android-only; iOS counterpart is in PR [iOS] Slider: Scale ThumbImageSource to match default thumb size #34184
• Test is Android-only (#if TEST_FAILS_ON_WINDOWS && TEST_FAILS_ON_IOS && TEST_FAILS_ON_CATALYST)
• Gate verification could not run (no Android SDK on this host)

---

📋 Expand PR Finalization Review

---

Title: ✅ Good

Current: [Android] Fix improper rendering of ThumbimageSource in Slider

Description: ⚠️ Needs Update

Description needs updates. See details below.

✨ Suggested PR Description

[!NOTE]
Are you waiting for the changes in this PR to be merged?
It would be very helpful if you could test the resulting artifacts from this PR and let us know in a comment if this change resolves your issue. Thank you!

Root Cause

On Android, when a custom ThumbImageSource is set on a Slider, the image drawable is applied to the SeekBar at its native size. Because images are typically larger than the expected thumb diameter (20dp per Material Design spec), the thumb appears oversized.

Description of Change

Android only — this PR adds image scaling before applying custom thumb drawables to SeekBar.

Key changes in src/Core/src/Platform/Android/SliderExtensions.cs:

• UpdateThumbImageSourceAsync: Refactored to call two new helpers (SetThumbDrawable / SetDefaultThumb) instead of inlining the logic.
• SetThumbDrawable: New method that scales the provided drawable to 20dp × 20dp (Material Design thumb size) by rendering it to a fixed-size Bitmap then wrapping in a BitmapDrawable before calling SeekBar.SetThumb().
• SetDefaultThumb: New method that restores the platform default thumb drawable (abc_seekbar_thumb_material) and re-applies the theme accent color or custom ThumbColor. Also adds a ResolveAttribute return-value check (previously the result was ignored).
• Null checks: Updated != null patterns to is not null for consistency.

Note: iOS and MacCatalyst scaling is tracked separately in PR #34184.

Issues Fixed

Fixes #13258

Platforms Tested

• Android
• iOS (separate PR [iOS] Slider: Scale ThumbImageSource to match default thumb size #34184)
• Windows
• Mac

Code Review: ⚠️ Issues Found

Code Review — PR #34064

🔴 Critical Issues

1. ReferenceEquals optimization is non-functional

File: src/Core/src/Platform/Android/SliderExtensions.cs
Method: SetThumbDrawable

// Check if we're setting the same drawable to avoid unnecessary work
if (ReferenceEquals(seekBar.Thumb, thumbDrawable))
{
    return;
}

Problem: In .NET for Android, seekBar.Thumb creates a new managed wrapper object each call, even when it wraps the same underlying Java object. ReferenceEquals compares C# object identity, not Java object identity. This means the check will always return false, so the early-return optimization never fires.

Recommendation: Compare Java handles instead:

if (seekBar.Thumb?.Handle == thumbDrawable.Handle)
{
    return;
}

Or simply remove the optimization if it's not worth the complexity — the bitmap-draw path only runs when the image source changes, which is not a hot path.

---

🟡 Suggestions

2. TARGET_SIZE naming violates C# conventions

File: src/Core/src/Platform/Android/SliderExtensions.cs

const int TARGET_SIZE = 20; // 10 radius * 2

C# uses PascalCase for constants (TargetSize or ThumbTargetSizeDp), not SCREAMING_SNAKE_CASE (which is a Java/C convention). The comment is also slightly misleading — Material Design's thumb radius is 10dp, so the diameter is 20dp. Suggested alternative:

// Thumb diameter per Material Design spec: https://m2.material.io/components/sliders
const int ThumbDiameterDp = 20;

3. Double blank line in SetThumbDrawable

File: src/Core/src/Platform/Android/SliderExtensions.cs

There is an extra blank line between the if (thumbSize <= 0) guard and the using block:

        if (thumbSize <= 0)
        {
            return;
        }


        using (Bitmap bitmap = ...)  // <-- extra blank line above

Should be a single blank line.

4. Missing newline at end of files

The diff shows \ No newline at end of file for:

• src/Controls/tests/TestCases.HostApp/Issues/Issue13258.cs
• src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue13258.cs
• src/Core/src/Platform/Android/SliderExtensions.cs

All three new/modified files are missing the trailing newline. Most editors and tools expect files to end with \n.

5. Test only covers the post-button-tap state

File: src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue13258.cs

The single test method SliderThumbImageShouldBeScaled taps the "Change Thumb Image" button and then calls VerifyScreenshot(). This validates the runtime-change scenario (slider2 gets coffee.png, slider3 gets null). However:

• There is no test for the initial state (slider1 with avatar.png, slider2 without image, slider3 with shopping_cart.png). This is the primary regression the issue reported.
• The snapshot file SliderThumbImageShouldBeScaled.png appears to cover the post-tap state. The initial-state regression (oversized thumb before any interaction) is not directly covered.

Consider adding a SliderThumbImageInitialStateShouldBeScaled test that calls VerifyScreenshot() before tapping the button.

---

✅ Looks Good

• Refactoring UpdateThumbImageSourceAsync into SetThumbDrawable + SetDefaultThumb helpers improves readability and reduces duplication.
• SetDefaultThumb adds a previously-missing check on ResolveAttribute's return value before using value.Data — good correctness improvement.
• The 20dp target size is well-justified with a link to the Material Design spec and the material-components-android source for the dimension value.
• using blocks for Bitmap and Canvas ensure proper native resource cleanup.
• Test infrastructure is correctly scoped: PlatformAffected.Android in the host app and TEST_FAILS_ON_WINDOWS && TEST_FAILS_ON_IOS && TEST_FAILS_ON_CATALYST in the shared test file.

---

[github-actions]

🚀 Dogfood this PR with:

⚠️ WARNING: Do not do this without first carefully reviewing the code of this PR to satisfy yourself it is safe.

curl -fsSL https://raw.githubusercontent.com/dotnet/maui/main/eng/scripts/get-maui-pr.sh | bash -s -- 34064

Or

• Run remotely in PowerShell:

iex "& { $(irm https://raw.githubusercontent.com/dotnet/maui/main/eng/scripts/get-maui-pr.ps1) } 34064"

[NirmalKumarYuvaraj]

@kubaflo , Addressed AI review summary. Please let me know , if you have any concerns