How to gap between two buttons in LinearLayout - android

In my app two button arranged vertically in LinearLayout. i want to provide a gap between two buttons. Please provide a solution...
my layout as follows
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp"
>
<Button
android:id="#+id/btnAction1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/cool_button"
android:text = "HiText1"
/>
<Button
android:id="#+id/btnAction2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/cool_button"
android:text="HiText2"
android:layout_below="#id/btnAction1"
/>
</LinearLayout>
image
thanks in advance

Add a margin (android:layout_marginTop="50dp") to the top of of the second button:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp"
>
<Button
android:id="#+id/btnAction1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/cool_button"
android:text = "HiText1"
/>
<Button android:layout_marginTop="50dp"
android:id="#+id/btnAction2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/cool_button"
android:text="HiText2"
android:layout_below="#id/btnAction1"
/>
</LinearLayout>

use android:layout_marginTop="10dp"

Use android:layout_marginTop="10.0dip" on second button.

use this code for your second button
<Buttonandroid:id="#+id/btnAction2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/cool_button"
android:text="HiText2"
android:layout_marginTop="15dp"
/>

Related

Can't set multiple controls in one line with RelativeLayout

I'm new in the world of Android development, and I'm trying to learn how to getting started from here.
Now I've followed all steps until to put the Zip Code and the Number on the same line. I don't understand how can I manage this, if I drag and drop the Number control beside the TextView the IDE put the Number above the control or to the bottom. I don't know how to explain correctly, anyway, this is an image:
and this is the source code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/relativeLayout1" />
<EditText
android:inputType="number"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeEdit"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:textSize="20sp"
android:layout_width="100sp"
android:textColor="#9933FF" />
<TextView
android:text="Zip Code: "
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeLabel"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:textSize="20sp" />
</LinearLayout>
from the site should be like this:
what is wrong? Sorry if something is not clear, or if the category tag is wrong.
Try This
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="25px"
android:minWidth="25px" >
<EditText
android:id="#+id/ZipCodeEdit"
android:layout_width="100sp"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:inputType="number"
android:textColor="#9933FF"
android:textSize="20sp" />
<TextView
android:id="#+id/ZipCodeLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_toRightOf="#+id/ZipCodeEdit"
android:text="Zip Code: "
android:textSize="20sp" />
</RelativeLayout>
</LinearLayout>
You should make proper use of LinearLayout, RelativeLayout, FrameLayout and TableLayout for the desired alignments.
Here is your solution.:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/relativeLayout1" >
<EditText
android:inputType="number"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeEdit"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:textSize="20sp"
android:layout_width="100sp"
android:textColor="#9933FF" />
<TextView
android:text="Zip Code: "
android:layout_width="match_parent"
android:layout_toRightOf="#+id/ZipCodeEdit"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeLabel"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:textSize="20sp" />
</RelativeLayout>
</LinearLayout>
What you were doing Wrong :
You are trying to align EditText and TextView one beside another inside RelativeLayout but you've closed the relative layiut right where it started.
that makes the EditText and TextView the child view of the LinearLayout(Vertical)
As the text views are behaving as the children of Linear vertical layout there is no use of RelativeLayout hence aligning both views one below another.
One more thing when you fix that and put both the text view within RelativeLayout you have to align one view in relation with the another.
In this case:
android:layout_toRightOf="#+id/ZipCodeEdit"
Let me know if any problem.
Happy Coding
You are using a vertical LinearLayout as the parent layout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
Change android:orientation="vertical" to android:orientation="horizontal".
You can also remove the RelativeLayout as it's not really being used(nothing inside it).
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<EditText
android:inputType="number"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeEdit"
android:layout_marginLeft="10dp"
android:textSize="20sp"
android:layout_width="100dp"
android:textColor="#9933FF" />
<TextView
android:text="Zip Code: "
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeLabel"
android:layout_marginLeft="10dp"
android:textSize="20sp" />
</LinearLayout>
This should fix your problem. I will explain if this works for you.

How to make a edittext view fill the parent element in android

I have two edittext views. One of them has only one line, its the title. But the other one should fill the linearlayout to the end, but it doesn't.
I updated the code so this is my whole xml for this app. I hope someone can find what's wrong. The part that i want to form like this is the part inside the LinearLayout named addView.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#ffffff">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<Button
android:id="#+id/addButton"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/addbuttonstyle"
android:layout_weight="20"/>
<ImageView
android:id="#+id/titleView"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/titleview"
android:layout_weight="60"/>
<Button
android:id="#+id/orderButton"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/orderbuttonstyle"
android:layout_weight="20"/>
</LinearLayout>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/addView"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<EditText
android:id="#+id/textBoxTitle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="note title"
android:singleLine="true"
/>
<EditText
android:id="#+id/textBoxContent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:hint="content"
/>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/backgroundLayout"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/background"
/>
</FrameLayout>
I changed textBoxTitle's height to wrap_content and I see this:
Is this what you were hoping for? Also if you want content to appear in the upper-left corner use this attribute:
<EditText
...
android:gravity="top"
/>
So i found what was wrong.
I needed to set layout_height (of the textBoxContent view) to 0dp and layout_weight (of the textBoxContent view) to 1.
The first view should have android:layout_width="wrap_content"

TextView horizontal center in RelativeLayout

In my app screen, i want to show Heading as horizontally center. I tried with below layout xml codes
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="10dip"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="Connections" />
</RelativeLayout>
thanks
android:gravity controls the appearance within the TextView. So if you had two lines of text they would be centered within the bounds of the TextView. Try android:layout_centerHorizontal="true".
Use this:
android:layout_centerHorizontal="true"
within TextView
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="10dip"
>
<TextView
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Connections" />
</RelativeLayout>
use layout_centerInParent="true"(layout_centerInHorizontal,layout_centerInVertical)
gravity means the algin of text on textview, not the view itself
replace textview with below code
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:text="Connections" />
only add this android:gravity="center_horizontal"
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="10dip"
android:gravity="center_horizontal"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="Connections" />
</RelativeLayout>

Relative Layout, Textview not showing

I am using this XML to show my one Button at the bottom and one TextView at the top with one TextView right in the middle. The middle textview covers the whole span in between the button and the top textview. The middle TextView is not being displayed at all. What is wrong?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_alignParentBottom="true"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_above="#id/task"
android:layout_below="#id/btnAddTask"
/>
</RelativeLayout>
Your problem is definitely that you have the TasksList TextView below your button. Swap your layout_above and layout_below values. This works for me:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_alignParentBottom="true"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_above="#id/btnAddTask"
android:layout_below="#id/task"
/>
</RelativeLayout>
The problem wsa that you reversed your layout above and the layout below:
try
android:layout_below="#id/task"
android:layout_above="#id/btnAddTask"
See screenshot.
And here is the complete layout.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_alignParentBottom="true"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_below="#id/task"
android:layout_above="#id/btnAddTask"
/>
</RelativeLayout>
There's definitely something wrong with how you have this laid out.
You have for the button, alignParentBottom="true"... then for the TasksList TextView it is set to be below the button... basically off the screen.
You can remove orientation from the RelativeLayout... Relative layout's do not have orientation like LinearLayout's do.
As you're describing... I'm not 100% you can do it with a Relative Layout. If you simply wanted one thing on top, one centered and the other on bottom, it would be best to use a single layout parameter for each one, centerInParent, alignParentTop and alignParentBottom.
If you reconsider LinearLayout (as I'm guessing you started with) you'd stick with a Vertical Orientation, then give them layout_weight of 0, 1, and 0 making sure the height was set to wrap_content.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/task"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
/>
<TextView
android:id="#+id/TasksList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/tasks"
android:layout_weight="1"
/>
<Button
android:id="#+id/btnAddTask"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/AddTasks"
android:layout_weight="0"
/>
</LinearLayout>

Why can't get IgnoreGravity within RelativeLayout to work?

I have two buttons. I want one to be aligned at the top center of the application. I want to get the other button to ignore the gravity settings and go where I tell it. How do I do this?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relative_layout"
android:layout_width="fill_parent"
android:gravity="center_horizontal"
android:layout_height="fill_parent" >
<Button
android:id="#+id/the_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Centered Button"
android:layout_alignTop="#id/relative_layout" />
<Button
android:id="#+id/the_button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Random Button"
android:ignoreGravity="#id/relative_layout" />
</RelativeLayout>
Do not use gravity attribute of RelativeLayout, elements within RelativeLayout can be positioned with additional attributes. Try this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relative_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<Button
android:id="#+id/the_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Centered Button"
android:layout_centerHorizontal="true" />
<Button
android:id="#+id/the_button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Random Button"/>
</RelativeLayout>
See RelativeLayout tutorial and RelativeLayout.LayoutParams docs for more information about usage of RelativeLayout.

Categories

Resources