How to Set the Starting Position of a Scrollview

How to set the starting position of a ScrollView?

Yes, that is possible:

ScrollView.scrollTo(int x, int y);
ScrollView.smoothScrollTo(int x, int y);
ScrollView.smoothScrollBy(int x, int y);

can be used for that. The x and y parameters are the coordinates to scroll to on the horizontal and vertical axis.

Example in code:

    @Override   
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.your_layout);

        ScrollView sv = (ScrollView) findViewById(R.id.scrollView);
        sv.scrollTo(0, 100);
     }

In that example, once the Activity is started, your ScrollView will be scrolled down 100 pixels.

You can also try to delay the scrolling process:

final ScrollView sv = (ScrollView) findViewById(R.id.scrollView);

Handler h = new Handler();

h.postDelayed(new Runnable() {

    @Override
    public void run() {
        sv.scrollTo(0, 100);            
    }
}, 250); // 250 ms delay

Is it possible to define the initial position of a ScrollView in the xml?

This can be done with the android:scrollX and android:scrollY attributes which are defined in the documentation as:

The initial [horiztonal/vertical] scroll offset, in pixels.

Android setting position of hortizontal scrollview

Right now you are trying to scroll to the top-left corner of the HorizontalScrollView rather than the position of the button. Try scrolling to the (x, y) position of the button like this:

HorizontalScrollView hsv = (HorizontalScrollView) findViewById(R.id.ScrollView);
Button button = (Button) findViewById(R.id.btn5);
int x, y;
x = button.getLeft();
y = button.getTop();
hsv.scrollTo(x, y);

EDIT:

This code will not behave as you would expect if it is placed in onCreate(). Even though you have called setContentView(), the layout has not been measured and initialized yet. This means that the getLeft() and getTop() methods will both return 0. Trying to set the scroll position before the layout is fully initialized has no effect, so you need to call hsv.scrollTo() some time after onCreate().

One option that seems to work is placing the code in onWindowFocusChanged():

@Override
public void onWindowFocusChanged(boolean hasFocus) {
    super.onWindowFocusChanged(hasFocus);

    HorizontalScrollView hsv = (HorizontalScrollView) findViewById(R.id.ScrollView);
    Button button = (Button) findViewById(R.id.btn5);
    int x, y;
    x = button.getLeft();
    y = button.getTop();
    hsv.scrollTo(x, y);
}

However, this function is called every time the Activity gains or loses focus, so you might end up updating the scroll position more often than you intended.

A more elegant solution would be to subclass the HorizontalScrollView and set the scroll position in onMeasure(), after you know that the view has been initialized. To do this, I split your layout into two files and added a new class named MyHorizontalScrollView:

package com.theisenp.test;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.HorizontalScrollView;

public class MyHorizontalScrollView extends HorizontalScrollView {

    public MyHorizontalScrollView(Context context) {
        super(context);
        addButtons(context);
    }

    public MyHorizontalScrollView(Context context, AttributeSet attrs) {
        super(context, attrs);
        addButtons(context);
    }

    /**
     * Inflates the layout containing the buttons and adds them to the ScrollView
     * @param context
     */
    private void addButtons(Context context) {
        View buttons = inflate(context, R.layout.buttons, null);
        addView(buttons);

    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);

        //Find button 5 and scroll to its location
        View button = findViewById(R.id.btn5);
        scrollTo(button.getLeft(), button.getTop());
    }
}

When MyHorizontalScrollView is created, it automatically inflates and adds the button layout. Then after calling the super onMeasure() (so that it knows the layout has finished initializing) it sets the scroll position.

This is the new main.xml. It only contains the new MyHorizontalScrollView, though you could easily put it inside of a Linear or Relative layout and add other view elements. (You would replace com.theisenp.test with the name of the package where MyHorizontalScrollView is located):

<?xml version="1.0" encoding="utf-8"?>
<com.theisenp.test.MyHorizontalScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/ScrollView"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:background="@null"
android:scrollbars="none" />

And this is the buttons.xml layout that is automatically inflated by MyHorizontalScrollView:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="horizontal" >

    <Button
    android:id="@+id/btn0"
    android:layout_width="100dp"
    android:layout_height="fill_parent"
    android:layout_marginBottom="-5dp"
    android:text="btn0" />

    <Button
    android:id="@+id/btn1"
    android:layout_width="100dp"
    android:layout_height="fill_parent"
    android:layout_marginBottom="-5dp"
    android:text="bnt1" />

    <Button
    android:id="@+id/btn2"
    android:layout_width="100dp"
    android:layout_height="fill_parent"
    android:layout_marginBottom="-5dp"
    android:text="btn2" />

    <Button
    android:id="@+id/btn3"
    android:layout_width="100dp"
    android:layout_height="fill_parent"
    android:layout_marginBottom="-5dp"
    android:text="btn3" />

    <Button
    android:id="@+id/btn4"
    android:layout_width="100dp"
    android:layout_height="fill_parent"
    android:layout_marginBottom="-5dp"
    android:text="btn4" />

    <Button
    android:id="@+id/btn5"
    android:layout_width="100dp"
    android:layout_height="fill_parent"
    android:layout_marginBottom="-5dp"
    android:text="btn5" />

</LinearLayout>

Android : Set scroll view position to start at 80% from top of screen

use layout_weight

<RelativeLayout 
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

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

        <View
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="8" />

        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="2">

        </ScrollView>

</LinearLayout>

</RelativeLayout>

SwiftUI: How to set position of ScrollView to Top Left? (both scrolls is enabled)

Update: Xcode 13.4 / macOS 12.4

The issue is still there, but now the solution is simpler using ScrollViewReader:

struct TestTwoAxisScrollView: View {
    var body: some View {
        ScrollViewReader { sp in
            ScrollView([.horizontal, .vertical]) {
                VStack {
                    ForEach(0..<100) { _ in
                        self.row()
                    }
                }
                .border(Color.green)
                .id("root")
            }
            .border(Color.gray)
            .padding()
            .onAppear {
                sp.scrollTo("root", anchor: .topLeading)
            }
        }
    }

    func row() -> some View {
        Text(test)
            .border(Color.red) // uncomment to see border
    }
}

Original

Here is possible approach. Tested with Xcode 11.2 / macOS 10.15.3

Demo:

Code (complete testable module, borders are added for better visibility of each component):

import SwiftUI

let test = """
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="12118" systemVersion="16A323" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
"""

struct ScrollViewHelper: NSViewRepresentable {
    func makeNSView(context: NSViewRepresentableContext<ScrollViewHelper>) -> NSView {
        let view = NSView(frame: .zero)
        DispatchQueue.main.async { // << must be async, so view got into view hierarchy
            view.enclosingScrollView?.contentView.scroll(to: .zero)
            view.enclosingScrollView?.reflectScrolledClipView(view.enclosingScrollView!.contentView)
        }
        return view
    }

    func updateNSView(_ nsView: NSView, context: NSViewRepresentableContext<ScrollViewHelper>) {
    }
}

struct TestTwoAxisScrollView: View {
    var body: some View {
        ScrollView([.horizontal, .vertical]) {
            VStack {
                ForEach(0..<100) { _ in
                    self.row()
                }
            }
            .background(ScrollViewHelper()) // << active part !!
            .border(Color.green) // uncomment to see border
        }
        .border(Color.gray)
        .padding()
    }

    func row() -> some View {
        Text(test)
            .border(Color.red) // uncomment to see border
    }
}

struct TestTwoAxisScrollView_Previews: PreviewProvider {
    static var previews: some View {
        TestTwoAxisScrollView()
    }
}

backup

Set scroll position from a different view in scrollview

What a horrible MRE!! This is what you could mean and how it works:

One. you have to put .id()s on your ScrollView, otherwise scollTo doesn't know where to go.

Two. There have to be enough entries in the ScrollView. If all are visible, the scrollTo won't do anything.

class EnvironmentVariables: ObservableObject {
    @Published var currentIndexforPosts: Int = 0
}


struct ContentView: View {
    
    @StateObject  var environmentVariables = EnvironmentVariables()
    
    var body: some View {
        VStack {
            ButtonView()
            ScrollView1()
        }
        .environmentObject(environmentVariables)
    }
}


struct ScrollView1: View {
    
    @EnvironmentObject var environmentVariables: EnvironmentVariables
    
    var body: some View {
        
        ScrollView {
            ScrollViewReader { value in
                LazyVStack {
                    ForEach(0..<100) { i in
                        Text ("Text \(i)").id(i)
                            .font(.title)
                    }
                }
                
              .onChange(of: environmentVariables.currentIndexforPosts) { _ in
                    if environmentVariables.currentIndexforPosts >= 0 {
                        withAnimation {
                            value.scrollTo(environmentVariables.currentIndexforPosts, anchor: .top)
                        }
                    }
                }
            }
        }
    }
}
            
struct ButtonView: View {
    
    @EnvironmentObject var environmentVariables: EnvironmentVariables

    var body: some View {
        
        Button("Go to next") {
            environmentVariables.currentIndexforPosts += 10
        }
        .padding()
        
        Button("Go to previous") {
            environmentVariables.currentIndexforPosts -= 10
        }
    }
}

---

Related Topics