Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit c8903cb

Browse files
author
Luke Brandon Farrell
authored
Merge pull request #6 from aikewoody/master
A few improvements to the project
2 parents 2d2785f + 313cca5 commit c8903cb

File tree

4 files changed

+30
-19
lines changed

4 files changed

+30
-19
lines changed

‎README.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,10 +52,11 @@ The `<VirtualKeyboard />` uses two arrays to allow you to set keys and define cu
5252

5353
| Prop | Type | Optional | Default | Description |
5454
| --------------- | ------------- | --------- | -------------------- | --------------------------------------------------------------------------------------- |
55-
| onRef | any | No | | onRef allows you to call the `throwError(message)` method. |
55+
| onRef | any | Yes | | onRef allows you to call the `throwError(message)` method. |
5656
| onKeyDown | function | Yes | | Callback function triggered when a key is pressed. Returns the key value. |
5757
| onChange | function | Yes | | Callback function triggered when a key is pressed. Returns the full string. |
5858
| onCustomKey | function | Yes | | Callback function triggered when custom left button is pressed, use with `onChange` |
59+
| onPressFunction | string | Yes | onPressIn | Determines which function to call when the user pressed a key. Could be one of the following three functions: `onPress`, `onPressIn` or `onPressOut`. For an explanation how the functions work take a look at the GitHub page from the [react-native-material-ripple](https://github.com/n4kz/react-native-material-ripple#properties) project.
5960
| keyboard | array | Yes | See VirtualKeyboard.js | 4 x 3 matrix containing the value for each key. See VirtualKeyboard.js. |
6061
| keyboardFunc | array | Yes | See VirtualKeyboard.js | 4 x 3 matrix containing custom functions for each key. Pass null for no function. |
6162
| keyboardCustomKeyImage | number | Yes | null | Image for the custom key (bottom left key) |

‎VirtualKeyboard.js‎

Lines changed: 26 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
*/
55

66
import React, { Component } from "react";
7-
import { View, Image, Text, StyleSheet, Platform, Vibration } from "react-native";
7+
import { View, Image, Text, StyleSheet, Platform, Vibration,ViewPropTypes } from "react-native";
88
import Ripple from "react-native-material-ripple";
99
import PropTypes from "prop-types";
1010

@@ -35,7 +35,9 @@ class VirtualKeyboard extends Component {
3535
* Executed when the component is mounted to the screen.
3636
*/
3737
componentDidMount() {
38-
this.props.onRef(this);
38+
if(this.props.onRef) {
39+
this.props.onRef(this);
40+
}
3941
}
4042

4143
/**
@@ -44,7 +46,9 @@ class VirtualKeyboard extends Component {
4446
* Executed when the component is unmounted from the screen
4547
*/
4648
componentWillUnmount() {
47-
this.props.onRef(undefined);
49+
if(this.props.onRef) {
50+
this.props.onRef(undefined);
51+
}
4852
}
4953

5054
/**
@@ -154,6 +158,7 @@ class VirtualKeyboard extends Component {
154158
vibration,
155159
onKeyDown,
156160
onChange,
161+
onPressFunction,
157162
// Style Props
158163
keyStyle,
159164
keyTextStyle,
@@ -192,16 +197,19 @@ class VirtualKeyboard extends Component {
192197

193198
// We want to block keyboard interactions if it has been disabled.
194199
if (!disabled) {
200+
const onPress = () => {
201+
if(vibration) Vibration.vibrate(50);
202+
203+
keyboardFuncSet[row][column] ? keyboardFuncSet[row][column]() : keyDown(entity)
204+
};
195205
return (
196206
<Ripple
197207
testID={`VirtualKeyboard-${entity}`}
198208
rippleColor={"#000"}
199209
key={column}
200-
onPressIn={() => {
201-
if(vibration) Vibration.vibrate(50);
202-
203-
keyboardFuncSet[row][column] ? keyboardFuncSet[row][column]() : keyDown(entity)
204-
}}
210+
onPress={onPressFunction === 'onPress' ? onPress : undefined}
211+
onPressIn={!onPressFunction || onPressFunction === 'onPressIn' ? onPress : undefined}
212+
onPressOut={onPressFunction === 'onPressOut' ? onPress : undefined}
205213
style={[keyContainerStyle, keyDefaultStyle, keyStyle]}
206214
>
207215
{keyJsx}
@@ -290,23 +298,24 @@ class VirtualKeyboard extends Component {
290298
}
291299

292300
VirtualKeyboard.propTypes = {
293-
onRef: PropTypes.any.isRequired,
301+
onRef: PropTypes.any,
294302
onKeyDown: PropTypes.func,
295303
onChange: PropTypes.func,
296304
onCustomKey: PropTypes.func,
305+
onPressFunction: PropTypes.oneOf(['onPress', 'onPressIn', 'onPressOut']),
297306
keyboard: PropTypes.array,
298307
keyboardFunc: PropTypes.array,
299308
keyboardCustomKeyImage: PropTypes.number,
300309
keyboardMessageDisplayTime: PropTypes.number,
301310
vibration: PropTypes.bool,
302311
// Style props
303-
keyboardStyle: PropTypes.object,
304-
keyboardDisabledStyle: PropTypes.object,
305-
keyStyle: PropTypes.object,
306-
keyTextStyle: PropTypes.object,
307-
keyImageStyle: PropTypes.object,
308-
messageStyle: PropTypes.object,
309-
messageTextStyle: PropTypes.object
312+
keyboardStyle: ViewPropTypes.style,
313+
keyboardDisabledStyle: ViewPropTypes.style,
314+
keyStyle: ViewPropTypes.style,
315+
keyTextStyle: ViewPropTypes.style,
316+
keyImageStyle: ViewPropTypes.style,
317+
messageStyle: ViewPropTypes.style,
318+
messageTextStyle: ViewPropTypes.style
310319
};
311320

312321
VirtualKeyboard.defaultProps = {
@@ -315,6 +324,7 @@ VirtualKeyboard.defaultProps = {
315324
// Use this array to set custom functions for certain keys.
316325
keyboardFunc: null,
317326
keyboardMessageDisplayTime: 3000,
327+
onPressFunction: 'onPressIn',
318328
vibration: false,
319329
};
320330

‎package-lock.json‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,4 +45,4 @@
4545
"prettier": "^2.3.0",
4646
"semantic-release": "^17.4.3"
4747
}
48-
}
48+
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /