Screen adaptation of Android fragmentation
Nowadays, due to the openness of the Android system, various Android versions, resolutions, models and other devices from different manufacturers have appeared on the market. For our development, fragmentation is definitely a brainstorming problem. Android system fragmentation, Android model screen size fragmentation, and Android screen resolution fragmentation. There are various mainstream screen sizes of Android phones on the market, and even if the screen size problem is solved, the various resolutions are dazzling. Faced with the adaptation problem thrown by the test students, the heart, liver and lungs trembled. Today we will talk about the resolution steps for screen adaptation.
1. The solutions for screen adaptation are:
"Layout" matching : Use relative layout (RelativeLayout), disable absolute layout (AbsoluteLayout). Load the corresponding UI layout and size qualifier according to the configuration of the screen.
"Layout component" matching : Use "wrap_content", "match_parent" and "weight" to control the width and height of the view component
"Picture resource" matching : Use automatic stretch bitmap: Picture type of Nine-Patch
2. The meaning of some terms for Android screen adaptation:
Screen size: That is, what we usually call a certain mobile phone is a few inches screen, such as HTC one V this mobile phone is 3.7 inches, the inch here refers to inches (inch), the unit used in the international arena, 1inch = 2.54cm, 3.7 inches refers to the diagonal length of the screen.
Screen resolution: refers to the width and height of the screen in pixels, for example, HTC one V is 480*800.
Screen density: the number of pixels per inch, such as HTC one V, is 252 px/inch.
px: pixels. A display screen is composed of many light spots, and each light spot is a pixel. Because these light spots are very small and dense, think about it. On the 3.7-inch mobile phone mentioned above, there are 480 light spots in the horizontal direction and 800 light spots in the vertical direction, so the displayed text or picture is very delicate and smooth.
ppi: It means the same as the screen density. The full name is pixel per inch. It is a professional name.
dpi: dot per inch, the number of dots per inch. In the field of electronic display, it has the same meaning as PPI. This abbreviation is meaningful only when printing. There is no name for PPI in the printing field, only DPI, which means that the printer prints a few pixels per inch. Under the same pixel width and height, the larger the dpi, the smaller the printed pattern.
dip: or dp, this is a measurement unique to Android development, called screen-independent pixels, it does not represent any specific length or pixel points, this value will only be converted to a mobile phone with a specific screen density The specific pixel value. Only then will it have practical significance. The specific conversion will be explained next.
The res directory of the Android project is generally added by our own creation, there will be 6 directories, namely: drawble drawble-ldpi drawble-mdpi drawble-hdpi drawble-xhdpi drawble-xxhdpi , this does not include more special drawble directory (For example, drawlbe-land-hdpi, which means high-resolution pictures in the horizontal direction. No matter how long these directories are, they are matched according to a little rule. Our goal is to find the rules from the individual and apply To the whole).
3. The relationship between screen size, resolution, and pixel density
Pixel density = Sqrt (horizontal pixels × horizontal pixels + vertical pixels × vertical pixels) / screen size
4. Steps to solve the problem of adapting the screen size and screen density of the control.
The percentage adaptation method, the steps are as follows:
1. Based on a certain resolution, generate a list of pixel numbers corresponding to all resolutions
. 2. Store the generated pixel number list in the corresponding values file in the res directory.
3. Find the size according to the design drawing given by the UI designer The unit corresponding to the number of pixels, and then set it to the control
Step 1 : Based on a certain resolution, generate a list of the number of pixels corresponding to all resolutions
Now we use the resolution of 320x480 as the benchmark:
divide the width of the screen into 320 parts, the value is x1~x320,
divide the height of the screen into 480 parts, the value is y1~y480,
and then generate a list of the number of pixels corresponding to the resolution ,As shown below:
lay_x.xml（宽）
<?xml version="1.0" encoding="utf-8"?>
<resources><dimen name="x1">1.0px</dimen>
<dimen name="x2">2.0px</dimen>
<dimen name="x3">3.0px</dimen>
<dimen name="x4">4.0px</dimen>
<dimen name="x5">5.0px</dimen>
<dimen name="x6">6.0px</dimen>
<dimen name="x7">7.0px</dimen>
<dimen name="x8">8.0px</dimen>
<dimen name="x9">9.0px</dimen>
<dimen name="x10">10.0px</dimen>
<dimen name="x300">300.0px</dimen>
<dimen name="x301">301.0px</dimen>
<dimen name="x302">302.0px</dimen>
<dimen name="x303">303.0px</dimen>
<dimen name="x304">304.0px</dimen>
<dimen name="x305">305.0px</dimen>
<dimen name="x306">306.0px</dimen>
<dimen name="x307">307.0px</dimen>
<dimen name="x308">308.0px</dimen>
<dimen name="x309">309.0px</dimen>
<dimen name="x310">310.0px</dimen>
<dimen name="x311">311.0px</dimen>
<dimen name="x312">312.0px</dimen>
<dimen name="x313">313.0px</dimen>
<dimen name="x314">314.0px</dimen>
<dimen name="x315">315.0px</dimen>
<dimen name="x316">316.0px</dimen>
<dimen name="x317">317.0px</dimen>
<dimen name="x318">318.0px</dimen>
<dimen name="x319">319.0px</dimen>
<dimen name="x320">320px</dimen>
</resources>
lay_y.xml（高）
<?xml version="1.0" encoding="utf-8"?>
<resources><dimen name="y1">1.0px</dimen>
<dimen name="y2">2.0px</dimen>
<dimen name="y3">3.0px</dimen>
<dimen name="y4">4.0px</dimen>
...
<dimen name="y480">480px</dimen>
</resources>
After finding the benchmark, it's time to complete other resolutions. Now take the resolution of 1080x1920 as an example:
Because the benchmark is 320x480, 1080/320=3.375px, 1920/480=4px, so the corresponding file should be
lay_x.xml
<?xml version="1.0" encoding="utf-8"?>
<resources><dimen name="x1">3.375px</dimen>
<dimen name="x2">6.65px</dimen>
<dimen name="x3">10.125px</dimen>
...
<dimen name="x320">1080px</dimen>
</resources>
lay_y.xml
<?xml version="1.0" encoding="utf-8"?>
<resources><dimen name="y1">4px</dimen>
<dimen name="y2">8px</dimen>
<dimen name="y3">12px</dimen>
<dimen name="y4">16px</dimen>
...
<dimen name="y480">1920px</dimen>
</resources>
Step 2 : Put the generated pixel number list into the corresponding resource file.
The generated pixel number list (lay_x.xml and lay_y.xml) will be stored in the corresponding values file in the res directory (note that the width and height must correspond), as shown below :
Step 3 : According to the size on the design drawing of a certain resolution given by the UI designer, find the unit corresponding to the number of pixels, and then set it to the control
as shown below:
<FrameLayout >
<Button
android:layout_gravity="center"
android:gravity="center"
android:text="@string/hello_world"
android:layout_width="@dimen/x160"
android:layout_height="@dimen/y160"/>
</FrameLayout>
Conclusion
Using the above-mentioned adaptation method, it should be able to perform 90% adaptation, but its shortcomings are still obvious:
because px is actually used as the unit of measurement for length, it will be different if dp is used as the unit of measurement as required by Google. Deviate
All resolutions must be included as much as possible, because this is the basis for using this solution. If a certain resolution is missing, the screen adaptation will not be completed.
Excessive resolution pixel description xml files will increase the size of the software package and the difficulty of maintenance
"Image resource" match
Essence : Make image resources display the same pixel effect on different screen densities
Method : Provide backup bitmaps (picture resources that fit the screen size)
Since Android can run on devices with various screen densities, the bitmap resources we provide should always meet the requirements of various densities:
| Density type | Represents the resolution (px) | System density (dpi) |
|---|---|---|
| Low density (ldpi) | 240x320 | 120 |
| Medium density (mdpi) | 320x480 | 160 |
| High density (hdpi) | 480x800 | 240 |
| Ultra high density (xhdpi) | 720x1280 | 320 |
| Super ultra high density (xxhdpi) | 1080x1920 | 480 |
Step 1: Generate corresponding pictures for each density according to the following size ranges.
For example, if we generate 200x200 px size images for xhdpi devices, we should generate 150x150, 100x100 and 75x75 size images for hdpi, mdpi, and ldpi devices according to the corresponding proportions.
That is, a set of resolution = a set of bitmap resources (this is of course made by the Ui designer)
Step 2: Place the generated image file in the corresponding subdirectory (mdpi, hdpi, xhdpi, xxhdpi) under res/, and the system will automatically select the appropriate image according to the screen density of the device running your application
Step 3: By referencing @drawable/id, the system can automatically select the appropriate bitmap according to the screen density (dpi) of the corresponding screen.
Note:
If it is 9 pictures or pictures that do not require multiple resolutions, just put them in the drawable folder. The pictures with corresponding resolutions should be placed in the appropriate folder correctly, otherwise it will cause problems such as picture stretching.
Unknowingly, it’s almost the same. I will talk about it today. I will continue to share experience and experience with you in the follow-up. Finally, I recommend that you want to quickly discover and solve the Android screen adaptation problem. You can click on the portal to learn about the excellent test. If you are interested, you can immediately add the official group to the official group: 214483489
Click "Portal" to learn about the latest developments of Youce.
Portal: https://newtest.21kunpeng.com/home