/Javascript/React/React native bordered image drop with shadow fix

React native bordered image drop with shadow fix

Image border shadow react native

shadowColor: "#000",
shadowOffset: {
	width: 0,
	height: 7,
},
shadowOpacity: 0.43,
shadowRadius: 25,

elevation: 15,

Source: ethercreative.github.io

React native bordered image drop with shadow fix

<View
	style={{
       flexGrow: 1,
       backgroundColor: Colors.white,
       borderTopLeftRadius: 40,
       borderTopRightRadius: 40,
      }}
>
          <View
            style={[
              Theme.center,
              Theme.dropShadow,
              {
                top: -100,
                width: 190,
                height: 190,
                borderRadius: 190 / 2,
                backgroundColor: Colors.white,
              },
            ]}
          >
            <Image
              source={require("../../assets/resto/chef_jude.png")}
              style={[
                {
                  width: 180,
                  height: 180,
                  borderRadius: 180 / 2,
                },
              ]}
            />
          </View>
        </View>

Similar codes

0 vote109 views1 answer
Loading react circular progress
Javascript React
0 vote111 views1 answer
React onpaste get value
Javascript React
0 vote111 views1 answer
Reactjs npm take photo
Javascript React
23 votes138 views6 answers
React hooks useeffect
Javascript React
11 votes127 views2 answers
How to refresh the page using react
Javascript React
1 vote138 views2 answers
How to get window size in react js
Javascript React
7 votes110 views2 answers
Hover react
Javascript React
1 vote115 views2 answers
Export 'Redirect' (imported as 'Redirect') was not found in 'react-router-dom'
Javascript React
2 votes131 views4 answers
Can't perform a React state update on an unmounted component
Javascript React
1 vote108 views1 answer
How to change the tab text in React
Javascript React