Android AutoLayout the new adaptation method is a Terminator.

Source: Internet
Author: User

Android AutoLayout the new adaptation method is a Terminator.

 

I. Overview

I believe that Android Developers are worried about configuration issues. Although Google provides a series of suggestions, it is quite difficult to simply use these suggestions to make the device easy. I also pay more attention to adaptation issues. I have also published several articles on adaptation, which are roughly as follows:

Android screen adaptation solution: percent-support-lib parsing and scaling the percentage layout library of Android enhanced edition for adaptation

OK. Let me give a general idea. If you haven't read this article, you should not read the above articles. This article is inspired by the above articles, however, the convenience and Effect of adaptation are far better than those described above.

Since it is inspired by the above articles, we will give a general introduction:

Article 1: Convert the px size marked on the design drawing to the percentage based on the design drawing size to generate the value of the percentage for all mainstream screens, each size has a values folder. There are some problems: a large number of folders are generated and cannot adapt to special sizes (default folders must be created)

Article 2 and Article 3: These two articles are the same, mainly based on the percentage layout launched by Google, which has largely solved the adaptation issue. There are some problems: the usage is more anti-human, because the design map identifies px, so we need to calculate the percentage, and then this percentage still depends on the parent container, the Design Drawing may not mark the size of each parent container, and it is hard to use (of course, some people have used automated tools to calculate ). Another problem is that the height of ScrollView, ListView, and other containers cannot use the percentage because it depends on the parent container.

We can see that there are some problems and more or less some additional work is required. However, I hope the adaptation is as follows:

After obtaining the design drawing, enter the size of the design drawing in the meta information, and then directly copy the size on the design drawing without any additional resource files. This completes resolution adaptation! 2. intuitive experience

Suppose we get a design drawing:

This design drawing is very common in development. Some companies may need to perform measurement on their own.

According to our ideas:

Layout directly copy the size on the Design Drawing

For,New passengersOur layout library should be written as follows:


  
   
    
   
  

Let's take a look at the combination chart:

Think about it. It's cool to write layout in this way.

OK, so the layout file of the Item is written as follows:


      
       
    
   
  

Seeing this, I believe that your biggest question now is: can you use px and px to adapt? Funny?

First, let's talk about it: this px does not represent 1 pixel. I will perform percent processing internally. That is to say, for a screen with a 720px height, you enter 72px here, accounting for 10%; when the layout file runs on any resolution mobile phone, the 72px represents a height of 10%, which is the principle of library adaptation.

Next, let's take a look at the effects of different resolutions:

768*1280, Andriod 4.4.4

480*800, Android 2.3.7

The resolution difference between the above two machines is quite large. According to the percentage rules, the best adaptation is achieved. The most important thing is:

You no longer need to take the design draft to figure out how much dp the width and height of the control take. You no longer need to write multiple dimens for multiple screens, and you no longer need to calculate the percentage (if the percentage control is used for adaptation) I no longer need to explain what dp is with UI MM.

Next, let's talk about the usage.

Address of the Library: https://github.com/hongyangAndroid/AndroidAutoLayout

Iii. usage (1) register the design drawing size

Introduce autolayout

dependencies {    compile project(':autolayout')}

For eclipse partners, only the source code can be copied ~~

In your project's AndroidManifest, specify yourDesign draft.


  
   
  
(2) Enable configuration in Activity for your Activity to inherit AutoLayoutActivityWrite in onCreate of your Activity:

AutoLayout.getInstance().auto(this, true);For example:

@Overrideprotected void onCreate(Bundle savedInstanceState){    super.onCreate(savedInstanceState);    setContentView(R.layout.activity_main);    AutoLayout.getInstance().auto(this);}

OK. You can introduce the project in two simple steps. What then?

Then start playing based on the previous chapter ~

OK. The above is the simplest usage. Of course you can not inheritAutoLayoutActivity.

AutoLayoutActivityThe usage is actually completed:

LinearLayout-> AutoLinearLayout RelativeLayout-> AutoRelativeLayout FrameLayout-> AutoFrameLayout

If you do not want to inheritAutoLayoutActivitySo you have to replace the original XXXLayout in the system with AutoXXXLayout, just like Google's percentage library. Of course, you can rest assured that all original attributes of system properties will be supported, but the root layout does not support automatic percentage of px, but the root layout is usually MATCH_PARENT, in the preceding method, the root layout can be directly scaled as a percentage of px.

Iv. Note (1) how to enable PreView

As we all know, when writing layout files, you cannot preview the results in real time, so the experience is really bad, and the development efficiency is greatly reduced, so here we will teach you how to make good use of PreView (for this library ).

First, remember the size of your design draft, such768 * 1280

Then on your PreView panel, select a device with consistent resolution:

Then you can seeThe most accuratePreview:

Two considerations:

The size of the design drawing you UI gave is not the mainstream design drawing. You can Hit him with a monitorCreate a device by yourself. Do not view the display at all resolutions in the PreView, but cannot see the adaptation effect, because some calculations are dynamic. (2) about TextView

The TextView control may differ from the design draft, not because of the library, but inherent features.

For example:


      

It is definitely not a 32px height for you to run it, and there will be some gaps between the upper and lower sides of the text. You can also find that the text is not completely displayed.

Well, you can flexibly deal with this problem. You can choose the top and bottom margins of TextView and other controls if there are very precise font identifiers.

In fact, almost all of my examples above are textviews. When I wrote items, I also intentionally reduced the marginTop value. However, this problem does not exist for other controls.

Ps: Due to the above problem of TextView: For center, you can use this library to writemargin_left,margin_topAnd so on. However, we recommend that you usegravity,centerInXXX.

5. Other currently supported attributes layout_width layout_height layout_margin (left, top, right, bottom) pading (left, top, right, bottom) textSize will not affect all other attributes of the system, and does not affect the performance of dp and sp.

You can use this library to write code.marginThat is to say, the position of the View is very well controlled, so as to reduce a lot of nesting, and even any complicated interface is not nested.

And, there is almost no need to use RelativeLayout rules, such as rightOf, can be completelymarginLeftFinished. The same applies to other rule.

For the weight of LinearLayout, almost no need to use it. For example, if the screen width is 720px and the four controls are evenly divided horizontally, you can writelayout_width=180px

I believe that through the above introduction, you have already learned how to adapt to this database, and it can be said that it is the most convenient adaptation solution I have ever seen, minimizing the adaptation burden, it is even easier to write the UI than when you are not compatible. Currently, this library has been used in projects to discover potential problems as much as possible.

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.