Android ScrollView ignores its border (Screenshots attached)

Question

Trying to set border to ScrollView component. On iOS it works just fine, but not on Android:

 scrollView: {   
   borderColor: '#000000',
   borderStyle: 'solid',
   borderWidth: (1),
 }

Nice black border on iOS:

No black border on Android:

Try here: https://rnplay.org/apps/cJbAjg

Answer 1

Can't really explain why, but one of the fixes is the following:

var styles = StyleSheet.create({   
  container: {
    marginTop: 20,
    marginHorizontal: 1,
    borderRadius: 8,
    borderColor: 'black',
    borderStyle: 'solid',
    borderWidth: 1,   
  }, 
  scrollView: {         
    height: 40,   
  },   
  item: {       
    backgroundColor: '#ddd',
    borderRadius: (5),
    padding: 5,
    margin: 5,   
  } 
});

I've tested this on an android device using rn 0.26.0

Answer 2

Instead of the prop styles use contentContainerStyle

<ScrollView contentContainerStyle={styles.scrollView}></ScrollView>

Answer 3

<View
style={{overflow : "hidden" , borderRadius : 20}}
>
<ScrollView>
{/*Your other view*/}
</ScrollView>
</View>