useDominant colour update

This commit is contained in:
tapframe 2025-10-25 02:31:52 +05:30
parent e84a8a58c7
commit 24c0bb5247

View file

@ -145,13 +145,13 @@ export const preloadDominantColor = async (imageUri: string | null) => {
if (__DEV__) console.log('[useDominantColor] Preloading color for URI:', imageUri); if (__DEV__) console.log('[useDominantColor] Preloading color for URI:', imageUri);
try { try {
// Fast first-pass: prioritize speed to avoid visible delay // Use highest quality for best color accuracy
const result = await getColors(imageUri, { const result = await getColors(imageUri, {
fallback: '#1a1a1a', fallback: '#1a1a1a',
cache: true, cache: true,
key: imageUri, key: imageUri,
quality: 'low', // Faster extraction quality: 'highest', // Best quality for accurate colors
pixelSpacing: 5, // Fewer sampled pixels (Android only) pixelSpacing: 1, // Sample every pixel for best accuracy (Android only)
}); });
const extractedColor = selectBestColor(result); const extractedColor = selectBestColor(result);
@ -201,13 +201,13 @@ export const useDominantColor = (imageUri: string | null): DominantColorResult =
setLoading(true); setLoading(true);
setError(null); setError(null);
// 1) Fast first-pass extraction to update UI immediately // Use highest quality for best color accuracy
const fastResult: ImageColorsResult = await getColors(uri, { const fastResult: ImageColorsResult = await getColors(uri, {
fallback: '#1a1a1a', fallback: '#1a1a1a',
cache: true, cache: true,
key: uri, key: uri,
quality: 'low', // Fastest available quality: 'highest', // Best quality for accurate colors
pixelSpacing: 5, pixelSpacing: 1, // Sample every pixel for best accuracy (Android only)
}); });
const fastColor = selectBestColor(fastResult); const fastColor = selectBestColor(fastResult);
@ -215,26 +215,7 @@ export const useDominantColor = (imageUri: string | null): DominantColorResult =
safelySetColor(fastColor); safelySetColor(fastColor);
setLoading(false); setLoading(false);
// 2) Optional high-quality refine in background // Since we're already using highest quality, no need for refinement
// Only refine if URI is still the same when this completes
Promise.resolve()
.then(async () => {
const hqResult: ImageColorsResult = await getColors(uri, {
fallback: '#1a1a1a',
cache: true,
key: uri,
quality: 'high',
pixelSpacing: 3,
});
const refinedColor = selectBestColor(hqResult);
if (refinedColor && refinedColor !== fastColor) {
colorCache.set(uri, refinedColor);
safelySetColor(refinedColor);
}
})
.catch(() => {
// Ignore refine errors silently
});
} catch (err) { } catch (err) {
if (__DEV__) console.warn('[useDominantColor] Failed to extract color:', err); if (__DEV__) console.warn('[useDominantColor] Failed to extract color:', err);
setError(err instanceof Error ? err.message : 'Failed to extract color'); setError(err instanceof Error ? err.message : 'Failed to extract color');
@ -242,7 +223,7 @@ export const useDominantColor = (imageUri: string | null): DominantColorResult =
colorCache.set(uri, fallbackColor); // Cache fallback to avoid repeated failures colorCache.set(uri, fallbackColor); // Cache fallback to avoid repeated failures
safelySetColor(fallbackColor); safelySetColor(fallbackColor);
} finally { } finally {
// loading already set to false after fast pass // loading already set to false
} }
}, []); }, []);