Migration Guide: strokeWidth and cornerRadius Density Scaling (v56.0)

This guide helps you migrate to the new density-independent pixel (dp) scaling behavior for strokeWidth and cornerRadius properties introduced in version 56.0.0.

Do You Need to Migrate?

Check your JSON configurations for strokeWidth and cornerRadius in cutoutConfig and scanFeedbackConfig:

  • If you’re not specifying these properties (using defaults) → Read carefully below (default changed from 2 to 0)

  • If you’re using custom values on high-density devices (xxhdpi, xxxhdpi) → Read carefully below (density scaling changed)

  • If you’re using low values (1-2) → Test your app to verify visual appearance

Two changes affect strokeWidth and cornerRadius:

  1. Default value change: strokeWidth default changed from 2 to 0 (matching iOS). If you were relying on the default, cutouts will now have NO border. Explicitly set "strokeWidth": 2 to restore the border.

  2. Density scaling change: Custom values now properly scale with device density. On high-density displays (xxhdpi, xxxhdpi), strokes will appear thicker than before.

Understanding the Change

The strokeWidth and cornerRadius properties in cutoutConfig and scanFeedbackConfig now correctly scale with device screen density, matching iOS behavior and ensuring consistent visual appearance across all devices.

Previous behavior (Android only): These properties used raw pixel values without density scaling. A value of 2 rendered as 2 physical pixels regardless of screen density (ldpi, mdpi, xxhdpi, xxxhdpi).

New behavior (Android and iOS): These properties are now density-independent pixels (dp) that automatically scale. A value of 2 renders as 2dp, which converts to more physical pixels on high-density displays (e.g., 6px on xxhdpi/3× devices).

Example on xxhdpi device (3× density):

{
  "strokeWidth": 2,
  "cornerRadius": 4
}

  • Before (v55.x): 2 physical pixels and 4 physical pixels (no density scaling)

  • After (v56.0): 6 physical pixels and 12 physical pixels (2dp × 3 = 6px, 4dp × 3 = 12px)

Impact Across Device Densities

The behavior change primarily affects high-density displays:

Device Density DP Value Before (px) After (px)

mdpi (1×)

2

2

2

hdpi (1.5×)

2

2

3

xhdpi (2×)

2

2

4

xxhdpi (3×)

2

2

6

xxxhdpi (4×)

2

2

8

Key takeaway: On high-density displays (xxhdpi, xxxhdpi), cutout borders and feedback strokes will appear thicker than before.

Migration Options

The new density scaling ensures consistent visual appearance across all device types and matches iOS rendering. Simply test your app on representative devices to verify the appearance meets your requirements.

Benefits:

  • Consistent visual thickness across all device densities

  • Matches iOS rendering for cross-platform consistency

  • Better user experience - UI elements maintain intended physical size

  • Aligns with Android design guidelines for dp usage

Option 2: Adjust Values for Previous Appearance

If you prefer the previous visual thickness on high-density displays, reduce your values proportionally:

// Old configuration (v55.x and earlier) on xxhdpi device
{
  "strokeWidth": 6,      // Rendered as 6px
  "cornerRadius": 12     // Rendered as 12px
}

// New configuration for same visual appearance (v56.0+) on xxhdpi device
{
  "strokeWidth": 2,      // 2dp × 3 = 6px
  "cornerRadius": 4      // 4dp × 3 = 12px
}

Common Scenarios

  • You increased values to compensate for thin lines on high-density devices: Reduce to original intended values (e.g., 6 → 2, 9 → 3)

  • You used low values (1-2) and they looked fine: Test on high-density devices; lines will be thicker but may look better

  • You relied on the default cutoutConfig.strokeWidth of 2: The new default is 0 (no border) — explicitly set "strokeWidth": 2 to restore the border appearance

Testing Recommendations

  1. Test your app on devices with different densities (mdpi, hdpi, xxhdpi, xxxhdpi)

  2. Verify cutout borders and scan feedback strokes appear at acceptable thickness

  3. Check visual consistency across your target device range

  4. Adjust values if needed - remember values are now in dp, not raw pixels

  5. If you have both Android and iOS apps, compare visual appearance across platforms

Technical Details

Density conversion formula:

physical_pixels = dp_value × device_density

Examples:
- mdpi (1×):    2dp = 2px
- hdpi (1.5×):  2dp = 3px
- xhdpi (2×):   2dp = 4px
- xxhdpi (3×):  2dp = 6px
- xxxhdpi (4×): 2dp = 8px

Affected properties:

  • cutoutConfig.strokeWidth - Border width around the cutout

  • cutoutConfig.cornerRadius - Corner rounding for cutout borders

  • scanFeedbackConfig.strokeWidth - Line width for scan feedback visualization

  • scanFeedbackConfig.cornerRadius - Corner rounding for feedback visualization

Get help

If there is anything you are missing, you require support, or want to provide us with feedback, please reach out to us via https://support.anyline.com, where you either may find helpful information in our Knowledge Base or you can open a Support Ticket for more specific inquiries.

In order to better assist you, please include any code of your Anyline integration and any ScanViewConfig you are using.