ViewPagerAndroid не отображается внутри ScrollView (используя Reacnative) - PullRequest
1 голос
/ 19 мая 2019

Я пытаюсь использовать ViewPagerAndroid внутри ScrollView, но ничего не отображается, как это.

enter image description here

После того, как я добавлю contentContainerStyle={{ flex: 1 }}в ScrollView, ViewPagerAndroid будет отображаться правильно, но вся страница не сможет прокручиваться следующим образом enter image description here

(вся страница не может прокручивать только часть FlatListможно прокрутить)

Это контейнер страницы

    <ScrollView contentContainerStyle={{ flex: 1 }}>
      <View style={styles.container}>
        <CustomHeader/>
        {Platform.OS === 'android'
          ? (
            <CategoryViewPager>
              <View
                key="0"
                style={styles.viewContent}
              >
                <DishesListContainer />
              </View>
              <View
                key="1"
                style={styles.viewContent}
              >
                <Text>Second page 2</Text>
              </View>
            </CategoryViewPager>
          )
          : (
            <Text>IOS Support later</Text>
          )
        }
      </View>
    </ScrollView>

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'red',
  },
  viewContent: {
    paddingLeft: dimens.level_12,
    paddingRight: dimens.level_12,
  },
})

Это ViewPager

// CategoryViewPager/index.js

  <View style={styles.container}>
    <CustomTabsButton/>
    <ViewPagerAndroid
      style={styles.viewPager}
    >
      {this.props.children}
    </ViewPagerAndroid>
  </View>

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  viewPager: {
    flex: 1,
    backgroundColor: setColors.mainBg,
  },
})

Это FlatList part

// DishesListContainer/index.js

const DishesListContainer = props => (
  <View>
    {props.isShowTitleBar && (
      <CategoryTitleBar />
    )}
    {props.dishes && (
      <FlatList
        style={styles.listContainer}
        data={props.dishes}
        keyExtractor={item => `${item.pk}-${item.sk}`}
        numColumns={Dimensions.get('window').width > 600 ? 3 : 2}
        renderItem={({ item }) => (
          <DishesList
            photoUrl={item.photoUrls[0]}
            name={item.name}
            priceRange={item.priceRange}
          />
        )}
      />
    )}
  </View>
)

Так как мне сделать, чтобы ViewPager показывал правильно, а также заставить ScrollView нормально работать (прокручивать весь экран)

Спасибо!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...