How Android UI should vary? Density (DPI) wise or as per screen size? Best practice to follow?
I am developing the app for mobile and tablet devices. In following screenshot I have applied button size as android:layout_width="200dp" android:layout_height="80dp". When I run my application in a tablet(mdpi) and in other two mobile devices (hdpi) and (xhdpi) the button size varies as all three devices has different densities.
Refer to the following image which has tablet(mdpi), nexus mobile(hdpi) and galaxy nexus mobile(xhdpi) emulator repectively:
I have also checked with the Gmail app in all 3 devices:
As the tablet has a bigger size but the lowest density(mdpi) the UI in tablet looks smaller compared to other devices which have the comparatively small size and high density.
If I want the button to look bigger in the tablet I need to change the height and width by adding different dimensions in values-sw360dp,values-sw480dp, values-sw600dp, etc.
My question is, should our UI look bigger as per screen size or let it vary as per density? Which is the best practice to follow?
There's no specific guidelines for this and I believe there's no best practice either.
Personally, I allow the UI to look bigger as per screen size, due to this being the same behavior for the majority of other apps on the phone. I only adjust the dp and sp values for these larger sizes if I notice text being cut off.
However, since there's no best practices, this does fall down to personal choice. I prefer keeping UI similar to other apps on the device, which also get enlarged.
But I do know other developers who prefer to keep the UI consistent. If you choose to do the same, you can consider using these two libraries: