Android UI difficulties - android

My layout was perfect until I decided to add a scrollview.
<?xml version="1.0" encoding="utf-8"?>
<TableLayout android:id="#+id/tableLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android">
<ScrollView android:id="#+id/scrollView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:id="#+id/linearLayout1">
<TableLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:id="#+id/tableLayout1"/>
</LinearLayout>
</ScrollView>
<Button android:layout_width="match_parent" android:id="#+id/button1" android:text="Start" android:layout_height="50dip" android:onClick="getOutput"></Button>
</TableLayout>
I would like the button to stay at the bottom of the screen, I would actually like the scrollview to take up the entire screen. With just the inner table layout it works fine. In the Graphical Layout preview it looks how I want it, but not when I run it.
I would like the scrollview to take up the whole screen except the button, which I'd like to be at the bottom.

you could use RelativeLayout or LinearLayout as Root view. Giving Button more weight. That way ScrollView won't take up the whole thing.

this should work
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:orientation="vertical">
<ScrollView android:layout_width="fill_parent" android:layout_height="0dip"
android:layout_weight="1.0">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent" android:orientation="vertical"
android:id="#+id/linearLayout1">
<TableLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/tableLayout1"/>
</LinearLayout>
</ScrollView>
<Button android:layout_width="fill_parent" android:layout_height="wrap_content"
android:text="Bottom Button"/>
</LinearLayout>

Try setting ScrollView fillViewport attribute to true.

Related

How to anchor buttons at the bottom of the layout?

I'd like the OK / Cancel buttons to be anchored at the bottom (even when there's more items on the list that can be shown on the screen). Here's what it currently looks like:
The buttons are on the top, not on the bottom.
The layout that contains the buttons:
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="true"
android:id="#+id/buttons_layout">
<TableRow>
<Button
android:id="#+id/btnOK"
android:background="#color/pomegranate"
android:text="OK"
android:layout_gravity="fill_horizontal"
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<Button
android:id="#+id/btnCancel"
android:background="#color/wet_asphalt"
android:text="Cancel"
android:layout_weight="1"
android:layout_gravity="fill_horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</TableRow>
</TableLayout>
The composite layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ListView android:id="#+id/options_list"
android:layout_width="fill_parent"
android:layout_height="match_parent">
</ListView>
<include layout="#id/buttons_layout"
android:layout_alignParentBottom="true"
android:layout_height="match_parent"
android:layout_below="#id/options_list"/>
</RelativeLayout>
I followed the guidelines I read on http://developer.android.com/guide/topics/ui/layout/relative.html
I tried this answer - https://stackoverflow.com/a/6285438/168719 - it hasn't helped me.
I suspected that it might not work because the list view doesn't "know" how tall it is, so the button layout doesn't know where to place itself, either. But I ruled it out by setting the ListView height to an arbitrary value like 100dp. The buttons are still superimposed over it.
I fiddled with all the layout attributes, but I can't get it to work.
Apart from the solution, I would also like to know why mine doesn't work...
the layout should be something like this :
<?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="match_parent">
<ListView android:id="#+id/options_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/layout_buttons" >
</ListView>
<include android:id="#+id/layout_buttons"
layout="#id/buttons_layout"
android:layout_alignParentBottom="true"
android:layout_height="wrap_parent"
android:layout_width="wrap_content"/>
</RelativeLayout>
you can use tab to do it
you can see this tutorial
Android Tab Layout Tutorial
you could try using it this way
<relativelayout1>
<relativelayout2 specify layout below listview with id="list">
<button1>
<button2>
</relativelayout2>
<listview id="list">
</listview>
</relativelayout1>
so this will ensure no matter how long your list is you always get the buttons below your list. so you can have a scrolling list and a static buttons below the list
try this. Put the include tag inside another RelativeLayout, then be sure ListView is above the new RelativeLayout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/parentLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/buttonsContent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true" >
<include
android:id="#+id/buttons"
android:layout_width="wrap_content"
layout="#layout/buttons_layout" />
</RelativeLayout>
<ListView
android:id="#+id/options_list"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_above="#id/buttonsContent" >
</ListView>
</RelativeLayout>
Try like this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/layout_buttons"
android:orientation="vertical" >
<ListView android:id="#+id/options_list"
android:layout_width="match_parent"
android:layout_height="match_parent">
</ListView>
</LinearLayout>
<include android:id="#+id/layout_buttons"
layout="#id/buttons_layout"
android:layout_alignParentBottom="true"
android:layout_height="wrap_parent"
android:layout_width="wrap_content"/>
</RelativeLayout>

linearlayout centered vertically between two linearlayout

I need to do a layout like the one in the picture, using 3 linearlayout, or relativelayout or whatever similar. The linearlayout in the middle has to adapt the height depending on the free space between the first ll one the top and the third ll at the bottom.
The ll at the bottom has to be fixed there.
How can I do?
Thanks, Mattia
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</LinearLayout>
</LinearLayout>
The important thing here is the android:layout_weight="1" in the second layout
Use this
<?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" >
<LinearLayout
android:id="#+id/ui_main_header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:orientation="horizontal"/>
<LinearLayout
android:id="#+id/ui_main_footer"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal"/>
<LinearLayout
android:id="#+id/ui_main_center"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#id/ui_main_header"
android:layout_above="#id/ui_main_footer"
android:orientation="vertical"/>
</RelativeLayout>

How to place both listview and textview in one page in android?

I am displaying a TextView and below that a ListView in one page. My code is:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:id="#+id/widget"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:id="#+id/widgetlay"
android:layout_height="fill_parent">
<TextView
android:id="#+id/txt1"
android:text=""
android:layout_height="wrap_content"
android:layout_width="fill_parent"
>
</TextView>
</RelativeLayout>
<ListView
android:layout_width="match_parent"
android:id="#+id/listlist"
android:layout_height="0dp"
android:layout_weight="1.0">
</ListView>
</RelativeLayout>
Here I am displaying the ListView data dynamically....but in my emulator it is displaying a TextView at the top and then the ListView with scroll...It is not expanding the list and instead it is scrolling with the content which is generated dynamically...Please tell me how to expand the entire ListView....
Thanks in advance
<?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">
<LinearLayout android:gravity="center|center_vertical"
android:orientation="vertical" android:layout_height="fill_parent" android:layout_width="fill_parent">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="status"
android:id="#+id/txtvw1">
</TextView>
<ListView
android:layout_width="fill_parent"
android:id="#+id/listlist"
android:layout_height="fill_parent">
</ListView>
</LinearLayout>
</LinearLayout>
<?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:orientation="vertical" >
<TextView
android:id="#+id/txtvw1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="status" >
</TextView>
<ListView
android:id="#+id/listlist"
android:layout_width="fill_parent"
android:layout_height="fill_parent" android:layout_weight="1">
</ListView>
</LinearLayout>
You have an error here
<ListView
android:layout_width="fill_parent"
android:id="#+id/listlist" //error here
android:layout_height="fill_parent">
</ListView>
the ListView is filled of the LinearLayout
so that you can't get the TextView.
instand of this
you can layout your view as follows:
<ListView
android:layout_width="match_parent"
android:id="#+id/listlist" //error here
android:layout_height="0"
android:layout_weight="1.0>
android:layout_weight="1.0" //this will make the list view filled with the rest of the screem
Further more
I suggest you use "match_parent" instand of "fill_parent"
this WAS CHANGED in the SDK level 8...
OK, now you use the RelativeLayout install of the LinearLayout
So you should add the relationship with your views in your layout.
You can layout as this:
<RelativeLayout
android:id="#+id/widgetlay"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/txt1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="" >
</TextView>
<ListView
android:id="#+id/listlist"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/txt1" />
android:layout_below="#id/txt"----Indicate the relationship with the layout
The RelativeLayout does not have the attr "orientation" and "layout_weight". So I don't suggest you to use this layout, It can't be fixed with the screen height in that way.
The good layout is:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/txtvw1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="status" >
</TextView>
<ListView
android:id="#+id/listlist"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1.0" />
Further more, what do you want to layout your views?
This is a part of my work. List view will appear in the middle of your screen and what ever u need at the top, put it in place of header() and things that u need in bottom of the screen , put it in place of footer(). U can use relative layout instead of the linear layout
Hope this helps.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<RelativeLayout android:layout_width="match_parent" android:layout_alignParentTop="true"
android:layout_height="wrap_content" android:id="#+id/layout_header">
<include layout="#layout/header"/>
</RelativeLayout>
<LinearLayout android:layout_width="match_parent" android:gravity="center" android:orientation="horizontal" android:weightSum="1"
android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:id="#+id/layout_footer">
<include layout="#layout/footer" />
</LinearLayout>
<ListView android:id="#android:id/list" android:layout_below="#id/layout_header" android:layout_above="#id/layout_footer"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:visibility="visible" />
<!-- <TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello"
/> -->
</RelativeLayout>
I don't know what is meaning of expanding meaning here, but listView in scroll view dont behave normally. To resolve this issue you need to implement list view outside of scrollview.
I don't quite understand what you mean, but if you want to have the textView scroll with the content of the listView, you need to add it as a header in your listView.
Moreover, it is not a good idea to put a listview in a scrollview, the listview being scrollable, it messes with the scrollview mechanism.
You can NEVER ever place a listview in the SCrollView.It wont behave properly.Instead of it try using LinearLayout TextView ListView < /Linearlayout>

How can I place new items under scrollview

I have a vertical scrollable layout with lots of items, working fine.
I am trying to place a new linearlayout to the bottom of the screen that would NOT be part of the scrollable layout.
That is, it would sit on the buttom (like an adview) independent of the scrollable part.
I was only able to place it inside the scrollView. How can I place it below, so it would always visible ?
Use a RelativeLayout, and organize it like this:
<?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:orientation="vertical" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentTop="true"
android:layout_above="#+id/linearLayoutThatDoesNotScroll" >
<LinearLayout
android:id="#+id/linearLayoutWithLotofContent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/linearLayoutThatDoesNotScroll"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" >
</LinearLayout>
</RelativeLayout>
The trick is in the ScrollView placement, at the same time it is aligned with the top of the screen AND above the lower, fixed, LinearLayout. It just works.
something like this :)
<?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" >
<ScrollView android:id="#+id/scroll_view"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<LinearLayout android:id="#+id/content"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</ScrollView>
<LinearLayout android:id="#+id/bottom"
android:layout_width="fill_parent"
android:layout_height="10dip" />
</LinearLayout>
You will add your bottom content to the bottom linearLayout with the android:id=bottom :)
If you used a vertical LinearLayout to hold the scrollable layout, then you could add the adview to the LinearLayout below the scrollable layout and it would appear at the bottom of the screen. (assuming your weights are set correctly,and the scroll layout is set to WRAP_CONTENT)
A RelativeLayout would allow you to set the adview to align itself with the bottom of the scrollable layout as well, but you would still need to make sure the scrollable layout was set to WRAP_CONTENT so it didn't automatically take up the entire screen.
<?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" >
<Button
android:id="#+id/dialogButtonOK"
android:layout_width="100px"
android:layout_height="wrap_content"
android:text=" Ok "
android:layout_alignParentBottom="true"
android:layout_centerInParent="true"
android:background="#drawable/button_style"
/>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:id="#+id/scrView"
android:layout_above="#id/dialogButtonOK"
android:layout_alignParentTop="true"
>
<HorizontalScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:stretchColumns="*"
android:id="#+id/main_table" >
</TableLayout>
</HorizontalScrollView>
</ScrollView>
</RelativeLayout>
This is worked for me

Making TextView scrollable without knowing max lines

I want to make my TextView vertically scrollable. I have read "Making TextView Scrollable in Android" but since I don't know the size of the screen of the final device, I can't know which value should be set for maximum lines.
Is there any other way, so it gets the scrolling for any screen size?
My XML looks like this:
<?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">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:layout_weight="1.0">
<TextView
android:id="#+id/consola"
android:layout_width="fill_parent"
android:layout_height="match_parent"/>
</ScrollView>
<EditText
android:id="#+id/comando"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.0"/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.0">
<Button
android:text="Conectar"
android:id="#+id/boton_conectar"
android:layout_width="wrap_content"
android:layout_weight="0.5"
android:layout_height="wrap_content">
</Button>
<Button
android:text="Enviar"
android:id="#+id/boton_enviar"
android:layout_width="wrap_content"
android:layout_weight="0.5"
android:layout_height="wrap_content">
</Button>
</LinearLayout>
</LinearLayout>
Look, here the structure of my XML layout with scroll:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scrollbars="vertical"
android:visibility="visible">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
.....
//your sub-widgets
.....
</LinearLayout>
</ScrollView>
As for me, works fine.
If you do not know number of lines (moreover, it could vary if soft input method are shown or not), you should use RelativeLayout to place you widget like TextView. And then connect both (it's critical, not one but both) top and bottom edges of it to parent withandroid:layout_alignParentTop and android:layout_alignParentBottom attibutes, or neighbors with android:layout_above and android:layout_below attributes.
After both sides are connected to other widgets, android will recalculate size of TextView and scroller properly, even if you change orientation or show/hide soft keyboard.
ScrollView is only allowed to have one sub widget.
You should put the linearlayout inside of the scroll view. and set the textview inside of the linear layout.
Put the TextView inside ScrollView with height = MATCH_PARENT
try:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ScrollView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:fillViewport="true"
android:layout_weight="1.0">
<TextView
android:id="#+id/consola"
android:layout_width="fill_parent"
android:layout_height="match_parent"/>
</ScrollView>
<EditText
android:id="#+id/comando"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<Button
android:text="Conectar"
android:id="#+id/boton_conectar"
android:layout_width="wrap_content"
android:layout_weight="0.5"
android:layout_height="wrap_content">
</Button>
<Button
android:text="Enviar"
android:id="#+id/boton_enviar"
android:layout_width="wrap_content"
android:layout_weight="0.5"
android:layout_height="wrap_content">
</Button>
</LinearLayout>
</LinearLayout>

Categories

Resources