In my application I have to arrange my widgets in proper ratio (width). I have 6 widgets and I want to align in the ratio of 2:2:4:4:1:1 considering width only. I tried this one but i am not get the right solution.
<LinearLayout
android:id="#+id/register_header12"
android:layout_width="fill_parent"
android:layout_height="55dp"
android:layout_alignParentBottom="true"
android:layout_marginTop="5dp"
android:weightSum="14"
android:orientation="horizontal" >
<ImageView
android:id="#+id/register_title_image"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="2"
android:contentDescription="#string/app_icon_desc"
android:src="#drawable/logo_blue" />
<TextView
android:id="#+id/register_title_name"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="2"
android:text="Name"
android:textStyle="bold" />
<Button
android:id="#+id/bbb"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#drawable/bar_button"
android:text="BBB"
android:textStyle="bold" />
<Button
android:id="#+id/aaa"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#drawable/bar_button"
android:text="AAA"
android:textStyle="bold" />
<ImageView
android:id="#+id/setting"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="4"
android:src="#drawable/ic_menu_manage"
android:onClick="showSettings"
/>
<ImageView
android:id="#+id/signout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="4"
android:src="#drawable/ic_menu_blocked_user"
android:onClick="doSignOut"
/>
</LinearLayout>
Please provide me the best way..
Change all of your android:layout_widths to 0. That will allow the weight property to determine the width and should solve your problem.
first of all put weightSum=(sum of all layout weight in your case is 14) in your Linear layout,
then make child view width wrap_content and weight attribute as per your ratio.
hope this will work.
layout_weight doesn't decide widget size. In layout, each widget measure its size and require space from parent layout. Then parent assign rest of space to all children according to ratio of layout_weight. So, in your case, you may specify layout_width=0. This way, widgets doesn't require any space, then parent layout could assign space according to layout_weight.
Ralgha's answer is correct one. and for code you can refer below code.
Please check code:
<LinearLayout
android:id="#+id/register_header12"
android:layout_width="fill_parent"
android:layout_height="55dp"
android:layout_alignParentBottom="true"
android:layout_marginTop="5dp"
android:weightSum="14"
android:orientation="horizontal" >
<ImageView
android:id="#+id/register_title_image"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="2"
android:contentDescription="#string/app_icon_desc"
android:src="#drawable/logo_blue" />
<TextView
android:id="#+id/register_title_name"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="2"
android:text="Name"
android:textStyle="bold" />
<Button
android:id="#+id/bbb"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#drawable/bar_button"
android:text="BBB"
android:textStyle="bold" />
<Button
android:id="#+id/aaa"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#drawable/bar_button"
android:text="AAA"
android:textStyle="bold" />
<ImageView
android:id="#+id/setting"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="4"
android:src="#drawable/ic_menu_manage"
android:onClick="showSettings"
/>
<ImageView
android:id="#+id/signout"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="4"
android:src="#drawable/ic_menu_blocked_user"
android:onClick="doSignOut"
/>
</LinearLayout>
Hope this will help you.
Related
I'm building a gridView which replicates the basic functionality of a Launcher (it allows you to create new folders - and arrange them within the gridView).
My problem is I have a textView and an imageView (which should appear below the bottom most tile [it is either white or grey depending on how many times the add image button is clicked] in the screenshot below) however they are being pushed outside the bounds of the layout for some reason - and I'm having trouble identifying which one is causing this to occur.
I've tried many different combinations of height and width paramaters as well as trying Linear vs Relative layout for my innermost child layout - but I still can't seem to keep the textView and an imageView from being pushed outside the layout completely and I'm having a bit of trouble nailing down what exactly is causing it.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:weightSum="1.0" >
<GridView
android:id="#+id/image_grid_view"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="0.8"
android:background="#color/grid_background"
android:gravity="center"
android:horizontalSpacing="2dip"
android:numColumns="#integer/num_columns"
android:stretchMode="columnWidth"
android:verticalSpacing="2dip" />
<RelativeLayout
android:id="#+id/bottom_part"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerHorizontal="true"
android:layout_weight="0.2"
android:background="#android:color/black"
android:orientation="horizontal"
android:weightSum="1.0" >
<Button
android:id="#+id/button_add_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:onClick="onClickAddImage"
android:text="Add image" />
<com.example.project.DeleteZone
android:id="#+id/delete_zone_view"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:src="#drawable/delete_zone" />
<FrameLayout
android:id="#+id/image_source_frame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.5" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ImageView
android:id="#+id/sqwhite"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:layout_marginRight="5dp" />
<EditText
android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#id/sqwhite"
android:layout_marginRight="5dp" >
<requestFocus />
</EditText>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#id/editText1"
android:layout_marginRight="5dp"
android:text=""
android:textColor="#android:color/white" />
</RelativeLayout>
</FrameLayout>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
Your FrameLayout is redundant as it only contains a LinearLayout, but more importantly it's set to 80dp height. This means that anything beyond 80dp will not be visible. Try setting it to wrap_content.
This is my custom dialog, there are some textboxs and two buttons.
I'm using a RelativeLayout on it.
I'd like the dialog size to match the content, not all that blank space under there.
I don't want to use explicit pixel heights (it's not good practice).
Another thing, there's a way to have some space between every view?
This is my XML
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/txt_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="8pt"
android:textStyle="italic" />
<TextView
android:id="#+id/txt_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_below="#+id/txt_desc"
android:textSize="8pt" />
<TextView
android:id="#+id/txt_place"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_below="#+id/txt_date"
android:textSize="8pt" />
<Button
android:id="#+id/btn_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/txt_place"
android:layout_toRightOf="#+id/view"
android:text="#string/btn_close" />
<View
android:id="#+id/view"
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_centerHorizontal="true" />
<Button
android:id="#+id/btn_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/txt_place"
android:layout_toLeftOf="#+id/view"
android:drawableLeft="#android:drawable/ic_menu_edit"
android:text="#string/btn_edit" />
</RelativeLayout>
First question
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
Second question
Plus use android:marginTop="5dp" if you want to separate a View from Top for 5 dp.
marginLeft|Right|Bottom are also available.
<TextView
android:id="#+id/txt_place"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp" <-----------------
android:layout_below="#+id/txt_date"
android:textSize="8pt" />
By the way, if I were you, I'd nest some layouts to make order. You can have a general Relative Layout, then 2 linear layouts: one horizontal for TextViews and one vertical for Buttons. You can definely play with your editor and try to make the best appearance for your dialog.
EDIT
Try this one:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#0000"
android:orientation="vertical"
android:paddingBottom="50dp" >
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/txt_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="prova"
android:textSize="8pt"
android:textStyle="italic" />
<TextView
android:id="#+id/txt_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="prova"
android:textSize="8pt" />
<TextView
android:id="#+id/txt_place"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="prova"
android:textSize="8pt" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Button
android:id="#+id/btn_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableLeft="#android:drawable/ic_menu_edit"
android:text="btn_edit" />
<Button
android:id="#+id/btn_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="btn_close" />
<View
android:id="#+id/view"
android:layout_width="0dp"
android:layout_height="1dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I've hard-coded the texts. The main idea is to use a big container layout in background, which is trasparent (background=#0000) and in top of that a layout in wrap_content containing your Views.
If this solution doesn't resolve your problem, I think you could edit height directly in your code. Try to relate to this question
Set your relative layout's height to wrap_content.
For example:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- More XML -->
</RelativeLayout>
Also be aware that fill_parent is deprecated for widths and heights.
You can add either margin (extra space outside a view) or padding (extra space inside a view) with android:layout_margin or android:padding respectively. There are also variants such as layout_marginTop that only apply to a specific side of the view.
The layout_weight attribute in the last TextView in this layout is being highlighted by lint as causing bad performance. I suspect the name of the lint warning is erroneous as there are no nested weights. There are several stretching views, and I suspect what it means is dependent weighted views.
What's the solution, to build this layout, and avoid this lint warning, and improve performance?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:background="#drawable/background_gradient"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/image4"
android:layout_margin="6dp"
android:contentDescription="#string/PLACEHOLDER_TEXT"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
>
<Button
style="#style/dashboard_button"
android:id="#+id/home_management"
android:text="#string/ICON_MANAGEMENT"
/>
<Button
style="#style/dashboard_button"
android:id="#+id/home_calculators"
android:text="#string/ICON_CALCULATORS"
/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
>
<Button
style="#style/dashboard_button"
android:id="#+id/home_guidelines"
android:text="#string/ICON_GUIDELINES"
/>
<Button
style="#style/dashboard_button"
android:id="#+id/home_faq"
android:text="#string/ICON_FAQ"
/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
>
<Button
style="#style/dashboard_button"
android:id="#+id/home_refs"
android:text="#string/ICON_REFERENCES"
/>
<Button
style="#style/dashboard_button"
android:text=""
android:visibility="invisible"
/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_margin="6dp"
>
<TextView
android:text="#string/HOMEPAGE_CONTENT"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal"
android:textStyle="bold"
android:textColor="#FFFFFF"
/>
<View
android:layout_width="8dp"
android:layout_height="1dp"
/>
<ImageView
android:id="#+id/home_logo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/image7"
android:contentDescription="#string/PLACEHOLDER_TEXT"
/>
</LinearLayout>
<Button
android:id="#+id/home_web_site"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/HOMEPAGE_FOOTER"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:textSize="12sp"
android:background="#drawable/button_red"
android:layout_margin="6dp"
android:textColor="#FFFFFF"
/>
</LinearLayout>
You don't need to worry about this, however, especially if you really need the weights, and if that's the only way to declare your layout properly.
The TextView and ImageView in your #string/HOMEPAGE_CONTENT area are nested in their parent LinearLayout and have weights assigned. I suspect those are your problem, especially since the parent is wrap_content, so theoretically there shouldn't be any space for the child elements to stretch into.
Concerning this part of code.
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
<Button
style="#style/dashboard_button"
android:id="#+id/home_management"
android:text="#string/ICON_MANAGEMENT"
/>
<Button
style="#style/dashboard_button"
android:id="#+id/home_calculators"
android:text="#string/ICON_CALCULATORS"
/>
Your LinearLayout contains "layout_weight" attribute, and if the style "dashboard_button" contains the attribute "layout_weight" too, then you got couple of nested views with the "layout_weight" attribute, though the lint doesn't warn me now concerning "layout_weight" inside the styles.
My solution is to substitue one(or both) of the LinearLayouts with RelativLayout and adjust the sizes and places programmatically.
i tried to put two buttons with the same size in linearlayout. my problem is that the left button isn't at the same height than the right one.
i searched for an answer but i didn't find anything related to my problem.
here a picture of what i get on an android 2.1 device:
http://tinypic.com/r/eskb4n/5
i used this code:
`
<LinearLayout
android:layout_alignParentBottom="true"
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="bottom">
<Button
android:id="#+id/take_pic_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/take_pic" />
<Button
android:id="#+id/from_gallery_btn"
android:text="#string/from_gallery"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
</LinearLayout>`
thanks for your help!
EDIT: i used 0dp for layout_width instead of fill_parent..
You can set the android:layout_height="fill_parent" to both buttons.
Hope this helps!
I see 2 possible solutions:
1) set fixed android:layout_height so both buttons will definitely take equal vertical space.
<LinearLayout
android:layout_alignParentBottom="true"
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="bottom">
<Button
android:id="#+id/take_pic_btn"
android:layout_width="fill_parent"
android:layout_height="40dip"
android:layout_weight="1"
android:text="#string/take_pic" />
<Button
android:id="#+id/from_gallery_btn"
android:text="#string/from_gallery"
android:layout_width="fill_parent"
android:layout_height="40dip"
android:layout_weight="1"
/>
2) force text on button to take single line only.
<LinearLayout
android:layout_alignParentBottom="true"
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="bottom">
<Button
android:id="#+id/take_pic_btn"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:singleLine="true"
android:maxLines="1"
android:text="#string/take_pic" />
<Button
android:id="#+id/from_gallery_btn"
android:text="#string/from_gallery"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:singleLine="true"
android:maxLines="1"
/>
When I have 1, 2 or 3 components I know how to get them to space properly. But now I have a view that will have 4, 5, ... components in it. Rather than increasing the size of the components (via weight), I need them to remain a fixed size. So... is there any way to lay these out with justified spacing (evenly spaced within the view)?
Thanks,
J
A similar work around that I've figured out is to add spacer view components. Again, this is not ideal, but it works. If there is anything better, please let me know.
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<biz.mycompany.mycomponent
android:layout_width="#dimen/screen_view_w"
android:layout_height="#dimen/screen_view_h"
/>
<View
android:layout_width="0px"
android:layout_height="#dimen/main_screen_button_h"
android:layout_weight="1"
/>
<biz.mycompany.mycomponent2
android:layout_width="#dimen/screen_view_w"
android:layout_height="#dimen/screen_view_h"
/>
<View
android:layout_width="0px"
android:layout_height="#dimen/screen_view_h"
android:layout_weight="1"
/>
<biz.mycompany.mycomponent3
android:layout_width="#dimen/screen_view_w"
android:layout_height="#dimen/screen_view_h"
/>
</LinearLayout>
Something like the following would work, but is not necessarily the most efficient way. What type of components are you wanting to insert? Basically, I created a horizontal LinearLayout, with child LinearLayouts with even weights. I set the gravity of these inner LinearLayouts to center their children within, so then your fixed width views go within at their proper sizes, centered evenly within.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<View
android:id="#+id/fixed_view_1"
android:layout_width="30dp"
android:layout_height="50dp"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<View
android:id="#+id/fixed_view_2"
android:layout_width="30dp"
android:layout_height="50dp"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<View
android:id="#+id/fixed_view_3"
android:layout_width="30dp"
android:layout_height="50dp"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<View
android:id="#+id/fixed_view_4"
android:layout_width="30dp"
android:layout_height="50dp"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<View
android:id="#+id/fixed_view_5"
android:layout_width="30dp"
android:layout_height="50dp"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<View
android:id="#+id/fixed_view_6"
android:layout_width="30dp"
android:layout_height="50dp"
/>
</LinearLayout>