DEV Community

Cover image for SDP - A scalable size unit... To the rescue 😁
Sdu
Sdu

Posted on

SDP - A scalable size unit... To the rescue 😁

My first 2019 post here on dev.to so happy new year and you're awesome 😎

I wrote an article here about my side project last year and the side effects were amazing πŸ™Œ Downloads picked up a lot and I've been receiving great reviews.

From the feedback the app was received on google play and emails, one issue stood out the most.

This is used as the cover image also 😐
google play review screenshot

Another review 🀨
another google play screenshot

Last screenshot, I swear πŸ˜‘
screenshot of an email review

I tinted the images to differentiate from the site background

Basically more and more people noticed the "little thing" I thought was "not an issue" text size on different screen sizes

I can't really recall how many requests I received about text size issues on smaller screen devices but it got me paranoid.

See, the app is a minimalist launcher that allows you to choose 5 apps to appear on your home screen and only displays a clock plus your selection. The problem is on smaller screens, app text would overlap with the clock 😫

I tried creating different dimens resources to target different densities but that was a disaster. I knew I would never cover every use case smoothly.

Until I came across

GitHub logo intuit / sdp

An Android lib that provides a new size unit - sdp (scalable dp). This size unit scales with the screen size.

issues Forks Stars Maven Central License

SDP - a scalable size unit

An android lib that provides a new size unit - sdp (scalable dp). This size unit scales with the screen size. It can help Android developers with supporting multiple screens.

for text views please refer to ssp which is based on the sp size unit for texts.

Attention

Use it carefully! for example, in most cases you still need to design a different layout for tablets.

Example

Here is a single layout built using sdp:

sdp example

And here is the same layout built using dp:

dp example

You can see that sdp scales with the screen size and the dp stays with the same size on all screen sizes.

Getting Started

To add sdp to your project (Using Android Studio and Gradle):

add implementation 'com.intuit.sdp:sdp-android:1.1.0' to your build.gradle dependencies block.

for example:

dependencies {
  implementation 'com.intuit.sdp:sdp-android:1.1.0'
}

See the sdp_example.xml to see how to use to the…

And

GitHub logo intuit / ssp

Variant of sdp project based on the sp size unit.

issues Forks Stars Maven Central License

SSP - a scalable size unit for texts

An android lib that provides a new size unit - ssp (scalable sp). This size unit scales with the screen size based on the sp size unit (for texts). It can help Android developers with supporting multiple screens.

This is the sibling of the sdp size unit that should be used for non text views.

Attention

Use it carefully! for example, in most cases you still need to design a different layout for tablets.

Example

Here is a single layout built using ssp:

ssp example

And here is the same layout built using sp:

sp example

You can see that ssp scales with the screen size and the sp stays with the same size on all screen sizes.

Getting Started

To add ssp to your Android Studio project:

add implementation 'com.intuit.ssp:ssp-android:1.1.0’ to your build.gradle dependencies block.

for example:

dependencies {
  implementation 'com.intuit.ssp:ssp-android:1.1.0'
}

See the ssp_example.xml…

I trusted these libraries for delivering a consistent ui in all homescreens of the hundreds of users who downloaded my app.

I truly design just one layout, use probably @dimen/_64sdp for a margin or text size and something like @dimen/_12ssp for an android:textSize that I want consistent across a lot of screen sizes.

It supports minimum sdk version 16, and I'll be testing for tablets too.

Be careful not to forget that the all screen sizes approach is not a solution for most ui design solutions.

Happy coding

Top comments (1)

Collapse
 
gopalmohata profile image
Gopal

How to convert pixal to sdp programaticly?