React Native android View перекрывается при использовании transform (scaleX) - PullRequest
Новая
       11

React Native android View перекрывается при использовании transform (scaleX)

0 голосов
/ 29 октября 2018

Я пытаюсь создать эллиптическую рамку для горизонтального прокрутки экрана в React Native, для которого я использую transform (scaleX), представление работает отлично на iOS, но в Android перекрывается (смотрите на скриншоте) , правый нижний угол). Как я могу исправить эту проблему? 

         <SwipeView.Slide>
            <View flex={1} />
            <View style={styles.footerContainer}>
              <View style={styles.footer}>
              </View>
            </View>
          </SwipeView.Slide>
          <SwipeView.Slide>
            <View flex={1} />
            <View style={styles.footerContainer}>
              <View style={styles.footer}>
              </View>
            </View>
          </SwipeView.Slide>



const styles = StyleSheet.create({
footer: {
    width: DEVICE_WIDTH,
    borderTopLeftRadius: DEVICE_WIDTH / 1.5,
    borderTopRightRadius: DEVICE_WIDTH / 1.5,
    overflow: 'hidden',
    transform: [{scaleX: 1.3}],
    backgroundColor: 'rgba(255, 255, 255, 0.8)',
    height: DEVICE_HEIGHT * 0.45,
    minHeight: 260,
    paddingTop: 45,
    paddingHorizontal: 25,
    alignItems: 'center',
      flex: 1
  },
    footerContainer: {
      height: DEVICE_HEIGHT * 0.45,
      minHeight: 280,
      paddingTop: Platform.select({
          ios: () => 55,
          android: () => 35,
      })(),
      paddingHorizontal: 25,
      width: DEVICE_WIDTH,
      overflow: 'hidden',
      alignItems: 'center',
  }
});

preview

...