react-native-popup icon indicating copy to clipboard operation
react-native-popup copied to clipboard

TouchableHighlight goes right through the tooltip

Open cablegunmaster opened this issue 9 years ago • 3 comments

I got it working but the tooltip centers itself right below my button. Which makes the button unseeable, and the text unreadable.

Layered: Normal screen everything except 1 thing becomes grey. The tooltip gets layered ontop of everything EXCEPT the TouchableHighlight button. which shines above everything else.

import React,{
    Component,
    StyleSheet,
    Text,
    TextInput,
    View,
    TouchableHighlight
} from 'react-native';
import Popup from 'react-native-popup';

export default class SomeClass extends Component {

    onPressFunction() {
        this.popup.tip({
            content: 'come on!'
        });
    }

render() {
           <View style={styles.container}>
                    <Popup ref={(popup) => { this.popup = popup }}/>
                    <TouchableHighlight style={styles.FunctionBodyButton} >
                        <Text style={styles.FunctiondBodyButtonText} onPress={this.onPressFunction.bind(this)}>
                            Do something in the middle of my screen                        
                     </Text>
                    </TouchableHighlight>
        </View>
}

}

const styles = StyleSheet.create({
    FunctionBodyButton: {
        padding: 10,
        marginTop: 50,
        borderRadius: 25,
        backgroundColor: '#1fa345'
    },
    FunctionBodyButtonText: {
        fontSize: 18,
        color: 'white',
        textAlign: 'center'
    }
});

Also : TouchableNativeFeedback seems to suffer the same fate. Specs: react-native: 0.23.1 react-native-popup: 0.5.2

The idea is really good , but right now if I wanna use the tooltip like its in the overlay state.

cablegunmaster avatar Apr 13 '16 15:04 cablegunmaster

didn't test this but i know React native enforces z-index based on the order you define the components

you should try putting the Popup as the last component within the view tag after the TouchableHighlight

lwhiteley avatar Jul 11 '16 23:07 lwhiteley

undefined is not an object (evaluating 'this.popup.confirm') in sub module?

khanhdd83 avatar Aug 11 '16 03:08 khanhdd83

@khanhdd83 you should post yours in a new issue with better context on what you have done so someone can attempt to solve it.. similar to the main body of this post

lwhiteley avatar Aug 12 '16 11:08 lwhiteley