Android -- How to allow horizontal and vertical scrolling

Question

There is the ScrollView that allows only vertical scrolling, and the HorizontalScrollView that allows only horizontal scrolling, but no class for both. This seems like a pretty gaping deficit in the Android UI. Any tricks to allow this?

In many cases, anything needing that much space should not be using `ScrollView`/`HorizontalScrollView`. Those only work when the contents are still fairly modest in memory consumption. On the far other end of the spectrum, consider Google Maps -- that is not implemented using `ScrollView` or `HorizontalScrollView`, because we cannot hold maps for the entire planet in RAM at once. Think long and hard about what you're trying to have scroll, because it is quite possible that you will need to do something much more complex than use `ScrollView` and kin to work on a mobile device. — CommonsWare, Apr 24 '11 at 15:44
My solution to that was to calculate which of the level's (this is a game) objects are onscreen, and only drawing those. The other solution was to use a frame view of parent's width/height and move the level's objects as events occur. The latter seems like it would require more processing, but probably less RAM. Do you have a recommendation? — farm ostrich, Apr 24 '11 at 15:50
"My solution to that was to calculate which of the level's (this is a game) objects are onscreen, and only drawing those." -- I'm no game developer, but that sounds like you don't need `ScrollView` and kin, then, as you are handling it all yourself. Just watch for swipe events and redraw your level at that point. — CommonsWare, Apr 24 '11 at 16:19

score 29 · Accepted Answer · edited Aug 20 '11 at 20:28

29

Try this

<?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="wrap_content">

    <HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
                  android:layout_width="wrap_content"
                  android:layout_height="fill_parent">

         <TableLayout
                  android:id="@+id/amortization"
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content">

              <TableRow
                  android:background="#ffff00">
                  <TextView
                       android:text="@string/amortization_1"
                       android:padding="3dip"/>
                  <TextView
                       android:text="@string/amortization_2"
                       android:padding="3dip"/>
                  <TextView
                       android:text="@string/amortization_3"
                       android:padding="3dip"/>
                  <TextView
                       android:text="@string/amortization_4"
                       android:padding="3dip"/>
                  <TextView
                       android:text="@string/amortization_5"
                       android:padding="3dip"/>
                  <TextView
                       android:text="@string/amortization_6"
                       android:padding="3dip"/>
                  <TextView
                       android:text="@string/amortization_7"
                       android:padding="3dip"/> 
              </TableRow>
         </TableLayout>
    </HorizontalScrollView>
</ScrollView>

edited Aug 20 '11 at 20:28

Chris Knight

24,333
24
88
134

answered Apr 24 '11 at 16:07

Bipin Vayalu

3,025
2
25
39

Translation on a FrameLayout is best, methinks – farm ostrich Apr 28 '11 at 21:23
This works ok, but you can only scroll horizontal or vertical, at one time, and not diagonally. It feels unfinished, but easy to implement. – Hersker May 08 '13 at 11:57
I have a large grid of numbers that I have to display and this works perfectly. While you can't scroll diagonally, it's not really that big of a deal in a situation like mine. – DiscDev May 09 '13 at 21:14
I tried this, HorizontalScrollView working fine, But vertically not working – MohanRaj S Jul 06 '15 at 10:55
@MohanRaj you need to handle vertical scrolling using touch event of scrollview. – Bipin Vayalu Jul 06 '15 at 16:05
@Bipin Vayalu Ok fine, What i am trying is any other way to handle the content reading page instead of webview. Let me try the what you said. – MohanRaj S Jul 07 '15 at 02:59
@MohanRaj If it's webpage, it will automatically do both side scrolling. You don't need to do anything with webview. – Bipin Vayalu Jul 07 '15 at 08:30
@Bipin Yeah I agree, Just few hours ago i tested and understood, thank you for the review. – MohanRaj S Jul 07 '15 at 09:34

score 2 · Answer 2 · answered Apr 24 '11 at 15:40

An example with an ImageView:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:id="@+id/ScrollView02" 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content"
            xmlns:android="http://schemas.android.com/apk/res/android">
<HorizontalScrollView android:id="@+id/HorizontalScrollView01" 
                      android:layout_width="wrap_content" 
                      android:layout_height="wrap_content">
<ImageView android:id="@+id/ImageView01"
           android:src="@drawable/pic" 
           android:isScrollContainer="true" 
           android:layout_height="fill_parent" 
           android:layout_width="fill_parent" 
           android:adjustViewBounds="true">
</ImageView>
</HorizontalScrollView>
</ScrollView>

Source: http://www.android-spa.com/viewtopic.php?t=3959&highlight=scrollview+vertical+horizontal

IMHO a screen that requires both scrolling is not comfortable at all (actually I think Vertical Scrolling is not a good idea) but it works. — Vicente Plata, Apr 24 '11 at 15:42
It's for a game with levels much bigger than the screen. Thanks guy. — farm ostrich, Apr 24 '11 at 15:43

score 1 · Answer 3 · answered Dec 16 '12 at 15:55

I found it is important to set fillViewportbecause otherwise scroll bars might appear at random positions instead of at the right/bottom of the scrolling area:

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true" >
    <HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fillViewport="true" >
    </HorizontalScrollView>
</ScrollView>

Android -- How to allow horizontal and vertical scrolling

3 Answers3

Linked