Question

I'm trying to have a HorizontalScrollView with 8 buttons which I can code fine. But I want to have the layout double the width of the screen so there are 4 buttons on the screen and the user has to scroll to see more (I'm don't want a "snap" scroll).

To do this I've manually change the width of the HorizontalScrollView to say "770dp" but whenever I specify the width it looks correct but does not scroll. Changing the width back to "wrap_content" and it works fine but does not look correct (5 or 6 buttons on the screen).

My xml code is below. This is just an extract - there are many more layouts/views on the screen.

I will be wanting to programmatically specify the width later the double the phone's screen size didn't want to move on to that until I worked out why the above isn't working. I have included that code if anyone wants to lend a hand, but it is NOT related to the above non-scrolling problem.

Thanks in advance for any help you can give. Much appreciated.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="true"
android:orientation="vertical"
tools:context="com.example.testScroll.MainActivity"
tools:ignore="MergeRootFrame" >

<HorizontalScrollView 
android:id="@+id/topline_Buttons"
android:layout_width="770dp"
android:layout_height="wrap_content"
android:fillViewport="true"
android:scrollbars="none">

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="0dp"
    android:orientation="horizontal" >

    <Button
        android:id="@+id/button_1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="0dp"
        android:layout_weight="1"
        android:text="@string/button_1" />

    <Button
        android:id="@+id/button_2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="0dp"
        android:layout_weight="1"
        android:text="@string/button_2" />

    <Button
        android:id="@+id/button_3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="0dp"
        android:layout_weight="1"
        android:text="@string/button_3" />

    <Button
        android:id="@+id/button_4"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="0dp"
        android:layout_weight="1"
        android:text="@string/button_4" />

    <Button
        android:id="@+id/button_5"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="0dp"
        android:layout_weight="1"
        android:text="@string/button_5" />

    <Button
        android:id="@+id/button_6"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="0dp"
        android:layout_weight="1"
        android:text="@string/button_6" />

    <Button
        android:id="@+id/button_7"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="0dp"
        android:layout_weight="1"
        android:text="@string/button_7" />

    <Button
        android:id="@+id/button_8"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="0dp"
        android:layout_weight="1"
        android:text="@string/button_8" />


</LinearLayout>

</HorizontalScrollView>
</LinearLayout>

Here is what I have found on SO HERE to programmatically set the width. ALthough I haven't got it working yet

    //Set HorizontalScrollView double screen width
    DisplayMetrics metrics = new DisplayMetrics();
    getWindowManager().getDefaultDisplay().getMetrics(metrics);

    LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(metrics.widthPixels*2, LayoutParams.MATCH_PARENT);
    LinearLayout topline_Buttons = (LinearLayout) findViewById(R.id.topline_Buttons);
    topline_Buttons.setLayoutParams(params);
Was it helpful?

Solution 3

Ok I've worked it out! Or at least one way of doing it... If there is a better way let me know.

Instead of specifying the width of the LinearLayout or HorizontalScrollView I needed to specify the width of the buttons inside to 1/4th of the screensize. The HorizontalScrollView should fill the whole page, the LinearLayout wrap content and so the buttons make enough space for themselves.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="true"
android:orientation="vertical">


 <HorizontalScrollView 
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:fillViewport="true"
 android:scrollbars="none">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="0dp"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/button_1"
            android:layout_width="92dp"  // Specify width here manually
            android:layout_height="wrap_content"
            android:text="1" />
... etc

That worked but obviously wouldn't look right with many screen sizes, so I specified it programmatically:

Display display = getWindowManager().getDefaultDisplay();
    Point size = new Point();
    display.getSize(size);
    int screenWidth = size.x / 4;

    button_1 = (Button)findViewById(R.id.button_1);

    button_1.setLayoutParams(new LinearLayout.LayoutParams(screenWidth, LayoutParams.WRAP_CONTENT));

OTHER TIPS

I think trying to increase the size of the scroll view is the wrong way to approach this. If you want the layout that the scroll view wraps to be larger, then change the height of the layout.

Remember that the buttons are in the LinearLayout, and that is currently set to wrap content, so it will only take the space needed to display its children (the buttons).

Try this (with the rest of your code of course):

<HorizontalScrollView 
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:scrollbars="none">


<LinearLayout
    android:id="@+id/topline_Buttons"
    android:layout_width="770dp"
    android:layout_height="wrap_content"
    android:layout_margin="0dp"
    android:orientation="horizontal" >
// try this way,hope this will help you..

Note : if fix HorizontalScrollView layout_width then it's not Scrollable so you have gave layout_width "wrap_content"

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:focusable="true"
    android:orientation="vertical">

    <HorizontalScrollView
        android:id="@+id/topline_Buttons"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:fillViewport="true"
        android:scrollbars="none">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">
            <Button
                android:id="@+id/button_1"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="button_1" />

            <Button
                android:id="@+id/button_2"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="button_2" />

            <Button
                android:id="@+id/button_3"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="button_3" />

            <Button
                android:id="@+id/button_4"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="button_4" />

            <Button
                android:id="@+id/button_5"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="button_5" />

            <Button
                android:id="@+id/button_6"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="button_6" />

            <Button
                android:id="@+id/button_7"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="button_7" />

            <Button
                android:id="@+id/button_8"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="button_8" />
        </LinearLayout>
    </HorizontalScrollView>
</LinearLayout>

**Also remove this peace of code from Activity**

DisplayMetrics metrics = new DisplayMetrics();
        getWindowManager().getDefaultDisplay().getMetrics(metrics);
        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(metrics.widthPixels*2, LinearLayout.LayoutParams.MATCH_PARENT);
        topline_Buttons.setLayoutParams(params);
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top