“реагировать на Native Scrollview Item внизу” Ответ

React Native Expo Scrollview Scroll внизу

import React, { useRef } from 'react';
import { ScrollView } from 'react-native';

const ScreenComponent = (props) => {
  const scrollViewRef = useRef();
  return (
    <ScrollView
      ref={scrollViewRef}
      onContentSizeChange={() => scrollViewRef.current.scrollToEnd({ animated: true })}
    />
  );
};
Worried Wombat

реагировать на Native Scrollview Item внизу

/*
The key is the contentContainerStyle property
(doc: https://facebook.github.io/react-native/docs/scrollview#contentcontainerstyle).
"These styles will be applied to the scroll view content container which wraps all of the child views. "

After setting flexGrow: 1, justifyContent: 'space-between',
flexDirection: 'column' in contentContainerStyle,
one can set justifyContent: 'flex-start' for the upper container view 
with the text, and justifyContent: 'flex-end' for the lower 
container view with the buttons. 
*/

<ScrollView
  contentContainerStyle={{ flexGrow: 1, justifyContent: 'space-between', flexDirection: 'column' }}
  style={{ backgroundColor: 'white', paddingBottom: 20 }}
>
  <View style={{ flex: 1, justifyContent: 'flex-start' }}>
    <Text>Some text with different length in different cases, or some input fileds.</Text>
  </View>
  <View style={{ flex: 1, justifyContent: 'flex-end' }}>
    <View>
      <TouchableOpacity style={[commonStyles.greenButton, styles.buttonPadding]}>
        <Text style={commonStyles.greenButtonTitle}>Next</Text>
      </TouchableOpacity>
    </View>
    <View>
      <TouchableOpacity style={styles.cancelButtonContainer}>
        <Text style={styles.cancelButton}>Cancel</Text>
      </TouchableOpacity>
    </View>
  </View>
</ScrollView>
Beautiful Bee

Ответы похожие на “реагировать на Native Scrollview Item внизу”

Вопросы похожие на “реагировать на Native Scrollview Item внизу”

Больше похожих ответов на “реагировать на Native Scrollview Item внизу” по JavaScript

Смотреть популярные ответы по языку

Смотреть другие языки программирования

Shell/Bash
C#
C++
C
CSS
HTML
Java
JavaScript
Objective-C
PHP
Python
Sql
Swift
Ruby
TypeScript
Go
Kotlin
Assembly
R
VBA
Scala
Rust
Dart
Elixir
Clojure
Haskell
Matlab
Erlang
Cobol
Fortran
Scheme
Perl
Groovy
Lua
Julia
Delphi
Abap
Lisp
Prolog
Pascal
ActionScript
Basic
Solidity
PowerShell
GDScript
Excel