How would I use a ScrollView inside a FrameLayout? - android

I'm having a lot of trouble getting my ScrollView to function properly. I'm using a Master-Detail design. The Master scrolls, since it's a listView. The Detail when selected will display the scrollbar implemented in my XML for a couple seconds when the Activity is inflated before disappearing (Stackoverflow won't allow me to post the screenshot of the error since this is my first post)
When I try to scroll the Detail Activity with touch input nothing happens. I've tried copying and pasting Mel's solution to what seems like an identical problem in the post at ScrollView doesn't work. I've also tried every conceivable combination of match_parent and fill_parent for the parent, child, and ScrollView itself. Any help is appreciated. My XML code is below:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/item_detail_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ItemDetailActivity"
tools:ignore="MergeRootFrame">
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:fillViewport="true"
>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/linearLayout"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="5dp"
android:layout_marginTop="20dp"
android:stretchColumns="1, 2"
>
<ImageView
android:id="#+id/picture"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:src="#drawable/bmp1"
android:layout_alignParentTop="true"
/>
<TableLayout
android:id="#+id/tableLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:layout_marginTop="20dp"
android:stretchColumns="1, 2">
<!-- Table Row 0 -->
<TableRow
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="#+id/tableRow0">
<TextView
android:id="#+id/priWeapon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/priWeapon" android:textColor="#000" android:textStyle="bold"
android:gravity="left"
android:padding="5dp"/>
<EditText
android:id="#+id/priWeaponEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/NA" android:textSize="14sp" android:textStyle="bold"
android:gravity="center"
android:focusable="false"
android:layout_weight="1"
android:cursorVisible="false"
android:longClickable="false"/>
</TableRow>
<!-- Table Row 1 -->
<TableRow
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="#+id/tableRow1">
<TextView
android:id="#+id/priWeaponRange"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/priMaxRange" android:textColor="#000"
android:gravity="left"
android:padding="5dp"/>
<EditText
android:id="#+id/priWeaponRangeEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/NA" android:textSize="14sp"
android:gravity="center"
android:focusable="false"
android:layout_weight="1"
android:cursorVisible="false"
android:longClickable="false"/>
</TableRow>
</TableLayout>
</LinearLayout>
</ScrollView>
</FrameLayout>

I found a solution! Instead of trying to apply the formatting to the Activity XML itself, I cut and pasted it into one of the Activity's Fragment XMLs, which didn't have a frameLayout. Because of this change it now scrolls perfectly while maintaining the title bar on top throughout the scroll, exactly the behavior that I wanted. I've posted the final code below. If you have a solution that would still allow me to use a scrollView inside a FrameLayout though I'd be more than happy to see it for future reference. Thank you for your help!
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:fillViewport="true"
>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/linearLayout"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="5dp"
android:layout_marginTop="20dp"
android:stretchColumns="1, 2"
>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/item_detail"
style="?android:attr/textAppearanceLarge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp"
android:textIsSelectable="true"
tools:context=".ItemDetailFragment"/>
<ImageView
android:id="#+id/picture"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:src="#drawable/bmp1"
android:layout_alignParentTop="true"
/>
<TableLayout
android:id="#+id/tableLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:layout_marginTop="20dp"
android:stretchColumns="1, 2">
<!-- Table Row 0 -->
<TableRow
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="#+id/tableRow0">
<TextView
android:id="#+id/priWeapon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/priWeapon" android:textColor="#000" android:textStyle="bold"
android:gravity="left"
android:padding="5dp"/>
<EditText
android:id="#+id/priWeaponEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/NA" android:textSize="14sp" android:textStyle="bold"
android:gravity="center"
android:focusable="false"
android:layout_weight="1"
android:cursorVisible="false"
android:longClickable="false"/>
</TableRow>
</TableLayout>
</LinearLayout>
</ScrollView>

Your goal is to use the maximal screen size for the ImageView and then scroll down to the (at first invisible) TableLayout? Thats afaik not possible. When you set android:layout_height="fill_parent" on ImageView it uses the the maximum possible (in your example all of the screen size) space. So no TableLayout is rendered and there is no need for scrolling. You should set the android:layout_height="wrap_content" in the ImageView.
Some notes on the source code:
Use match_parent instead of fill_parent. It's renamed since API Level 8
You have a useless android:layout_below="#id/picture" in the TableLayout. May an artifact from a previous version with RelativeLayout?
Remove the namespace definitions in the TableLayout

Related

Android TextView Text wont wrap on Listview

hello i am trying to wrap a textview that has a long text. but when i test it, it just goes beyond the screen. What im trying to do is it will go to the next line if the text is long and it automatically adjust the layout. I am using this in a listview.
i am referring to this old question Android TextView Text not getting wrapped, it works on him so i tried to implement it but it wont effect on mine. thanks for answering.
here's my XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:background="#e6e6e6"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="10dp">
<LinearLayout
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:orientation="vertical" android:padding="4dip"
android:layout_weight="1">
<TextView
android:id="#+id/tv_reviewer_name"
android:textSize="16sp"
android:textAppearance="?android:textAppearanceLarge"
android:text="Reviewer Name"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_marginTop="5dp"
android:id="#+id/tv_review_details"
android:textSize="16sp"
android:textAppearance="?android:textAppearanceSmall"
android:text="Review"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:width="0dip"/>
</LinearLayout>
</LinearLayout>
UPDATE
here's my listview:
<ListView
android:divider="#android:color/transparent"
android:dividerHeight="2.0sp"
android:id="#+id/lv_reviews"
android:background="#f2f2f2"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
You can use the inputType to auto manage a multiline text.
<TextView
android:layout_marginTop="5dp"
android:id="#+id/tv_review_details"
android:textSize="16sp"
android:textAppearance="?android:textAppearanceSmall"
android:text="Review"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:width="0dip"
android:inputType="textMultiLine"
/>
if i use listView or recyclerView, i well put the layout width match parent as mentioned below:
<LinearLayout
<!--change to match_parent-->
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" android:padding="4dip"
android:layout_weight="1">
try it once, hope this will help you.
problem solved. it turns out android studio didnt update my changes when i ran my app. i uninstalled the app and then run it again and it works perfectly.
When you are using Gravity in vertical orientation, you have to use layout_height=0dp & when you are using Gravity in Horizontal orientation then you have to use layout_width=0dp for every child of Linear Layout so that it can resize the layout by itself
<LinearLayout
android:background="#e6e6e6"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="10dp">
<LinearLayout
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:orientation="vertical" android:padding="4dip"
android:layout_weight="1">
<TextView
android:id="#+id/tv_reviewer_name"
android:textSize="16sp"
android:textAppearance="?android:textAppearanceLarge"
android:text="Reviewer Name"
android:layout_width="wrap_content"
android:layout_height="0dp" />
<TextView
android:layout_marginTop="5dp"
android:id="#+id/tv_review_details"
android:textSize="16sp"
android:textAppearance="?android:textAppearanceSmall"
android:text="Review"
android:layout_height="0dp"
android:layout_width="match_parent"/>
</LinearLayout>
</LinearLayout>

ScrollView starts from tabbar, but needs to scroll from top of the layout

I have an issue over Scroll bar in my layout.
My layout contains a scrollbar which contains two layouts. The first layout has static height. And the second latout contains tabHost for tabgroup. Second layout also contains Expandable Gridview.
The issue is, when I load my layout, It shows Tabbar directly and hides the first layout. We can scroll But initially I need to show the top layout instead of tabHost. Can anyone help me to slove this issue?
Thanks in Advance...
I have added my code snippet from xml file.
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/header"
android:fillViewport="true" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<RelativeLayout
android:id="#+id/relay1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="true" >
<include
android:id="#+id/cover"
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/coverphoto" />
<ImageView
android:id="#+id/ximg_logo"
android:layout_width="70dip"
android:layout_height="70dip"
android:layout_below="#+id/cover"
android:layout_marginLeft="16dip"
android:layout_marginTop="-42dip" />
<TextView
android:id="#+id/xtxt_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/ximg_logo"
android:layout_marginLeft="5dip"
android:layout_toRightOf="#+id/ximg_logo"
android:ellipsize="end"
android:ems="5"
android:singleLine="true"
android:textColor="#color/sixty_black"
android:textSize="20sp" >
<requestFocus />
</TextView>
<Button
android:id="#+id/xbtn_follow"
style="#style/follow_button_normal"
android:layout_width="95dip"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/cover"
android:layout_marginRight="7dip"
android:background="#drawable/buttons_shape_fill_orange"
android:text="#string/str_follow" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/cover"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#color/fifty_black"
android:orientation="vertical"
android:paddingLeft="3dip"
android:paddingRight="3dip"
android:weightSum="3" >
<RelativeLayout
android:id="#+id/xlay_following"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_alignParentTop="true"
android:layout_marginTop="10dip"
android:layout_weight="1"
android:onClick="following" >
<TextView
android:id="#+id/xtxt_imfollowing"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:textColor="#color/white"
android:textSize="18sp" />
<TextView
android:id="#+id/xtxt_imfollowing_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/xtxt_imfollowing"
android:layout_centerHorizontal="true"
android:padding="5dip"
android:text="#string/str_im_following"
android:textColor="#color/white"
android:textSize="14sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/xlay_follower"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:onClick="follower" >
<TextView
android:id="#+id/xtxt_myfollower"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dip"
android:textColor="#color/white"
android:textSize="18sp" />
<TextView
android:id="#+id/xtxt_myfollowers_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/xtxt_myfollower"
android:layout_centerHorizontal="true"
android:padding="5dip"
android:text="#string/str_myfollowers"
android:textColor="#color/white"
android:textSize="14sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/xlay_interests"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_alignParentBottom="true"
android:layout_below="#+id/xlay_follower"
android:layout_centerHorizontal="true"
android:layout_weight="1" >
<TextView
android:id="#+id/xtxt_interests"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dip"
android:textColor="#color/white"
android:textSize="18sp" />
<TextView
android:id="#+id/xtxt_interests_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/xtxt_interests"
android:layout_centerHorizontal="true"
android:paddingBottom="5dip"
android:text="#string/str_interest"
android:textColor="#color/white"
android:textSize="14sp" />
</RelativeLayout>
</LinearLayout>
<RelativeLayout
android:id="#+id/xrl_msg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#color/fifty_black"
android:padding="10dip" >
<ImageView
android:id="#+id/ximg_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="#drawable/ic_msg" />
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/relay2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/relay1"
android:layout_marginTop="10dip" >
<TabHost
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dip" >
</TabWidget>
<View
android:layout_width="match_parent"
android:layout_height="1dip"
android:background="#color/orange" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/tab1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
</LinearLayout>
<LinearLayout
android:id="#+id/tab2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
</LinearLayout>
<LinearLayout
android:id="#+id/tab3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
</LinearLayout>
</FrameLayout>
</LinearLayout>
</TabHost>
</RelativeLayout>
</RelativeLayout>
</ScrollView>
Of course, the RelativeLayout rl1 overlaps with rl2. They're both match_parent on layout_width. You need to align both layouts with left/right or top/bottom using android:layout_alignParentTop or android:layout_alignParentLeft="true".
However you cannot use it for RelativeLayout. It is used for the UI elements inside RelativeLayout or LinearLayout.
Since you did not post the full layout file with your tab elements or any UI, I cannot give you any xml example.
I have a similar issue and one way that works for my layout is to change the height and visibility like below (using your layout schema as a good example):
<RelativeLayout
android:id="#+id/relay1"
android:layout_width="match_parent"
android:focusable="true"
android:layout_height="0dp"
android:visibility="gone"
>
Notice the android:layout_height and visibility. Of course I know you don't want your first layout to be absolutely hidden always. But this is the idea, and you can do the same with your second layout relay2.
Here's a sample code to hide/show a layout, dynamically. Object relayLayout is your relay1 view.
if "hide the layout" {
relayLayout.setVisibility(LinearLayout.GONE);
}
else {
relayLayout.setVisibility(LinearLayout.VISIBLE);
}
Notice setVisibility and the valid constants.
Now, sample code to set the height of a view. This may be the only code you need and may actually work better.
ViewGroup.LayoutParams layoutParams = relayLayout.getLayoutParams();
layoutParams.height = 0;
relayLayout.setLayoutParams(layoutParams);
Notice ViewGroup.LayoutParams and height attribute, mainly. In this code, the layout will be hidden and the second layout should rise to the top.
Another solution and possibly the best is the Google's answer to show/hide 2 different layouts. In your layout file, I see 2 very different layout designs and so this is applicable in your case.
One webpage stating this is Building a Dynamic UI with Fragments.
It's good reading.
Here's a sample code, making this idea work:
// Create new fragment and transaction
Fragment newFragment = new ExampleFragment();
FragmentTransaction transaction = getFragmentManager().beginTransaction();
// Replace whatever is in the fragment_container view with this fragment,
// and add the transaction to the back stack
transaction.replace(R.id.fragment_container, newFragment);
transaction.addToBackStack(null);
// Commit the transaction
transaction.commit();
The sample code is from Fragments.
One advantage of this code and layout design is that your 2 layouts are separated in 2 files, at least, and forces separation for future code changes.
Have fun with this :-) Tommy Kwee.

Swiperefreshlayout with fragment not scrolling up

I have a layout with some preferences. It works correctly in portrait, but not in landscape. I want this layout to refresh with a swiperefreshlayout, and does work. But as i i say in the title, it doesnt scroll up.
Ive been playing with a normal LinearLayout, with a RelativeLayout, using the swiperefreshlayout as the root view, playing with weights, ... but nothing. It either doesnt scroll up, or doesnt show the preferences correctly (only the 1st title). Dont know what else to try.
I should also say, i want this screen to keep a linearlayout at the bottom, fixed there. So, only the preferences would scroll.
Heres what i have right now:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/edittexts"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:elevation="8dp"
android:background="#color/primary"
android:visibility="gone"
android:layout_alignParentBottom="true">
<Button
android:id="#+id/setwallpaperbutton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="onActivarClick"
android:text="#string/setwallpaperbuton"
android:visibility="gone"
android:clickable="true"
android:enabled="true"/>
<EditText
android:id="#+id/edittextlocation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_margin="2dp"
android:textColor="#android:color/white"
android:clickable="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:gravity="center"
android:layout_gravity="center"
android:inputType="textMultiLine"
android:maxLines="2"
android:background="#android:color/transparent"
android:textAppearance="?android:attr/textAppearanceSmall" />
<EditText
android:id="#+id/edittextupdate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_margin="2dp"
android:textColor="#android:color/white"
android:clickable="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:gravity="center"
android:layout_gravity="center"
android:inputType="text"
android:background="#android:color/transparent"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/swipelayout"
android:isScrollContainer="true"
android:layout_alignParentTop="true"
android:layout_above="#+id/edittexts">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true">
<fragment
android:name="es.jnsoft.nowweather.PreferencesFragment"
android:id="#+id/preferencesfragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:layout="#xml/settings"/>
</ScrollView>
</android.support.v4.widget.SwipeRefreshLayout>
</RelativeLayout>
Thanks in advance.
According to the documentation,
[SwipeRefreshLayout] should be made the parent of the view that will be
refreshed as a result of the gesture and can only support one direct
child.
This clause is violated in your layout.

RelativeLayout doesn't obey parent size (with layout_weight)

I haven't been able to find a similar problem to the one I'm having on StackOverflow - basically, I have a simple XML layout with a vertical LinerLayout which uses layout_weight to make a 10/50/40 split, which is what I want (as seen below):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="left"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=".1"
android:text="#string/title"
android:textColor="#color/black"
android:textStyle="bold" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight=".5"
android:orientation="vertical"
android:background="#color/green">
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="top"
android:fillViewport="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" />
</HorizontalScrollView>
<ImageView
android:id="#+id/preview_bg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/level_preview_back"
android:focusable="false" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=".4"
android:text="#string/title"
android:textColor="#color/black"
android:textStyle="bold" />
</LinearLayout>
BUT - I want the HorizontalScrollView and the ImageView to be overlayed (i.e. take up the exact same space on on top of the other), so I insert a RelativeLayout as such:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="left"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=".1"
android:text="#string/title"
android:textColor="#color/black"
android:textStyle="bold" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight=".5"
android:orientation="vertical"
android:background="#color/green">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="top"
android:fillViewport="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" />
</HorizontalScrollView>
<ImageView
android:id="#+id/preview_bg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/level_preview_back"
android:focusable="false" />
</RelativeLayout>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=".4"
android:text="#string/title"
android:textColor="#color/black"
android:textStyle="bold" />
</LinearLayout>
But when I do this, the layout_weight (10/50/40 split) breaks and suddently the LinearLayout that now contains the RelativeLayout takes up virtually all the screen in the previews.
Anyone experienced this problem or know a good workaround? I've also tried replacing the LinearLayout with the RelativeLayout directly and I have the same problem.
EDIT: Looking further into this issue, there seems to be more to it. As I commented below, I was able to get around the problem by wrapping LinearLayouts around the TextViews, though I'm not sure why that worked. Updating my SDK and plugin didn't help (though I did need to do it....)
Moving further along with my task, I hit a second problem - I was implementing a second version of the overlapped ScrollView & ImageView (which were done with a FrameLayout as suggested by Karsten) but the layout_weight problems began anew.
Testing various arrangements, it seems that the issue is very much related to the image I'm using, which is quite large in resolution. Replacing them with a smaller image corrects the issues - it looks like using large images in either ImageViews or as backgrounds to LinearLayouts tends to ruin the layouts for the entire screen.
EDIT #2: I've actually loaded the XML on to two different devices and it renders exactly as it should.... This seems to be a bug with the Eclipse XML layout viewer?
(Please excuse the poor XML formatting - the Eclipse Android xml editor is frustrating in that regard...)
The XML you've posted works fine for me in the Eclipse preview. Are you running the latest version of the Android plugin?
Note that you can replace the middle LinearLayout and RelativeLayout with a single FrameLayout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="left"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=".1"
android:text="string/title"
android:textStyle="bold" />
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight=".5"
android:background="#00ff00" >
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="top"
android:fillViewport="true" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" />
</HorizontalScrollView>
<ImageView
android:id="#+id/preview_bg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff0000"
android:focusable="false" />
</FrameLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight=".4"
android:text="string/title2"
android:textStyle="bold" />
</LinearLayout>

ListView inside LinearLayout breaking out (Android)

Been struggling with this for a while now. I have a layout XML consisting of various LinearLayouts, with separate weighting. The end result looks like this..
Dont mind the colors, its just to see the break points..Anyway, below the Terminal/Origin etc LinearLayout is a ListView which is populated using a custom adapter. The data loads fine, but then the listView "breaks out" of the LinearLayout, and takes up most of the page
(Dont mind the colors, its just to see the break points..)
ie. it flows over the View above and below.
My XML is as follows:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:ignore="HardcodedText" >
<RelativeLayout
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.2"
android:background="#FF0000"
android:gravity="right" >
<Button
android:id="#+id/update"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:onClick="getFlightInfo"
android:text="Refresh" />
</RelativeLayout>
<LinearLayout
android:id="#+id/table_header"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="0.4"
android:background="#FFFFFF"
android:weightSum="1" >
<TextView
android:id="#+id/header_cell1"
android:layout_width="0px"
android:layout_height="fill_parent"
android:layout_weight="#string/cell_1_weight"
android:gravity="center_vertical"
android:paddingLeft="5dp"
android:paddingRight="12dp"
android:text="#string/table_header_terminal"
android:textSize="11dp" />
<TextView
android:id="#+id/header_cell2"
android:layout_width="0px"
android:layout_height="fill_parent"
android:layout_weight="#string/cell_2_weight"
android:gravity="center_vertical"
android:paddingRight="12dp"
android:text="#string/table_header_origin"
android:textSize="11dp" />
<TextView
android:id="#+id/header_cell3"
android:layout_width="0px"
android:layout_height="fill_parent"
android:layout_weight="#string/cell_3_weight"
android:gravity="center_vertical"
android:paddingRight="12dp"
android:text="#string/table_header_flight"
android:textSize="11dp" />
<TextView
android:id="#+id/header_cell4"
android:layout_width="0px"
android:layout_height="fill_parent"
android:layout_weight="#string/cell_4_weight"
android:gravity="center_vertical"
android:paddingRight="12dp"
android:text="#string/table_header_scheduled"
android:textSize="11dp" />
<TextView
android:id="#+id/header_cell5"
android:layout_width="0px"
android:layout_height="fill_parent"
android:layout_weight="#string/cell_5_weight"
android:gravity="center_vertical"
android:paddingRight="12dp"
android:text="#string/table_header_status"
android:textSize="11dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/table_list_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="3"
android:background="#FFFFFF"
android:orientation="vertical" >
<ListView
android:id="#+id/list_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</ListView>
</LinearLayout>
<LinearLayout
android:id="#+id/filter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#00FF00" />
</LinearLayout>
I may be missing something glaring, but for the life of me, I cant see it. Can anyone help?
Thanks a million..
This is because you have kept LinearLayout's height(the one wrapping listview) "wrap_content".Fixing its size to some dip would solve your problem.
Also make listview's height "fill_parent" then.
EDIT :
try this way:
...
<ListView
android:id="#+id/list_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</ListView>
in upper two layouts,you user 0.2 and 0.4 as weight but in lower two layouts,you users 3 and 1...try it former way and see,if it can help you.also try making height of LinearLayout(the one wrapping listview) to 0dip.
Maybe it is late, but I could help someone.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ff0000">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="20dp"
android:text="Content 1" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#00ff00">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="20dp"
android:text="Content 2" />
</LinearLayout>
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/linearLayout2"
android:layout_below="#id/linearLayout1"
android:background="#00f0f0"></ListView>
Result:
Ok.. after consulting this post I came up with a fix
Remove the LinearLayout outside the ListView, its superfluous.
Add a height of '0px' (which I've found around the web) to the ListView ensures it obeys the android:weight parameter properly.
Hope this helps.
Remove the weight of id/filter.
Let the ListView have a weight of 1 with fill_parent height.
Remove the listView's immediate parent.
One other thing you missed, is to set the weightSum=sum_of all_child_weight in your root. That should fix the problem.

Categories

Resources