Android 单击按钮上的反应本机水平滚动

我是英语初学者。从中可以看到，我有一个滚动视图和两个按钮。我已经成功地实现了scroll视图，该视图运行良好，但我也希望它们能够在按下按钮时自动滚动。我尝试了很多次搜索，但没有找到任何有效的。因此，我们非常感谢您的帮助。请在下面找到我的代码

import React，{Component}来自'React'；
从“react native”导入{AppRegistry，StyleSheet，Text，View，Dimensions，ScrollView，Button}；
var screenWidth=Dimensions.get（'window'）.width；
导出默认类App扩展React.Component{
render（）{
返回(
屏幕1
屏幕2
);
}
}
const styles=StyleSheet.create({
主容器：{
背景色：“#abe3a8”，
弹性：1，
为内容辩护：“中心”，
对齐项目：“中心”
},
滚动容器：{
背景颜色：“#cdf1ec”，
flexGrow:1，
玛金托普：0，
宽度：屏幕宽度，
为内容辩护：“中心”，
对齐项目：“中心”
},
ScrollTextContainer：{
尺寸：20，
填充：15，
颜色：“#000”，
textAlign:“中心”
},
按钮查看容器：{
flexDirection:'行'，
paddingTop:35，
},
按钮容器：{
填充：30，
},
});您可以尝试：

onPress = (index) => {
   this.scroll.scrollTo({x: index * screenWidth, y: 0, animated: true})
}

 <Button title="Screen 1" 
    onPress = {() => this.onPress(0)}
 />
 ...
  <Button title="Screen 2" 
    onPress = {() => this.onPress(1)}
 />
 ...
 <ScrollView
      horizontal={true}
      pagingEnabled={true}
      showsHorizontalScrollIndicator={false}
      ref = {re => this.scroll = re}
 >
 </ScrollView>

onPress=（索引）=>{
this.scroll.scrollTo（{x:index*screenWidth，y:0，动画：true}）
}
这个.onPress（0）}
/>
...
这个.onPress（1）}
/>
...
this.scroll=re}
>
我不能保证这是最好的方法，因为我没有与React Native进行过很多合作

将
this.scroll.scrollTo（{x:calculatedStartPositionOfTheScreen}）
添加到按钮按下处理程序中

e、 g


...
{this.scroll.scrollTo（{x:0}}}/>
{this.scroll.scrollTo（{x:screenWidth}}}}/>
{this.scroll.scrollTo（{x:screenWidth*2}}}/>
...
this.scroll=node}
>
...

对于大型项目中的用例，你也可以考虑
试试这个

<View>
    ...
    <View style={styles.ButtonContainer}>
        <Button title="Screen 1" onPress={() => { this.refs.scroll.scrollTo({ x: 0 }) }} />
    </View>
    <View style={styles.ButtonContainer}>
        <Button title="Screen 2" onPress={() => { this.refs.scroll.scrollTo({ x: screenWidth }) }} />
    </View>
    <View style={styles.ButtonContainer}>
        <Button title="Screen 3" onPress={() => { this.refs.scroll.scrollTo({ x: screenWidth * 2 }) }} />
    </View>
    ...
    <ScrollView
        horizontal={true}
        pagingEnabled={true}
        showsHorizontalScrollIndicator={false}
        ref={'scroll'}
    >
    ...
    </ScrollView>
</View >


...
{this.refs.scroll.scrollTo（{x:0}）}}/>
{this.refs.scroll.scrollTo（{x:screenWidth}}}}/>
{this.refs.scroll.scrollTo（{x:screenWidth*2}}}/>
...
...
我遵循了您的指导，但当我单击按钮时出现错误--未定义不是函数（评估“\u this2.scroll.ScrollToIndex（{index:1，animated:true}）”仍然是错误。。未定义不是一个函数。。选中图像更改以使用：this.scroll.scrollTo（{x:index*screenWidth，y:0，animated:true}）找不到您引用的按钮的任何单击功能？您想在哪里自动滚动？现在滚动正常。。但我也有两个按钮，点击后会自动滚动到相应的屏幕。（请查看图片）这很令人惊讶，可能有一些基本问题，我在这里运行了它，它适用于android和IOS，修改了你的代码并添加了onPress方法，谢谢。。建立了一个新项目并进行了尝试，结果成功了。。我想我以前的项目有点问题。。
<View>
    ...
    <View style={styles.ButtonContainer}>
        <Button title="Screen 1" onPress={() => { this.refs.scroll.scrollTo({ x: 0 }) }} />
    </View>
    <View style={styles.ButtonContainer}>
        <Button title="Screen 2" onPress={() => { this.refs.scroll.scrollTo({ x: screenWidth }) }} />
    </View>
    <View style={styles.ButtonContainer}>
        <Button title="Screen 3" onPress={() => { this.refs.scroll.scrollTo({ x: screenWidth * 2 }) }} />
    </View>
    ...
    <ScrollView
        horizontal={true}
        pagingEnabled={true}
        showsHorizontalScrollIndicator={false}
        ref={'scroll'}
    >
    ...
    </ScrollView>
</View >