Properly align images and text in relative layout? - android

I've a shop layout in which are three different sized images. To the right of them, there is text representing price. How can I align images and text under each other ? And put the middle of the screen between Image and text. Here is my layout:
<?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" android:background="#drawable/podklad">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lives"
android:focusable="false" android:background="#drawable/heart_image"
android:layout_below="#+id/money" android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price1"
android:textSize="30sp" android:textColor="#ff000000"
android:layout_alignTop="#+id/lives" android:layout_toRightOf="#+id/lives"
android:layout_toEndOf="#+id/lives"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/money" android:layout_alignParentTop="true" android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" android:textSize="40dp" android:textColor="#ff000000"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/monstertoprightcolored"
android:id="#+id/hardmode"
android:layout_centerVertical="true" android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price2"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/hardmode"
android:layout_toEndOf="#+id/hardmode"
android:layout_above="#+id/price3"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/monsterbottomleftcolored"
android:id="#+id/reversedmode"
android:layout_alignParentBottom="true" android:layout_alignLeft="#+id/hardmode"
android:layout_alignStart="#+id/hardmode"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price3"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_marginTop="26dp"
android:layout_below="#+id/hardmode"
android:layout_toRightOf="#+id/price2"
android:layout_toEndOf="#+id/price2"/>

A TableLayout might work better in this case. Here's a start to what your layout would look like:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout 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:stretchColumns="*">
<TableRow>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_span="2"
android:layout_gravity="right"
android:id="#+id/money"
android:textSize="40dp"
android:textColor="#ff000000"
tools:text="money" />
</TableRow>
<TableRow>
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/lives"
android:focusable="false"
android:background="#drawable/heart_image"
/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price1"
android:textSize="30sp"
android:textColor="#ff000000"
tools:text="price1" />
</TableRow>
<TableRow>
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/monstertoprightcolored"
android:id="#+id/hardmode" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price2"
android:textSize="30dp"
android:textColor="#ff000000"
tools:text="price2" />
</TableRow>
<TableRow>
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/monsterbottomleftcolored"
android:id="#+id/reversedmode" />
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price3"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_marginTop="26dp"
tools:text="price3" />
</TableRow>
</TableLayout>
Note that in order to "put the middle of the screen between Image and text", the two columns have to be equal in width. This is done by setting android:stretchColumns="*" in the TableLayout, and setting android:layout_width="0dp" and android:layout_weight="1" in the children of the TableRows.
See tablelayout - Set equal width of columns in table layout in Android for more info.

You can use linear layouts for this. Image and text can be split vertically in a linear layout. Each of this linear layout can be placed horizontally. Can you add a screenshot of how your layout should look for better understanding.

Here try this ,hope to help you, and i hope that i understand your problem correctly.
<?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:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:background="#drawable/ic_launcher">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lives"
android:focusable="false"
android:background="#drawable/ic_launcher"
android:layout_below="#+id/money"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price1"
android:textSize="30sp"
android:text="Text"
android:textColor="#ff000000"
android:layout_alignTop="#+id/lives"
android:layout_toRightOf="#+id/lives"
android:layout_toEndOf="#+id/lives" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/money"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textSize="40dp"
android:text="Text"
android:textColor="#ff000000" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:id="#+id/hardmode"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price2"
android:textSize="30dp"
android:textColor="#ff000000"
android:text="Text"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/hardmode"
android:layout_toEndOf="#+id/hardmode"
android:layout_above="#+id/price3" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:id="#+id/reversedmode"
android:layout_alignParentBottom="true"
android:layout_alignLeft="#+id/hardmode"
android:layout_alignStart="#+id/hardmode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/price3"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_marginTop="26dp"
android:layout_below="#+id/hardmode"
android:text="Text"
android:layout_toRightOf="#+id/price2"
android:layout_toEndOf="#+id/price2" />
</LinearLayout>

Related

put overlapping image between horizontal relative layout

Expected Result
Achieved Result
i am able to acheive everything but not able to place image (+ sign) between two layouts as described.
Following is the code i have used. i am not getting idea how should i place ( + sign image ) overlapping between two relative layouts.
I have tried placing imageview between 2 layouts but it takes space between layouts , i want overlapping between 2 layouts.
If anyone has come across such situation before or can help figure out this problem i would be very much grateful to them. thanks in advance.
<LinearLayout
android:id="#+id/line3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/indicator"
android:orientation="horizontal"
android:weightSum="4">
<RelativeLayout
android:id="#+id/line3_1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#CCCCCC"
android:padding="#dimen/line3_layout_padding">
<TextView
android:id="#+id/textRent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Rent"
android:textColor="#999999"
android:textSize="#dimen/line3_text1_size" />
<TextView
android:id="#+id/textRentValue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textRent"
android:layout_centerHorizontal="true"
android:text="€30.00"
android:textColor="#999999"
android:textSize="#dimen/line3_text2_size" />
<TextView
android:id="#+id/textRentPerDay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textRentValue"
android:layout_centerHorizontal="true"
android:text="Per day"
android:textColor="#999999"
android:textSize="#dimen/line3_text1_size" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/line3_2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#FF3333"
android:gravity="center"
android:padding="#dimen/line3_layout_padding">
<TextView
android:id="#+id/textIns"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Insurance"
android:textColor="#FFFFFF"
android:textSize="#dimen/line3_text1_size" />
<TextView
android:id="#+id/textInsValue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textIns"
android:layout_centerHorizontal="true"
android:text="€4.00"
android:textColor="#FFFFFF"
android:textSize="#dimen/line3_text2_size" />
<TextView
android:id="#+id/textInsPerDay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textInsValue"
android:layout_centerHorizontal="true"
android:text="Per day"
android:textColor="#FFFFFF"
android:textSize="#dimen/line3_text1_size" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.2"
android:background="#33CC66"
android:gravity="center"
android:padding="#dimen/line3_layout_padding">
<TextView
android:id="#+id/textEbysComm"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Ebys commission"
android:textColor="#FFFFFF"
android:textSize="#dimen/line3_text1_size" />
<TextView
android:id="#+id/textEbysCommValue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textEbysComm"
android:layout_centerHorizontal="true"
android:text="€2.00"
android:textColor="#FFFFFF"
android:textSize="#dimen/line3_text2_size" />
<TextView
android:id="#+id/textEbysCommPerDay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textEbysCommValue"
android:layout_centerHorizontal="true"
android:text="Per day"
android:textColor="#FFFFFF"
android:textSize="#dimen/line3_text1_size" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.8"
android:background="#6666CC"
android:gravity="center"
android:padding="#dimen/line3_layout_padding">
<TextView
android:id="#+id/textTotalCost"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Total Cost"
android:textColor="#FFFFFF"
android:textSize="#dimen/line3_text1_size" />
<TextView
android:id="#+id/textTotalCostValue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textTotalCost"
android:layout_centerHorizontal="true"
android:text="€36.00"
android:textColor="#FFFFFF"
android:textSize="#dimen/line3_text2_size" />
<TextView
android:id="#+id/textTotalCostPerDay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textTotalCostValue"
android:layout_centerHorizontal="true"
android:text="Per day"
android:textColor="#FFFFFF"
android:textSize="#dimen/line3_text1_size" />
</RelativeLayout>
</LinearLayout>
create three individual layouts as below and place them between RelativeLayouts as
XML for sub type
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="60dp">
<View
android:layout_width="30dp"
android:background="#F00"
android:layout_alignParentLeft="true"
android:layout_height="match_parent"/>
<View
android:layout_width="30dp"
android:background="#0F0"
android:layout_alignParentRight="true"
android:layout_height="match_parent"/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:scaleType="fitCenter"
android:layout_centerInParent="true"
android:src="#android:drawable/ic_dialog_info"/>
</RelativeLayout>

Android nested linear layout

I am following tutorial from the book "Android Apps for Absolute Beginners 3rd Edition", and I am stuck with nested LinearLayout for android project in API 19 (4.4.2): Parent LinearLayout is horizontal and it is supposed to hold two child LinearLayout which are vertical and the end result should be like this:
But what I get is:
I tried several times, cross checked code in book, and explanations but I can't get it right.
Here is content of activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" tools:context=".MainActivity"
android:layout_width="match_parent" android:layout_height="match_parent"
android:orientation="horizontal" android:background="#drawable/galaxyinfoscreen" >
<LinearLayout android:orientation="vertical" android:layout_margin="12dip"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:background="#00000000">
<TextView android:text="#string/hello_world" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginLeft="48dip" android:textStyle="bold" />
<TextView android:text="#string/galaxy_name" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_solar" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_habit" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_colony" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_pop" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_fleet" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_ships" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout android:orientation="vertical" android:layout_margin="33dip"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:background="#00000000" >
<TextView android:text="#string/name_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/name" />
<TextView android:text="#string/solar_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/solar" />
<TextView android:text="#string/habit_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/habit"/>
<TextView android:text="#string/colony_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/colony" />
<TextView android:text="#string/pop_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/pop" />
<TextView android:text="#string/fleet_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/fleet" />
<TextView android:text="#string/ships_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/ships"/>
</LinearLayout>
</LinearLayout>
What could be missing from this file? What should I do to get desired result?
try this
<?xml version="1.0" encoding="utf-8"?>
<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:background="#drawable/galaxyinfoscreen"
android:orientation="vertical"
tools:context=".MainActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="48dip"
android:text="#string/hello_world"
android:textColor="#FFFFFF"
android:textStyle="bold" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="12dip"
android:background="#00000000"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/galaxy_name"
android:textColor="#FFFFFF" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/galaxy_solar"
android:textColor="#FFFFFF" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/galaxy_habit"
android:textColor="#FFFFFF" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/galaxy_colony"
android:textColor="#FFFFFF" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/galaxy_pop"
android:textColor="#FFFFFF" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/galaxy_fleet"
android:textColor="#FFFFFF" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/galaxy_ships"
android:textColor="#FFFFFF" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="12dip"
android:background="#00000000"
android:orientation="vertical" >
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/name_data"
android:textColor="#FFFFFF" />
<TextView
android:id="#+id/solar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/solar_data"
android:textColor="#FFFFFF" />
<TextView
android:id="#+id/habit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/habit_data"
android:textColor="#FFFFFF" />
<TextView
android:id="#+id/colony"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/colony_data"
android:textColor="#FFFFFF" />
<TextView
android:id="#+id/pop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/pop_data"
android:textColor="#FFFFFF" />
<TextView
android:id="#+id/fleet"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/fleet_data"
android:textColor="#FFFFFF" />
<TextView
android:id="#+id/ships"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/ships_data"
android:textColor="#FFFFFF" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
"Glaxy Information Screen" TextView is inside first verical LinearLayout. As this text view is taking more space due to its margin and text length hence leaving less space for second linearlayout, resulting into wrap of text for sencond verical layout.
To solve the problem, add one more linear layout with orientation as horizontal as parent of both the vertical layout and add the "Glaxy Information Screen" text view as direct child of top parent.
you may need to make some adjustment to the margin values to aling the layouts.
In the second LinearLayout, the margin parameter is android:layout_marginTop="33dip
You forgot to put Top after margin.
;)
The second LinearLayout doesn't have enough width to accommodate the string and it gets wrapped. If you absolutely must use nested LinearLayout, you should use layout_weight instead of using width with wrapped content. In the example below, I have also moved the title out of the nested LinearLayout to another vertical one.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" tools:context=".MainActivity"
android:layout_width="match_parent" android:layout_height="match_parent"
android:orientation="vertical" android:background="#drawable/galaxyinfoscreen" >
<TextView android:text="#string/hello_world" android:textColor="#FFFFFF"
android:layout_width="match_parent" android:layout_height="wrap_content"
android:gravity="center" android:textStyle="bold" />
<LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout android:orientation="vertical" android:layout_margin="12dip"
android:layout_width="0dp" android:layout_weight="3" android:layout_height="wrap_content"
android:background="#00000000">
<TextView android:text="#string/galaxy_name" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_solar" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_habit" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_colony" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_pop" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_fleet" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView android:text="#string/galaxy_ships" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout android:orientation="vertical" android:layout_margin="12dip"
android:layout_width="0dp" android:layout_weight="1" android:layout_height="wrap_content"
android:background="#00000000" >
<TextView android:text="#string/name_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/name" />
<TextView android:text="#string/solar_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/solar" />
<TextView android:text="#string/habit_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/habit"/>
<TextView android:text="#string/colony_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/colony" />
<TextView android:text="#string/pop_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/pop" />
<TextView android:text="#string/fleet_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/fleet" />
<TextView android:text="#string/ships_data" android:textColor="#FFFFFF"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:id="#+id/ships"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
With your current code i have two suggestions:
First:
android:singleLine="true"
add this tag to all your list views, so this will maintain symmetry in all your textView placement.
Secondly:
Keep a single Parent LinearLayout with orientation vertical, then have multiple LinearLayout with horizontal orientation and two TextView inside it.

Fixed horizontal ScrollView above ListFragment

I am displaying a list using a custom ListFragment. The fragment inflates a layout and works fine. I want to add a horizontal scrollView above the fragment to act as a category menu. It must be fixed, so addHeaderView is not acceptable.
I found a layout example here on SO and plugged it into my layout to see how it could be made to work. But in its current form below, it does what you would expect - puts a horizontal scrollview in every entry on the list.
So how do I share a screen with a static view on top and the listfragment below.
Here is the layout that does not work - as I mentioned the Scrollview part is not mine and is only included as an example. The relativelayout at the bottom makes the actual list
<?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"
android:clickable="false" >
<HorizontalScrollView
android:id="#+id/hor_svID"
android:layout_width="wrap_content"
android:layout_height="35dip"
android:scrollbars="none"
android:fillViewport="false"
android:focusable="false" >
<!--android:background="#drawable/submenu_bg"> -->
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:focusable="false"
android:background="#FFFFFF"
android:gravity="center">
<TextView android:id="#+id/TechnologyTxtVId"
android:text="TECHNOLOGY"
android:textColor="#342D7E"
android:textSize="12sp"
android:textStyle="bold"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></TextView>
<TextView android:id="#+id/SportsTxtVId"
android:text="SPORTS"
android:textColor="#342D7E"
android:textStyle="bold"
android:textSize="12sp"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:paddingLeft="15dip"></TextView>
<TextView android:id="#+id/EntntTxtVId"
android:text="ENTERTAINMENT"
android:textStyle="bold"
android:paddingLeft="15dip"
android:textSize="12sp"
android:gravity="center"
android:textColor="#342D7E"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></TextView>
<TextView android:id="#+id/LocalTxtVId"
android:text="LOCAL"
android:textStyle="bold"
android:paddingLeft="15dip"
android:textSize="12sp"
android:textColor="#342D7E"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></TextView>
<TextView android:id="#+id/WorldTxtVId"
android:text="WORLD"
android:textStyle="bold"
android:textSize="12sp"
android:paddingLeft="15dip"
android:gravity="center"
android:textColor="#342D7E"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></TextView>
<TextView android:id="#+id/FeaturesTxtVId"
android:text="FEATURES"
android:textStyle="bold"
android:textSize="12sp"
android:paddingLeft="15dip"
android:gravity="center"
android:textColor="#342D7E"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></TextView>
<TextView android:id="#+id/RecentTxtVId"
android:text="RECENT"
android:textStyle="bold"
android:textSize="12sp"
android:paddingLeft="15dip"
android:gravity="center"
android:textColor="#342D7E"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></TextView>
</LinearLayout>
</HorizontalScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="false" >
<ImageView
android:id="#+id/imageView_thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginRight="#dimen/default_padding"
android:contentDescription="#null"
android:focusable="false"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/textView_source"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/imageView_thumbnail"
android:layout_alignParentTop="true"
android:layout_marginRight="#dimen/default_padding"
android:focusable="false"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="#+id/textView_pubDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginRight="#dimen/default_padding"
android:focusable="false"
android:textAppearance="?android:attr/textAppearanceSmall"
/>
<TextView
android:id="#+id/textViewHeadline"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/imageView_thumbnail"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView_pubDate"
android:layout_marginLeft="#dimen/default_padding"
android:focusable="false"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textStyle="bold" />
<TextView
android:id="#+id/textViewSummary"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textViewHeadline"
android:layout_toRightOf="#+id/imageView_thumbnail"
android:maxLines="#integer/Four"
android:layout_marginLeft="#dimen/default_padding"
android:focusable="false"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
</RelativeLayout>

android layout textview between two button

I have comman header with two button and single textview.
textview is in center of the screen. button 1 is at the right side of the parent and button2 is at the left side of the parent.
now, I want to show text view in the center of the parent not in the center of the space between two buttons.
Text length in the textview can be any thing either it could be 3 words or it could be more than 10 word.
I dont want to overlap textview above the two buttons while length is more than 10 words.
and also I want textview in the center of the screen while there is only 3 words.
When I am using below code it is not showing textview in the center of the screen horizontally when there is only 3 to 4 words but below code also dont overlap while there is more than 10 words.
<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"
tools:context=".Webviewdemo" >
<ImageView
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:background="#drawable/backbtn" />
<ImageView
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="#drawable/infobtn" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_toLeftOf="#+id/button2"
android:layout_toRightOf="#+id/button1"
android:gravity="center"
android:singleLine="true"
android:text="123"
android:textSize="22sp"/>
</RelativeLayout>
In same way When I am using below code it is showing textview in the center of the screen horizontally when there is only 3 to 4 words but below code overlap while there is more than 10 words.
<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"
tools:context=".Webviewdemo" >
<ImageView
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:background="#drawable/backbtn" />
<ImageView
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="#drawable/infobtn" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center"
android:singleLine="true"
android:text="123"
android:textSize="22sp" />
</RelativeLayout>
So, My question is how can I achive above both thing with single code.
Textview should not overlap while there is more words.
Textview should be in center while there is less no of words.
I hope you all get my problem. if any query plz ask.
<LinearLayout
android:id="#+id/panelIconLeft1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_margin="5dp" >
<Button
android:id="#+id/btnHome1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="LOCATION"
android:onClick="btnHomeClick" />
</LinearLayout>
<TextView
android:id="#+id/txtHeading1"
style="#style/heading_text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_toLeftOf="#+id/panelIconRight1"
android:layout_toRightOf="#id/panelIconLeft1"
android:ellipsize="marquee"
android:focusable="true"
android:focusableInTouchMode="true"
android:gravity="center"
android:singleLine="true"
android:text=""
android:textColor="#android:color/white" />
<LinearLayout
android:id="#+id/panelIconRight1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_margin="5dp" >
<Button
android:id="#+id/btnFeedback1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Post Ad"
android:onClick="btnFeedbackClick" />
</LinearLayout
The above code will help you
Use This Code
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="left">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="right" >
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
</LinearLayout>
try this code
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/button2"
android:layout_toRightOf="#+id/button1"
android:gravity="center"
android:singleLine="true"
android:text="123"
android:textSize="22sp"/>
EDIT
remove this line
android:layout_centerInParent="true"
try this (without centerInParent)
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/button2"
android:layout_toRightOf="#+id/button1"
android:gravity="center"
android:singleLine="true"
android:text="123"
android:textSize="22sp"/>

Android: Tablelayout with relative layouts contained within?

I have an xml layout that compiles fine but when I used the intent to change to the new view it force closes. I'm almost positive it has to do with my use of table and relative layouts. It's kind of a frankenstien monster of coding, haha. Please let me know if how I can remedy this force close problem. Also, before I had strickly table layout. With this layout it compiled and was fully functional, just not as a pretty. So the java should be fine (theoretically).
CODE:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout android:id="#+id/tableLayout1"
android:layout_width="fill_parent" android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android" android:background="#FFFFF0">
<RelativeLayout android:orientation="vertical" android:background="#drawable/banner"
android:layout_width="fill_parent" android:layout_height="50sp" android:gravity="center" >
</RelativeLayout>
<RelativeLayout android:id="#+id/tableTitle" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:background="#999">
<TextView android:id="#+id/ListingsTitle" android:text="Title: "
android:textColor="#000" android:textStyle="bold" android:textSize="20sp" />
<TextView android:id="#+id/sellingprice" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:textColor="#000fff"
android:text="Price:" android:layout_below="#id/ListingsTitle" ></TextView>
<TextView android:id="#+id/mileage" android:layout_below="#id/ListingsTitle" android:layout_toRightOf="#id/sellingprice" android:layout_height="wrap_content" android:text="Mileage:" android:textColor="#000fff" android:layout_width="wrap_content"></TextView>
</RelativeLayout>
<RelativeLayout android:orientation="vertical" android:background="#FFFFF0"
android:layout_width="fill_parent" android:layout_height="wrap_content">
<ImageButton android:id="#+id/PhotoGallerybtn"
android:src="#drawable/icon" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_alignParentLeft="true"></ImageButton>
<Button android:text="Email the Dealer" android:id="#+id/EmailDealerbtn" android:layout_alignParentLeft="true"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="#id/PhotoGallerybtn"></Button>
<Button android:text="Add to Favs" android:id="#+id/Favsbtn" android:layout_below="#id/PhotoGallerybtn"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_toRightOf="#id/EmailDealerbtn"></Button>
<Button android:text="Share" android:id="#+id/Sharebtn" android:mimeType="image/*"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="#id/PhotoGallerybtn" android:layout_toRightOf="#id/Favsbtn"></Button>
</RelativeLayout>
<TableRow android:id="#+id/tableRow4" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:background="#999">
<TextView android:id="#+id/textName" android:text="Details:"
android:textColor="#000" android:textStyle="bold" android:textSize="20sp" />
</TableRow>
<TextView android:id="#+id/bodystyle" android:layout_height="wrap_content"
android:layout_width="wrap_content" android:textColor="#000"
android:text="Body Style:"></TextView>
<TextView android:id="#+id/color" android:layout_height="wrap_content"
android:layout_width="wrap_content" android:textColor="#000"
android:text="Color:"></TextView>
<TextView android:id="#+id/doors" android:layout_height="wrap_content"
android:layout_width="wrap_content" android:textColor="#000"
android:text="Doors:"></TextView>
<TextView android:id="#+id/engine" android:layout_height="wrap_content"
android:layout_width="wrap_content" android:textColor="#000"
android:text="Engine:"></TextView>
<TextView android:id="#+id/vin" android:layout_height="wrap_content"
android:layout_width="wrap_content" android:textColor="#000"
android:text="VIN:"></TextView>
</TableLayout>
You should add layout_width and layout_height fields to your TextView with #+id/ListingsTitle id:
<TextView android:id="#+id/ListingsTitle" android:text="Title: "
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#000"
android:textStyle="bold"
android:textSize="20sp" />

Categories

Resources