Relative layout in XML file - android

I have the following code in my XML file:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="60dip"
android:layout_marginLeft="13dp"
android:layout_marginRight="13dp"
android:layout_marginTop="20dp"
android:background="#color/white"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/name_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/pic"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginLeft="6dp" />
<EditText
android:id="#+id/name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_alignRight="#id/pic" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/phone_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/phone_pic"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginLeft="6dp"
android:layout_weight="0.15" />
<EditText
android:id="#+id/phone_number"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_alignRight="#id/phone_pic" />
</RelativeLayout>
</LinearLayout>
I want the ImageView and EditText field inside the RelativeLayout and the EEditText Field to the right of the ImageView. However, when i check the graphical layout, the EditText and ImageView are placed outside the RelativeLayout as well as the LinearLayout. What am I doing wrong and how to correct this?

Why don't you replace your RelativeLayout with horizontal LinearLayout
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="60dip"
android:layout_marginLeft="13dp"
android:layout_marginRight="13dp"
android:layout_marginTop="20dp"
android:background="#color/white"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/name_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/pic"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginLeft="6dp" />
<EditText
android:id="#+id/name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/phone_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/phone_pic"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginLeft="6dp"
android:layout_weight="0.15" />
<EditText
android:id="#+id/phone_number"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp" />
</LinearLayout>
</LinearLayout>

This will help you........
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_launcher" />
<EditText
android:id="#+id/editText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/imageView1"
android:ems="10" >
<requestFocus />
</EditText>
</RelativeLayout>

Try using the attribute android:layout_toRightOf
Positions the left edge of this view to the right of the given anchor
view ID. Accommodates left margin of this view and right margin of
anchor view.
So try this:
<RelativeLayout
android:id="#+id/name_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/pic"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginLeft="6dp" />
<EditText
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_toRightOf="#+id/pic" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/phone_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/phone_pic"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginLeft="6dp"
android:layout_weight="0.15" />
<EditText
android:id="#+id/phone_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_toRightOf="#+id/phone_pic" />
</RelativeLayout>
</LinearLayout>
If you want an example to understand better, here is one for you. And there is still a source code so you can test. http://www.mkyong.com/android/android-relativelayout-example/

You can try this piece of code
<?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="60dp"
android:layout_marginLeft="13dp"
android:layout_marginRight="13dp"
android:layout_marginTop="20dp"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/name_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/pic"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:src="#drawable/ic_launcher" />
<EditText
android:id="#+id/name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_toRightOf="#id/pic" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/phone_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/phone_pic"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:src="#drawable/ic_launcher" />
<EditText
android:id="#+id/phone_number"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_toRightOf="#id/phone_pic" />
</RelativeLayout>

As Mr. rogcg said try android:layout_toRightOf it will work. However you have to make certain changes in your Linear Layout attributes also. You have specified android:layout_height="60dip"
which is causing the consecutive relative layout to be hidden. Make it to fill parent and set layout_toRightOf. It will work.
Also for the image view assign a src as follows
android:src="#drawable/someimage"
Thanks & Regards,
Rajamanickem.S

change these line of code in your layout this is wrong
android:layout_alignRight="#id/phone_pic"
android:layout_alignRight="#id/pic"
write these below lines
android:layout_alignRight="#+id/phone_pic"
android:layout_alignRight="#+id/pic"

Related

How to Customize Layout

How to customize FrameLayout, I have to make screen like this:
and i have made this :
So now i want to know, How can i achieve above Layout
How to show icon on top, like in above screen (Path)
How to place text above circles, like in above screen (Dark Text: Remember Life) (Light Text: Instantly ....)
How to place buttons below circles, like in above screen (Register & Login)
Here is my XML, in which i am using FrameLayout, see below:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res/com.indianic.viewflipperdemo"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<com.indianic.viewflipperdemo.widget.ViewFlow
android:id="#+id/viewflow"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
app:sidebuffer="3" >
</com.indianic.viewflipperdemo.widget.ViewFlow>
<com.indianic.viewflipperdemo.widget.CircleFlowIndicator
android:id="#+id/viewflowindic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:padding="10dip"
android:layout_marginBottom="10dip"
app:inactiveType="stroke" />
</FrameLayout>
Finally, I achieved my target, I used both the Layouts [Relative Layout and Linear Layout] to organize widgets, see complete XML :
circle_layout.xml:-
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res/com.indianic.viewflipperdemo"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<com.indianic.viewflipperdemo.widget.ViewFlow
android:id="#+id/viewflow"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
app:sidebuffer="3" >
</com.indianic.viewflipperdemo.widget.ViewFlow>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/textView2"
android:layout_centerHorizontal="true"
android:text="Remember Life"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textStyle="bold" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/viewflowindic"
android:layout_centerHorizontal="true"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:padding="5dp"
android:text="Instantly search memories of friends, season, birthdays, and more"
android:textAppearance="?android:attr/textAppearanceSmall" />
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:orientation="horizontal"
android:paddingBottom="10dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="10dp" >
<Button
android:id="#+id/textView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="left|center"
android:layout_weight="1"
android:text="Register"
android:textColor="#000000" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_weight="1"
android:text="Login"
android:textColor="#000000" />
</LinearLayout>
<com.indianic.viewflipperdemo.widget.CircleFlowIndicator
android:id="#+id/viewflowindic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/linearLayout1"
android:layout_centerHorizontal="true"
android:padding="20dp"
app:inactiveType="stroke" />
</RelativeLayout>
And look at this awesome screenshot:
Use RelativeLayout instead FrameLayout. You will be more free with elements positions.
Relative Layout
Something like this you can do it
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res/com.indianic.viewflipperdemo"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<com.indianic.viewflipperdemo.widget.ViewFlow
android:id="#+id/viewflow"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:sidebuffer="3" />
<View
android:id="#+id/center"
android:layout_width="1dp"
android:layout_height="0dp"
android:layout_centerHorizontal="true" />
<Button
android:id="#+id/button_register"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_toLeftOf="#+id/center"
android:padding="10dp"/>
<Button
android:id="#+id/button_login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/center"
android:padding="10dp"/>
<com.indianic.viewflipperdemo.widget.ViewFlow
android:id="#+id/viewflowindic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/button_register"
android:layout_gravity="bottom|center_horizontal"
android:padding="10dip"
android:layout_marginBottom="10dip"
app:inactiveType="stroke" />
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/viewflowindic"
android:layout_centerHorizontal="true"
android:text="description"/>
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/description"
android:layout_centerHorizontal="true"
android:text="title"/>
</RelativeLayout>
btw use match_parent instead fill_parent.
Use RelativeLayout to organize views. For implementing view pager indicator try this link
https://github.com/JakeWharton/Android-ViewPagerIndicator
Sample
<?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">
//You can put an image view or text view to show your app name
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Path"
android:id="#+id/title"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="74dp"/>
**// Try view pager indicator here.**
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:weightSum="2"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:id="#+id/">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Register"
android:layout_weight="1"
android:id="#+id/button"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:layout_weight="1"
android:id="#+id/button2"/>
</LinearLayout>
</RelativeLayout>

Placing text view on image view

I want to place a single TextView over five ImageViews.the ImageViews are placed in a single TableRow.Is there any option available for that.Please help me..
Thanks in advance.
Use this one.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:gravity="bottom"
android:src="#drawable/image" />
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/image1"
android:layout_centerHorizontal="true"
android:layout_marginBottom="2dp"
android:text="#string/text"
android:textColor="#ff0000" />
</RelativeLayout>
</RelativeLayout>
Use Relative layout firstly create a table layout for height and width set as wrap contents align gravity center similarly then add a textView also with gravity center this way textview will come over the table layout.
Try these one:
<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"
>
<TableLayout
android:id="#+id/tableLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="84dp" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/arrow_icon_normal"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/arrow_icon_pressed"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/audio_normal"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/audio_pressed"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/back_normal"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
/>
</TableRow>
</TableLayout>
</RelativeLayout>
Try insert this code:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:gravity="bottom"
android:src="#drawable/image" />
<TextView
android:id="#+id/text1"
android:visibility="gone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/image1"
android:layout_alignBottom="#id/image1"
android:layout_alignLeft="#id/image1"
android:layout_alignRight="#id/image1"
android:layout_alignTop="#id/image1"
android:text="#string/text" />
</RelativeLayout>
Set main layout as Relative Layout inside that add your Table Layout then from the graphical layout add TextView wherever you need.
What about using your TableLayout as "outer" layout and for each table cell you use a FrameLayout as "inner" layout. Using this FrameLayout, both ImageView and TextView will overlap.
The above answer are correct. If you need it in table layout try this one.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TableLayout
android:id="#+id/tb1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/image2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/image3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
</TableRow>
</TableLayout>
<TextView
android:id="#+id/text1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/tb1"
android:layout_alignParentLeft="true"
android:layout_marginBottom="2dp"
android:text="i am text on image views"
android:textColor="#ff0000" />
</RelativeLayout>
</RelativeLayout>

ListView with button at the bottom in Activity with fixed header and footer

I am developing an Android Application and I have an Activity that looks like this. I have a header and a footer that have fixed positions, and a ListView with clickable items in the middle. Below the ListView, I have a button.
It is working when I have a few items, but as I add more items, the button begins to disappear, like this.
When I have more items in that list that can be shown in the page, I have a scroll in the list. If I scroll down like this I can see all the items in the list, but the button is hidden.
I have had a lot of problems before trying to add a ListView inside a ScrollView, so I know it doesn't work. As I am new in Android development, perhaps my XML layout files are a bit confusing, but I have a parent LinearLayout with two RelativeLayouts inside, one for the header and one for the middle and footer. The XML is something like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#FFFFFF">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#drawable/background"
android:gravity="center_vertical">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:text="#string/baseTitle"
android:textColor="#FFFFFF"
android:layout_centerVertical="true"
android:textSize="18dp"
android:textStyle="bold"/>
<Button
android:id="#+id/buttonHelp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:background="#drawable/button_help"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="fill_vertical">
<LinearLayout
android:id="#+id/buttonBar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:background="#bdbdbd"
android:layout_alignParentBottom="true">
<RelativeLayout
android:id="#+id/bottomButtomBar"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:orientation="horizontal">
<Button
android:id="#+id/myGroups"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:text="#string/myGroups"
android:gravity="center"
android:textSize="13dp"
android:textColor="#000000"
android:background="#layout/button_meus_grupos"/>
<Button
android:id="#+id/createGroups"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_centerInParent="true"
android:text="#string/createGroups"
android:gravity="center"
android:textSize="13dp"
android:textColor="#000000"
android:background="#layout/button_criar_grupos"/>
<Button
android:id="#+id/configurations"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="15dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:text="#string/configurations"
android:gravity="center"
android:textSize="13dp"
android:textColor="#000000"
android:background="#layout/button_configuracoes"/>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_above="#id/buttonBar"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/listContent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:orientation="vertical"
>
<RelativeLayout
android:id="#+id/searchBarLayout"
android:layout_width="fill_parent"
android:layout_height="48dp"
android:orientation="horizontal"
android:background="#ffffff"
android:gravity="center_vertical"
android:clickable="true"
>
<TextView
android:id="#+id/myGroupsLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/myGroups"
android:layout_centerInParent="true"
android:textColor="#bdbdbd"
android:textSize="16dp"
android:textStyle="bold"
/>
<ImageView
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="15dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_search" />
</RelativeLayout>
<View android:layout_height="2dip"
android:layout_width="wrap_content"
android:background="#cccccc"
/>
<ListView android:id="#+id/listview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#000000"
android:cacheColorHint="#000000"
/>
<Button
android:id="#+id/buttonCreateGroup"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:background="#layout/button_confirm"
android:layout_gravity="center_horizontal"
android:text="#string/createOneGroup"
android:textColor="#FFFFFF"
android:textSize="22dp"
android:layout_marginTop="15dp"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
Does anyone have any tips on how can I keep the footer fixed, scroll down until the end of the list and then show the button? I want that it looks like the button is the last item at the List.
EDIT: Entire XML posted
The ListView and the Button should be in a RelativeLayout and in the Button you should set android:layout_below="#id/listview"
<RelativeLayout
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="#+id/listview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:cacheColorHint="#000000"
android:textColor="#000000" />
<Button
android:layout_below="#id/listview"
android:id="#+id/buttonCreateGroup"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="20dp"
android:layout_marginTop="15dp"
android:background="#layout/button_confirm"
android:text="#string/createOneGroup"
android:textColor="#FFFFFF"
android:textSize="22dp" />
</RelativeLayout>
Try it in the following manner:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout //Header
android:layout_alignParentTop="true">
</RelativeLayout>
<ListView
android:layout_below="#+id/header" />
<RelativeLayout //Button(footer)
android:layout_alignParentBottom="true"
android:layout_below="#+id/listView" >
</RelativeLayout>
</RelativeLayout>
The only way I could achieve the exact requirements I explained above was doing the following:
-In the XML file with the layout of the list items, I added a button with android:visibility="gone".
-In my custom ListView adapter, I always add an empty object in the last position. I simply add an object with a flag that shows it is the last in the list.
-In the method getView() that I override in the custom Adapter, I check if the object in the current position has the flag indicating that it is the last in the list. If so, I set the button visibility to VISIBLE, otherwise I fill the other components.
If anyone is facing the same problem and needs some sample code from my solution just ask here.
Try this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:text="baseTitle"
android:textColor="#FFFFFF"
android:textSize="18dp"
android:textStyle="bold" />
<Button
android:id="#+id/buttonHelp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="fill_vertical"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/buttonBar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/bottomButtomBar"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:orientation="horizontal" >
<Button
android:id="#+id/myGroups"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="15dp"
android:gravity="center"
android:text="myGroups"
android:textColor="#000000"
android:textSize="13dp" />
<Button
android:id="#+id/createGroups"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:gravity="center"
android:text="createGroups"
android:textColor="#000000"
android:textSize="13dp" />
<Button
android:id="#+id/configurations"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="15dp"
android:gravity="center"
android:text="configurations"
android:textColor="#000000"
android:textSize="13dp" >
</Button>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#id/buttonBar"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/listContent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/searchBarLayout"
android:layout_width="fill_parent"
android:layout_height="48dp"
android:clickable="true"
android:gravity="center_vertical"
android:orientation="horizontal" >
<TextView
android:id="#+id/myGroupsLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="myGroups"
android:textColor="#bdbdbd"
android:textSize="16dp"
android:textStyle="bold" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="15dp" >
</ImageView>
</RelativeLayout>
<ScrollView
android:id="#+id/scroll"
android:layout_width="fill_parent"
android:layout_height="280dip"
android:layout_margin="7dip"
android:scrollbars="none" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ListView
android:id="#+id/listview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:cacheColorHint="#000000"
android:textColor="#000000" />
<Button
android:id="#+id/buttonCreateGroup"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="20dp"
android:layout_marginTop="15dp"
android:text="createOneGroup"
android:textColor="#FFFFFF"
android:textSize="22dp" />
</LinearLayout>
</ScrollView>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</LinearLayout>

LinearLayout: TextViews at left, big ImageView at right

i'm working on a LinearLayout but unfortunately it's not working as it should.
The goal is to have a LinearLayout with two TextViews (one placed below the other) on the left side, and an ImageView on the right side.
The ImageView should be as big as possible, the TextViews should take the remaining space.
At the moment my layout XML is like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_linearlayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_margin="1dp"
android:background="#drawable/background" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="2dp"
android:orientation="vertical" >
<TextView
android:id="#+id/layout1label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:singleLine="true"
android:text="1234"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/layout2label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1234_label2"
android:textSize="14dp" />
</LinearLayout>
<ImageView
android:id="#+id/layout_image"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical"
android:layout_margin="2dp"
android:layout_weight="1"
android:adjustViewBounds="true"
android:src="#drawable/ic_launcher" />
The part that isn't working: If the text in the TextViews is "too long", the ImageView gets shrinked. I want it exactly the other way round.
Any solutions?
It would be more efficient to use RelativeLayout instead of LinearLayout. Then you can place your views without having to nest layouts:
<?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" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/image"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
/>
<TextView
android:id="#+id/subtitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#+id/image"
android:layout_below="#+id/title"
/>
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
/>
</RelativeLayout>
By arranging the TextViews to be relative to the ImageView instead of the other way around, the ImageView takes priority for the space, and the text works with the remainder.
this might be help to you
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_linearlayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_margin="1dp"
android:background="#drawable/background" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/layout1label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:singleLine="true"
android:text="1234"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/layout2label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1234_labj hairu iue rel2"
android:textSize="14dp" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" >
<ImageView
android:id="#+id/layout_image"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical"
android:layout_margin="2dp"
android:adjustViewBounds="true"
android:src="#drawable/ic_launcher" />
</LinearLayout>
</LinearLayout>
A little modification to Kirans Code..worked for me
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/layout1label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:singleLine="true"
android:text="Name: BalaVishnu"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1" >
<ImageView
android:id="#+id/layout_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:adjustViewBounds="true"
android:src="#drawable/edit_icon" />
</LinearLayout>

ListView Row Height Too Small

Below is an image of a ListView row that is too short. I've tried too many combinations and yield my frustration to StackOverflow.
How can I fix this and show the whole row? Here is the XML for the item.
<?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="fill_parent"
android:weightSum="1">
<LinearLayout android:id="#+id/item_left"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:paddingRight="2dp"
android:paddingLeft="2dp"
android:background="#drawable/item_left"
android:layout_gravity="fill_vertical">
<TextView
android:id="#+id/status_day"
android:layout_gravity="center_vertical"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:textColor="#color/item_left_text"
android:textSize="25sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingLeft="2dp"
android:background="#drawable/item_right"
android:layout_weight="1">
<TextView
android:id="#+id/date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/item_right_text"
android:text="" />
<TextView
android:id="#+id/message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/item_right_text"
android:text="" />
</LinearLayout>
<ImageButton
android:id="#+id/options"
android:background="#drawable/item_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_menu_moreoverflow_normal_holo_light"
/>
</LinearLayout>
Any help is appreciated.
can you use this, set row layout height
android:layout_height="?android:attr/listPreferredItemHeight"
I set the height of the ImageButton to match_parent.
This fixed the issue oddly. Sigh.
your layout should be in such manner for your requirement i have pasted not same as your's layout but related to it check it
<?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="fill_parent"
android:layout_height="60dp" >
<ImageView
android:id="#+id/ivArrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:focusable="false"
android:clickable="false"
android:src="#drawable/arrow" />
<RelativeLayout
android:id="#+id/ivIcon"
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:focusable="false"
android:clickable="false"
android:background="#drawable/oddnumbg" >
<TextView
android:id="#+id/tvNo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="15dp"
android:textColor="#color/ReceiptNoLable"
android:text="No." />
<TextView
android:id="#+id/tvReceiptNo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:singleLine="true"
android:layout_below="#+id/tvNo"
android:gravity="center"
android:textColor="#color/ReceiptSavedColor"
android:textSize="18dp"
android:text="1234" />
</RelativeLayout>
<TextView
android:id="#+id/tvSubName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="15dp"
android:layout_marginTop="10dp"
android:layout_toRightOf="#+id/ivIcon"
android:text="RECEIVED FROM"
android:gravity="center"
android:focusable="false"
android:clickable="false"
android:textColor="#color/ReceiptNoLable"
/>
<TextView
android:id="#+id/tvName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/ivIcon"
android:layout_below="#+id/tvSubName"
android:text="RECEIPT"
android:layout_marginLeft="15dp"
android:textColor="#color/ReceiptSavedColor"
android:textSize="30dp"
android:focusable="false"
android:layout_toLeftOf="#+id/tvReceiptPrize"
android:clickable="false"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/tvReceiptPrize"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/ivArrow"
android:background="#drawable/myreceiptprizebg"
android:gravity="center"
android:singleLine="true"
android:layout_marginRight="5dp"
android:textSize="20dp"
android:textColor="#fff"
android:text="$84.20" />
</RelativeLayout>
</LinearLayout>
just set the height of the outer layout, instead of using fill_parent
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:awesome="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height=50dp <!-- or anything which fits -->

Categories

Resources