Hello. I decided to try to write my first application. Immediately a question arose. enter image description here

There is such a pattern. The background is in principle clear how to do it, I will do it through standard xml background. But how to work with the image in the center, so that it would be proportionally compressed on different smartphones. Tell us how you type it? Maybe there is a service that cuts the image for all devices?

ps Template parameters Width 640px height 960px

    2 answers 2

    Break into 4 elements:

    Red background - background
    Black Manchester Logo - ImageView
    White lettering - TextView
    The white icon at the bottom - ImageView - image .9.png, with stretching ends, where there is no image. Android Studio has a built-in tool for working with 9patch images.

    All this is LinearLayout into a vertical LinearLayout , you specify the vertical margin (margin) for the Manchester logo from the top and paddings (indents) for all elements. For the Manchester logo, text and icon below the text, the horizontal size indicates - match_parent - to occupy the entire width, position the text inside with the help of gravity in the center and in general it is ready.

    ImageView done with a transparent background.

    For the preparation of two ImageView you can use the built-in Android Studio Asset Manager. Make one image under the maximum resolution (the largest picture), add to the project, then в IDE правый клик по картинке -> New -> Image Asset .
    There you will understand - the tool will prepare images for the desired density of the screen and will scatter itself on the necessary folders.
    If you are not familiar with the support of different screen resolutions in android, you need to be familiar with , in particular, the choice of an appropriate system for a particular device image.
    For TextView specify the font size in sp - this should be enough for scaling

    • Thanks helped! - duddeniska
    • @duddeniska aha, added a little ... - pavlofff
    • Great answer! Thank! - researcher

    All sizes are in dp. Graphics cut into 4 copies in the folder drawable

    xlarge (xhdpi): 640x960 large (hdpi): 480x800 medium (mdpi): 320x480 small (ldpi): 240x320

    Layout in xml in the folder layout.

    Use the 9patch utility http://habrahabr.ru/post/113623/

    Support for various screens http://developer.android.com/training/multiscreen/screensizes.html

    If you do not want to suffer with raster graphics and cutting, the images can be connected in a vector. For this you need a library like androidsvg