Advanced Features

🌀 Parallax

Add a depth-scroll effect — the image shifts slightly as you scroll, creating a layered 3D feel:

AsyncPic(
    source = ImageSource.Url("https://example.com/hero.jpg"),
    modifier = Modifier.fillMaxWidth().height(300.dp),
    parallaxIntensity = 0.05f   // 0f = off, higher = more movement
)

Tip: Values between 0.02f and 0.08f look natural. Higher values cause visible over-shift.

The parallax is based on the item's distance from the screen center — items at the top/bottom shift more than items in the middle.

---

🔍 Zoomable

Enable pinch-to-zoom and double-tap zoom:

AsyncPic(
    source = ImageSource.Url("https://example.com/photo.jpg"),
    modifier = Modifier.fillMaxWidth().height(300.dp),
    zoomable = true
)

Gesture	Behavior
Double tap	Toggle 1x ↔ 3x zoom
Pinch	Zoom from 1x to 4x
Pan	Move image when zoomed in

note

When zoomable = true, shape clipping is deferred to the zoom layer to allow correct panning behavior.

---

⭕ Circle Crop

AsyncPic(
    source = ImageSource.Url("https://example.com/avatar.jpg"),
    modifier = Modifier.size(56.dp),
    circleCrop = true
)

Uses Coil's CircleCropTransformation internally.

---

🌫️ Blur

Apply a Gaussian blur to the image:

AsyncPic(
    source = ImageSource.Url("https://example.com/photo.jpg"),
    modifier = Modifier.fillMaxWidth().height(200.dp),
    blurRadius = 15   // 0–25, uses RenderScript
)

CustomBlurTransformation is applied via Coil's transformation pipeline. The radius is clamped to 0–25 (RenderScript limit).

---

🎞️ Animated Formats (GIF / WebP / SVG)

AsyncPic automatically detects and handles animated formats — no extra setup:

// GIF
AsyncPic(
    source = ImageSource.Url("https://example.com/animation.gif"),
    modifier = Modifier.size(200.dp)
)

// Animated WebP
AsyncPic(
    source = ImageSource.Url("https://example.com/sticker.webp"),
    modifier = Modifier.size(120.dp)
)

// SVG (rendered at original size for sharpness)
AsyncPic(
    source = ImageSource.Url("https://example.com/icon.svg"),
    modifier = Modifier.size(48.dp)
)

For animated formats, the shimmer timer (minShimmerTime) is skipped and the image plays immediately.

---

♻️ Cache Control

Override caching behavior per image:

// No caching (live feeds, frequently-changing images)
AsyncPic(
    source = ImageSource.Url("https://example.com/live-photo.jpg"),
    modifier = Modifier.size(200.dp),
    diskCachePolicy = CachePolicy.DISABLED,
    memoryCachePolicy = CachePolicy.DISABLED
)

// Memory cache only (no disk write)
AsyncPic(
    source = ImageSource.Url("https://example.com/temp.jpg"),
    modifier = Modifier.size(200.dp),
    diskCachePolicy = CachePolicy.DISABLED,
    memoryCachePolicy = CachePolicy.ENABLED
)

Policy	Description
CachePolicy.ENABLED	Read and write cache (default)
CachePolicy.DISABLED	Skip cache entirely
CachePolicy.READ_ONLY	Use cache but don't write
CachePolicy.WRITE_ONLY	Write cache but always re-fetch

---

🔒 SVG Headers

AsyncPic automatically sends proper browser headers when loading SVGs to avoid 403 errors from CDNs that check User-Agent:

User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64)
Accept: image/svg+xml,image/*,*/*

This is handled internally — you don't need to do anything extra.