Lesson 16. Software Screen Creation. LayoutParams

Lesson 16. Software Screen Creation. LayoutParams


In this lesson we:

– we draw the screen programmatically, not through the layout file

Before that we created a screen with layout files. But we can do the same programmatically.

Let’s create a project:

Project name: P0161_DynamicLayout
Build Target: Android 2.3.3
Application name: DynamicLayout
Package name: ru.startandroid.develop.dinamiclayout
Create Activity: MainActivity

open MainActivity.java and pay attention to the line:

setContentView(R.layout.main);

Recall that in this line we indicate that Activity how the screen will use layout file main.xml. There is another implementation of this method, which accepts not the layout file as input View-The element also makes it root. In layout files, the root element is usually LinearLayout, We also use it.

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // создание LinearLayout
        LinearLayout linLayout = new LinearLayout(this);
        // установим вертикальную ориентацию
        linLayout.setOrientation(LinearLayout.VERTICAL);
        // создаем LayoutParams  
        LayoutParams linLayoutParam = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT); 
        // устанавливаем linLayout как корневой элемент экрана 
        setContentView(linLayout, linLayoutParam);
    }

Update Import – CTRL + SHIFT + O. Eclipse will ask us which one to choose LayoutParams we will use. Here it is necessary to dwell in more detail. Let’s remember the theory about screens. The screen consists of ViewGroup and View nested in them.

We know of examples ViewGroup is it LinearLayout, TableLayout, RelativeLayout etc. Each of these ViewGroup has a LayoutParams nested class. The default for these LayoutParams is ViewGroup.LayoutParams.

ViewGroup.LayoutParams has only two attributes: height and width. Its ViewGroup.MarginLayoutParams subclass inherits two of these attributes and has four: bottomMargin, leftMargin, rightMargin, topMargin. The LinearLayout.LayoutParams class, in turn, is a subclass of ViewGroup.MarginLayoutParams, inherits 6 attributes from it and adds two: gravity and weight.

That is an object LinearLayout has a nested class LinearLayout.LayoutParams with layout attributes. And these attributes apply to all View and ViewGroup children.

That is, the View that is in LinearLayout has one set of layout parameters:

and View from RelativeLayout is another:

There are also common elements because the parents in these ViewGroup are the same.

Back to Eclipse, he is waiting for our choice. We use the base class ViewGroup.LayoutParams

Let’s parse the code. we create LinearLayout and put vertical orientation. then create LayoutParams. The constructor on input accepts two parameters: width and height. We both put MATCH_PARENT. The setContentView method is then called. He is fed to the entrance LinearLayout and LayoutParams. This means that the root element Activity will LinearLayout with layout properties from LayoutParams.

If we launch the application now, we will not see anything because LinearLayout is transparent. Let’s add components to LinearLayout View.

        LayoutParams lpView = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        
        TextView tv = new TextView(this);
        tv.setText("TextView");
        tv.setLayoutParams(lpView);
        linLayout.addView(tv);
        
        Button btn = new Button(this);
        btn.setText("Button");
        linLayout.addView(btn, lpView);

We recreate the object LayoutParams with attributes width = wrap_content and height = wrap_content. Now if we give this object any View, then it is View will have width and height in content.

Next we create TextView, We customize its text, assign it the LayoutParams created above and add it to LinearLayout using the addView (View child) method.

WITH Button similarly, we create, edit text, and then use another implementation of the addView (View child, ViewGroup.LayoutParams params) method, which simultaneously adds Button in LinearLayout and assigns to Button specified LayoutParams. The result will be the same as with TextView, but instead of two lines of code came one.

Note that for two View objects I used one LayoutParams object – lpView. Both View objects count parameters and use LayoutParams.

Save and launch the application. We see the components appear on the screen. It can be seen that their height and width are determined by their content (wrap_content).

object lpView has a basic type android.view.ViewGroup.LayoutParams. So it will allow you to adjust only the width and height. But for View in LinearLayout available, for example, left indentation or right edge alignment. And if we want to use them, then we must use them LinearLayout.LayoutParams:

        LinearLayout.LayoutParams leftMarginParams = new LinearLayout.LayoutParams(
                LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        leftMarginParams.leftMargin = 50;
        
        Button btn1 = new Button(this);
        btn1.setText("Button1");
        linLayout.addView(btn1, leftMarginParams);

We look at the code. We create an object of type LinearLayout.LayoutParams using the same constructor as for regular LayoutParams, pointing width and height. Then we specify indent to the left = 50. Indentation here is indicated in pixels. The scheme is as follows: create an object, configure the text and add it to LinearLayout with LayoutParams assignments.

Similarly, add the component with the alignment:

        LinearLayout.LayoutParams rightGravityParams = new LinearLayout.LayoutParams(
                LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        rightGravityParams.gravity = Gravity.RIGHT;
        
        Button btn2 = new Button(this);
        btn2.setText("Button2");
        linLayout.addView(btn2, rightGravityParams);

Let’s save and run. Button1 has a 50px indent. Button2 is right-aligned:

Probably this topic will not be very clear the first time. Therefore, in the next two lessons we will consolidate this knowledge and practice in adding elements to the screen and adjusting them.

Full lesson code:

public class MainActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // создание LinearLayout
        LinearLayout linLayout = new LinearLayout(this);
        // установим вертикальную ориентацию
        linLayout.setOrientation(LinearLayout.VERTICAL);
        // создаем LayoutParams  
        LayoutParams linLayoutParam = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT); 
        // устанавливаем linLayout как корневой элемент экрана 
        setContentView(linLayout, linLayoutParam);
        
        LayoutParams lpView = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        
        TextView tv = new TextView(this);
        tv.setText("TextView");
        tv.setLayoutParams(lpView);
        linLayout.addView(tv);
        
        Button btn = new Button(this);
        btn.setText("Button");
        linLayout.addView(btn, lpView);

        
        LinearLayout.LayoutParams leftMarginParams = new LinearLayout.LayoutParams(
                LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        leftMarginParams.leftMargin = 50;
        
        Button btn1 = new Button(this);
        btn1.setText("Button1");
        linLayout.addView(btn1, leftMarginParams);

        
        LinearLayout.LayoutParams rightGravityParams = new LinearLayout.LayoutParams(
                LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        rightGravityParams.gravity = Gravity.RIGHT;
        
        Button btn2 = new Button(this);
        btn2.setText("Button2");
        linLayout.addView(btn2, rightGravityParams);
    }
}

In the next lesson:

– Add components to the screen while the program is running




Discuss in the forum [72 replies]

Leave a Comment