android - another android UI question - android

I have a scrollview ( mainly for landscape purposes, as I don't have a different xml file, I'm using android:configChanges="orientation")
which contains a RelativeLayout and within it there's a Linear Layout.
The code looks like this:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:background="#color/background"
android:padding="10dip" android:layout_width="fill_parent"
android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout android:layout_height="fill_parent"
android:layout_width="fill_parent">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_gravity="center"
android:orientation="vertical">
<TextView android:textSize="24.5sp" android:textStyle="bold"
android:layout_height="wrap_content" android:layout_gravity="center"
android:text="#string/main_title" android:layout_width="wrap_content">
</TextView>
<ImageView android:src="#drawable/icon"
android:layout_marginTop="20px" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_gravity="center" />
<TextView android:textSize="15sp" android:layout_marginTop="20px"
android:layout_height="wrap_content" android:text="#string/time_window_please_select_label"
android:layout_width="wrap_content"></TextView>
<Spinner android:layout_height="wrap_content" android:id="#+id/spinner"
android:prompt="#string/time_window_prompt" android:layout_width="fill_parent"></Spinner>
<Button android:layout_height="wrap_content"
android:layout_marginTop="20px" android:id="#+id/start_button"
android:text="#string/start_label" android:layout_width="fill_parent"></Button>
<TextView android:layout_height="wrap_content"
android:layout_marginTop="20px" android:id="#+id/status_label"
android:layout_width="wrap_content"></TextView>
<TextView android:layout_height="wrap_content"
android:layout_marginTop="20px" android:id="#+id/status_time_label"
android:layout_width="wrap_content">
</TextView>
</LinearLayout>
<ImageView android:id="#+id/info_button" android:src="#drawable/info"
android:layout_alignParentBottom="true" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_gravity="bottom|right" />
</RelativeLayout>
</ScrollView>
Everything works fine, both in portrait and loandscape mode except for the ImgView (info_button) at the very end.
I used a Relative Layout because I thought I'd be able to position it on bottom right hand corner (a bit of margin would be desirable bottom and right) of the screen...
This is what I get instead...
http://www.doc.ic.ac.uk/~am907/wrong.png
any help appreciated!
EDIT: The link to the full XML file http://pastebin.com/Cce4AC4v (for some reason I can't see it all in preview mode but it's there when I try to re-copy in the text form)
Thanks
andreas

Instead of:
android:layout_gravity="bottom|right"
Try:
android:layout_alignParentRight="true"
Edit: Reading your question again, I believe the problem is the ScrollView. I'm not sure why you are using this type of layout. You could get rid of it in favor of the relative layout and that should solve your problem. I'm not sure why you feel this activity needs to support landscape. If so, I would boil the ScrollView down to a single view object and try to troubleshoot that.

I have understood that u want to place that image at bottom - right location. If so, then give:
<ImageView android:id="#+id/info_button" android:src="#drawable/info"
android:layout_alignParentBottom="true" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_alignParentRight="true" />
If this is not the solution, could you place ur desired screen to be prepared, so that we can cross check ur layout.

Related

Android Rotation Hide some Widgets

this my xml file of an activity. It works well except in the case of rotation. In my mobile, if AutoRotation is enabled, then the screen is also rotated. During rotation it doesn't show the Button named "Exit". I've tried to scroll to bottom, but I can't able to scroll.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scrollbars="none" >
<AbsoluteLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/ll_buttons"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical|center_horizontal"
android:layout_below="#+id/slogon"
android:layout_marginTop="50dip">
<ImageView
android:id="#+id/image1"
android:layout_width="match_parent"
android:layout_height="481dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:background="#drawable/ic_launcher" />
</LinearLayout>
<Button android:layout_height="wrap_content" android:textColor="#FF0000" android:textStyle="bold" android:id="#+id/button2" android:layout_width="wrap_content" android:text="EXISTINGFARMER" android:layout_x="161dip" android:layout_y="157dip"></Button>
<Button android:layout_height="wrap_content" android:textColor="#FF0000" android:textStyle="bold" android:id="#+id/button1" android:layout_width="wrap_content" android:text="NEW FARMER" android:layout_x="34dip" android:layout_y="157dip"></Button>
<Button android:layout_height="wrap_content" android:textColor="#FF0000" android:textStyle="bold" android:id="#+id/btn_exit" android:layout_width="100dip" android:text="EXIT" android:layout_x="105dip" android:layout_y="233dip"></Button>
<TextView android:layout_height="wrap_content" android:textStyle="bold" android:textSize="40dip" android:layout_width="wrap_content" android:textColor="#FFEA00" android:id="#+id/heading" android:text="S.V.Sugar Mills" android:layout_x="29dip" android:layout_y="14dip"></TextView>
<TextView
android:id="#+id/subheading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="38dp"
android:layout_y="97dp"
android:text="The New and Old Farmer Details."
android:textColor="#0000A0"
android:textSize="15dip"
android:textStyle="bold" />
</AbsoluteLayout>
</ScrollView>
I didn't understand the mistake, I someone know how to scroll during rotation, please help help me. Thanks in advance
First of all you have to put your all the widgets in scrollview if you want to support scroll in portrait or landscape mode.
Please use scrollview . Scrollview supports only one direct child. So you need to take relative layout or linear layout as child of scrollview, put all your widget controll in that child layout.
Look here for scrollview tutorial.

Why two items in the same relative layout are differently layouted?

I have a listview with item specified by RelativeLayout
There is an image (gray arrow, this is png, with transparent padding). In first case text with blue back overlaps this image, in second - it is aligned.
The only difference between these cases is that left photo is invisible in first case. I do not understand why in second case the blue text does not overlap gray arrow? (it is desirable behavior)
<?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="wrap_content"
android:padding="#dimen/padding_content">
<ru.ip_news.ui.views.RationalImage
android:id="#+id/picture"
android:layout_width="#dimen/article_short_image_width"
android:layout_height="fill_parent"/>
<View
android:id="#+id/separator"
android:layout_width="#dimen/padding_content"
android:layout_height="fill_parent"
android:layout_toRightOf="#id/picture"/>
<ImageView
android:id="#+id/dis_ind"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="#drawable/dis_ind"/>
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/separator"
android:layout_toLeftOf="#id/dis_ind"
android:layout_gravity="left"
android:textStyle="bold"
android:textColor="#color/article_text_main"
android:maxLines="2"
android:ellipsize="end"
android:background="#F0F0"/>
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/separator"
android:layout_below="#id/title"
android:layout_alignParentBottom="true"
android:textColor="#color/article_text_secondary"
android:maxLines="4"
android:background="#F00F"/>
</RelativeLayout>
I've never worked with Android coding before, but just from looking at your code I'd say there's a conflict between android:layout_alignParentRight="true" found here:
<ImageView
android:id="#+id/dis_ind"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="#drawable/dis_ind"/>
and your android:layout_alignParentBottom="true" found here:
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/separator"
android:layout_below="#id/title"
android:layout_alignParentBottom="true"
android:textColor="#color/article_text_secondary"
android:maxLines="4"
android:background="#F00F"/>
I've never worked with the code base before and don't have a "solution" for you, but maybe it'll get you a starting point.
Since the picture no longer exists in the top view , the layout has become smaller so the textviews are closer. Put some margin between the two text views to fix the issue.
Resolved the problem by extracting linearlayout and moving photo to it. For some reason this photo in the same layout involves space between texts.
<?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:padding="#dimen/padding_content">
<ru.ip_news.ui.views.RationalImage
android:id="#+id/picture"
android:layout_width="#dimen/article_short_image_width"
android:layout_height="fill_parent"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="#dimen/padding_content">
<ImageView
android:id="#+id/dis_ind"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="#drawable/dis_ind"/>
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/dis_ind"
android:layout_gravity="left"
android:layout_alignParentLeft="true"
android:textStyle="bold"
android:textColor="#color/article_text_main"
android:maxLines="2"
android:ellipsize="end"/>
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/title"
android:layout_alignParentBottom="true"
android:textColor="#color/article_text_secondary"
android:maxLines="4"/>
</RelativeLayout>
</LinearLayout>

RelativeLayout margin problem, text bleeding into other "fields"

been trying to figure out Android layouts and having a bit of an issue. i got as far as figuring out how to get the objects in the places i want, using a RelativeLayout (tried LinearLayout and TableLayout combinations, only to find that gravity and attributes weren't doing things i thought they would...) but i've run into an issue with text bleeding behind other text.
the second item demonstrates the problem. i'd like to have this same layout without the text bleeding. here is my code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="?android:attr/listPreferredItemHeight"
android:layout_width="wrap_content"
android:padding="6dip">
<TextView android:id="#+id/item_text_product"
android:layout_alignParentLeft="true"
android:textSize="24sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/item_text_total"
android:layout_alignParentRight="true"
android:textSize="18sp"
android:textStyle="bold"
android:textColor="#00aa00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/item_text_count"
android:layout_alignParentRight="true"
android:layout_below="#id/item_text_total"
android:textSize="12sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/text_count"
android:text="Count: "
android:textSize="12sp"
android:layout_toLeftOf="#id/item_text_count"
android:layout_alignBaseline="#id/item_text_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
Put first your item_text_count and text_count items (I mean, put them above the text_count in the XML)... then:
<TextView android:id="#+id/item_text_total"
android:layout_alignParentRight="true"
android:layout_toLeftOf="#id/text_count"
android:textSize="18sp"
android:textStyle="bold"
android:textColor="#00aa00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
As you see, the difference is android:layout_toLeftOf="#id/text_count".
Set a maxEms attribute on the product TextView so that it's width can never exceed n ems.
That way should be the best solution.
I think you just have to add android:layout_toRightOf="#id/item_text_product" to the second textView, but can't try it right now.
The issue is with wrap_content, with it the view is going to expand to fit its content.
What about shrinking the text and using nested Linear Layouts?
You might try and use a LinearLayout if you don't want overlapping behavior.
Something like:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="?android:attr/listPreferredItemHeight"
android:layout_width="wrap_content"
android:padding="6dip">
<TextView android:id="#+id/item_text_product"
android:textSize="24sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView android:id="#+id/item_text_total"
android:layout_alignParentRight="true"
android:textSize="18sp"
android:textStyle="bold"
android:textColor="#00aa00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/item_text_count"
android:layout_alignParentRight="true"
android:layout_below="#id/item_text_total"
android:textSize="12sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/text_count"
android:text="Count: "
android:textSize="12sp"
android:layout_toLeftOf="#id/item_text_count"
android:layout_alignBaseline="#id/item_text_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
</LinearLayout>
layout_weight="1" causes that view to expand to fill the available space not taken up by the right-hand views.

android - linearlayout in scrollview

Since my UI is quite simple I'd like to cater for both landscape and portrait in one xml file.
In portrait mode everything is as I exactly want it to be.
In landscape the main_title TextView is barely shown. Is there a work around for this?
<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:background="#color/background"
android:layout_width="fill_parent" android:padding="20dip"
android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout android:layout_height="fill_parent"
android:layout_gravity="center" android:orientation="vertical"
android:layout_marginTop="30dip" android:id="#+id/LinearLayout01"
android:layout_width="fill_parent">
<TextView android:layout_marginBottom="15dip"
android:textSize="24.5sp" android:layout_height="wrap_content"
android:id="#+id/TextView01" android:layout_gravity="center"
android:text="#string/main_title" android:layout_width="wrap_content"></TextView>
<Button android:layout_marginBottom="15dip"
android:layout_height="wrap_content" android:id="#+id/start_button"
android:text="#string/start_label" android:layout_width="fill_parent"></Button>
<TextView android:textSize="18sp" android:layout_height="wrap_content"
android:id="#+id/TextView02" android:text="#string/time_window_please_select_label"
android:layout_width="wrap_content"></TextView>
<Spinner android:layout_height="wrap_content" android:id="#+id/spinner"
android:prompt="#string/time_window_prompt" android:layout_width="fill_parent"></Spinner>
<TextView android:layout_height="wrap_content"
android:layout_marginBottom="10dip" android:id="#+id/status_label"
android:layout_width="wrap_content"></TextView>
<TextView android:layout_height="wrap_content"
android:layout_marginBottom="10dip" android:id="#+id/status_time_label"
android:layout_width="wrap_content">
</TextView>
<ImageView android:layout_marginTop="60dip" android:id="#+id/info_button"
android:src="#drawable/info" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_gravity="bottom|right" />
</LinearLayout>
</ScrollView>
Links:
http://www.doc.ic.ac.uk/~am907/landscape.png
http://www.doc.ic.ac.uk/~am907/portrait.png
looks like the problem lies with your margin and padding values.
best option may be to have 2 different layouts for this, 1 being portrait and other being landscape. create another folder named layout-land and layout-port in your res folder. then copy the layout file into both of these folders and make appropriate changes for the orientation.
see the android docs for more info about providing different resources for different orientations and so on: http://developer.android.com/guide/topics/resources/providing-resources.html#AlternativeResources
add a blank textview at the top of the file, ie above the textview which is not visible. maybe your content area is very big and the screen is not able to support it. The problem that you are facing should not be happening in the first place.... but this is a work around. Also try switching emulators...

Why are some of my views not aligned correctly at the bottom of my relative layout?

I have problems getting some of my views aligned in a relative layout that I use inside a row of my listview.
Here is a screenshot from the layout builder in Eclipse, this is what I think it should look like:
(source: janusz.de)
The next image is from the emulator. Now the TestTestTest View is at the top and covers the name and distance Textviews.
(source: janusz.de)
This is my layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:padding="4dip">
<ImageView android:id="#+id/logo" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:adjustViewBounds="true"
android:scaleType="centerInside" android:src="#drawable/icon"
android:layout_centerVertical="true" android:layout_alignParentLeft="true"
android:background="#color/green" />
<TextView android:id="#+id/distance" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Distance"
android:layout_alignParentRight="true" android:layout_alignParentTop="true"
android:paddingRight="4dip" android:background="#000000" />
<TextView android:id="#+id/name" android:layout_width="fill_parent"
style="#style/ListHeadText" android:layout_height="wrap_content"
android:text="Name"
android:layout_alignTop="#id/distance" android:layout_toRightOf="#id/logo"
android:layout_toLeftOf="#id/distance" android:gravity="clip_horizontal"
android:lines="1" android:paddingLeft="4dip" android:background="#color/red" />
<TextView android:id="#+id/number" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Number"
android:paddingRight="4dip" android:layout_alignRight="#id/distance"
android:background="#color/darkred" android:layout_below="#id/distance" />
<TextView android:id="#+id/subcategory" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Subcategory"
android:paddingLeft="4dip" android:layout_alignLeft="#id/name"
android:lines="1" android:gravity="clip_horizontal"
android:layout_below="#id/distance" android:background="#color/green" />
<TextView android:id="#+id/test" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:text="TestTestTest"
android:paddingLeft="4dip"
android:layout_alignParentBottom="true" android:gravity="bottom"
android:background="#color/red" />
Shouldnt align_parent_bottom put the view at the bottom of the cell in the list?
Try adding android:layout_alignParentLeft="true" as well; sometimes Views aren't displayed properly if it can't anchor the view with at least 2 points. Also, is this RelativeLayout used within a ListView? If so, you might find you have some difficulty getting it to look right. There was another question where someone was having a problem where the RelativeLayout looked right on its own, but not once it was included as part of a ListView. We didn't manage to figure out what went wrong so he had to use nested LinearLayouts instead.

Categories

Resources