{"id":1972,"date":"2016-06-02T06:44:41","date_gmt":"2016-06-02T06:44:41","guid":{"rendered":"http:\/\/abhiandroid.com\/ui\/?p=1972"},"modified":"2019-06-12T12:46:59","modified_gmt":"2019-06-12T12:46:59","slug":"linear-layout-inside-relative-layout","status":"publish","type":"post","link":"https:\/\/abhiandroid.com\/ui\/linear-layout-inside-relative-layout.html","title":{"rendered":"Using Linear Layout Inside Relative Layout With Example In Android Studio"},"content":{"rendered":"<p>Linear Layout can be used inside relative layout since one layout can be nested in other layout in XML. Here we will show you how to use\u00a0Linear Layout\u00a0in relative layout with example in Android Studio.<\/p>\n<p><strong>Also Read:<\/strong><\/p>\n<p><a href=\"\/ui\/relative-layout\">Relative Layout Tutorial<\/a><br \/>\n<a href=\"\/ui\/linear-layout\">Linear Layout Tutorial<\/a><\/p>\n<p>In the example of Linear Layout in relative layout we create custom layout of four buttons by using two Linear Layout\u2019s. We place both the layout\u2019s inside Relative Layout one after another by using different properties of Relative Layout. Finally we get the reference of Button in our Activity and perform click events on them. Whenever a user click on any Button the name of the Button is displayed on the screen by using a Toast.<\/p>\n<p>Below you can download code, see final output and step by step explanation:<\/p>\n<p style=\"text-align: center;\"><a class=\"download\" href=\"https:\/\/github.com\/abhisheksaini4\/LinearLayoutInsideRelativeLayout\" target=\"_blank\" rel=\"nofollow\">Download Code<\/a><a class=\"help\" title=\"Learn How To Download Code And Import In Android Studio\" href=\"\/androidstudio\/download-code-abhiandroid\" target=\"_blank\" rel=\"nofollow\"> ?<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2004\" src=\"\/ui\/wp-content\/uploads\/2016\/05\/Linear-Layout-Inside-Relative-Layout-Example-Android-Studio.jpg\" alt=\"Linear Layout Inside Relative Layout Example Android Studio\" width=\"237\" height=\"409\" srcset=\"https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/05\/Linear-Layout-Inside-Relative-Layout-Example-Android-Studio.jpg 237w, https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/05\/Linear-Layout-Inside-Relative-Layout-Example-Android-Studio-174x300.jpg 174w\" sizes=\"auto, (max-width: 237px) 100vw, 237px\" \/><\/p>\n<p><span style=\"color: #008000;\"><strong>Step 1:<\/strong><\/span>\u00a0Create a new project and name it LinearLayoutInsideRelativeLayout.<\/p>\n<p><span style=\"color: #008000;\"><strong>Step 2:<\/strong><\/span>\u00a0Open res -&gt; layout -&gt; activity_main.xml (or) main.xml and add following code:<\/p>\n<p>In this step we open xml file and then create custom layout of four buttons by using two Linear Layout\u2019s and then place the both layout\u2019s inside Relative Layout one after another by using \u00a0different properties of Relative Layout.<\/p>\n<pre>&lt;RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:paddingBottom=\"@dimen\/activity_vertical_margin\"\r\nandroid:paddingLeft=\"@dimen\/activity_horizontal_margin\"\r\nandroid:paddingRight=\"@dimen\/activity_horizontal_margin\"\r\nandroid:paddingTop=\"@dimen\/activity_vertical_margin\"\r\ntools:context=\".MainActivity\"&gt;\r\n\r\n&lt;!-- create a Linear Layout with horizontal orientation and weightSum property --&gt;\r\n\r\n&lt;LinearLayout\r\nandroid:id=\"@+id\/firstLayout\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"20dp\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:weightSum=\"2\"&gt;\r\n\r\n&lt;!-- place two button's inside layout using weight property --&gt;\r\n\r\n&lt;Button\r\nandroid:id=\"@+id\/firstButton\"\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginRight=\"10dp\"\r\nandroid:layout_weight=\"1\"\r\nandroid:background=\"@color\/redColor\"\r\nandroid:text=\"First\"\r\nandroid:textColor=\"@color\/whiteColor\"\r\nandroid:textStyle=\"bold\" \/&gt;\r\n\r\n&lt;Button\r\nandroid:id=\"@+id\/secondButton\"\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginLeft=\"10dp\"\r\nandroid:layout_weight=\"1\"\r\nandroid:background=\"@color\/greenColor\"\r\nandroid:text=\"Second\"\r\nandroid:textColor=\"@color\/whiteColor\"\r\nandroid:textStyle=\"bold\" \/&gt;\r\n&lt;\/LinearLayout&gt;\r\n\r\n&lt;!-- create a Linear Layout with horizontal orientation and weightSum property --&gt;\r\n\r\n&lt;LinearLayout\r\nandroid:id=\"@+id\/secondLayout\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_below=\"@+id\/firstLayout\"\r\nandroid:layout_marginTop=\"20dp\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:weightSum=\"2\"&gt;\r\n\r\n&lt;!-- place two button's inside layout using weight property --&gt;\r\n\r\n&lt;Button\r\nandroid:id=\"@+id\/thirdButton\"\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginRight=\"10dp\"\r\nandroid:layout_weight=\"1\"\r\nandroid:background=\"@color\/greenColor\"\r\nandroid:text=\"Third\"\r\nandroid:textColor=\"@color\/whiteColor\"\r\nandroid:textStyle=\"bold\" \/&gt;\r\n\r\n&lt;Button\r\nandroid:id=\"@+id\/fourthButton\"\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginLeft=\"10dp\"\r\nandroid:layout_weight=\"1\"\r\nandroid:background=\"@color\/redColor\"\r\nandroid:text=\"Fourth\"\r\nandroid:textColor=\"@color\/whiteColor\"\r\nandroid:textStyle=\"bold\" \/&gt;\r\n&lt;\/LinearLayout&gt;\r\n\r\n&lt;\/RelativeLayout&gt;\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 3:<\/strong><\/span>\u00a0Open src -&gt; package -&gt; MainActivity.java<\/p>\n<p>In this step Firstly we get the reference of Button\u2019s and then perform click event on all the Button\u2019s. In this Activity we implement overrided methods of OnClickListener interface to perform click event. Whenever a user click on any Button the name of the Button is displayed on the screen by using a Toast.<\/p>\n<pre>package example.abhiandroid.linearlayoutinsiderelativelayout;\r\n\r\nimport android.app.Activity;\r\nimport android.support.v7.app.AppCompatActivity;\r\nimport android.os.Bundle;\r\nimport android.view.Menu;\r\nimport android.view.MenuItem;\r\nimport android.view.View;\r\nimport android.widget.Button;\r\nimport android.widget.Toast;\r\n\r\npublic class MainActivity extends Activity implements View.OnClickListener {\r\n\r\nButton firstButton, secondButton, thirdButton, fourthButton;\r\n\r\n\/\/ automatically called when the activity is first created\r\n@Override\r\nprotected void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\nsetContentView(R.layout.activity_main);\r\n\/\/ get the reference of Button's and then perform click event on Button's\r\nfirstButton = (Button) findViewById(R.id.firstButton);\r\nfirstButton.setOnClickListener(this);\r\nsecondButton = (Button) findViewById(R.id.secondButton);\r\nsecondButton.setOnClickListener(this);\r\nthirdButton = (Button) findViewById(R.id.thirdButton);\r\nthirdButton.setOnClickListener(this);\r\nfourthButton = (Button) findViewById(R.id.fourthButton);\r\nfourthButton.setOnClickListener(this);\r\n}\r\n\r\n@Override\r\npublic void onClick(View v) {\r\nString btnName = null;\r\n\/\/ check which button is clicked and set the string value in the variable for displaying it by using a toast\r\nswitch (v.getId()) {\r\ncase R.id.firstButton:\r\nbtnName = \"First Button Clicked\";\r\nbreak;\r\ncase R.id.secondButton:\r\nbtnName = \"Second Button Clicked\";\r\nbreak;\r\ncase R.id.thirdButton:\r\nbtnName = \"Third Button Clicked\";\r\nbreak;\r\ncase R.id.fourthButton:\r\nbtnName = \"Fourth Button Clicked\";\r\nbreak;\r\n}\r\n\/\/ display the name of clicked Button by using a Toast\r\nToast.makeText(getApplicationContext(), btnName, Toast.LENGTH_LONG).show();\r\n\r\n}\r\n\r\n\r\n\r\n}\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 4:<\/strong><\/span>\u00a0Open res -&gt; values-&gt; colors.xml<\/p>\n<p>In this step we define the colors (red, green and white) that used in the background and text color of Button\u2019s.<\/p>\n<pre>&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;\r\n&lt;resources&gt;\r\n&lt;!-- define colors used in our xml file--&gt;\r\n&lt;color name=\"whiteColor\"&gt;#fff&lt;\/color&gt;\r\n&lt;color name=\"redColor\"&gt;#f00&lt;\/color&gt;\r\n&lt;color name=\"greenColor\"&gt;#0f0&lt;\/color&gt;\r\n&lt;\/resources&gt;\r\n<\/pre>\n<p><strong>Output:<\/strong><\/p>\n<p>You will see 4 button out of which 2 each are used in one Linear Layout which further used inside Relative Layout.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Linear Layout can be used inside relative layout since one layout can be nested in other layout in XML. Here we will show you how to use\u00a0Linear Layout\u00a0in relative layout with example in Android Studio. Also Read: Relative Layout Tutorial Linear Layout Tutorial In the example of Linear Layout in relative layout we create custom &hellip; <a href=\"https:\/\/abhiandroid.com\/ui\/linear-layout-inside-relative-layout.html\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Using Linear Layout Inside Relative Layout With Example In Android Studio<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":2004,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1,67],"tags":[],"class_list":["post-1972","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-archieve","category-layout"],"acf":[],"psp_head":"<title>Using Linear Layout Inside Relative Layout With Example In Android Studio \u2013 Abhi Android<\/title>\r\n<meta name=\"description\" content=\"Linear Layout can be used inside relative layout since one layout can be nested in other layout in XML. Here we will show you how to use Linear Layout in relative layout with example in Android Studio.\" \/>\r\n<meta name=\"robots\" content=\"index,follow\" \/>\r\n<link rel=\"canonical\" href=\"https:\/\/abhiandroid.com\/ui\/linear-layout-inside-relative-layout.html\" \/>\r\n","_links":{"self":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/posts\/1972","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/comments?post=1972"}],"version-history":[{"count":3,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/posts\/1972\/revisions"}],"predecessor-version":[{"id":2824,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/posts\/1972\/revisions\/2824"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/media\/2004"}],"wp:attachment":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/media?parent=1972"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/categories?post=1972"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/tags?post=1972"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}