1

I am in android development for last 6 months, recently got a design from a client. I implemented the design and he said this is not exactly look like what the designer has done. Then again he gave me the design with following specifications

enter image description here

my question is - is this right to add the spacing as he has given will this be proper in all devices else how can I explain him what he says is wrong

Please correct me am I wrong or he is wrong

Phantômaxx
  • 37,901
  • 21
  • 84
  • 115
Sivasankar K
  • 11
  • 1
  • Although this is not the place to post it, I will say that this design wont fit in all screens. Each screen will have different amount of pixels, so when de screen is different the dimensions will remain exactly the same, making it look very different in each screen. – Ivan Nov 15 '18 at 09:55
  • thats what I am confused how to explain him or is there any way to instruct the designer to design in a proper way – Sivasankar K Nov 15 '18 at 10:01
  • _ is this right to add the spacing as he has given will this be proper in all devices?_ Technically if you use `px` in XML spacing will be exact (as per-pixel measurement) in all device but it won't look same as pixel density in different in different divices. – Kunu Nov 15 '18 at 10:10
  • Use dimens.xml for multiple screens. Create dimens.xml in values folder. First time you don't give any specifications, 2nd time give screen width as 600. that is for tablets – Athira Nov 15 '18 at 10:12
  • the problem is mainly that they use px as reference, so in a small screen this wont let see everything and in a large screen there will be a lot of blank space. A relative dimension should be used, like percentage or dps – Ivan Nov 15 '18 at 10:12
  • @Ivan - instead of px if i give dp, will it look the same in all devices – Sivasankar K Nov 15 '18 at 10:32
  • are you asking or telling me? – Ivan Nov 15 '18 at 10:57

2 Answers2

0

As other users told you, px is not a relative dimension. As an example, we suppose a mobile phone with 5x10 cm screen dimensions, the model has hdpi resolution (480x854 px). For this device, a horizontal margin of 100px takes up more than 20% of the screen width. But, we also have another phone with the same screen dimensions (5x10 cm), but this one is more expensive and it has higher resolution (xxhdpi -> 1080x1920 px). For this case, a horizontal margin of 100 px will not take up more than 10% of the screen width. Therefore, it is needed a relative dimension as dp.

A possible way to deal with your designer could be decide a device to do the designs (a common one). This is a useful link with some devices and their configurations: https://material.io/tools/devices/ . I could recommend you to design using a 720x1080 px (xhdpi) one as MotoG or Nexus 4. For this case, you only need to divide by 2 the px value that he provides you to get each dp value.

SopCam
  • 21
  • 3
0

You should take in account 3 Things:

  1. Px - dp proportions: Read this answer : https://stackoverflow.com/a/2025541/5884956 (actually the whole post is useful)

  2. Percentage doesn't work for you: What you improve by using dp instead of px is that for screens with same aspect ratio and different pixel density, the layout looks exactly the same (dp-density independent pixel). It means everything inside the screen will look with the same proportions (buttons, imageviews, margins... etc). Then, you would imagine all android phones have the same aspect ratio (16:9 for example). Which means that for every 16 dp of high, they have 9 dp of width , or in other words if you divide the height of the phone between the width of the phone will give you the same solution as 16/8. But this is way far from the reality. The most common one is 16:9 but some phones like "Samsung Galaxy S8" have 18,5:9 and there are a lot more aspect ratios: https://material.io/tools/devices/. If you work with %, the time you see your design in a different aspect ratio, your items will look stretched. And this is not the desired.

  3. Size does matter By this time you should be convinced that dp is the best solution, if not, someone pease improve my answer. Buuuuuut, as the screen size vary, the number of dp also does. So for a phone of bigger dimensions (even for same aspect ratio) we have more dp. Then you should work knowing that some parts are going to be stretched (it should be the spaces between items and margins).

Ideally (Android Studio should do all this work for you) working with same aspect ratio , % of dp should be the mesure and when changing the aspect ratio this changes must be reflected in spaces between views. But this is a hard work.

TL;DR

  • Select a standard device that designers are going to use to design (use a common one).
  • Tell them the design is not going to look exactly the same for every device (unless you design a different layout for each).
  • They need to decide which parts of the design are going to be the stretched (stretch spaces and margins please, not buttons or images).
  • Let them work with px, they may feel more comfortable (meanwhile you must convert it to dp and work with dp). Also if you choose an 'mdpi' device dp = px.
  • Look at the layouts that allows you work better with this kind of the designs ( I feel comfortable with ConstraintLayouts, but by working you will notice that this doesn't fit for everything ), but this is up to you.

Extra Information

https://developer.android.com/training/multiscreen/screensizes

Javier Antón
  • 570
  • 4
  • 8