Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Stroke with MaskedView not working #17

Closed
perroudsky opened this issue Jun 16, 2022 · 1 comment
Closed

Stroke with MaskedView not working #17

perroudsky opened this issue Jun 16, 2022 · 1 comment

Comments

@perroudsky
Copy link

Hi, I can't apply borders to squircle with an Image

 <MaskedView
    style={{
     height: 78,
     width: 94,
    }}
    maskElement={
     <SquircleView
      style={StyleSheet.absoluteFill}
      squircleParams={{
       cornerRadius: 22,
       cornerSmoothing: 1,
       fillColor: "pink",
       strokeColor: "#000000",
       strokeWidth: 2,
      }}
     />
    }
   >
    <Image
     style={StyleSheet.absoluteFill}
     source={{
      uri: "https://images.unsplash.com/photo-1655219282830-7ecd31afac68?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1287&q=80",
     }}
    />
   </MaskedView>
@phamfoo
Copy link
Owner

phamfoo commented Jun 17, 2022

That's just how MaskedView works. If you replace SquircleView with a normal View the result would be the same.
Try putting another SquircleView with stroke and transparent fill on top of the Image.

@phamfoo phamfoo closed this as completed Jun 17, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants