Android ImageView in right of TextView with layout_centerHorizontal="true" - android

I have TextView with android android:layout_centerHorizontal="true", where is the user nickname and in the right of TextView.I want to add an ImageView,where I set the status of the user (red or green) but the status image is still in left (layout_toEndOf="#+id/username" is set).
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="#string/username"
android:id="#+id/username"
android:layout_alignParentTop="false"
android:textColor="#921090"
android:textSize="20dp"
android:layout_centerHorizontal="true"/>
<ImageView
android:layout_width="10dp"
android:layout_height="10dp"
android:id="#+id/status"
android:layout_toEndOf="#+id/username"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/username"/>


Please try this.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center">
<TextView
android:id="#+id/username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="name"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#921090"
android:textSize="20dp" />
<ImageView
android:id="#+id/status"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_marginLeft="10dp" />
</LinearLayout>


have tried with android:weightSum so it will be supported in all device with diffrenet resolution.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="2">
<TextView
android:id="#+id/username"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="#string/username"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#921090"
android:textSize="20dp" />
<ImageView
android:id="#+id/status"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/cal" />
</LinearLayout>


Here is your solution
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:id="#+id/username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="false"
android:text="username"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#921090"
android:paddingEnd="10dp"
android:textSize="20dp" />
<ImageView
android:id="#+id/status"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentTop="true"
android:layout_toEndOf="#+id/username"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
Hope you find this useful,......

Related

How to align textView on layout center without conflict with other view?

I have an issue trying align textView to the center of layout: when I try to do this - it has a conflict with a button on the left - if text is too long - it become hidden under the button. Text length can be very different and I need it in the center of layout but not under/on the button.
Here is the xml file of activity layout:
<?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">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/item_content_action_bar_layout"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#color/colorBlue"
android:padding="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Title"
android:textColor="#color/colorWhite"
android:textAlignment="center"
android:singleLine="true"
android:layout_gravity="center_vertical"
android:textStyle="bold"
android:autoText="false"
android:layout_centerInParent="true"
android:layout_alignWithParentIfMissing="false"
android:layout_alignParentRight="false" />
<ImageButton
android:layout_width="120dp"
android:layout_height="45dp"
android:id="#+id/item_content_back_button"
android:background="#drawable/back_button_selector"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginRight="5dp" />
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/item_content_scroll_view"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:fillViewport="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="125dp"
android:layout_height="125dp"
android:id="#+id/item_content_image"
android:src="#drawable/ic_no_thumbnail"
android:maxHeight="125dp"
android:maxWidth="125dp"
android:layout_alignParentLeft="false"
android:layout_alignParentStart="true"
android:layout_margin="10dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_subtitle"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Subtitle"
android:layout_alignTop="#+id/item_content_image"
android:layout_toRightOf="#+id/item_content_image"
android:layout_toEndOf="#+id/item_content_image"
android:textSize="20dp"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_pubdate"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Date"
android:layout_below="#+id/item_content_subtitle"
android:layout_alignLeft="#+id/item_content_subtitle"
android:layout_alignStart="#+id/item_content_subtitle"
android:textSize="10dp"
android:layout_marginTop="10dp" />
</RelativeLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="blabla"
android:layout_below="#+id/item_content_pubdate"
android:layout_alignStart="#+id/item_content_pubdate"
android:layout_alignParentStart="true"
android:layout_margin="10dp" />
</LinearLayout>
</ScrollView>
</LinearLayout>

Try using LinearLayout with layout-weight for this to avoid conflict. Change your first relativelayout to below one
<LinearLayout
android:id="#+id/item_content_action_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/_white"
android:orientation="horizontal"
android:padding="10dp"
android:weightSum="7">
<ImageButton
android:id="#+id/item_content_back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:layout_weight="2"
android:background="#drawable/chemist" />
<TextView
android:id="#+id/item_content_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="5"
android:autoText="false"
android:gravity="center"
android:maxLines="2"
android:singleLine="true"
android:text="Title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#color/Black"
android:textStyle="bold" />
</LinearLayout>

Change Your RelativeLayout to LinearLayout and use android:layout_weight attribute of layout to do this.
<LinearLayout
android:id="#+id/item_content_action_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/_white"
android:orientation="horizontal"
android:padding="10dp"
android:weightSum="1"
>
<ImageButton
android:id="#+id/item_content_back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:background="#drawable/chemist" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Title"
android:textColor="#color/colorWhite"
android:textAlignment="center"
android:singleLine="true"
android:layout_gravity="center_vertical"
android:textStyle="bold"
android:gravity="center"
android:layout_weight="1"
android:autoText="false"/>
</LinearLayout>

Make the layout_gravity of the textview item_content_title as "center_horizontal".
And add android:layout_toLeftOf="#+id/item_content_title" under the ImageButton item_content_back_button.
Hope it was what you wanted.

Your Action bar layout has to be like this-
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/item_content_action_bar_layout"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#color/colorBlue"
android:padding="10dp">
<ImageButton
android:layout_width="120dp"
android:layout_height="45dp"
android:id="#+id/item_content_back_button"
android:background="#drawable/back_button_selector"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_marginRight="5dp" />
<TextView
android:toRightOf="#id/item_content_back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Title"
android:textColor="#color/colorWhite"
android:textAlignment="center"
android:singleLine="true"
android:layout_gravity="center_vertical"
android:textStyle="bold"
android:autoText="false"
android:layout_centerInParent="true" />
</RelativeLayout>

How To Put Back Button in Fragment Class in android

I want to put back button on Fragment class. I want to put back button on left ShoppingMazza text .
nav_drawer_row.xml:-
<?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"
android:clickable="true"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/log" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:gravity="center">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="30dp"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold"
android:onClick="shopByCategory"
android:text="Shop By Category"/>
<!-- <RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/electronic1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="#+id/imageView1"
android:layout_toRightOf="#+id/imageView1"
android:gravity="center_vertical"
android:text="Hello" />
</RelativeLayout> -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:paddingLeft="60dp"
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/electronic1" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold"
android:layout_centerVertical="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="#+id/imageView1"
android:layout_toRightOf="#+id/imageView1"
android:gravity="center_vertical"
android:text="Electronic"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:paddingLeft="60dp"
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/fashion" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold"
android:layout_centerVertical="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="#+id/imageView2"
android:layout_toRightOf="#+id/imageView2"
android:gravity="center_vertical"
android:text="Fashion & Lifestyle "/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:paddingLeft="25dp"
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/deal" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold"
android:layout_centerVertical="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="#+id/imageView3"
android:layout_toRightOf="#+id/imageView3"
android:gravity="center_vertical"
android:onClick="deal"
android:text="#string/today_deals"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:paddingLeft="25dp"
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/track" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold"
android:layout_centerVertical="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="#+id/imageView4"
android:layout_toRightOf="#+id/imageView4"
android:gravity="center_vertical"
android:onClick="home"
android:text="#string/track_your_order"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:paddingLeft="25dp"
android:id="#+id/imageView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/track" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold"
android:layout_centerVertical="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="#+id/imageView5"
android:layout_toRightOf="#+id/imageView5"
android:gravity="center_vertical"
android:onClick="legal"
android:text="#string/legal"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:paddingLeft="25dp"
android:id="#+id/imageView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/rate1" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold"
android:layout_centerVertical="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="#+id/imageView6"
android:layout_toRightOf="#+id/imageView6"
android:gravity="center_vertical"
android:text="#string/rate_this_app"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:paddingLeft="25dp"
android:id="#+id/imageView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/query" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold"
android:layout_centerVertical="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="#+id/imageView7"
android:layout_toRightOf="#+id/imageView7"
android:gravity="center_vertical"
android:onClick="query"
android:text="#string/any_other_query"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:paddingLeft="25dp"
android:id="#+id/imageView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/twitter" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold"
android:layout_centerVertical="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="#+id/imageView8"
android:layout_toRightOf="#+id/imageView8"
android:gravity="center_vertical"
android:text="#string/follow_us_on_twitter"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:paddingLeft="25dp"
android:id="#+id/imageView9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/fb" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold"
android:layout_centerVertical="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="#+id/imageView9"
android:layout_toRightOf="#+id/imageView9"
android:gravity="center_vertical"
android:text="#string/follow_us_on_facebook"/>
</RelativeLayout>
</LinearLayout>
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="30dp"
android:paddingTop="10dp"
android:text=""
android:paddingBottom="10dp"
android:textSize="15dp"
android:textStyle="bold" />
</LinearLayout>
When click on back button drawer layout is closed.Anyone can hep me how i solved my problem.

I think that it is very strange to put a back button here.because you can close drawer by slide it .But any way just put your back button like this .
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="60dp">
<ImageView
android:layout_marginLeft="60dp"
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/electronic1" />
<ImageView
android:layout_marginLeft="10dp"
android:id="#+id/imageView"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:src="#drawable/back" />
</RelativeLayout>

First put a back button here is a bad idea, try to take a look to the google layout design.
But for your pb, you wants help for the layout ?
in your case juste create an horizontal Linear Layout, and add your button and then your image.
For the close operation we lack of information. Does you want to close the activity ?
does you want to go back to the main fragment ?
I'm a bit confused cauz it seems that you never touched android development.

Creating a layout with image extending the list item - Android XML

I am trying to create the following layout in android.
I am unable to achieve the layout as shown in the image.Please ignore the image on the extreme left.
<LinearLayout
android:id="#+id/ll_groups_list_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="10dp"
android:layout_weight="1.0"
android:background="#drawable/normal_white_bg"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:id="#+id/groups_list_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="Group name"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/groups_list_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:text="Group Description may come for two lines" />
</LinearLayout>
<ImageView
android:id="#+id/groups_list_image"
android:layout_width="70dp"
android:layout_height="70dp"
android:padding="3dip"
android:src="#drawable/logo" />

this may helpful to you,
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="2dp" >
<ImageView
android:id="#+id/image"
android:layout_width="120dp"
android:layout_height="120dp"
android:contentDescription="#string/news" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_toLeftOf="#+id/arrow"
android:layout_toRightOf="#+id/thumb"
android:orientation="vertical" >
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="1"
android:text="#string/text1"
android:textSize="25dp"
android:textStyle="bold" />
<TextView
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginTop="25dp"
android:padding="2dp"
android:paddingTop="20dp"
android:text="#string/text2"
android:textColor="#7F7F7F"
android:textSize="10sp" />
</RelativeLayout>
<ImageView
android:id="#+id/textImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="5dp"
android:src="#drawable/image_source" />
</RelativeLayout>

Try this way,hope this will help you to solve your problem.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFF00"
android:padding="5dp">
<LinearLayout
android:id="#+id/ll_groups_list_text"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:orientation="vertical"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:gravity="center_vertical"
android:padding="5dp">
<TextView
android:id="#+id/groups_list_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="Group name"
android:textColor="#000000"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/groups_list_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:textColor="#000000"
android:layout_marginTop="5dp"
android:text="Group Description may come for two lines" />
</LinearLayout>
<ImageView
android:id="#+id/groups_list_image"
android:layout_width="70dp"
android:layout_height="70dp"
android:padding="3dip"
android:background="#FFFFFF"
android:src="#drawable/ic_launcher" />
</LinearLayout>

Please use this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFF00"
android:padding="2dp" >
<RelativeLayout
android:id="#+id/ll_groups_list_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#FFFFFF"
android:orientation="vertical" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/imageView1"
android:text="Text1"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageView1"
android:layout_alignParentLeft="true"
android:text="Text 2"
android:textAppearance="?android:attr/textAppearanceMedium" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
</LinearLayout>

Android Design 2 Images and text LinearLayout

I'm trying to create a layout like this:
Basically I have 2 Images that I would like to stick to either side of the LinearLayout and in the center have some text. I'm setting the width of the images in code based on the density of the screen, so that is of variable width.
Here is the code I have so far:
<RelativeLayout
android:id="#+id/user_header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/user_loading_wrapper"
android:layout_alignWithParentIfMissing="true"
android:layout_alignParentTop="true"
android:layout_margin="#dimen/default_spacing">
<!--User Poster-->
<ImageView
android:id="#+id/user_poster"
android:layout_width="50dp"
android:layout_height="50dp"
android:scaleType="fitXY"
android:contentDescription="User Poster"
android:layout_alignParentLeft="true"/>
<!--Review Details-->
<LinearLayout
android:id="#+id/screen_details"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/user_poster"
android:layout_alignParentTop="true"
android:gravity="center"
android:layout_centerInParent="true"
android:layout_marginLeft="#dimen/default_spacing_max"
android:orientation="vertical">
<!--User Title-->
<TextView
android:id="#+id/user_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#333"
android:singleLine="false"
android:layout_gravity="center"/>
<!--Location-->
<TextView
android:id="#+id/user_location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#333"
android:singleLine="false"
android:layout_gravity="center"/>
<!--User 2 Title-->
<TextView
android:id="#+id/user_secondary_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#333"
android:layout_marginTop="4dp"
android:singleLine="false"
android:layout_gravity="center"
tools:text="Life of Pi"/>
</LinearLayout>
<!--Poster-->
<ImageView
android:id="#+id/user_poster_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitEnd"
android:layout_toRightOf="#id/screen_details"
android:contentDescription="Poster"
android:layout_alignParentRight="true"/>
</RelativeLayout>
But it doesn't work at all. I want the Center Layout to expand and occupy all the space in the middle between the two images.

i fixed it .... check output it in image and flow in code.
And Code is:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/user_header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignWithParentIfMissing="true" >
<ImageView
android:id="#+id/user_poster"
android:layout_width="60dp"
android:layout_height="60dp"
android:background="#android:color/black"
android:scaleType="fitXY" />
<LinearLayout
android:id="#+id/screen_details"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:id="#+id/user_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#android:color/darker_gray"
android:paddingLeft="10dp"
android:singleLine="false"
android:text="Life of Pi"
android:textColor="#333" />
<TextView
android:id="#+id/user_location"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="4dp"
android:background="#android:color/darker_gray"
android:paddingLeft="10dp"
android:singleLine="false"
android:text="Life of Pi"
android:textColor="#333" />
<TextView
android:id="#+id/user_secondary_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="4dp"
android:background="#android:color/darker_gray"
android:paddingLeft="10dp"
android:singleLine="false"
android:text="Life of Pi"
android:textColor="#333" />
</LinearLayout>
<ImageView
android:id="#+id/user_poster2"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_weight="0"
android:background="#android:color/black"
android:scaleType="fitXY" />
</LinearLayout>

try this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/user_header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignWithParentIfMissing="true"
android:layout_alignParentTop="true"
android:layout_margin="5dp">
<!--User Poster-->
<ImageView
android:id="#+id/user_poster"
android:layout_width="50dp"
android:layout_height="50dp"
android:scaleType="fitXY"
android:contentDescription="User Poster"
android:layout_alignParentLeft="true"/>
<!--Review Details-->
<LinearLayout
android:id="#+id/screen_details"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="20dp"
android:layout_marginRight="70dp"
android:layout_toRightOf="#id/user_poster"
android:gravity="center"
android:orientation="vertical" >
<!--User Title-->
<TextView
android:id="#+id/user_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#333"
android:singleLine="false"
android:layout_gravity="center"/>
<!--Location-->
<TextView
android:id="#+id/user_location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#333"
android:singleLine="false"
android:layout_gravity="center"/>
<!--User 2 Title-->
<TextView
android:id="#+id/user_secondary_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#333"
android:layout_marginTop="4dp"
android:singleLine="false"
android:layout_gravity="center"
android:text="Life of Pi"/>
</LinearLayout>
<!--Poster-->
<ImageView
android:id="#+id/user_poster_2"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentRight="true"
android:contentDescription="Poster" />
</RelativeLayout>

Button in LinearLayout not displayed in Android

I have a button in linearlayout above the image. The image is displaying properly, but the linearlayout above the image is not displayed.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#E9E0DB" >
<LinearLayout
android:id="#+id/editdialogstartedlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/profdialogphotoimageview"
android:background="#ffffff"
android:orientation="horizontal"
android:padding="5dip" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:text="Edit"
android:textColor="#000000" />
</LinearLayout>
<com.example.masonrytest.views.ScaleImageView
android:id="#+id/profdialogphotoimageview"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
<LinearLayout
android:id="#+id/textlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/profdialogphotoimageview"
android:background="#ffffff"
android:orientation="vertical"
android:padding="5dip" >
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/profdialogphotoimageview"
android:text="There Is Nothing Negative In Total Exploitation Of Natural Resources. What Say?"
android:textColor="#000000"
android:textSize="12dp"
android:textStyle="normal" />
<LinearLayout
android:id="#+id/dialog_details"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="5dip" >
<ImageView
android:id="#+id/list_image"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignBottom="#id/text1"
android:src="#drawable/picture1" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/list_image"
android:layout_toRightOf="#+id/list_image"
android:padding="5dip"
android:text="By Andrew"
android:textColor="#000000"
android:textSize="10dp"
android:textStyle="normal" />
<ImageView
android:id="#+id/list_image"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_marginLeft="25dp"
android:src="#drawable/member" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:padding="5dip"
android:text="8"
android:textColor="#000000"
android:textSize="10dp"
android:textStyle="normal" />
<ImageView
android:id="#+id/list_image"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dp"
android:src="#drawable/udebate_fav" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:padding="5dp"
android:text="64"
android:textColor="#000000"
android:textSize="10dp" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Any ideas or suggestions please?
Thanks.

Try it.
remove following property from LinearLayout.
android:layout_above="#+id/profdialogphotoimageview"
and put
android:layout_alignParentTop="true"
and also you need to put following property in "com.example.masonrytest.views.ScaleImageView"
android:layout_below="#+id/editdialogstartedlayout"
now you get the actual View which you need.
In your old code Your Button not view because of has fill-parent height so, it takes all size of the screen. and LinearLayout above of this layout that's why its gone above of the screen.

Your root level (the RelativeLayout) has children that all have fill_parent/match_parent. This means that all items are going to fill the available space. You will only see the last one (#+id/textlayout). Think about what you are trying to achieve with your layout.
If you use Eclipse, there is also a GUI you can test with.

Give id to main layout here RelativeLayout android:id="#+id/main"
and add
android:layout_below="#+id/main" to LinearLayout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#E9E0DB" >
<LinearLayout
android:id="#+id/editdialogstartedlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:orientation="horizontal"
android:padding="5dip"
android:layout_alignParentTop="true" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:text="Edit"
android:textColor="#000000" />
</LinearLayout>
<com.example.masonrytest.views.ScaleImageView
android:id="#+id/profdialogphotoimageview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/editdialogstartedlayout" />
<LinearLayout
android:id="#+id/textlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/profdialogphotoimageview"
android:background="#ffffff"
android:orientation="vertical"
android:padding="5dip" >
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="There Is Nothing Negative In Total Exploitation Of Natural Resources. What Say?"
android:textColor="#000000"
android:textSize="12dp"
android:textStyle="normal" />
<LinearLayout
android:id="#+id/dialog_details"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="5dip" >
<ImageView
android:id="#+id/list_image"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignBottom="#id/text1"
android:src="#drawable/picture1" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/list_image"
android:layout_toRightOf="#+id/list_image"
android:padding="5dip"
android:text="By Andrew"
android:textColor="#000000"
android:textSize="10dp"
android:textStyle="normal" />
<ImageView
android:id="#+id/list_image"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_marginLeft="25dp"
android:src="#drawable/member" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:padding="5dip"
android:text="8"
android:textColor="#000000"
android:textSize="10dp"
android:textStyle="normal" />
<ImageView
android:id="#+id/list_image"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dp"
android:src="#drawable/udebate_fav" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:padding="5dp"
android:text="64"
android:textColor="#000000"
android:textSize="10dp" />
</LinearLayout>
</LinearLayout>

in the element com.example.masonrytest.views.ScaleImageView try adding the following line:
android:layout_toEndOf="#id/editdialogstartedlayout"

Categories

Resources