Board index » Android Coding Problems » View, Layout & Resource Problems

Skip to content

Strange Behaviour

Put problem concerning Views, Layouts and other XML-Resources (like AndroidManifest) here.
Post a reply

Strange Behaviour

Postby darolla » Fri Nov 07, 2008 4:58 pm

Hi,

I've got a RelativeLayout with a customized ListView and a TableLayout below.

5 entries into the ListView are ok, everything is visible.

8 entries into the ListView are pushing the Table out of the screen.

So I started to put them all into a ScrollView.

But now it becomes very strange:

The ListView ist very small, but with scrollbars.

I am gettings nuts on this for days now.

Please help me on this...

Greetings,
DaRolla
Attachments
strange.png
strange.png (15.98 KiB) Viewed 221 times
8items.png
8items.png (24.02 KiB) Viewed 221 times
5items.png
5items.png (21.73 KiB) Viewed 221 times
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany
Top
Top

Postby darolla » Fri Nov 07, 2008 5:00 pm

my xml without scrollview:
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2. <?xml version="1.0" encoding="utf-8"?>
  3.  
  4.  
  5.  
  6. <RelativeLayout
  7.  
  8.         xmlns:android="http://schemas.android.com/apk/res/android"
  9.  
  10.         android:orientation="vertical" android:layout_width="fill_parent"
  11.  
  12.         android:layout_height="fill_parent">
  13.  
  14.  
  15.  
  16.         <ListView android:id="@+id/android:list"
  17.  
  18.                 android:layout_width="fill_parent"
  19.  
  20.                 android:layout_height="wrap_content" />
  21.  
  22.  
  23.  
  24.         <TableLayout android:id="@+id/table"
  25.  
  26.                 android:layout_below="@+id/android:list"
  27.  
  28.                 android:layout_width="fill_parent"
  29.  
  30.                 android:layout_height="wrap_content" android:stretchColumns="0"
  31.  
  32.                 android:layout_marginTop="2px" android:background="#636363">
  33.  
  34.  
  35.  
  36.                 <TableRow android:id="@+id/tr1">
  37.  
  38.                         <TextView android:id="@+id/tr1tv1" android:textSize="16px"
  39.  
  40.                                 android:text="Einsatz pro Wette:" android:layout_gravity="left"
  41.  
  42.                                 android:paddingLeft="10px">
  43.  
  44.                         </TextView>
  45.  
  46.  
  47.  
  48.                         <TextView android:id="@+id/tr1tv2" android:textSize="16px"
  49.  
  50.                                 android:text="€ 1,00" android:layout_gravity="right"
  51.  
  52.                                 android:paddingRight="10px">
  53.  
  54.                         </TextView>
  55.  
  56.                 </TableRow>
  57.  
  58.  
  59.  
  60.                 <TableRow android:id="@+id/tr2">
  61.  
  62.                         <TextView android:id="@+id/tr2tv1" android:textSize="16px"
  63.  
  64.                                 android:text="Anzahl Wetten:" android:layout_gravity="left"
  65.  
  66.                                 android:paddingLeft="10px">
  67.  
  68.                         </TextView>
  69.  
  70.  
  71.  
  72.                         <TextView android:id="@+id/tr2tv2" android:textSize="16px"
  73.  
  74.                                 android:text="1" android:layout_gravity="right"
  75.  
  76.                                 android:paddingRight="10px">
  77.  
  78.                         </TextView>
  79.  
  80.                 </TableRow>
  81.  
  82.  
  83.  
  84.  
  85.  
  86.                 <TableRow android:id="@+id/tr3">
  87.  
  88.                         <TextView android:id="@+id/tr3tv1" android:textSize="16px"
  89.  
  90.                                 android:text="Max. Gesamtquote:" android:layout_gravity="left"
  91.  
  92.                                 android:paddingLeft="10px">
  93.  
  94.                         </TextView>
  95.  
  96.  
  97.  
  98.                         <TextView android:id="@+id/tr3tv2" android:textSize="16px"
  99.  
  100.                                 android:text="2,56" android:layout_gravity="right"
  101.  
  102.                                 android:paddingRight="10px">
  103.  
  104.                         </TextView>
  105.  
  106.                 </TableRow>
  107.  
  108.  
  109.  
  110.                 <TableRow android:id="@+id/tr4">
  111.  
  112.                         <TextView android:id="@+id/tr4tv1" android:textSize="16px"
  113.  
  114.                                 android:text="Gebühren (gesamt):" android:layout_gravity="left"
  115.  
  116.                                 android:paddingLeft="10px">
  117.  
  118.                         </TextView>
  119.  
  120.  
  121.  
  122.                         <TextView android:id="@+id/tr4tv2" android:textSize="16px"
  123.  
  124.                                 android:text="€ 0,05" android:layout_gravity="right"
  125.  
  126.                                 android:paddingRight="10px">
  127.  
  128.                         </TextView>
  129.  
  130.                 </TableRow>
  131.  
  132.  
  133.  
  134.                 <TableRow android:id="@+id/tr5">
  135.  
  136.                         <TextView android:id="@+id/tr5tv1" android:textSize="16px"
  137.  
  138.                                 android:text="Max. Auszahlung:" android:layout_gravity="left"
  139.  
  140.                                 android:paddingLeft="10px">
  141.  
  142.                         </TextView>
  143.  
  144.  
  145.  
  146.                         <TextView android:id="@+id/tr5tv2" android:textSize="16px"
  147.  
  148.                                 android:text="€ 2,56" android:layout_gravity="right"
  149.  
  150.                                 android:paddingRight="10px">
  151.  
  152.                         </TextView>
  153.  
  154.                 </TableRow>
  155.  
  156.  
  157.  
  158.                 <TableRow android:id="@+id/tr5">
  159.  
  160.                         <TextView android:id="@+id/tr5tv1" android:textSize="16px"
  161.  
  162.                                 android:text="Gesamtpreis:" android:layout_gravity="left"
  163.  
  164.                                 android:paddingLeft="10px" android:textStyle="bold">
  165.  
  166.                         </TextView>
  167.  
  168.  
  169.  
  170.                         <TextView android:id="@+id/tr5tv2" android:textSize="16px"
  171.  
  172.                                 android:text="€ 120,05" android:layout_gravity="right"
  173.  
  174.                                 android:paddingRight="10px" android:textStyle="bold">
  175.  
  176.                         </TextView>
  177.  
  178.                 </TableRow>
  179.  
  180.  
  181.  
  182.         </TableLayout>
  183.  
  184.  
  185.  
  186. </RelativeLayout>
  187.  
  188.  
Parsed in 0.013 seconds, using GeSHi 1.0.8.4


the xml with scrollview and the strange behaviour:
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2. <?xml version="1.0" encoding="utf-8"?>
  3.  
  4.  
  5.  
  6. <ScrollView android:id="@+id/scrollview_events"
  7.  
  8.         xmlns:android="http://schemas.android.com/apk/res/android"
  9.  
  10.         android:layout_width="fill_parent"
  11.  
  12.         android:layout_height="fill_parent">
  13.  
  14.  
  15.  
  16.         <RelativeLayout android:orientation="vertical"
  17.  
  18.                 android:layout_width="fill_parent"
  19.  
  20.                 android:layout_height="fill_parent">
  21.  
  22.  
  23.  
  24.                 <ListView android:id="@+id/android:list"
  25.  
  26.                         android:layout_width="fill_parent"
  27.  
  28.                         android:layout_height="wrap_content" />
  29.  
  30.  
  31.  
  32.                 <TableLayout android:id="@+id/table"
  33.  
  34.                         android:layout_below="@+id/android:list"
  35.  
  36.                         android:layout_width="fill_parent"
  37.  
  38.                         android:layout_height="wrap_content" android:stretchColumns="0"
  39.  
  40.                         android:layout_marginTop="2px" android:background="#636363">
  41.  
  42.  
  43.  
  44.                         <TableRow android:id="@+id/tr1">
  45.  
  46.                                 <TextView android:id="@+id/tr1tv1"
  47.  
  48.                                         android:textSize="16px" android:text="Einsatz pro Wette:"
  49.  
  50.                                         android:layout_gravity="left" android:paddingLeft="10px">
  51.  
  52.                                 </TextView>
  53.  
  54.  
  55.  
  56.                                 <TextView android:id="@+id/tr1tv2"
  57.  
  58.                                         android:textSize="16px" android:text="€ 1,00"
  59.  
  60.                                         android:layout_gravity="right" android:paddingRight="10px">
  61.  
  62.                                 </TextView>
  63.  
  64.                         </TableRow>
  65.  
  66.  
  67.  
  68.                         <TableRow android:id="@+id/tr2">
  69.  
  70.                                 <TextView android:id="@+id/tr2tv1"
  71.  
  72.                                         android:textSize="16px" android:text="Anzahl Wetten:"
  73.  
  74.                                         android:layout_gravity="left" android:paddingLeft="10px">
  75.  
  76.                                 </TextView>
  77.  
  78.  
  79.  
  80.                                 <TextView android:id="@+id/tr2tv2"
  81.  
  82.                                         android:textSize="16px" android:text="1"
  83.  
  84.                                         android:layout_gravity="right" android:paddingRight="10px">
  85.  
  86.                                 </TextView>
  87.  
  88.                         </TableRow>
  89.  
  90.  
  91.  
  92.  
  93.  
  94.                         <TableRow android:id="@+id/tr3">
  95.  
  96.                                 <TextView android:id="@+id/tr3tv1"
  97.  
  98.                                         android:textSize="16px" android:text="Max. Gesamtquote:"
  99.  
  100.                                         android:layout_gravity="left" android:paddingLeft="10px">
  101.  
  102.                                 </TextView>
  103.  
  104.  
  105.  
  106.                                 <TextView android:id="@+id/tr3tv2"
  107.  
  108.                                         android:textSize="16px" android:text="2,56"
  109.  
  110.                                         android:layout_gravity="right" android:paddingRight="10px">
  111.  
  112.                                 </TextView>
  113.  
  114.                         </TableRow>
  115.  
  116.  
  117.  
  118.                         <TableRow android:id="@+id/tr4">
  119.  
  120.                                 <TextView android:id="@+id/tr4tv1"
  121.  
  122.                                         android:textSize="16px" android:text="Gebühren (gesamt):"
  123.  
  124.                                         android:layout_gravity="left" android:paddingLeft="10px">
  125.  
  126.                                 </TextView>
  127.  
  128.  
  129.  
  130.                                 <TextView android:id="@+id/tr4tv2"
  131.  
  132.                                         android:textSize="16px" android:text="€ 0,05"
  133.  
  134.                                         android:layout_gravity="right" android:paddingRight="10px">
  135.  
  136.                                 </TextView>
  137.  
  138.                         </TableRow>
  139.  
  140.  
  141.  
  142.                         <TableRow android:id="@+id/tr5">
  143.  
  144.                                 <TextView android:id="@+id/tr5tv1"
  145.  
  146.                                         android:textSize="16px" android:text="Max. Auszahlung:"
  147.  
  148.                                         android:layout_gravity="left" android:paddingLeft="10px">
  149.  
  150.                                 </TextView>
  151.  
  152.  
  153.  
  154.                                 <TextView android:id="@+id/tr5tv2"
  155.  
  156.                                         android:textSize="16px" android:text="€ 2,56"
  157.  
  158.                                         android:layout_gravity="right" android:paddingRight="10px">
  159.  
  160.                                 </TextView>
  161.  
  162.                         </TableRow>
  163.  
  164.  
  165.  
  166.                         <TableRow android:id="@+id/tr5">
  167.  
  168.                                 <TextView android:id="@+id/tr5tv1"
  169.  
  170.                                         android:textSize="16px" android:text="Gesamtpreis:"
  171.  
  172.                                         android:layout_gravity="left" android:paddingLeft="10px"
  173.  
  174.                                         android:textStyle="bold">
  175.  
  176.                                 </TextView>
  177.  
  178.  
  179.  
  180.                                 <TextView android:id="@+id/tr5tv2"
  181.  
  182.                                         android:textSize="16px" android:text="€ 120,05"
  183.  
  184.                                         android:layout_gravity="right" android:paddingRight="10px"
  185.  
  186.                                         android:textStyle="bold">
  187.  
  188.                                 </TextView>
  189.  
  190.                         </TableRow>
  191.  
  192.  
  193.  
  194.                 </TableLayout>
  195.  
  196.  
  197.  
  198.         </RelativeLayout>
  199.  
  200.  
  201.  
  202. </ScrollView>
  203.  
  204.  
Parsed in 0.014 seconds, using GeSHi 1.0.8.4
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany
Top

Postby Quetzalcoatl » Fri Nov 07, 2008 5:18 pm

Hi,

This could be a little confusing from a UI point of view. What do you actually want to happen:

1. Varying length list view + table view immediately underneath it (scroll bars if required as there might be a lot of list items).
2. Varying length list view but with the Table always at the bottom of the screen (so there would be a gap if there were only a couple of list entries)?
3. Varying length list view where the Table is pushed down the screen dependent on the number of items in the list (until it reaches the bottom of the screen - what happens hen it reaches the bottom of the screen? stops but forces a scroll bar on the list?)

Sorry to add fuel to the fire but clumsy UIs add to a bad user experience.
Image
Quetzalcoatl
Senior Developer
Senior Developer
 
Posts: 129
Joined: Sat Oct 18, 2008 8:21 pm
Location: near Manchester, UK
Top

Postby darolla » Fri Nov 07, 2008 6:40 pm

hi,

thanks for the answer. Maybe I should explain my idea in detail.

Lets think about an online shop.

The user can add articles to his shopping trolley. This list of articles is the ListView. It can grow unforeseeable.

Underneath the ListView the user can find a summary (which will be visible when the 1st article is added). This summary is the TableLayout.

Both views belong together and should be seen as one unit.

This unit should be scrolled when it's length exceeds the screen limit.

Therefor I placed this unit into a ScrollView.


Alternative 1: the ListView and the TableLayout are one of both. But if both become one TableLayout I dont get the nice orange clicks as visual feedback (is there a OnClickListener for TableLayout ?)

Alternative 2: both become one ListView. But now the user can click the summary, well, maybe I can disable this. But the height of the row is different (40px line for each article, but 200px for the summary).

Greetings,
Marco
User avatar
darolla
Master Developer
Master Developer
 
Posts: 273
Joined: Thu Sep 25, 2008 5:16 pm
Location: Dortmund, Germany
Top
Top
Post a reply

Return to View, Layout & Resource Problems

Who is online

Users browsing this forum: No registered users and 6 guests

Board index The team • Delete all board cookies • All times are UTC + 1 hour