After looking around for some time, I've yet to find a question that matches my problem. My issue is this, I have a ListView whose entries adhere to the following 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="wrap_content"
android:baselineAligned="false"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:orientation="horizontal"
android:descendantFocusability="blocksDescendants" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
amdroid:layout_weight="1"
android:orientation="vertical" >
...
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="vertical" >
...
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical" >
...
</LinearLayout>
</LinearLayout>
I would expect this to produce an entry in which the 1st nested layout gets 1/4 of the available width, the 2nd gets 1/2 of the width, and the 3rd gets 1/4 of the width. This isn't what happens, though; instead, the width of each nested layout is wrapped for some reason.
Interestingly, if I specify a particular width in the parent LinearLayout instead of "match_parent", the nested layout widths obey the weights as expected. For example, the following produces the expected result:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="290dp"
android:layout_height="wrap_content"
android:baselineAligned="false"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:orientation="horizontal"
android:descendantFocusability="blocksDescendants" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
amdroid:layout_weight="1"
android:orientation="vertical" >
...
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="vertical" >
...
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical" >
...
</LinearLayout>
</LinearLayout>
Obviously, though, specifying a particular width ignores the whole point of weights. So my question is this: why aren't the weights actually filling the parent LinearLayout when "match_parent" is used, and how can this be corrected?
Oh and one final point of interest, the graphical layout preview in Eclipse produces expected results when "match_parent" is used for the parent LinearLayout width. It's only when emulated or used on an actual device that the contents of the nested LinearLayouts get width-wrapped. I'm guessing that this is due to the layout's use inside of a ListView, but who knows?
Thanks
Alright, I feel dumb now; my suspicion was correct: the problem was with the ListView.
I had specified "wrap_content" for the ListView width in the layout that instantiates the ListView. Correcting the ListView width by specifying "match_parent" produces the expected results for the entry layout without relying on a hard-coded layout_width.
Related
As easy as it seems to be, as stubbornly this ListView won't center itself (or it's content within - doesn't matter to me).
This is activity layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.drobiazko.den.mobineon.MainActivity"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center_horizontal"
android:background="#drawable/bg">
<RelativeLayout android:id="#+id/clock_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<!--<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/holo_blue_dark">-->
<com.drobiazko.den.mobineon.ListViewRowsHeight
android:id="#+id/listview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:overScrollMode="never"
android:scrollbars="none"
android:divider="#null"
android:listSelector="#android:color/transparent"
android:persistentDrawingCache="scrolling|animation"
android:background="#android:color/holo_green_dark" />
<!--</RelativeLayout>-->
</LinearLayout>
This is ListView's item layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:id="#+id/btn_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="#style/custom_btn_icon" />
<TextView android:id="#+id/btn_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="#style/custom_btn_name" />
<TextView android:id="#+id/btn_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="#style/custom_btn_count" />
</RelativeLayout>
I've tried everything (including simplifying layout to max), but it still won't go.
Funny that the first relative layout clock_container - centers like a charm, due to parent LinearLayout's android:gravity="center_horizontal". Why won't ListView?
Added later:
Inspired by FOliveira's answer, I've done some investigation and found that:
everything works fine, parent LinearLayout has android:gravity="center_horizontal" and centers his children respectfully. The reason for ListView's children are left-aligned is that ListView takes all possible width despite his android:layout_width="wrap_content" attribute.
Anyone knows why is that?
First of all , i would remove the first linear layout and stay only with the relative layout as the parent.
After having the relative layout as the main parent , set the CENTER_IN_PARENT attribute to true.
The mistake you are making is that you are setting the gravity of Linear Layout child to center horizontal, which is correct, but the only children being affected by this option is the Relative layout itself.
I have a CircularMeter class which is derived from Button. The problem is that it is not resizing even if the weight given is 0.5 (ie. half the vertical screen).
<LinearLayout
android:id="#+id/WidgetDataLayout"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_alignParentTop="true"
android:layout_weight="0.5"
android:orientation="vertical"
android:layout_gravity="center_horizontal">
<com.test.CircularMeter
android:id="#+id/cm1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal" />
</LinearLayout>
Any Ideas ?
You can take help from this example to make your circularmeter fill half of the vertical screen
eg.
<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="fill_parent"
android:weightSum="1">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_weight="0.5"
android:background="#123456"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#123456"
android:text="#string/hello_world" />
</LinearLayout>
</LinearLayout>
There's no layout_weight in CircularMeter.
It's parent LinearLayout has both android:layout_alignParentTop="true" and android:layout_weight="0.5" which is not correct since layout_alignParentTop is a layout attribute for a RelativeLayout parent while android:layout_weightis an attribute for a LinearLayout parent. The layout XML does not show what is the parent layout actually is. android:layout_height="0dp" would make the layout invisible unless there really is a vertical LinearLayout as a parent.
Also note that layout_weight="0.5" won't make the view size half the screen. After doing first pass layout for a linear layout, the weight mechanism just distributes any remaining space in proportion of element weights. By default an element's weight is 0. So if you have just one element with non-zero weight, it will get all remaining space in its linear layout parent.
I separated the interface of my app in three areas: header, content and footer.
The header has a fixed size (it has only one image), while the footer and content have sizes that can vary.
In devices with higher resolutions I thought to insert the header and footer on the screen, and reserve any free space for the content area.
In devices with low resolutions thought of putting the content length as little as possible (something like wrap_content) and insert the footer below (requiring the user to perform scroll to view the footer).
The best I got was using RelativeView:
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:id="#+id/header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentTop="true" >
(...)
</LinearLayout>
<LinearLayout
android:id="#+id/footer"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentBottom="true" >
(...)
</LinearLayout>
<FrameLayout
android:id="#+id/content"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/footer"
android:layout_below="#+id/header"
android:lay >
(...)
</FrameLayout>
</RelativeLayout>
For resolutions larger works as expected, the problem is that for small resolutions: the content is less than it should, because it takes the space between the header and footer.
How can I solve the problem?
I could not find another way to get content assuming all the free space of the screen (in large resolutions), because I can not simply use fill_parent, since the content is between the header and footer.
I also tried using min-height, but without success.
Top level RelativeLayout layout_height make that fill_parent.
Then FrameLayout remove the layout_above property, just saying it's below the header should be enough.
Finally, FrameLayout may be causing the problem as it's normally used when only 1 element is on the screen and it fills the screen. Try replacing this with a LinearLayout. I've done something exactly like what you want in one of my apps, the layout is (keep in mind in my case I swap out the FrameLayouts for Fragments which are LinearLayout or RelativeLayout based.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainBack"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/transparent" >
<FrameLayout
android:id="#+id/headerFrag"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:id="#+id/homeAdMsgFrag"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" />
<ListView
android:id="#+id/contactList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/homeAdMsgFrag"
android:layout_alignParentLeft="true"
android:layout_below="#id/headerFrag"
android:background="#color/transparent"
android:cacheColorHint="#color/transparent" >
</ListView>
</RelativeLayout>
Some days before I also faced this issue, to solved what I did that I created Header.xml and footer.xml and included this two xml in my all others activities xmls because this two are common in all others activities.
To meet global resolution issue, I used weightsum and weight, applying weight will fixed your header and footer area and content area too.
This way I done in my one of project to resolve this issue, just try it, hope it will works for you.
EXAMPLE
<LinearLayout
android:weightSum="10"
android:orientation="vertical"
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:id="#+id/header"
android:layout_width="fill_parent"
android:layout_weight="2"
android:layout_height="0dp"
android:orientation="vertical" >
(...)
</LinearLayout>
<FrameLayout
android:id="#+id/content"
android:layout_width="fill_parent"
android:layout_weight="6"
android:layout_height="0dp">
(...)
</FrameLayout>
<LinearLayout
android:id="#+id/footer"
android:layout_width="fill_parent"
android:layout_weight="2"
android:layout_height="0dp"
android:orientation="vertical" >
(...)
</LinearLayout>
</LinearLayout>
Thanks.
As it seems the GridLayout will always push its children to layout corresponding to their needs. for instance the following declaration:
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnCount="3"
android:orientation="vertical"
android:rowCount="4"
android:useDefaultMargins="true" >
...
<ImageView
android:id="#+id/main_image"
android:layout_column="1"
android:layout_columnSpan="2"
android:layout_row="3"
android:scaleType="fitStart" />
</GridLayout>
The GridLayout declares fill_parent and as such I would expect it to not overflow. The GridLayout should take the size of the parent which in this case is the window (full height). However in hierarchy viewer the GridLayout is set as Wrap_content for both vertical and horizontal.
As such the ImageView (which is a large image) or any text view will be push to fit themself and as such overflow the container.
This can be seen within the hierarchy viewer where the container grid view fits the parent:
while the image view overflow
Reading the documentation, I understand there is a need to set gravity. As far as I can try, I used all kinds of gravity options and image scaling options without much effect. Removing the margins with useDefaultMargins="false" does change the layout overflow which leads the issue towards gridlayout.
My question follows:
Is this a bug or am I using the GridLayout incorrectly
How can I force the GridLayout's children to fit their container and to fill
remaining spaces
The trick in other layouts is to give the first element an android:layout_weight="1.0" and nothing to the other elements. Why it works I have no idea, but it does. Here's a simple XML that displayed an ImageView, a TextView and a Button. Without the layout_weight parameter assigned to the ImageView the text and button were shifted down.
<?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:background="#color/white"
android:orientation="vertical"
android:keepScreenOn = "true" >
<ImageView
android:id="#+id/imageView_surprise"
android:layout_width="wrap_content"
android:layout_height="0dip"
android:scaleType="centerInside"
android:contentDescription="#string/accessibility_imageView_surprise"
android:layout_weight="1.0" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="bottom" >
<TextView
android:id="#+id/textView_message"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#color/black"
android:textSize="24sp"
android:gravity="center_horizontal" />
<Button
android:id="#+id/button_share"
style="#style/button_text"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
I'm having trouble figuring out why my image isn't within the bounds of my imageview. Instead, it is floating off to the left and hidden. Is this only because the Graphical Interface doesn't show it?
EDIT:
I edited the original code to more clearly show the issue i'm having and added a picture(i want the image to show in the red box):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:id="#+id/top_container"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
>
<View
android:layout_height="fill_parent"
android:layout_width="0dp"
android:layout_weight="195"
android:background="#00FF00"/>
<ImageView
android:id="#+id/img"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ff0000"
android:src="#drawable/img" />
<View
android:layout_height="fill_parent"
android:layout_width="0dp"
android:layout_weight="1"
android:background="#0000FF"
/>
</LinearLayout>
</LinearLayout>
Ok I have it working. The height attribute of "block_container" is set to a random 200dp you WILL want to change the height to whatever your needs are, or potentially set it to "wrap_content". I tested this on emulator and device.
I am also assuming that you want all three block to be equally spaced. Notice how the parent "block_container" has a weight_sum of 9? Well the children are equal widths because they have a weight of 3 each (3 blocks * 3 weight each = 9 weight total).
I noticed before it looks like you were trying to use weight as width directly e.g. a weight of 569. Just remember weight != width directly.
EDIT: added the missing id attributes from some of the views
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/top_container"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
android:id="#+id/block_container"
android:layout_width="fill_parent"
android:layout_height="200dp"
android:orientation="horizontal"
android:weightSum="9"
>
<View
android:id="#+id/left_block"
android:layout_height="fill_parent"
android:layout_width="0dp"
android:layout_weight="3"
android:background="#00FF00"/>
<ImageView
android:id="#+id/img"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="3"
android:background="#ff0000"
android:src="#drawable/logo" />
<View
android:id="#+id/right_block"
android:layout_height="fill_parent"
android:layout_width="0dp"
android:layout_weight="3"
android:background="#0000FF"
/>
</LinearLayout>
</LinearLayout>
Why are you setting android:layout_height to be 0dp? I can't even get it to display unless I change this to something like fill_parent.
Either way, its because of your layout_weight for the parent LinearLayout. Specify a larger layout_weight for your ImageView and it will come into view.
<ImageView
android:id="#+id/my_img"
android:gravity="center"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="279"
android:src="#drawable/my_img" />
This worked for me.. but math might not be right.
I don't know where to begin with the issues with what you posted, some simple observations before even debugging further:
Your layouts ALL need ids (e.g. android:id="#+id/another_layout")
You have a width on the second linear layout of 0dp
Your first linear layout has a height of 0 dp, combined with the previous I'm surprised it renders at all
The last inner linear layout again has a width of 0dp
What are you trying to achieve? To me there seems to be a lot of layouts unless you have removed some elements to make it easier to understand? You could post a simple image of what you are trying to do then perhaps we can help you refine the markup?