dominicstop / react-native-ios-context-menu

A react-native component to use context menu's (UIMenu) on iOS 13/14+
MIT License
572 stars 29 forks source link

CustomPreview with button => Button can not click #42

Closed fukemy closed 2 years ago

fukemy commented 2 years ago

Screen Shot 2022-06-16 at 15 41 55 HI, thanks for great lib, I am using your lib to build a screen with custom reaction preview like this, each reaction icon is TouchableOpacity

const renderReactionButton = (type) => {
        return <TouchableOpacity
        onPress={() => console.log('choose reaction', type)}
        style={{
            width: 36,
            height: 36,
            borderRadius: 18,
            justifyContent: 'center',
            alignItems: 'center',
            backgroundColor: allReactionsType.includes(`${type}`) ? theme.lightBlue : '#FFFFFF40',
            margin: 8
        }}>
            <Image
                source={getReactionIcon(type)}
                style={{
                    width: 24,
                    height: 24
                }} />
        </TouchableOpacity>
    }

But the problem is when click into icon, the context menu dismiss and it's does not fire event into TouchableOpacity, can u help?

fukemy commented 2 years ago

it's look like native ios problem, the screen was covered by a transparent ScrollView from Apple Api, I done this when developer my native Swift App

https://user-images.githubusercontent.com/8202437/174037708-9d4f85ee-0116-467a-86dc-6d5c4c158768.MP4

Here is my logic:

  1. I created CustomPreviewScreen contain Image + ReactionView (vertical align), note: ReactionView is only a blank view with fixed size
  2. I passed longPress view into CustomPreviewScreen => convert to ImageData and show inside Image
  3. Inside willDisplayContextMenu delegate, i find the view which named _UIPlatterClippingView, it's the top ScrollView from Apple api, then add reactionView into it with fixed size + fixed position from CustomPreviewScreen

    I need to do it's because CustomPreviewScreen still below the ScrollView from Apple, so it's can not click. So, i find the frame of ReactionView from CustomPreviewScreen, add the reactionview in exactly potision. then it's done As you can see the image here

    Can u double check it's again?

fukemy commented 2 years ago

I just double check again with your ios code, then I can not found willDisplayContextMenu delegate, in my class Im using collectionView, so it provide

@available(iOS 13.0, *)
    func collectionView(_ collectionView: UICollectionView, willDisplayContextMenu configuration: UIContextMenuConfiguration, animator: UIContextMenuInteractionAnimating?)
SamuelScheit commented 2 years ago

duplicate of #31 You are trying to get press events from the custom preview screen, which is not possible. You need to use the newly added auxiliary view property to be able to add a custom view with pressables enabled.