Change DPI in Android Apps: Guide for Developers and DesignersDPI (dots per inch) is a core concept when building Android apps that need to look and behave consistently across devices with different screen sizes and pixel densities. This guide explains what DPI means in the Android ecosystem, how Android maps physical pixels to density-independent units, practical approaches to handle DPI in layouts, images and code, and best practices for designers and developers.
What DPI means on Android
- DPI refers to screen pixel density — how many physical pixels fit into one linear inch of the display.
- Android groups device densities into buckets (ldpi, mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi) and exposes a density scale factor (dpi / 160).
- The platform provides density-independent pixels (dp or dip) so you can design UI elements that keep physical size across densities: 1 dp = 1 pixel on a 160 dpi screen (mdpi).
Why DPI matters
- Controls consistent physical sizing: a 48dp button should appear about the same physical size across phones and tablets.
- Image and icon quality: supplying correctly scaled raster assets prevents blurriness on high-density displays and unnecessary APK bloat from overly large files on low-density screens.
- Layout and spacing: mismanagement of DPI leads to overlapping UI, text clipping, or inconsistent whitespace.
- Performance and memory: loading large bitmaps without scaling wastes memory and may cause OOM.
Android density buckets and scale factors
Common buckets and their nominal scale relative to mdpi (160 dpi):
- ldpi (~120 dpi) — 0.75x
- mdpi (160 dpi) — 1.0x
- hdpi (240 dpi) — 1.5x
- xhdpi (320 dpi) — 2.0x
- xxhdpi (480 dpi) — 3.0x
- xxxhdpi (640 dpi) — 4.0x
Use these to produce properly scaled raster assets. Vector assets (SVG/VectorDrawable) avoid per-density bitmaps for most UI icons.
Designing for DPI — practical tips for designers
- Design at a baseline density: many teams design UI assets at xxhdpi (3x) or xhdpi (2x) to balance fidelity and file size; export to other scales.
- Prefer vector formats (SVG → VectorDrawable) for icons, logos, and simple shapes. Vectors scale without quality loss.
- Provide multiple raster sizes for complex images (photos may still need density-specific versions or use high-resolution bitmaps with downsampling).
- Use design tools that support export to multiple scales (Figma, Sketch, Adobe XD).
- Test visual weight and spacing on physical devices when possible; dp is a guide — perceived size can still vary.
Implementing DPI-aware layouts
- Use dp for view sizes, margins, padding, and most dimension values in XML.
- Use sp for font sizes (scales with user’s font-size preference).
- Avoid hard-coding pixel (px) values in layouts; px ties to device pixels and breaks across densities.
- Use ConstraintLayout, Material components and responsive patterns that adapt to screen size and orientation.
- For programmatic sizing, convert between px and dp with utilities:
// Kotlin fun Context.dpToPx(dp: Float): Float = dp * resources.displayMetrics.density fun Context.pxToDp(px: Float): Float = px / resources.displayMetrics.density // Java public static float dpToPx(Context context, float dp) { return dp * context.getResources().getDisplayMetrics().density; } - When measuring bitmaps, use BitmapFactory.Options.inDensity and inTargetDensity to let the system scale appropriately, or use createScaledBitmap for manual control.
Handling images and icons
- Use VectorDrawable for UI icons wherever possible. Android Studio can auto-convert simple SVGs to VectorDrawable.
- For raster images, include density-specific folders: drawable-ldpi, drawable-mdpi, drawable-hdpi, drawable-xhdpi, drawable-xxhdpi, drawable-xxxhdpi.
- Use WebP for photos and PNG for images that need lossless transparency; WebP often reduces size.
- Use Glide, Coil or Picasso for efficient image loading, caching and downsampling; they help avoid OOM by loading size-appropriate bitmaps.
- Example: load a large photo into an ImageView with Glide and let it downsample:
Glide.with(context) .load(url) .override(targetWidthPx, targetHeightPx) // requested pixel size .into(imageView) - For adaptive icons (launcher icons), include foreground and background layers and provide appropriate sizes per guidelines.
DPI in Canvas, custom views and bitmaps
- Use dp-to-px conversion for dimensions and stroke widths in custom drawing.
- Respect the device density when creating bitmaps: create bitmaps with the correct density tag so Android can scale them if needed:
val bmp = Bitmap.createBitmap(widthPx, heightPx, Bitmap.Config.ARGB_8888) bmp.setDensity(resources.displayMetrics.densityDpi) - When drawing text on canvas, set textSize in scaled pixels (sp) or convert sp to px.
- Use Paint.setFilterBitmap(true) for smoother scaled rendering.
Supporting multiple screen densities for assets (workflow)
- Generate assets at a high resolution base (e.g., xxhdpi / 3x) and downscale to mdpi/hdpi/etc.
- Automate asset generation with scripts or plugins (Android Asset Studio, Sketch/Figma export plugins, build scripts).
- Keep vector assets for UI elements and only rasterize when necessary.
- Use Android App Bundle (AAB) — Google Play serves device-specific density splits to reduce app size.
Testing and QA
- Test on real devices with different densities when possible; emulators can simulate density but may miss subtle differences.
- Use Android Studio’s Layout Inspector and Device Manager to preview layouts at different DPIs and screen sizes.
- Verify bitmaps look crisp on xxhdpi/xxxhdpi displays and aren’t unnecessarily large on mdpi.
- Test with different font scale settings to ensure text remains readable and layouts don’t break.
Common pitfalls and fixes
- Problem: Blurry icons on high-density displays — fix by supplying higher-density raster assets or using VectorDrawable.
- Problem: Too-large APK size due to multiple full-resolution images — fix with VectorDrawable, WebP, AAB density splits.
- Problem: Layouts that look different on tablets vs phones — use sw
dp qualifiers and responsive layouts rather than only density qualifiers. - Problem: OOM from large bitmaps — use sampling (inSampleSize), image libraries, and request appropriately sized images from servers.
Quick reference conversions
- dp ↔ px: px = dp * (densityDpi / 160)
- sp ↔ px: px = sp * scaledDensity
In code, platform helpers and DisplayMetrics provide density and scaledDensity values.
Best practices checklist
- Use dp for layout dimensions and sp for text.
- Prefer VectorDrawable for icons; supply raster images in multiple densities when needed.
- Convert and test graphics across density buckets (ldpi → xxxhdpi).
- Use image-loading libraries to request appropriately sized bitmaps.
- Use AAB to let Play deliver density-optimized APK slices.
- Test on real devices with different densities and font scales.
This guide covers the practical concerns for handling DPI in Android apps for both designers and developers. If you want, I can generate a checklist for designers, sample asset export settings for Figma/Sketch, or code templates for converting and loading density-aware images.
Leave a Reply