Android user interface-XML Layout

The layout is an activity structure for the user interface. It defines the layout structure and holds all elements displayed to the user. You can use either of the following methods to declare your layout:

1. Declare the UI element in the XML file. Android provides a simple XML vocabulary that corresponds to the View class and subclass. For example, widget components and layout.

2. instantiate layout elements at runtime. Your application can program to create view and viewgroup objects (and manipulate their attributes)

The android framework provides a flexible way to declare and manage the application UI. You can use either of the preceding methods or both. For example, you can declare the default layout of an application in an XML file, including the screen elements and attributes to be displayed in the layout. Then you can add code in the application to modify the status of the Screen Object at runtime, including the attributes declared in the XML file.

The advantage of declaring the application UI in an XML file is that it can better separate the application's performance from the code that controls their behavior. Your UI is described outside the application code, which means you can modify and adjust the UI without modifying or re-compiling the code. For example, you can create XML layout files for different screen directions, device screen sizes, and languages. In addition, declaring the layout in the XML file makes it easier to see the UI structure, making debugging easier. For example, this document focuses on how to declare the layout in an XML file. If you are interested in instantiating a view object at runtime, see viewgroup and View class descriptions.

Generally, XML vocabulary that declares UI elements is closely related to the structure and naming of these classes and methods. In fact, you can directly guess a class method corresponding to the XML Attribute, or guess the XML element corresponding to the class. However, note that not all terms are the same. In some cases, there may be slight differences in naming. For example, the edittext element has a text attribute that corresponds to the edittext. settext () method.

Tip:In the "common layout objects" topic, you will learn more about different types of la S.

Write XML

With the XML vocabulary of Android, you can quickly design the UI layout and the screen elements they contain, just as easily and quickly as creating webpages with HTML tags.

Each layout file must contain a clear root element, which must be a view or viewgroup object. Once you have defined the root element, you can add additional layout objects, components, and other child elements to gradually build a hierarchical tree that defines the overall layout view. For example, the following uses the XML layout of the vertical linearlayout object that holds the textview object and the button object:

<? XML version = "1.0" encoding = "UTF-8"?>
<Linearlayout xmlns: Android = "http://schemas.android.com/apk/res/android"
Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent"
Android: Orientation = "vertical">
<Textview Android: Id = "@ + ID/text"
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: text = "Hello, I am a textview"/>
<Button Android: Id = "@ + ID/button"
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: text = "Hello, I am a button"/>
</Linearlayout>

After the layout is declared in XML, save the file with the. xml extension to the res/layout directory of your android project so that the project can be correctly compiled.

Each attribute in the above example will be discussed later.

Load XML Resources

When compiling an application, each XML layout file is compiled into a view resource. You should load the layout resource in the implementation code of the application's activity. oncreate () callback. You can call setcontentview () to load view resources. To call this method, you must pass the referenced layout resource to it in the format of R. layout. layout_file_name. For example, if the XML layout is saved in the main_layout.xml file, load it as follows:

Public void oncreate (bundle savedinstancestate ){
Super. oncreate (savedinstancestate );
Setcontentview (R. layout. main_layout );
}

When the activity is started, the oncreate () callback method in the activity is called by the android framework.

Attribute (attributes)

Each view and viewgroup object supports their own XML attributes. Some attributes are for a view object (such as the textsize attribute supported by the textview object), but these attributes are also inherited by any view object inheriting this class. Some attributes are shared by all view objects, because they are inherited from the Root View class (such as the ID attribute), and other attributes are considered as "layout Parameters, they are attributes describing a layout direction of a view object, which is usually defined by the parent viewgroup object of the object.

Id attribute

Any view object can have an integer ID associated with it, which uniquely identifies this view in the hierarchical tree of the layout. During application compilation, this ID is referenced as an integer, but this ID is usually associated with the string corresponding to the ID attribute value in the layout XML file. This is an attribute that is common to all view objects (with a View class definition) and is frequently used. The following is its syntax in the XML tag:

Android: Id = "@ + ID/my_button"

The @ character at the beginning indicates that the XML Parser should parse and extend the rest of the ID string and identify it as an ID resource. "+" Indicates that this is a new resource name that must be created and must be added to our resource file (R. Java file ). There are many ID resources provided by the android framework. When an android resource ID is referenced, the "+" number is not required, but the android package namespace must be added as in the following example:

Android: Id = "@ Android: ID/empty"

The android package namespace indicates that we apply an ID from the android. r Resource class instead of a local resource class.

To create a view and apply it to the application, the common mode is as follows:

1. Define a view/widget in the layout file and assign it a unique ID;

<Button Android: Id = "@ + ID/my_button"

Android: layout_width = "wrap_content"

Android: layout_height = "wrap_content"

Android: text = "@ string/my_button_text"/>

2. Create an instance of the view object and obtain it from the layout (usually in the oncreate () method)

Button mybutton = (button) findviewbyid (R. Id. my_button );

When creating a relativelayout object, it is important to define the ID of the view object. In the relative layout, a view of the same level references a unique ID to define the layout of the view relative to another view.

IDS do not need to be unique in the entire hierarchy tree. A single ID should be unique in the hierarchy section you want to search for (Because retrieval is often the entire hierarchy tree, so it is best to make it as globally unique as possible ).

Layout Parameters

Name: Layout _SomethingThe XML layout attribute defines the layout parameters of the viewgroup object that is suitable for the view object to reside.

Each viewgroup class implements a nested class that inherits viewgroup. layoutparams. This subclass includes attribute types that define dimensions and positions for each sub-view so that the sub-view formation can adapt to this viewgroup object. 1. The parent viewgroup defines the layout parameters for each sub-view (including the sub-viewgroup:

Figure 1. View hierarchy with layout parameters associated with each sub-View

Note that each layoutparams subclass has its own syntax for setting values. Each child element must define the layoutparam subclass suitable for its parent element, although it can also define different layoutparam subclasses for its own child elements.

All viewgroups contain a width and height (layout_width and layout_height attributes), and each view must define them. Many layoutparam classes also contain optional attributes such as margins and borders.

You can specify the width and height through precise measurement, although this is not always possible. More, you can set the width and height in the following ways:

1. wrap_content will tell you that its size is determined by its content;

2. fill_parent (match_parent recommended in API Level 8) will tell you that the view will become the same size as its parent viewgroup.

In general, it is not recommended to use absolute units to specify the width and height of the layout. On the contrary, relative calculations are required, such as resolution-independent pixel units (DP ), wrap_content or fill_parent is a good method because it helps your applications to be displayed on devices of various sizes.

Layout location

A view is a rectangle. It uses the coordinates of the Left vertex of the rectangle to express its position (left and top), and uses width and height to express the sizes of both sides. The unit of measurement for the position and size is pixel.

Call the getleft () and gettop () methods to obtain the position of a view. The Return Value of the getleft () method indicates the left margin or X coordinate of the view. The Return Value of the gettop () method indicates the top margin or Y coordinate of the view. The returned values of these two methods are relative to the position of its parent element. For example, when the getleft () method returns 20, this means that the view object is set to 20 pixels to the right of the left edge of its parent element.

In addition, there are several convenient methods to avoid unnecessary calculations, including getright () and getbottom (). The two methods return the coordinates of the lower right vertex of the view object. For example, calling the getright () method is equivalent to the calculation result of getleft () + getwidth.

Dimensions, filling methods, and edges

The size of a view object is expressed in width and height. A view object actually has two pairs of width and height values.

The first pair is called the measurement width and height. These two dimensions define the desired size of a view object in its parent element. The measurement size can be obtained by calling the getmeasuredwidth () and getmeasuredheight () methods.

The second pair is simply called width and height, or is sometimes called width and height. The two dimensions define the actual drawing and layout size of the view object on the screen. These two values can be but do not have to be distinguished with the measurement width and height. You can call the getwidth () and getheight () methods to obtain the width and height of the view object.

To calculate the size of view objects, You need to calculate their filling mode. Fill mode is measured in pixels, representing the rectangular area between the left vertex and the right bottom vertex of the view object. The fill mode can be used to offset the view object content (by specifying the offset pixel ). For example, if the left side is filled with 2, the content of the view object is pushed to the position of 2 pixels on the right of the left edge of the object. The filling method can be set by calling the setpadding (ing, Int, INT) method, and by calling the getpaddingleft (), getpaddingtop (), getpaddingright (), and getpaddingbottom () methods.

Although a view object can only define the filling mode without any support for edges, viewgroup provides such support. For more information, see viewgroup and viewgroupmarginlayoutparams.