Put the Scroll View under the Up and Down Button

Question

I want to show the scrollView under the Up and Down button as show in picture. And after taping on up and down arrow scroll bar should be scroll and after long press on the up and down button it should be scrolled continue till the end point. Please tell me how we can Implement this.

Thanks in Advance.

Answer 1

Perform ScrollView .pageScroll() or ScrollView.smoothScrollBy() on the tap event of the button.

Use a Runnable to continues invoke ScrollView.scrollBy() when long press event happens. I wrote a demo for you.

public class TestAndroidActivity extends Activity implements OnTouchListener,
        OnGestureListener {
    private static final String TAG = "TestAndroid";
    private Handler mHandler = new Handler();
    private ScrollView mScrollView;
    private Button mBtnUp;
    private Button mBtnDown;
    private View mCurBtn;
    private GestureDetector mDetecor;

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        mScrollView = (ScrollView) findViewById(R.id.scroll);
        mBtnUp = (Button) findViewById(R.id.btn_up);
        mBtnDown = (Button) findViewById(R.id.btn_down);
        mBtnUp.setOnTouchListener(this);
        mBtnDown.setOnTouchListener(this);
        mDetecor = new GestureDetector(this, this);
    }

    private long mStartTime = 0;
    private float mSpeed = 0.5f;
    private Runnable mScrollRunnable = new Runnable() {

        @Override
        public void run() {
            int dy = (int) ((SystemClock.uptimeMillis() - mStartTime) * mSpeed);
            mStartTime = SystemClock.uptimeMillis();
            int direction = getCurrentBtnDirection();
            if (direction == View.FOCUS_UP)
                dy *= -1;
            mScrollView.scrollBy(0, dy);
            mHandler.post(this);
        }
    };

    private int getCurrentBtnDirection() {
        if (mCurBtn == mBtnUp) {
            return View.FOCUS_UP;
        } else if (mCurBtn == mBtnDown) {
            return View.FOCUS_DOWN;
        } else
            return 0;
    }

    private void perfromPageScroll() {
        int direction = getCurrentBtnDirection();
        mScrollView.pageScroll(direction);
    }

    private void stopContinuousScroll() {
        mStartTime = 0;
        mHandler.removeCallbacks(mScrollRunnable);
    }

    private void startContinuousScroll() {
        mStartTime = SystemClock.uptimeMillis();
        mHandler.post(mScrollRunnable);
    }

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        mCurBtn = v;
        mDetecor.onTouchEvent(event);
        if (event.getAction() == MotionEvent.ACTION_UP) {
            stopContinuousScroll();
        }
        return true;
    }

    @Override
    public boolean onSingleTapUp(MotionEvent e) {
        perfromPageScroll();
        return true;
    }

    @Override
    public void onLongPress(MotionEvent e) {
        startContinuousScroll();
    }

    @Override
    public boolean onDown(MotionEvent e) {
        return false;
    }

    @Override
    public void onShowPress(MotionEvent e) {
    }

    @Override
    public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
            float distanceY) {
        return false;
    }

    @Override
    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
            float velocityY) {
        return false;
    }

}

If you want to detect the scroll state of the ScrollView to enable or disable the buttons, you must write a CustomView to extends ScrollView and override the OnScrollChanged() method.

EDIT: add the layout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ScrollView
        android:id="@+id/scroll"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="1\n\n\n\n\n\n2\n\n\n\n\n\n3\n\n\n\n\n4\n\n\n\n5\n\n"
            android:textSize="32sp" />
    </ScrollView>

    <Button
        android:id="@+id/btn_up"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:text="up" />

    <Button
        android:id="@+id/btn_down"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:text="down" />

</RelativeLayout>

EDIT2: If you are using a ListView, you can use ListView.smoothScrollBy() to replace ScrollView.scrollBy(). There is not a pageScroll() method in ListView, write it by yourself, it's not very hard.

EDIT3: pageScroll for ListView

private void pageScroll(ListView l) {
    l.smoothScrollBy(l.getHeight(), 300);
}

Answer 2

For going to Top you can use the method

ScrollView.fullScroll(ScrollView.FOCUS_UP)

For scrolling portions.. basically you can use the function

ScrollView.smoothScrollTo (int x, int y)

You can get the current X, Y positions by getScrollX() and getScrollY() and then add some amount to scroll further.