In Android app development, there are various components that make up the user interface (UI), among which LinearLayout<\/strong> is one of the most basic and important layouts. LinearLayout provides the functionality to arrange child views in a linear fashion, either horizontally or vertically. In this course, we will explain the concept, usage, attributes, and examples of LinearLayout in detail.<\/p>\n LinearLayout is a view group that allows you to arrange child views in a single row. By default, it allows aligning child views in two directions: horizontal<\/strong> and vertical<\/strong>. This allows for quick and easy configuration of simple layouts.<\/p>\n LinearLayout has the following characteristics:<\/p>\n To use LinearLayout, define it in the XML layout file and add other views inside it. The basic structure of a LinearLayout is as follows.<\/p>\n Below is an example of a LinearLayout set in a vertical direction. In this example, we will create a simple app using basic UI elements, namely TextView and Button.<\/p>\n LinearLayout can also be set in horizontal direction. The following code is an example of arranging a button and a text view horizontally.<\/p>\n Now, let’s explain the key attributes you need to know when using LinearLayout.<\/p>\n The orientation attribute sets the direction of the LinearLayout. The default value is vertical direction.<\/p>\n The layout_gravity attribute sets the position of child views. By default, child views will take the full width or height of the LinearLayout.<\/p>\n The weight attribute is very useful for setting the proportion of child views. This allows you to adjust the space that child views occupy within the LinearLayout.<\/p>\n Below is an example where two buttons are used, sharing an equal proportion.<\/p>\n Now, let’s create a simple app that uses LinearLayout. The following example shows an app where the user inputs their name, and upon clicking a button, a welcome message is displayed.<\/p>\n LinearLayout is one of the most basic yet very useful layouts among Android UI components. In this course, we explored the concept, usage, key attributes, and examples related to LinearLayout. You can effectively configure simple user interfaces using LinearLayout. Furthermore, you can use it alongside various layout options to create more complex and sophisticated UIs.<\/p>\n Now, try creating your own app using LinearLayout! It would be great to practice by combining various UI elements and layout properties.<\/p>\n","protected":false},"excerpt":{"rendered":"1. Understanding LinearLayout<\/h3>\n
1.1. Direction of LinearLayout<\/h4>\n
\n
1.2. Components<\/h4>\n
\n
2. How to Use LinearLayout<\/h3>\n
<LinearLayout\n android:layout_width=\"match_parent\"\n android:layout_height=\"match_parent\"\n android:orientation=\"vertical\">\n\n <TextView\n android:layout_width=\"wrap_content\"\n android:layout_height=\"wrap_content\"\n android:text=\"Hello!\" \/>\n\n <Button\n android:layout_width=\"wrap_content\"\n android:layout_height=\"wrap_content\"\n android:text=\"Click me!\" \/>\n\n<\/LinearLayout><\/code><\/pre>\n2.1. Example of LinearLayout Settings<\/h4>\n
<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<LinearLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\n android:layout_width=\"match_parent\"\n android:layout_height=\"match_parent\"\n android:orientation=\"vertical\"\n android:padding=\"16dp\">\n\n <TextView\n android:layout_width=\"wrap_content\"\n android:layout_height=\"wrap_content\"\n android:text=\"Hello, LinearLayout example!\" \n android:textSize=\"24sp\"\n android:layout_gravity=\"center\"\/>\n\n <Button\n android:layout_width=\"wrap_content\"\n android:layout_height=\"wrap_content\"\n android:text=\"Click!\"\n android:layout_gravity=\"center\"\/>\n\n<\/LinearLayout><\/code><\/pre>\n2.2. Horizontal Example<\/h4>\n
<LinearLayout\n android:layout_width=\"match_parent\"\n android:layout_height=\"wrap_content\"\n android:orientation=\"horizontal\"\n android:padding=\"16dp\">\n\n <TextView\n android:layout_width=\"wrap_content\"\n android:layout_height=\"wrap_content\"\n android:text=\"Button: \" \n android:textSize=\"18sp\"\/>\n\n <Button\n android:layout_width=\"wrap_content\"\n android:layout_height=\"wrap_content\"\n android:text=\"Click\"\/>\n\n<\/LinearLayout><\/code><\/pre>\n3. Key Attributes of LinearLayout<\/h3>\n
3.1. orientation<\/h4>\n
android:orientation=\"vertical\"<\/code><\/pre>\nandroid:orientation=\"horizontal\"<\/code><\/pre>\n3.2. layout_gravity<\/h4>\n
android:layout_gravity=\"center\"<\/code><\/pre>\n3.3. weight<\/h4>\n
<LinearLayout\n android:layout_width=\"match_parent\"\n android:layout_height=\"wrap_content\"\n android:orientation=\"horizontal\">\n\n <Button\n android:layout_width=\"0dp\"\n android:layout_height=\"wrap_content\"\n android:layout_weight=\"1\"\n android:text=\"First Button\"\/>\n\n <Button\n android:layout_width=\"0dp\"\n android:layout_height=\"wrap_content\"\n android:layout_weight=\"1\"\n android:text=\"Second Button\"\/>\n\n<\/LinearLayout><\/code><\/pre>\n4. Example Application Using LinearLayout<\/h3>\n
4.1. XML Layout File (activity_main.xml)<\/h4>\n
<LinearLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\n android:layout_width=\"match_parent\"\n android:layout_height=\"match_parent\"\n android:orientation=\"vertical\"\n android:padding=\"16dp\">\n\n <EditText\n android:id=\"@+id\/editTextName\"\n android:layout_width=\"match_parent\"\n android:layout_height=\"wrap_content\"\n android:hint=\"Enter your name\"\/>\n\n <Button\n android:id=\"@+id\/buttonGreet\"\n android:layout_width=\"wrap_content\"\n android:layout_height=\"wrap_content\"\n android:text=\"Greet\"\/>\n\n <TextView\n android:id=\"@+id\/textViewGreeting\"\n android:layout_width=\"wrap_content\"\n android:layout_height=\"wrap_content\"\n android:text=\"\"\n android:textSize=\"24sp\"\/>\n\n<\/LinearLayout><\/code><\/pre>\n4.2. Java Code (MainActivity.java)<\/h4>\n
package com.example.helloapp;\n\nimport android.os.Bundle;\nimport android.view.View;\nimport android.widget.Button;\nimport android.widget.EditText;\nimport android.widget.TextView;\nimport androidx.appcompat.app.AppCompatActivity;\n\npublic class MainActivity extends AppCompatActivity {\n\n private EditText editTextName;\n private Button buttonGreet;\n private TextView textViewGreeting;\n\n @Override\n protected void onCreate(Bundle savedInstanceState) {\n super.onCreate(savedInstanceState);\n setContentView(R.layout.activity_main);\n\n editTextName = findViewById(R.id.editTextName);\n buttonGreet = findViewById(R.id.buttonGreet);\n textViewGreeting = findViewById(R.id.textViewGreeting);\n\n buttonGreet.setOnClickListener(new View.OnClickListener() {\n @Override\n public void onClick(View v) {\n String name = editTextName.getText().toString();\n String greeting = \"Hello, \" + name + \"!\";\n textViewGreeting.setText(greeting);\n }\n });\n }\n}<\/code><\/pre>\n5. Precautions When Using LinearLayout<\/h3>\n
\n
6. Conclusion<\/h3>\n