{"id":531,"date":"2016-01-08T08:09:27","date_gmt":"2016-01-08T08:09:27","guid":{"rendered":"http:\/\/abhiandroid.com\/ui\/?page_id=531"},"modified":"2018-06-05T08:07:08","modified_gmt":"2018-06-05T08:07:08","slug":"absolute-layout","status":"publish","type":"page","link":"https:\/\/abhiandroid.com\/ui\/absolute-layout","title":{"rendered":"Absolute Layout With Example In Android Studio"},"content":{"rendered":"<p>In Android, an Absolute Layout is a layout used to design the custom layouts. In this layout you can specify the exact location of its children by using x and y coordinates.<\/p>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-535\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/Absolute-Layout-in-Android-Studio.jpg\" alt=\"Absolute Layout in Android Studio\" width=\"433\" height=\"188\" srcset=\"https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/01\/Absolute-Layout-in-Android-Studio.jpg 433w, https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/01\/Absolute-Layout-in-Android-Studio-300x130.jpg 300w\" sizes=\"auto, (max-width: 433px) 100vw, 433px\" \/><\/center><span style=\"color: #ff0000;\"><strong>Important Note 1:<\/strong><\/span> Absolute layout are harder to maintain for different mobile screen sizes than other types of layouts because we set the exact location of a child view or called component. The positioning is based on x(top) and y(left) coordinates and that positioning is not as useful in world of various screen resolutions(sizes) and aspect ratios.<\/p>\n<p><span style=\"color: #ff0000;\"><strong>Important Note 2:<\/strong><\/span> Absolute layout is depreciated in Android because of the same reason as discussed in above note.<\/p>\n<hr \/>\n<h4><strong>Android Absolute Layout Syntax Code:<\/strong><\/h4>\n<pre>&lt;AbsoluteLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n\r\nandroid:layout_width=\"fill_parent\"\r\nandroid:layout_height=\"fill_parent\"&gt;\r\n\r\n&lt;!-- add child view\u2019s here --&gt;\r\n\r\n&lt;\/AbsoluteLayout&gt;\r\n<\/pre>\n<hr \/>\n<h4><strong>Attributes of Absolute Layout:<\/strong><\/h4>\n<p><span style=\"color: #008000;\"><strong>1.id:<\/strong><\/span> In android id is a attribute used to uniquely identify a Absolute Layout.<br \/>\nBelow is id attribute\u2019s example code with explanation included.<\/p>\n<pre>&lt;AbsoluteLayout\r\nandroid:id=\"@+id\/absoluteLayout\"\r\nandroid:layout_width=\"fill_parent\"\r\nandroid:layout_height=\"fill_parent\"\/&gt;\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>2.layout_x:<\/strong><\/span> In Absolute Layout layout_x attribute is used to specify the x- coordinate of the view(TextView or any other view). The possible value for this is in dp or px.<\/p>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-540\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/layout_x-example-in-Absolue-Layout.jpg\" alt=\"layout_x example in Absolue Layout\" width=\"211\" height=\"155\" \/><\/center><br \/>\nBelow is the layout_x attribute\u2019s example code with explanation included in which we set the 200px value for the x-coordinate.<\/p>\n<pre>&lt;TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:text=\"AbhiAndroid\"\r\nandroid:textSize=\"25sp\"\r\nandroid:layout_x=\"200px\"\/&gt; &lt;!--x-coordinates of a text view in AbsoluteLayout--&gt;\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>3.layout_y:<\/strong><\/span> In AbsoluteLayout layout_y attribute is used to specify the y- coordinate of the view(TextView or any other view). The possible value for this is in dp or px.<\/p>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-541\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/layout_y-example-in-Absolute-Layout.jpg\" alt=\"layout_y example in Absolute Layout\" width=\"214\" height=\"187\" \/><\/center><br \/>\nBelow is the layout_y attribute\u2019s example code with explanation included in which we set the 200px value for the y- coordinate.<\/p>\n<pre>&lt;TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:text=\"AbhiAndroid\"\r\nandroid:textSize=\"25sp\"\r\nandroid:layout_y=\"200px\"\/&gt;&lt;!--y-coordinate of a text view in Android Studio--&gt;\r\n<\/pre>\n<hr \/>\n<h4><strong>Example of Absolute Layout in Android:<\/strong><\/h4>\n<p>Below is the example code of Absolute Layout in which we design a login screen with two field user name and password and one button for login. We set the all views using x and y coordinates of the screen and set the values in px(pixels). Below is the final output and code:<\/p>\n<p>[cp_modal id=&#8221;cp_id_390fb&#8221;]<img loading=\"lazy\" decoding=\"async\" src=\"\/ui\/wp-content\/uploads\/2016\/08\/Download-Code1.png\" alt=\"Download Code\" width=\"428\" height=\"85\" class=\"aligncenter size-full wp-image-2143\" \/>[\/cp_modal]<\/p>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-549\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/Absolute-Layout-Example.png\" alt=\"Absolute Layout Example\" width=\"216\" height=\"357\" srcset=\"https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/01\/Absolute-Layout-Example.png 216w, https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/01\/Absolute-Layout-Example-182x300.png 182w\" sizes=\"auto, (max-width: 216px) 100vw, 216px\" \/><\/center><span style=\"color: #008000;\"><strong>Step 1:<\/strong><\/span> Create a new project and name it AbsoluteLayoutExample.<\/p>\n<p>Select File -&gt; New -&gt; New Project. Fill the forms and click &#8220;Finish&#8221; button.<\/p>\n<p><span style=\"color: #008000;\"><strong>Step 2:<\/strong><\/span> Open res -&gt; layout -&gt; activity_main.xml (or) main.xml and add following code. Here we are designing a login form inside Absolute Layout.<\/p>\n<pre>&lt;AbsoluteLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    android:layout_width=\"fill_parent\"\r\n    android:layout_height=\"fill_parent\"&gt;\r\n\r\n    &lt;TextView\r\n        android:layout_x=\"110px\"\r\n        android:layout_y=\"110px\"\r\n        android:text=\"User Name\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\" \/&gt;\r\n    &lt;EditText\r\n        android:layout_x=\"250px\"\r\n        android:layout_y=\"80px\"\r\n        android:width=\"100px\"\r\n        android:layout_width=\"200dp\"\r\n        android:layout_height=\"wrap_content\" \/&gt;\r\n    &lt;TextView\r\n        android:layout_x=\"110px\"\r\n        android:layout_y=\"200px\"\r\n        android:text=\"Password\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\" \/&gt;\r\n    &lt;EditText\r\n        android:layout_x=\"250px\"\r\n        android:layout_y=\"150px\"\r\n        android:width=\"100px\"\r\n        android:layout_width=\"200dp\"\r\n        android:layout_height=\"wrap_content\" \/&gt;\r\n    &lt;Button\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:text=\"Log In\"\r\n        android:layout_x=\"300px\"\r\n        android:layout_y=\"300px\"\/&gt;\r\n&lt;\/AbsoluteLayout&gt;<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 3:<\/strong><\/span> Now Open java -&gt; package -&gt; MainActivity.java and paste the below code.<\/p>\n<pre>package example.abhiandriod.absolytelayoutexample;\r\n\r\nimport android.support.v7.app.AppCompatActivity;\r\nimport android.os.Bundle;\r\nimport android.view.Menu;\r\nimport android.view.MenuItem;\r\n\r\npublic class MainActivity extends AppCompatActivity {\r\n\r\n    @Override\r\n    protected void onCreate(Bundle savedInstanceState) {\r\n        super.onCreate(savedInstanceState);\r\n        setContentView(R.layout.activity_main);\r\n    }\r\n\r\n    @Override\r\n    public boolean onCreateOptionsMenu(Menu menu) {\r\n        \/\/ Inflate the menu; this adds items to the action bar if it is present.\r\n        getMenuInflater().inflate(R.menu.menu_main, menu);\r\n        return true;\r\n    }\r\n\r\n    @Override\r\n    public boolean onOptionsItemSelected(MenuItem item) {\r\n        \/\/ Handle action bar item clicks here. The action bar will\r\n        \/\/ automatically handle clicks on the Home\/Up button, so long\r\n        \/\/ as you specify a parent activity in AndroidManifest.xml.\r\n        int id = item.getItemId();\r\n\r\n        \/\/noinspection SimplifiableIfStatement\r\n        if (id == R.id.action_settings) {\r\n            return true;\r\n        }\r\n\r\n        return super.onOptionsItemSelected(item);\r\n    }\r\n}<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 4:<\/strong><\/span> Now Open Manifests and click on AndroidManifest.xml and paste the below code<\/p>\n<pre>&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;\r\n&lt;manifest xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    package=\"example.abhiandriod.absolytelayoutexample\" &gt;\r\n\r\n    &lt;application\r\n        android:allowBackup=\"true\"\r\n        android:icon=\"@mipmap\/ic_launcher\"\r\n        android:label=\"@string\/app_name\"\r\n        android:theme=\"@style\/AppTheme\" &gt;\r\n        &lt;activity\r\n            android:name=\".MainActivity\"\r\n            android:label=\"@string\/app_name\" &gt;\r\n            &lt;intent-filter&gt;\r\n                &lt;action android:name=\"android.intent.action.MAIN\" \/&gt;\r\n\r\n                &lt;category android:name=\"android.intent.category.LAUNCHER\" \/&gt;\r\n            &lt;\/intent-filter&gt;\r\n        &lt;\/activity&gt;\r\n    &lt;\/application&gt;\r\n\r\n&lt;\/manifest&gt;<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 5:<\/strong><\/span> Lastly Open res -&gt; values -&gt;strings.xml and paste the below code.<\/p>\n<pre>&lt;resources&gt;\r\n    &lt;string name=\"app_name\"&gt;AbsolyteLayoutExample&lt;\/string&gt;\r\n    &lt;string name=\"hello_world\"&gt;Hello world!&lt;\/string&gt;\r\n    &lt;string name=\"action_settings\"&gt;Settings&lt;\/string&gt;\r\n&lt;\/resources&gt;<\/pre>\n<p><strong>Output:<\/strong><\/p>\n<p>Now run the App in Emulator or AVD. You will see the login form designed in Absoulte Layout having fix x and y coordinate.<\/p>\n<p><center><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-548\" src=\"\/ui\/wp-content\/uploads\/2016\/01\/Login-Form-Using-Absolute-Layout-Example.jpg\" alt=\"Login Form Using Absolute Layout Example\" width=\"377\" height=\"448\" srcset=\"https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/01\/Login-Form-Using-Absolute-Layout-Example.jpg 377w, https:\/\/abhiandroid.com\/ui\/wp-content\/uploads\/2016\/01\/Login-Form-Using-Absolute-Layout-Example-252x300.jpg 252w\" sizes=\"auto, (max-width: 377px) 100vw, 377px\" \/><\/center><span style=\"color: #ff0000;\"><strong>Important Note:<\/strong><\/span> Try opening the same layout in different size Emulator and you will see it doesn&#8217;t fit in different size device. That&#8217;s why Android has depreciated the use of Absolute Layout.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In Android, an Absolute Layout is a layout used to design the custom layouts. In this layout you can specify the exact location of its children by using x and y coordinates. Important Note 1: Absolute layout are harder to maintain for different mobile screen sizes than other types of layouts because we set the &hellip; <a href=\"https:\/\/abhiandroid.com\/ui\/absolute-layout\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Absolute Layout With Example In Android Studio<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"home.php","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-531","page","type-page","status-publish","hentry"],"acf":[],"psp_head":"<title>Absolute Layout With Example In Android Studio \u2013 Abhi Android<\/title>\r\n<meta name=\"description\" content=\"Tutorial on Absolute Layout with example and code in Android Studio. Also find out why it is depreciated in Android.\" \/>\r\n<meta name=\"robots\" content=\"index,follow\" \/>\r\n<link rel=\"canonical\" href=\"https:\/\/abhiandroid.com\/ui\/absolute-layout\" \/>\r\n","_links":{"self":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/531","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/types\/page"}],"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=531"}],"version-history":[{"count":2,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/531\/revisions"}],"predecessor-version":[{"id":2861,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/531\/revisions\/2861"}],"wp:attachment":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/media?parent=531"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}