androidandroid-screen-support

Android Different Screen Size and Density


Question One: My application has 18-20 xml layout files. How can i make app same on all android phone. I read many answers creating different value folder for sizes and density but how can i achieve both things like some phone have different density but same screen size. and creating 7-8 files for each layout xml file i think will not be good.

Please be specific do not reply the links of other questions or android developer site url. I have read all android doc and answers in stack overflow.

Question 2: in two activities im creating button at run time. i have created button according to density but what about size if size is big there is many blank white space left.

Resources r = getResources();
            int px = Math.round(TypedValue.applyDimension(
                    TypedValue.COMPLEX_UNIT_DIP, 150,r.getDisplayMetrics()));


            button.setWidth(px);   
            button.setHeight(px);  

Solution

  • As we all know, different phones have different screens. Almost all android phones are in a 16 by 9 ratio. (Except for the wonderfull s8 ... ).

    Now I used to run into problems regarding the design but I found a way to make the design look 100 % the same on every 16:9 and even 21.5:9 screens.

    What I basically do is design in photoshop on an xxxhdpi canvas:

    2560 x 1440 with 577 in density.

    I render my buttons and use a batch converter to convert each button (drawable) into 5 different sizes:

    xxxhdpi = 100 % ( the size of the original )
    xxhdpi = 75 %
    xhdpi = 50 %
    hdpi = 37.5 %
    mdpi = 25 %.
    

    I then put up 5 different folders in my android project, named:

    "drawable-xxxhdpi"
    "drawable-xxhdpi"
    "drawable-xhdpi"
    "drawable-hdpi"
    "drawable-mdpi"
    

    I insert my drawables in the correct folders and start the design.

    I try to always use a linearlayout and then use android:layout_weights to determine the position on the screen.

    Weights work like percents, so saying I put up two linear layouts into my root layout, both weighing in at exactly 50 . they fill up exactly half the screen on every device.

    This works very well for all devices as long as you can use a linearlayout.

    If I need to use a framelayout I then go into the code of my class and init every element that cannot have weights. Especially when it comes down to padding:

    I put up a new linearlayout.layoutparams for the elemens in questions in for witdh and height go "resources.dimensions.displaymetrics.height / width pixels and divide those with a hardcoded number.

    Since the display metrics correspond the actual phone, the division will end in percentages, even when frame layouts are used. Same goes for margins or padding.

    The result is flawless. No matter what phone is used, when it is 16:9 ratio, the design will ALWAYS look the same. Even in Scrollviews, Relative-Layouts and so one.

    For phones with a different aspect ratio I set the ratio by dividing hightpixels / widthpixels which makes the design work just as well on those screens.

    The result ends in much work but perfect design. I refuse to use "dpi" in my axmls, since they do work but will not ALWAYS look the same on each phone.

    I hope this wil be an answer for you. In Short: Design in photoshop, render one button, batchconvert it, put up on xml and youre good.