full size image background 효과

return (
    <View style={{ flex:1, backgroundColor: 'transparent' }}>
        <Image
            style={styles.backgroundImage}
            source={img}
            blurRadius={3}
        />
        <ScrollView style={{ flex:1 }}>
            <Text>ddd</Text>
            <Text>ddd</Text>
            <Text>ddd</Text>
            <Text>ddd</Text>
        </ScrollView>
    </View>
)

const styles = {
    containerStyle: {
        flex:1,
        backgroundColor: 'transparent'
    },
    backgroundImage: {
        position: 'absolute',
        top: 0,
        right: 0,
        bottom: 0,
        left: 0,
        opacity: 0.2,
        width: null,
        height: null,
        resizeMode: 'stretch',
    }
};

스타일 값 밖으로 빼야함. 코드 테스트 하느라 정리 안함.

View에 backgroundColor transparent 안 주면, scrollview 내용 배경색이 흰색됨.

width, heigth null 안주면 사진이 계속 원래 사이즈와 ratio에 맞춰 나옴 

원래 아래와 같이 했다가 opacity 때문에 내용물도 opacity 먹어서  수정함..

backgroundImage1: {
    flex: 1,
    width: null,
    height: null,
    resizeMode: 'stretch',
    opacity: 0.2
}