I created this interface such that, the top most row of the table layout has 3 equally distributed buttons using layout_weight. But this is what I end up with:
And this is my code:
<RelativeLayout
android:id="#+id/content_rel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ECECEC"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/blurImage"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TableLayout
android:id="#+id/tableLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip" >
<ImageButton
android:id="#+id/btnHeartLike"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:clickable="true"
android:src="#drawable/selector" />
<ImageButton
android:id="#+id/btnShare"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:clickable="true"
android:src="#drawable/share39" />
<ImageButton
android:id="#+id/btnProductComment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:clickable="true"
android:src="#drawable/comment_icon" />
</TableRow>
I didn't add the rest of the code since it's long and irrelevant (I think?). Let me know if you need the rest as well but I think the problem is with the layout it is in? What do you think is wrong?
why you are using TableRow. you can create it using linearlayout
use the following code
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/button1"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
</LinearLayout>
the another way
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:id="#+id/button1"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
</TableRow>
</TableLayout>
</LinearLayout>
Try setting the width to 0 instead of having wrap_content: android:layout_width="0.0dip"
And check the following link for the explanation.
Related
I have a requirement where there needs to be a horizontal row of buttons with different images for different tap states and text on the bottom. For the life of me, I can't figure out how to keep the aspect ratio, my button backgrounds look stretched wide.
I'm using a LinearLayout and each button has equal weight. That made the buttons equal size to each other but I wanted to keep the background image aspect ratio square. The ideal layout would be a row of square sized buttons...
I have tried this solution but it is for an ImageButton.
My main.xml looks like this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:layout_weight="1"
android:layout_marginTop="10dp"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"
android:weightSum="5">
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:adjustViewBounds="true"
android:background="#drawable/menu"
android:gravity="center|bottom"
android:text="Settings" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#null" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#null" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#null" />
<Button
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#null" />
</LinearLayout>
And my layout looks like this, yes I realize some buttons don't have images yet. How should I fix the aspect ratio?
Your layout will be look like this :
Your Bottom Layout will be like this :
<LinearLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:orientation="horizontal"
android:layout_marginTop="10dp"
android:background="#color/gray_light1"
android:layout_alignParentBottom="true">
<include layout="#layout/home_bottom"/>
you can include this LinearLayout to your Bottom LinearLayout :
home_bottom.xml :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/home_ll"
android:gravity="center_horizontal"
android:layout_weight="1"
android:padding="5dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:background="?android:attr/selectableItemBackground"
android:layout_height="55dp">
<ImageView
android:id="#+id/home_img"
android:background="#mipmap/ic_home"
android:layout_width="25dp"
android:layout_height="25dp" />
<TextView
android:layout_marginTop="4dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/blacklike"
android:textSize="10dp"
android:text="Home"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/search_ll"
android:gravity="center_horizontal"
android:layout_weight="1"
android:padding="5dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:background="?android:attr/selectableItemBackground"
android:layout_height="55dp">
<ImageView
android:id="#+id/search_img"
android:background="#mipmap/ic_search"
android:layout_width="25dp"
android:layout_height="25dp" />
<TextView
android:layout_marginTop="4dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/blacklike"
android:textSize="10dp"
android:text="Search"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/categories_ll"
android:gravity="center_horizontal"
android:layout_weight="1"
android:padding="5dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:background="?android:attr/selectableItemBackground"
android:layout_height="55dp">
<ImageView
android:id="#+id/categories_img"
android:background="#mipmap/ic_categories"
android:layout_width="25dp"
android:layout_height="25dp" />
<TextView
android:layout_marginTop="4dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/blacklike"
android:textSize="10dp"
android:text="Categories"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/cart_ll"
android:gravity="center_horizontal"
android:layout_weight="1"
android:padding="5dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:background="?android:attr/selectableItemBackground"
android:layout_height="55dp">
<LinearLayout
android:gravity="center_horizontal"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/cart_img"
android:background="#mipmap/ic_cart"
android:layout_width="25dp"
android:layout_height="25dp" />
<TextView
android:gravity="center"
android:layout_marginLeft="-10dp"
android:layout_width="18dp"
android:layout_height="18dp"
android:textColor="#color/white"
android:textSize="10dp"
android:background="#mipmap/ic_cart_back"
android:text="8"
/>
</LinearLayout>
<TextView
android:layout_marginTop="4dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/blacklike"
android:textSize="10dp"
android:text="Cart"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/account_ll"
android:gravity="center_horizontal"
android:layout_weight="1"
android:padding="5dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:background="?android:attr/selectableItemBackground"
android:layout_height="55dp">
<ImageView
android:id="#+id/account_img"
android:background="#mipmap/ic_account"
android:layout_width="25dp"
android:layout_height="25dp" />
<TextView
android:layout_marginTop="4dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/blacklike"
android:textSize="10dp"
android:text="Account"
/>
</LinearLayout>
</LinearLayout>
I am working with android and I have designed my xml in which I am showing three buttons at the bottom of my screen. Now I want to show a textbox at the center of my screen along with three buttons at the bottom of the screen.
Below is my layout which shows three buttons at the bottom of the screen but it doesn't show textbox at the center of the screen -
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<EditText
android:id="#+id/edittext"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/button"
android:layout_below="#+id/textView1"
android:layout_marginTop="61dp"
android:ems="10"
android:inputType="text" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ButtonA" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ButtonB" />
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ButtonC" />
</LinearLayout>
</LinearLayout>
And also how do I add a placeholder in the textbox just like we do in HTML? As soon as I click in the testbox that placeholder will be gone and they can start typing.
Try using ReleativeLayout instead then for the TextView you can set attribute named
android:layout_centerInParent="true"
, and for three buttons , set layout_alignParentBottom :
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
then align other two buttons related to first.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="#+id/edittext"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
<Button
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignRight="#id/button3"
android:text="ButtonA" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignRight="#id/button3"
android:text="ButtonB" />
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="ButtonC"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
Use below code, i think its work for you
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:orientation="horizontal" >
<Button
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ButtonA" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ButtonB" />
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ButtonC" />
</LinearLayout>
<EditText
android:id="#+id/edittext"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:ems="10"
android:hint="Your Hint Here"
android:inputType="text" >
</EditText>
<Spinner
android:id="#+id/spinner1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/edittext"
android:layout_centerHorizontal="true" />
I reviewed your code and sorted it out for you.
android:hint="Your Message here". can be used to add a placeholder in the textbox.
`
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<EditText
android:id="#+id/edittext"
android:layout_width="fill_parent"
android:layout_height="80dp"
android:layout_alignLeft="#+id/button"
android:layout_below="#+id/textView1"
android:layout_marginTop="61dp"
android:ems="10"
**android:hint="#string/edit_message"**
android:inputType="text" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ButtonA" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ButtonB" />
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ButtonC" />
</LinearLayout>
`
I have the following XML code (partial for this example purposes):
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingLeft="0dp"
android:paddingRight="0dp" >
<RadioGroup
android:id="#+id/rgVehicle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1.5" >
<RadioButton
android:id="#+id/rbCar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="true"
android:text="Car" />
<RadioButton
android:id="#+id/rbTruck"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Truck" />
<RadioButton
android:id="#+id/rbCycle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Motorcycle" />
</RadioGroup>
<EditText
android:id="#+id/etToll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="numberDecimal"
android:layout_weight=".5" />
</LinearLayout>
For smaller screen like Galaxy Nexus and Nexus One the layout comes out like this:
How do I fix it so the EditText is directly below the #6 label as shown below (no matter what size the screen is):
There you go:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="5. Vehicle type"
android:textAppearance="?android:attr/textAppearanceLarge" />
<RadioGroup
android:id="#+id/rgVehicle"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<RadioButton
android:id="#+id/rbCar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="true"
android:text="Car" />
<RadioButton
android:id="#+id/rbTruck"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Truck" />
<RadioButton
android:id="#+id/rbCycle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Motorcycle" />
</RadioGroup>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="6. Total amount"
android:textAppearance="?android:attr/textAppearanceLarge" />
<EditText
android:id="#+id/etToll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="numberDecimal" />
</LinearLayout>
</LinearLayout>
Use something like this:
<tablelayout>
<tablerow android:layout_weightsum="2">
<textview android:layout_weight="1" android:text="4">
<textview android:layout_weight="1" android:text="6">
</tablerow>
<tablerow android:layout_weightsum="2">
<radiogroup android:layout_weight="1">
<!-- add radio buttons here -->
</radiogroup>
<edittext android:layout_weight="1" >
</tablerow>
</tablelayout>
I've got an example layout that I'm trying to create in android using xml. I am able to create similar layouts but I feel as if my approach might be wrong.
What I have been doing in these cases is nesting relative layouts to act as a "row". The below image demonstrates what I would do.
How would you guys create a layout similar to this? I feel as if nesting relative layouts is overkill but I'm not sure how I can keep everything centred if I don't.
When I didn't nest the layouts I used
android:layout_toRightOf="..."
android:layout_below="#+id/t1"
on t5, t6 and t7 (from the image). The result looked incorrect. t1, t2, t3 and t4 wasn't centred horizontally any more.
Is there a way to like tell the relative layout that everything after this point should appear on a new row? Or is relative layouts the wrong way to go for things like this? I don't think a table layout would work correctly since each row doesn't necessarily need to have the same amount of views and they need to be centred.
Any suggestions appreciated!
You could nest two horizontal LinearLayouts within a vertical LinearLayout. Maybe not so efficient as a RelativeLayout, but easier to get the centering behavior you want.
<?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" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="A" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="B" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="C" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="D" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="E" />
<Button
android:id="#+id/button6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="F" />
<Button
android:id="#+id/button7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="G" />
</LinearLayout>
</LinearLayout>
Here's another version of the same layout using RelativeLayout. I started with the nested LinearLayouts above, selected "Refactor > Android > Change Layout...", selected RelativeLayout, and then tweaked the resulting layout until I got things centered.
I used a couple of tricks to get it right. I started by centering the middle button on the parent, then built out to the left and right. On the top row, where there is an even number of buttons and space in the center, I used a centered, 0-width TextView to anchor the buttons. That's a bit hacky, I guess, but it gets the job done. :-)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:orientation="vertical" >
<TextView
android:id="#+id/TextView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="#string/hello" />
<TextView
android:id="#+id/Dummy"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_centerInParent="true"
android:layout_below="#+id/TextView1" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/Dummy"
android:layout_toLeftOf="#+id/Dummy"
android:text="B" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/button2"
android:layout_alignTop="#+id/Dummy"
android:layout_toLeftOf="#+id/button2"
android:text="A" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/button2"
android:layout_alignTop="#+id/Dummy"
android:layout_toRightOf="#+id/Dummy"
android:text="C" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/button2"
android:layout_alignTop="#+id/Dummy"
android:layout_toRightOf="#+id/button3"
android:text="D" />
<Button
android:id="#+id/button6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_below="#+id/Dummy"
android:text="F" />
<Button
android:id="#+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/button6"
android:layout_alignBaseline="#+id/button6"
android:layout_toLeftOf="#+id/button6"
android:text="E" />
<Button
android:id="#+id/button7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/button6"
android:layout_alignTop="#+id/button6"
android:layout_toRightOf="#+id/button6"
android:text="G" />
</RelativeLayout>
You could also try it using the weight.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="10" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="2.5"
android:gravity="center"
android:text="hello" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="A" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="B" />
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="C" />
<Button
android:id="#+id/button4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="D" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/button5"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="E" />
<Button
android:id="#+id/button6"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="F" />
<Button
android:id="#+id/button7"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="G" />
</LinearLayout>
</LinearLayout>
Check this out:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:id="#+id/l1"
android:layout_width="fill_parent"
android:layout_height="50dp"></LinearLayout>
<View
android:layout_width="fill_parent"
android:layout_height="2dp"
android:background="#android:color/white"
android:layout_below="#+id/l1"
android:id="#+id/v1"/>
<LinearLayout
android:id="#+id/l2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_below="#+id/v1"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp">
<Button
android:id="#+id/pos"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
/>
<Button
android:id="#+id/neu"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"/>
<Button
android:id="#+id/neg"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"/>
<Button
android:id="#+id/neg"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"/>
</LinearLayout>
<View
android:layout_width="fill_parent"
android:layout_height="2dp"
android:background="#android:color/white"
android:layout_below="#+id/l2"
android:id="#+id/v2"
/>
<LinearLayout
android:id="#+id/l3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_below="#+id/v2"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp">
<Button
android:id="#+id/pos"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
/>
<Button
android:id="#+id/neu"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"/>
<Button
android:id="#+id/neg"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"/>
</LinearLayout>
<View
android:layout_width="fill_parent"
android:layout_height="2dp"
android:background="#android:color/white"
android:layout_below="#+id/l3"
android:id="#+id/v3"
/>
</RelativeLayout>
You could also try using linear layout instead. in the first linear layout set the weightsum to 4 and the layout weight to 1 to make it equal divided and set each views gravity to center.
Do the same thing in send Linear Layout.
I am new to Android development.
I have an activity in which I would like to set a few buttons in two table rows. but currently they use only a small portion of it
Here is the XML for the layout for this activity:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/TableLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<Button
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</TableRow>
<TableRow
android:id="#+id/tableRow3"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</TableRow>
</TableLayout>
Thanks for any help!
try to use android:layout_weight="1" in table row
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1">
see this
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/TableLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#ffff0000">
<Button
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Button" />
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#ff00ff00">
</TableRow>
<TableRow
android:id="#+id/tableRow3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#ff00ff">
</TableRow>
</TableLayout>
Its like this....
Either goto the GUI tool to edit the XML properties in Eclipse and set the layout property
layout weight to 1.
OR goto the XML page, and do the following to the Table row android:layout_weight="1"
android:layout_width="wrap_content" and android:layout_height="wrap_content"