diff --git a/README.md b/README.md index ebc4a00..1786f41 100644 --- a/README.md +++ b/README.md @@ -17,6 +17,7 @@ A react-native component from displaying tooltip. Uses UIMenuController. - `actions`: Array of actions `[{text: 'Copy', onPress: () => Clipboard.set(this.someValue) }]` - `longPress`: Boolean indicating if the tooltip should be showing on longPress, false by default. +- `arrowDirection`: String indicating the direction of the tooltip arrow. Possible values are: `up`, `down`, `left`, and `right`. Default is `down`. #### Props from TouchableHighlight.propTypes @@ -60,6 +61,7 @@ var tooltip = React.createClass({ ]} underlayColor='transparent' longPress={true} + arrowDirection='down' style={styles.textinput} > diff --git a/ToolTip.ios.js b/ToolTip.ios.js index fc0b460..72269fb 100644 --- a/ToolTip.ios.js +++ b/ToolTip.ios.js @@ -16,13 +16,20 @@ var propTypes = { text: React.PropTypes.string.isRequired, onPress: React.PropTypes.func, })), + arrowDirection: React.PropTypes.oneOf(['up', 'down', 'left', 'right']), longPress: React.PropTypes.bool, ...TouchableHighlight.propTypes, }; var ViewClass = React.createClass({ + getDefaultProps: function() { + return { + arrowDirection: 'down' + }; + }, + showMenu: function() { - ToolTipMenu.show(findNodeHandle(this.refs.toolTipText), this.getOptionTexts()); + ToolTipMenu.show(findNodeHandle(this.refs.toolTipText), this.getOptionTexts(), this.props.arrowDirection); }, getOptionTexts: function() { diff --git a/ToolTipMenu/ToolTipMenu.m b/ToolTipMenu/ToolTipMenu.m index 81be73d..c905703 100644 --- a/ToolTipMenu/ToolTipMenu.m +++ b/ToolTipMenu/ToolTipMenu.m @@ -16,7 +16,8 @@ - (dispatch_queue_t)methodQueue } RCT_EXPORT_METHOD(show:(nonnull NSNumber *)reactTag - items: (NSArray *)items) + items: (NSArray *)items + arrowDirection: (NSString *)arrowDirection) { UIView *view = [self.bridge.uiManager viewForReactTag:reactTag]; NSArray *buttons = items; @@ -30,7 +31,16 @@ - (dispatch_queue_t)methodQueue [view becomeFirstResponder]; UIMenuController *menuCont = [UIMenuController sharedMenuController]; [menuCont setTargetRect:view.frame inView:view.superview]; - menuCont.arrowDirection = UIMenuControllerArrowDown; + + if([arrowDirection isEqualToString: @"up"]){ + menuCont.arrowDirection = UIMenuControllerArrowUp; + }else if ([arrowDirection isEqualToString: @"right"]){ + menuCont.arrowDirection = UIMenuControllerArrowRight; + }else if ([arrowDirection isEqualToString: @"left"]) { + menuCont.arrowDirection = UIMenuControllerArrowLeft; + } else { + menuCont.arrowDirection = UIMenuControllerArrowDown; + } menuCont.menuItems = menuItems; [menuCont setMenuVisible:YES animated:YES]; } diff --git a/package.json b/package.json index ac52781..133f2c8 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-tooltip", - "version": "4.1.0", + "version": "4.1.1", "description": "A react-native wrapper for showing tooltips", "main": "ToolTip.ios.js", "author": {