All apps require some form of user interface for the user to input data or view the output of information.
Creating an interface for our apps is very easy. There are two ways to create user interfaces, with code or with XML:
If we are using code to create a button on the screen, we would do something similar to this:
protected override void OnCreate(Bundle bundle) { base.OnCreate(bundle); LinearLayout layout = new LinearLayout(this); layout.Orientation = Orientation.Vertical; Button button = new Button(this); button.Text = "Hello World!"; layout.AddView( button, ViewGroup.LayoutParams.MatchParent, ViewGroup.LayoutParams.WrapContent); SetContentView(layout); }
Both XML and code can be used to create equivalent UIs, but using XML, we have additional capabilities:
The equivalent interface in XML would be created and stored in the
layoutsub-folder of theResourcesfolder and reads as follows:<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/layout" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <Button android:id="@+id/button" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Hello World!" /> </LinearLayout>Once we have created the interface in XML, we have to indicate to the activity which layout file is to be used. This is done by invoking the
SetContentView()method in theOnCreate()method of the activity. For example, say we named our layout fileMain.axml:protected override void OnCreate(Bundle bundle) { base.OnCreate(bundle); // note the name "Main" SetContentView(Resource.Layout.Main); }
Regardless of whether the layout was created in code or through XML files, we are able to access the various controls similarly:
In order to access the control at runtime, we make use of the
FindViewByIdmethod on the activity or a view (use theViewproperty of a fragment):Button btn = FindViewById<Button>(Resource.Id.buttonId);
Separating the UI from the code allows us to easily make changes for updates as well as to support different screen configurations. The benefit of this is that it allows us to modify the UI without updating the code. And part of this is the fact that the Android system can switch the entire layout at runtime. Different layouts for different screen configurations can be selected simply by changing the suffix of the layout folder name.
Tip
Fragments can be used in addition to layouts to create advanced interfaces consisting of self-contained, reusable regions.
For example, if we want our Main layout to have the LinearLayout method to be vertical in portrait orientation and horizontal in landscape orientation, all we have to do is create two layout files with the same name in different folders as follows:
<project-root>/Resources/layout/<layout-file-name>.axml <project-root>/Resources/layout-land/<layout-file-name>.axml
There are many uses for the suffixes, and there are many different suffixes. Each of the resource subfolders can have suffixes, including values, layout, menu, and drawable. Each of the folders can have combinations of the suffixes for language or culture, screen orientation, screen density, screen size, and platform version. More information can be found online at https://developer.android.com/guide/topics/resources/providing-resources.html#AlternativeResources.
The Android layout structure usually follows the structure of the type, with the element name matching the type name and property names matching the attribute names. For example, the Button type has a Text property; thus, the XML will have a <Button android:text="..." /> element.
Although we can nest one or more layouts within another layout, we should strive to keep our layout hierarchy as shallow as possible. The layout will be drawn faster if it has fewer nested layouts.
One of the most important attributes in layouts is the id attribute. This attribute is used to uniquely identify a view within a tree. An ID need not be unique throughout the entire tree, but it should be unique within the part of the tree that is being searched.
Layout files are an easy way to create the UI separate from the code, and in the same way, resource files can be used to separate the localizable text from the layout. This is achieved by placing the strings into a resource file and then, referencing each the string from the layout. Say we have a button that has some text:
<Button android:text="Hello World!" />This value can be extracted and placed into a file under the values folder of the project resources (<project-root>/Resources/values/<file-name>.xml):
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="buttonText">Hello World!</string>
</resources>The layout file can then be updated to reference the value:
<Button android:text="@string/buttonText" />Using this pattern, we are able to not only extract strings but any value for any attribute, including layout information. An example would be to extract an element's padding and use a larger padding for larger screens. These types of resources are placed in the values folder with a suffix, such as -large for large screens.
Chapter 2 , Showing Views and Handling Fragments, Creating and using fragments
Providing Resources | Android Developers, https://developer.android.com/guide/topics/resources/providing-resources.html#AlternativeResources