/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

1 vote279 views1 answer
React center a text
Javascript React
3 votes242 views1 answer
React.children.only expected to receive a single react element child
Javascript React
0 vote232 views1 answer
Reactnaviataion change title
Javascript React
1 vote197 views2 answers
React check internet connection
Javascript React
11 votes295 views4 answers
How to check for react version
Javascript React
21 votes209 views4 answers
Setinterval react
Javascript React
48 votes262 views6 answers
Comment in react
Javascript React
-1 vote191 views1 answer
How to create scroll to top button in reactjs example code
Javascript React
0 vote301 views1 answer
React native flexbox 2 columns 1 fixed width
Javascript React
0 vote184 views1 answer
Undefined is not a function (near '...(0, _reactNative.createStackNavigator)...')
Javascript React