mirror of
https://github.com/zhigang1992/react-native-keyboard-manager.git
synced 2026-04-29 12:55:02 +08:00
Exposed PreviousNextView to wrap TextInput and solve the problem of navigating between fields in Modal. #8
This commit is contained in:
@@ -31,9 +31,10 @@ import {
|
||||
TextInput,
|
||||
ScrollView,
|
||||
Switch,
|
||||
Modal,
|
||||
} from 'react-native';
|
||||
|
||||
import KeyboardManager from 'react-native-keyboard-manager'
|
||||
import KeyboardManager, { PreviousNextView } from 'react-native-keyboard-manager'
|
||||
|
||||
KeyboardManager.setEnable(true);
|
||||
KeyboardManager.setEnableDebugging(false);
|
||||
@@ -42,7 +43,7 @@ KeyboardManager.setPreventShowingBottomBlankSpace(true);
|
||||
KeyboardManager.setEnableAutoToolbar(true);
|
||||
KeyboardManager.setToolbarDoneBarButtonItemText("Close");
|
||||
KeyboardManager.setToolbarManageBehaviour(0);
|
||||
KeyboardManager.setToolbarPreviousNextButtonEnable(false);
|
||||
KeyboardManager.setToolbarPreviousNextButtonEnable(true);
|
||||
KeyboardManager.setShouldToolbarUsesTextFieldTintColor(false);
|
||||
KeyboardManager.setShouldShowTextFieldPlaceholder(true);
|
||||
KeyboardManager.setOverrideKeyboardAppearance(false);
|
||||
@@ -116,20 +117,30 @@ class SampleKeyboardManager extends Component {
|
||||
|
||||
return (
|
||||
<View style={{ flex: 1 }}>
|
||||
{/* ScrollView is not required, but may be required in some cases. */}
|
||||
<ScrollView>
|
||||
|
||||
<View style={{ alignItems: "center" }}>
|
||||
<Text style={{ marginTop: 50, textAlign: "center" }}>React-Native Keyboard Manager</Text>
|
||||
<View style={{ marginTop: 10, flexDirection: "row", alignItems: "center" }}>
|
||||
<Text>Enable/Disable </Text>
|
||||
<Switch onValueChange={this.enableDisable.bind(this)}
|
||||
value={this.state.enableDisable} />
|
||||
</View>
|
||||
</View>
|
||||
{/* To try with Modal, uncomment the two following lines. */}
|
||||
{/* <Modal visible={true}> */}
|
||||
{/* <PreviousNextView style={{ flex: 1 }}> */}
|
||||
|
||||
{/* ScrollView is not required, but may be needed in some cases. */}
|
||||
<ScrollView>
|
||||
|
||||
<View style={{ alignItems: "center" }}>
|
||||
<Text style={{ marginTop: 50, textAlign: "center" }}>React-Native Keyboard Manager</Text>
|
||||
<View style={{ marginTop: 10, flexDirection: "row", alignItems: "center" }}>
|
||||
<Text>Enable/Disable </Text>
|
||||
<Switch onValueChange={this.enableDisable.bind(this)}
|
||||
value={this.state.enableDisable} />
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View>{inputs}</View>
|
||||
|
||||
</ScrollView>
|
||||
|
||||
{/* </PreviousNextView> */}
|
||||
{/* </Modal> */}
|
||||
|
||||
<View>{inputs}</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -960,7 +960,7 @@
|
||||
);
|
||||
runOnlyForDeploymentPostprocessing = 0;
|
||||
shellPath = /bin/sh;
|
||||
shellScript = "export NODE_BINARY=node\n../node_modules/react-native/packager/react-native-xcode.sh";
|
||||
shellScript = "export NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh";
|
||||
};
|
||||
2D02E4CB1E0B4B27006451C7 /* Bundle React Native Code And Images */ = {
|
||||
isa = PBXShellScriptBuildPhase;
|
||||
|
||||
Reference in New Issue
Block a user