I was trying to get two images side by side inside my LinearLayout. I tried setting my layout weight to 1 as suggested by many other posts I saw here for both views but to no avail. The imageViews in question are the ones with the ID rainfall and wind. What am I doing wrong here? I even tried wrapping them inside a relative layout and it did not work. This is what they look like with the code below: I just want the umbrellas to be side by side instead of one being slightly below the other one? Any ideas?
<Button
android:layout_width="wrap_content"
android:id="#+id/city"
android:layout_gravity="center"
android:gravity="center"
android:layout_height="wrap_content"
android:background="#null"
android:onClick="location"/>
<ImageButton
android:id="#+id/condition"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:onClick="sendMessage"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/txtCondition"
android:gravity="center"
android:layout_gravity="center" />
<TextView
android:layout_width="wrap_content"
android:id="#+id/temp"
android:layout_gravity="center"
android:gravity="center"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/maxMin"
android:gravity="center"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/highTemp"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/wind"
android:src="#drawable/ic_umbrella"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="start" />
<ImageView
android:id="#+id/rainfall"
android:src="#drawable/ic_umbrella"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="end" />
<TextView
android:id="#+id/secDay"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/weekHigh"
android:layout_gravity="bottom|center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
Try to put them inside a LinearLayout :
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/wind"
android:src="#drawable/ic_umbrella"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start" />
<ImageView
android:id="#+id/rainfall"
android:src="#drawable/ic_umbrella"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="end" />
</LinearLayout>
Related
I want to create my Toolbar layout like below image.
I written below code for create this view. Please see my xml Code.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="#dimen/_40sdp"
android:background="#color/black"
android:padding="#dimen/_5sdp">
<ImageView
android:id="#+id/toolbar_default_img_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_menu" />
<TextView
android:id="#+id/toolbar_default_textview_title"
style="#style/textview_normal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="#+id/toolbar_default_img_menu"
android:layout_toStartOf="#+id/toolbar_default_img_search"
android:text="#string/app_name"
android:textColor="#color/white"
android:textSize="#dimen/_15ssp" />
<ImageView
android:id="#+id/toolbar_default_img_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toStartOf="#+id/toolbar_default_img_filter_tag"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_search" />
<ImageView
android:id="#+id/toolbar_default_img_filter_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toStartOf="#+id/toolbar_default_img_filter"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_filter" />
<ImageView
android:id="#+id/toolbar_default_img_filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_filter" />
</RelativeLayout>
After written this code i can see my view is correct in android studio preview but when i run my project it look like below image.
only left and right imageview on correct position but my textview and other two imageview is not set on correct position after run this code.
May be problem with android:layout_toEndOf and android:layout_toStartOf property of RelativeLayout.
I don't know why this problem create.Thank you for help.
Replace this code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="#dimen/_40sdp"
android:background="#color/black"
android:padding="#dimen/_5sdp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:gravity="center_vertical"
android:layout_centerVertical="true"
android:orientation="horizontal"
>
<ImageView
android:id="#+id/toolbar_default_img_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="#dimen/_5sdp"
android:src="#drawable/ic_launcher_background" />
<TextView
android:id="#+id/toolbar_default_textview_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:maxEms="50"
android:text="#string/app_name" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/toolbar_default_img_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_search" />
<ImageView
android:id="#+id/toolbar_default_img_filter_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_filter" />
<ImageView
android:id="#+id/toolbar_default_img_filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_filter" />
</LinearLayout>
</RelativeLayout>
Do changes as per your requirement by padding and margin to make a proper design.
Try using layout_alignParentRight , layout_toLeftOf , layout_toRightOf ,layout_alignParentLeft instead of layout_alignParentEnd , layout_toStartOf , layout_toEndOf and layout_alignParentStart or use Both in the 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">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#color/black"
android:padding="5dp">
<ImageView
android:id="#+id/toolbar_default_img_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:padding="5dp"
android:src="#drawable/add_btn" />
<TextView
android:id="#+id/toolbar_default_textview_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/toolbar_default_img_menu"
android:layout_toLeftOf="#+id/toolbar_default_img_search"
android:text="#string/app_name"
android:textColor="#color/white"
android:textSize="15sp" />
<ImageView
android:id="#+id/toolbar_default_img_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/toolbar_default_img_filter_tag"
android:padding="5dp"
android:src="#drawable/add_btn" />
<ImageView
android:id="#+id/toolbar_default_img_filter_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/toolbar_default_img_filter"
android:padding="5dp"
android:src="#drawable/add_btn" />
<ImageView
android:id="#+id/toolbar_default_img_filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:padding="5dp"
android:src="#drawable/add_btn" />
</RelativeLayout>
</RelativeLayout>
you need to add them as action button on the appbar
https://developer.android.com/training/appbar/actions.html
You need to add
android:layout_toLeftOf
along with
android:layout_toStartOf
and
android:layout_toRightOf
with
android:layout_toEndOf
Add
android:layout_toLeftOf:
along with
android:layout_toStartOf:
and
android:layout_toRightOf:
with
android:layout_toEndOf:
because you need to support lower API versions.
I have two buttons inside a linear layout which have same properties defined. But to my surprise, both have different height. Please see the xml code below
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:paddingBottom="10dp"
android:paddingTop="5dp" >
<ImageView
android:id="#+id/imgUser"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="5dp"
android:layout_marginTop="10dp"
android:adjustViewBounds="true"
android:src="#drawable/default_people_thumb" />
<TextView
android:id="#+id/tvUploadHeader"
style="#style/Text.Quaternary.Small.Bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/choose_a_profile_photo" />
<TextView
android:id="#+id/tvDescription"
style="#style/Text.Quaternary.ExtraSmall.Bold"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:gravity="center"
android:text="#string/photo_upload_initial" />
<Button
android:id="#+id/btnChoosePhoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/login_button_selector"
android:text="#string/choose_photo_from_gallery" />
<Button
android:id="#+id/btnSkip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/login_button_selector"
android:text="#string/choose_photo_from_gallery" />
</LinearLayout>
Can you please help me to have the same height. I am wondering as to how both behaves differently. Also added includeFontPadding for the button. But no hope :(.
Your background drawables have different padding or height. check #drawable/btn_large_gray and #drawable/login_button_selector
put both the button inside linear layout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:paddingBottom="10dp"
android:paddingTop="5dp" >
<ImageView
android:id="#+id/imgUser"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="5dp"
android:layout_marginTop="10dp"
android:adjustViewBounds="true"
android:src="#drawable/default_people_thumb" />
<TextView
android:id="#+id/tvUploadHeader"
style="#style/Text.Quaternary.Small.Bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/choose_a_profile_photo" />
<TextView
android:id="#+id/tvDescription"
style="#style/Text.Quaternary.ExtraSmall.Bold"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:gravity="center"
android:text="#string/photo_upload_initial" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:paddingBottom="10dp"
android:paddingTop="5dp" >
<Button
android:id="#+id/btnChoosePhoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/login_button_selector"
android:text="#string/choose_photo_from_gallery" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:paddingBottom="10dp"
android:paddingTop="5dp" >
<Button
android:id="#+id/btnSkip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/btn_large_gray"
android:text="#string/skip" />
</LinearLayout>
</LinearLayout>
and adjust both linear layouts as you like it
Try defining property android:layout_weight for each element in your LinearLayout, so they can have the same height.
For example :
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:paddingBottom="10dp"
android:paddingTop="5dp" >
<ImageView
android:id="#+id/imgUser"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_weight="1"
android:layout_margin="5dp"
android:layout_marginTop="10dp"
android:adjustViewBounds="true"
android:src="#drawable/default_people_thumb" />
<TextView
android:id="#+id/tvUploadHeader"
style="#style/Text.Quaternary.Small.Bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/choose_a_profile_photo" />
<TextView
android:id="#+id/tvDescription"
style="#style/Text.Quaternary.ExtraSmall.Bold"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:gravity="center"
android:text="#string/photo_upload_initial" />
<Button
android:id="#+id/btnChoosePhoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_margin="5dp"
android:background="#drawable/login_button_selector"
android:text="#string/choose_photo_from_gallery" />
<Button
android:id="#+id/btnSkip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_margin="5dp"
android:background="#drawable/login_button_selector"
android:text="#string/choose_photo_from_gallery" />
</LinearLayout>
The idea is to give as much space to each element. Your LinearLayout contains different elements so by choosing wrap_content in the android:layout_height and android:layout_width, space available will be allocated for each element added. And as you TextViews and Buttons are not the same...
Hope it'll help
You are using different style for both the buttons,
i.e. "#style/Text.Quaternary.Small.Bold" and "#style/Text.Quaternary.ExtraSmall.Bold" you should use only one style for both buttons
I have several logos and i want to set a Textview right next to it so that they are in the same line. I can't place them in the same line.please help me. I want my textview right next to my image.
my 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" >
<!--
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
-->
<TextView
android:id="#+id/filmhall_contactdetails"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/cinema_filmhall_contactdet"
android:textColor="#000000"
android:layout_margin="4dp"
android:toRightof="#+id/pointer"
android:textStyle="bold" />
<TextView
android:id="#+id/filmhall_address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="32dp"
android:layout_marginTop="2dp"
android:text="#string/cinema_filmhall_address"
android:textColor="#000000"
android:textSize="12sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/pointer"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_marginLeft="4dp"
android:src="#drawable/pointer" />
<TextView
android:id="#+id/filmhall_telephone1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/cinema_filmhall_tp1"
android:textColor="#000000"
android:layout_marginTop="2dp"
android:layout_marginLeft="32dp"
android:textSize="12sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/telephone"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_marginLeft="4dp"
android:src="#drawable/call" />
<TextView
android:id="#+id/filmhall_telephone2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/cinema_filmhall_tp2"
android:textColor="#000000"
android:layout_marginTop="2dp"
android:layout_marginLeft="32dp"
android:textSize="12sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/fax"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_marginLeft="4dp"
android:src="#drawable/fax" />
<TextView
android:id="#+id/filmhall_email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/cinema_filmhall_email"
android:textColor="#000000"
android:layout_marginTop="2dp"
android:layout_marginLeft="32dp"
android:textSize="12sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/message"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_marginLeft="4dp"
android:src="#drawable/message" />
<TextView
android:id="#+id/filmhall_facility"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:layout_marginTop="10dp"
android:text="#string/cinema_filmhall_facility"
android:textColor="#000000"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
android:id="#+id/fac1"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginLeft="4dp"
android:src="#drawable/fac1" />
<ImageView
android:id="#+id/fac3"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginLeft="4dp"
android:src="#drawable/fac3" />
<ImageView
android:id="#+id/fac2"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginLeft="4dp"
android:src="#drawable/fac2" />
</LinearLayout>
</LinearLayout>
Method 1:
Like others have suggested, you can have a nested LinearLayoutwith horizontal orientation. It will contain both TextView and ImageView with weights set according to your need.
See How to set ImageView and the textView in a single line inside a LinearLayout
Eg:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.5"
...
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="0.5"
android:text="Test2" />
</LinearLayout>
Method 2 [ Easier ]:
Since you mentioned that you've several logos and want to set the drawable/ImageView right next to it, there is an easier alternate way. Supposing you want something like this:
You can use android:drawableLeft or similar in the TextView. You can also set the padding between the drawable and the text of the TextView using android:drawablePadding. Using this way you don't need the extra ImageView. But it depends at the end what you are looking for.
See Programmatically set left drawable in a TextView
Hope this helps.
You can use TableRow as well. Here you don't need to specify the android:orientation="horizontal".
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/TextView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<ImageView
android:layout_width="33dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_marginRight="15dp"
android:src="#drawable/nextarrow" />
</TableRow>
</LinearLayout>
You can simply use android:layout_centerVertical="true" for all the views in Relative Layout to make them in a single vertical line.
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:layout_centerVertical="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="0.5"
android:text="Test2"
android:layout_centerVertical="true" />
I am trying to make a linear layout scrollable by using a scrollView so that the images put into the imageViews don't push the other views and functions off of the screen like this:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/personalizetextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/customize"
android:textSize="30sp"
android:gravity="center"
android:layout_marginTop="20dip"/>
<TextView
android:id="#+id/personalizetextviewChangeBackground"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/customizebackground"
android:gravity="center" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:maxWidth="100dp"
android:maxHeight="100dp"
android:scaleType="fitCenter"
android:contentDescription="#string/descForBackground"
/>
<Button
android:id="#+id/btnChangeImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/change_background" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/set_background"
android:id="#+id/btnSetBackground" />
<TextView
android:id="#+id/personalizetextviewChangeIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/change_icon"
android:gravity="center" />
<ImageView
android:id="#+id/imageView2Icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:maxWidth="100dp"
android:maxHeight="100dp"
android:scaleType="fitCenter"
android:contentDescription="#string/descForIcon"
/>
<Button
android:id="#+id/btnChangeImageForIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/change_icon" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/set_icon"
android:id="#+id/btnSetIcon" />
<Button
android:id="#+id/btnLinkToFeedback"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="40dip"
android:background="#null"
android:text="#string/Send_Feedback"
android:textColor="#21dbd4"
android:textStyle="bold" />
</LinearLayout>
</ScrollView>
But it just makes it so that my first textView shows up and nothing else.
What can I do to fix this?
Put
android:orientation="vertical"
in LinearLayout and not in ScrollView ;)
The default orientation for LinearLayout is horizontal and your TextView probably spans across multiple lines.
I am currently designing a ButtonBar with 5 buttons (they will all be ImageButtons, but for now, only 3 of them are). This is my first android project so I'm learning as I go along. I'm trying to weight each button equally, without scaling them (have equal padding rather than equal width). This is my code so far:
<LinearLayout
android:id="#+id/back"
android:orientation="horizontal"
android:layout_height="50dip"
android:layout_width="fill_parent"
android:layout_alignParentBottom="true"
android:background="#000000"
style="#android:style/ButtonBar"
android:weightSum="5"
>
<ImageButton
android:id="#+id/info_button"
android:padding="20dp"
android:background="#drawable/info"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_weight="1"
/>
<Button
android:id="#+id/wishlist_button"
android:text="#string/wish_label"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_weight="1"
android:padding="20dp"
android:textSize="15dip"
android:textColor="#b7b7b7"></Button>
<Button
android:id="#+id/buy_button"
android:text="#string/buy_label"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_weight="1"
android:padding="20dp"
android:textSize="15dip"
android:textColor="#b7b7b7"/>
<ImageButton
android:id="#+id/dislike_button"
android:padding="20dp"
android:background="#drawable/dislike_button"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_weight="1"
/>
<ImageButton
android:id="#+id/like_button"
android:padding="20dp"
android:background="#drawable/like_button"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_weight="1"
/>
This is what it looks like now:
stretched weighted: http://i.imgur.com/MAfjp.png
This is what I want it to look like (closely):
non-stretched equally padded: http://i.imgur.com/vXTEy.png
Thank you for helping. I've been searching for the answer for a while and have tried so much already.
Here it is:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/back"
android:orientation="horizontal"
android:layout_height="50dip"
android:layout_width="fill_parent"
android:layout_alignParentBottom="true"
android:background="#000000"
style="#android:style/ButtonBar"
android:gravity="center"
>
<ImageButton
android:id="#+id/info_button"
android:background="#null"
android:src="#drawable/info"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
/>
<Button
android:id="#+id/wishlist_button"
android:text="#string/wish_label"
android:background="#null"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
android:textSize="15dip"
android:textColor="#b7b7b7"></Button>
<Button
android:id="#+id/buy_button"
android:text="#string/buy_label"
android:background="#null"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
android:textSize="15dip"
android:textColor="#b7b7b7"/>
<ImageButton
android:id="#+id/dislike_button"
android:background="#null"
android:src="#drawable/dislike_button"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
/>
<ImageButton
android:id="#+id/like_button"
android:background="#null"
android:src="#drawable/like_button"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
/>
</LinearLayout>
I don't know how style="#android:style/ButtonBar" is set, so if it doesn't show properly try remove it.
You could add a spacer element in between each of the images/buttons and assign the layout_weight to the spacer elements instead of the images/buttons. So it would look something like this:
<LinearLayout
android:id="#+id/back"
android:orientation="horizontal"
android:layout_height="50dip"
android:layout_width="fill_parent"
android:layout_alignParentBottom="true"
android:background="#000000"
style="#android:style/ButtonBar"
>
<ImageButton
android:id="#+id/info_button"
android:padding="20dp"
android:background="#drawable/info"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
/>
<LinearLayout
android:layout_height="wrap_content"
android:layout_weight="1" />
/>
<Button
android:id="#+id/wishlist_button"
android:text="#string/wish_label"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:padding="20dp"
android:textSize="15dip"
android:textColor="#b7b7b7"></Button>
<LinearLayout
android:layout_height="wrap_content"
android:layout_weight="1" />
<Button
android:id="#+id/buy_button"
android:text="#string/buy_label"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:padding="20dp"
android:textSize="15dip"
android:textColor="#b7b7b7"/>
<LinearLayout
android:layout_height="wrap_content"
android:layout_weight="1" />
<ImageButton
android:id="#+id/dislike_button"
android:padding="20dp"
android:background="#drawable/dislike_button"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
/>
<LinearLayout
android:layout_height="wrap_content"
android:layout_weight="1" />
<ImageButton
android:id="#+id/like_button"
android:padding="20dp"
android:background="#drawable/like_button"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
/>
</LinearLayout>
This may not be the most elegant solution since it adds several views to your layout, but it's worked for me in the past.
You should consider using only image button with equal size images with equal weight inside your LinearLayout.
Regards,
Stéphane