I'm getting two differents behavior for a ListActivity row. Eclipse Graphical Layout show the right behavior, but at runtime, on the device, the layout:weight doesn't seem to work properly and the Textview is resized to the minimum width, depending on the text property.
This is how I had setup the layout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="60dp"
android:background="#color/defaultBg"
android:orientation="horizontal">
<ImageButton
android:id="#+id/myButton"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_marginLeft="5dp"
android:layout_weight="2"
android:src="#drawable/ic_launcher"/>
<TextView
android:id="#+id/myText"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_margin="5dp"
android:background="#2288EE"
android:layout_weight="6" android:text="Hello" android:textColor="#android:color/white"/>
</LinearLayout>
EDIT: I just found that the LinearLayout doesn't fill the listRow width. I'm still trying to find how to solve
Any help will be very appreciated.
I fix the issue myself. The problem wasn't in the table row layout posted above. The problem was in the android:layout_width of the parent ListView which was set to 'wrap_content' instead of 'fill_parent'.
Thanks to everyone who offered his contribute!
In your LinearLayout put android:weightSum="8". It should do the trick, on my device works fine.
Try adding android:scaleType="fitCenter" to your ImageButton. If I'm not mistaken, your source Drawable is too big, therefore making the ImageButton take too much horizontal space.
Related
UPDATING the question: I know that LinearLayout is much better and already implemented it with linear.
I have an educational task that requires RelativeLaouyt implementation.
Please, don't comment about Linear layout, this is not the purpose of my question.
I know that it much easier in LinearLayout, but I have to implement it with RelativeLayout only.
I have 3 buttons in my xml file and want them on the same line and to have the same width that equals to 1/3 of the screen.
(I found here a nice solution for 2 buttons using a "fake" view. But it doesn't work for 3 buttons.)
Any ideas? (relative layout only!)
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_margin="10dp">
<Button
android:id="#+id/bottom_left"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Left"/>
<Button
android:id="#+id/bottom_center"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:layout_centerInParent="true"
android:text="Center"/>
<Button
android:id="#+id/bottom_right"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:layout_alignParentRight="true"
android:text="Right"/>
</RelativeLayout>
With reference to your link provided for 2 buttons, you can also use the same for 3 buttons using Relative layout.
The answer could be, set 3 different properties of relative layout to each view.
For instance,
Button 1: alignParentLeft true
Button 2: centreInParent true
Button 3: alignParentRight true
You are partially right, centerInParent is the property you need.
Thanks.
please help me, how to align the height to width. I've tried everything, it is not working.
Edit: Added full layout.
The code to create the button looks like this
LinearLayout showLayout = (LinearLayout) view.findViewById(R.id.show_full_btn);
showButton = new ImageButton(activityContext);
<LinearLayout
android:id="#+id/top_layout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.3"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/count"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.1"
android:orientation="vertical">
</LinearLayout>
<TextView
android:id="#+id/w_tv"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.8"
android:typeface="normal"/>
<LinearLayout
android:id="#+id/show_full_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.1"
android:scaleType="fitXY"
android:orientation="horizontal">
</LinearLayout>
</LinearLayout>
Thanks.
You are giving android:scaleType to a LinearLayout which is not applicable, it works with ImageButtons, so declare your view as an ImageButton instead and apply scalyType to it, or if you kinda stuck with a layout, just make as this answer says:
Try using FrameLayout with an ImageView and LinearLayout inside. For
example, try changing the alpha of the image and move it to foreground
in your FrameLayout, thus the LinearLayout stays on background.
If you're finding it difficult to get your results from the XML layout, then try to do it within the onCreate method of your activity. You can easily get it done.
You are talking about an ImageButton in your question, but have not used an ImageButton in your XML, just LinearLayout. Also, in your java, the showLayout and showButton are two separate variables, and not connected.
I am writing an Android game. In the level selection activity's layout file, I want to layout the levels' buttons (They are actually ImageViews) like this:
x x x
x x x
And each level button has a TextView, with that level's name as the text, below it (Let's call these two views together as a "level choice"). I used a lot of LinearLayouts to do this. Here is the code for a level choice:
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal"
android:layout_weight="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/angles"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/angles_level"
android:textSize="#dimen/level_text_size"/>
</LinearLayout>
As you can see, the two views' height and width are all wrap_content. But when I look at the designer, the text view doesn't show up.When I select the text view in the component tree, it shows where the text view is:
P.S. The picture isn't showing all six levels because I haven't made them yet.
As you can see, the text view is right at the bottom! When I select the ImageView, it shows that it is occupying all the space of its parent!
I don't know why this is happening, my image is certainly a square! Can you explain why this is happening and how do I fix it?
If you need my whole layout code, feel free to tell me in the comments.
For me, the best solution is to position and size it properly by code (where you have total control) instead of xml.
Anyway, i think your problem can be solved by setting ImageViews ScaleType
imageView1.setScaleType(ScaleType.FIT_START);
By XML:
android:scaleType="fit_start"
Hope this helps.
I use background color for textview when I'm studying the layout.
If you use wrap content in both dimension for TextView, that is invisible since you did not write any text inside it. wrap content means that the view take the minimum space. And no text means 0px; try to set ImageView and TextView with layout_weight 1 and layout_height 0dp. In this way both view take half of space of parent layout
Because right now, your LinearLayout doesn't know how to distribute the ratio of its children. And in fact, your imageview's wrap content already
consumes the whole space.
So, LinearLayout says "Sorry TextView, you have no space left".
Use layout_weight to both of the children.
I guess you want to have your picture twice the size of your text.
2:1
That is,
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal"
android:layout_weight="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=2
android:src="#drawable/angles"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=1
android:text="#string/angles_level"
android:textSize="#dimen/level_text_size"/>
</LinearLayout>
I just realized that I posted a question about ImageViews leaving out too much whitespace:
LinearLayout leaving out too much white space. Why?
I think this is the same as that problem. So I tried setting adjustViewBounds to true in the xml. And it works! Now the image view look like this:
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/parallel_lines"/>
You can use relative layout
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/angles"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/angles_level"
android:textSize="#dimen/level_text_size"/>
</RelativeLayout>
or simple you can set background of textview to that image by putting this
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/angles_level"
android:background="#drawable/angles"
android:textSize="#dimen/level_text_size"/>
[Second Edited]
I found where problem is. But i dont know why its doing. It cant be margin on LinearLayout (or just marginLeft). Does anybody know why it cant have ?
[EDITED]
Hello i have xml file in layout like bellow.And iam adding TextViews from any xml layout to horizontal LinearLayout. This layout structure is given and i cant change it.
And last added TextView is streching always verticaly. I dont know why i am in tottaly despair. Too many hours i was try* that but without no idea. I know just its not in programicaly adding TextViews ..
If some body know why its doing i will be thankful.
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/back_border"
>
<RelativeLayout
android:id="#+id/manager_view_table_header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
>
<LinearLayout
android:id="#+id/layout_for_textViews"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="6px"
android:layout_alignParentTop="true"
android:gravity="center_vertical"
android:background="#drawable/back_border"
>
<!-- horizontal layout, HERE IAM ADDING TEXTVIEWS -->
</LinearLayout>
</RelativeLayout>
<!--What is here its no important
because, there is RelativeLayout with alignBellow relative layout before -->
</RelativeLayout>
and TextView witch iam addig to LinearLayout:
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="15sp"
android:paddingRight="7px"
android:paddingLeft="7px"
android:paddingTop="3px"
android:paddingBottom="3px"
android:layout_marginLeft="5px"
android:gravity="center_horizontal"
android:background="#drawable/background_table"
android:textColor="#330033"
android:text="Some text"
/>
Try to replace the android:layout_margin="6px" from the LinearLayout by android:padding="6px".
I think this will solve your problem. I mean the new LInearLayout should be like this:
<LinearLayout
android:id="#+id/layout_for_textViews"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="6px"
android:layout_alignParentTop="true"
android:gravity="center_vertical"
android:background="#44ff435f"
>
I am confused with your three layouts. Wat's the porpose of all thses nested layouts, try to recreate the text views with a single relative layout, and use the android:layout_above and android:layout_below for placing the text views.
First of all you need to refactor this code.
You might want to use actual ListView to create repeated elements.
and why is xmlns:android="http://schemas.android.com/apk/res/android" declared thrice in this xml code, when it is actually required just once at top root element.
Even with this layout to solve your problem, if other things are not working a nice idea would be to switch to Graphic layout(bottom tab in eclipse when on .xml file) and manually try to set the third TextView (not listview) height manually, you can observe the changes then and finalize them accordingly..
I have a n app widget that is pretty much working, with one quirk. I've got a LinearLayout in the widget, and I can add rows of my data to it just fine. There doesn't seem to be any obvious way for me to tell how big the linear layout is and if a given row will fit, so I just add the entire data set (since it isn't very large). The text in my layout gets cropped at the bottom, which is what I'd expect. However, the ImageView next to it is not being cropped, but is instead being scaled. It, frankly, looks goofy.
If there's a way for me to tell if a row will fit in my LinearLayout, that would be great. If there's a way I can tell it to just crop my image, that would be fine too. This is what the cropping looks like.
The layout for the rows I'm adding (if there's a goof here, it's probably from the anonymization I applied):
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/checkbox"
android:layout_width="28sp"
android:layout_height="28sp"
android:src="#drawable/check_off"
android:layout_marginLeft="5dp"
android:layout_marginTop="1dp"
android:layout_alignParentLeft="true"/>
<TextView
android:id="#+id/textview"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textSize="16sp"
android:minHeight="28sp"
android:paddingLeft="5dp"
android:layout_centerVertical="true"
android:layout_alignWithParentIfMissing="true"
android:layout_toRightOf="#id/checkbox"/>
</RelativeLayout>
EDIT: The container for the rows is just a simple LinearLayout:
<LinearLayout
android:id="#+id/list_items"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_above="#id/logo"
android:layout_marginBottom="4dp"
android:padding="1dp"
android:orientation="vertical"
android:background="#drawable/widget_background"/>
Try adding a scaletype to your ImageView:
android:scaleType="centerCrop"
or
android:scaleType="fitCenter"
or any of the other options listed here:
http://developer.android.com/reference/android/widget/ImageView.ScaleType.html
It turns out that giving the RelativeLayout that corresponds to the row a specific height (30sp, for this layout) instead of "wrap_content" fixed the problem. The image now crops correctly.