search

nandorojo / zeego

Menus for React (Native) done right.
https://zeego.dev
MIT License
1.42k stars 41 forks source link

Change borderRadius in ContextMenu.Preview #56

Open tanlucvo opened 10 months ago

tanlucvo commented 10 months ago

I use borderRadius but it not work

https://github.com/nandorojo/zeego/assets/57494001/0eb04e26-282c-4ec2-9f8e-800b0188fde4

tanlucvo commented 10 months ago 
<View style={{ width: 80, height: 80, borderRadius: 40 }}>
  <DropdownMenu.Root style={{ width: 80, height: 80, borderRadius: 40 }}>
    <DropdownMenu.Trigger action="press">
      <Image source={{uri:"https://picsum.photos/400/400"}} style={{ width: 80, height: 80, borderRadius: 40 }} />
    </DropdownMenu.Trigger>
    <DropdownMenu.Content style={{ borderRadius: 100 }}>
      <DropdownMenu.Preview>
        <Image source={{uri:"https://picsum.photos/400/400"}}  style={{ width: 200, height: 200, borderRadius: 100 }} />
      </DropdownMenu.Preview>
    </DropdownMenu.Content>
  </DropdownMenu.Root>
</View>
nandorojo commented 10 months ago

border radius needs to get passed as a prop to the preview

tanlucvo commented 10 months ago

I try use prop borderRadius in preview, It seems not work

https://github.com/nandorojo/zeego/assets/57494001/f2096bf8-2516-42d9-81ed-cd988f729d30

<DropdownMenu.Root style={{ width: 80, height: 80, borderRadius: 40 }}>
  <DropdownMenu.Trigger>
    <AsyncImage uri={'https://picsum.photos/400/400'} style={{ width: 80, height: 80, borderRadius: 40 }} />
  </DropdownMenu.Trigger>
  <DropdownMenu.Content>
    <DropdownMenu.Preview borderRadius={100} backgroundColor="#ff0000">
      <AsyncImage uri={'https://picsum.photos/400/400'} style={{ width: 200, height: 200, borderRadius: 100 }} />
    </DropdownMenu.Preview>
  </DropdownMenu.Content>
</DropdownMenu.Root>
nandorojo commented 10 months ago

might be a bug of the upstream ios library. but also, your usage of preview looks wrong. it receives a function as a child

nandorojo commented 10 months ago

for the record, you only need to use the preview if it has a different view than the trigger. if it’s the same view, you can leave the preview out

mikescott commented 10 months ago

I'm having the same issue.

Expo SDK: 49

React Native: 0.72.1

iOS: 15 and 16

borderRadius has no effect on ContextMenu.Preview

nandorojo commented 10 months ago

interesting, i’m thinking it’s an issue with the upstream library. does setting it to 0 work? i wonder if there’s a max or not

ushan-swivel commented 8 months ago

anyone found a solution?

nandorojo commented 8 months ago

Can you open an issue on the upstream iOS library?