Code2care : TechZone Apps & Tutorials

Make Android View Scrollable both Horizontally and Vertically





If you want to have a Android Activity to be scrollable both horizontally and vertically be its any parent layout i.e LinearLayout, TableLayout, RelativeLayout or GridLayout, you can achieve it by making use of both HorizontalScrollView and ScrollView



Step 1 :


    Choose your Parent layout. In the example I have choose a LinearLayout with with horizontal orientation.


Step 2 :


    Add HorizontalScrollView as a sub-view with layout_width and layout_height as match_parent. You may add padding if you want.


Step 3 :


    Within the HorizontalScrollView Add ScrollView as a sub-view with layout_width and layout_height as match_parent. You may add padding if you want.


Step 4 :


    Now here you can all all the View elements that make up your Activity. To demonstrative i have added Two LinearLayouts with orientations vertical and horizontal respectively and added 10+ Button's to it.


Thats it! Try running the App and you would see that the View Scrolls both ways!

Source code :



<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal" >

    <HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="10px" >

        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:padding="10px" >

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content" >

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:orientation="vertical" >

                    <Button
                        android:id="@+id/button1"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 1" />

                    <Button
                        android:id="@+id/button2"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 2" />

                    <Button
                        android:id="@+id/button3"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 3" />

                    <Button
                        android:id="@+id/button12"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 4" />

                    <Button
                        android:id="@+id/button4"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 5" />

                    <Button
                        android:id="@+id/button5"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 6" />

                    <Button
                        android:id="@+id/button6"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 7" />

                    <Button
                        android:id="@+id/button7"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 8" />

                    <Button
                        android:id="@+id/button8"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 9" />

                    <Button
                        android:id="@+id/button9"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 10" />

                    <Button
                        android:id="@+id/button10"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 11" />

                    <Button
                        android:id="@+id/button11"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 12" />
                </LinearLayout>

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:orientation="horizontal" >

                    <Button
                        android:id="@+id/button111"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 2" />

                    <Button
                        android:id="@+id/button21"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 3" />

                    <Button
                        android:id="@+id/button31"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 4" />

                    <Button
                        android:id="@+id/button121"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 5" />

                    <Button
                        android:id="@+id/button41"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 6" />

                    <Button
                        android:id="@+id/button51"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 7" />

                    <Button
                        android:id="@+id/button61"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 8" />

                    <Button
                        android:id="@+id/button71"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 9" />

                    <Button
                        android:id="@+id/button81"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 10" />

                    <Button
                        android:id="@+id/button91"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 11" />

                    <Button
                        android:id="@+id/button101"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 12" />

                    <Button
                        android:id="@+id/button1121"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Button 13" />
                </LinearLayout>
            </LinearLayout>
        </ScrollView>
    </HorizontalScrollView>

</LinearLayout>












Top




Posts related to android.


1. Share image and text Twitter using your Android Application Programatically

2. The Android Virtual Device 'myEmulator' is currently running an emulator and cannot be deleted.

3. Make Android View Scrollable both Horizontally and Vertically

4. Can we move apps like WhatsApp, Facebook to external MicroSD card

5. Parsing Data for android-21 failed unsupported major.minor version 51.0

6. Android : Prevent App for rotation landscape or portrait

7. ADT quit unexpectedly error on Mac OSX Android Eclipse SDK

8. Android-Failed to install apk on device EOF Timeout Error

9. How to change Android EditText Cursor Color

10. JavaDocs for Android SDK Eclipse IDE

11. Two Buttons next to each other in Android Layout

12. Change Title text for Android Activity using java code

13. How to add Newline to text in Android TextView

14. Android : Unable to load VM from snapshot : Mac OS X Error

15. INVALID FILE NAME: MUST CONTAIN ONLY [a-z0-9_.] Android Eclipse Error

16. Hide Tittle bar and Navigation bar from android activity

17. appcompat_v7 errors after updates to API level 21 Material Theme

18. How to Copy Text to Android Clipboard Programatically ClipboardManager (Both Old and New SDK)

19. [Solution] Running Android Lint has encountered a problem NullPointerException Error

20. Remove Trailing zeros BigDecimal Java

    more...






Popular tags
android
x 175
eclipse
x 29
notepadplusplus
x 20
macosx
x 14
sharepoint
x 14
html
x 14
mac
x 13
androidstudio
x 11




1000+ C Programs     PHP Tutorial     JSON Tutorial     Swift Tutorial     India Pinocdes     About Us     Privacy Policy


Code2care © 2012-17