How to use the react-native-windows.supportKeyboard function in react-native-windows

To help you get started, we’ve selected a few react-native-windows examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github microsoft / react-native-windows / vnext / src / RNTester / js / KeyboardFocusExample.windows.tsx View on Github external
StyleSheet,
  Text,
  TextInput,
  TouchableHighlight,
  TouchableOpacity,
  TouchableWithoutFeedback,
} from 'react-native';
import {
  supportKeyboard,
  IKeyboardEvent,
  ViewWindows,
  Picker,
} from 'react-native-windows';

// TextInput2 is used to verify supportKeyboard + focus
const TextInput2 = supportKeyboard(TextInput);

const styles = StyleSheet.create({
  border: {
    borderStyle: 'dotted',
    borderColor: 'black',
  },
  keyComponentRoot: {
    borderWidth: 2,
    flexDirection: 'column',
    marginVertical: 5,
    backgroundColor: 'whitesmoke',
    justifyContent: 'space-around',
  },
  keyEnterVisualizer: {
    margin: 5,
    alignItems: 'center',
github microsoft / react-native-windows / vnext / src / RNTester / js / KeyboardExtensionExample.windows.tsx View on Github external
/**
 * Copyright (c) Microsoft Corporation. All rights reserved.
 * Licensed under the MIT License.
 * @format
 */

import * as React from 'react';
import {View, StyleSheet, Text, TextInput} from 'react-native';
import {
  supportKeyboard,
  IHandledKeyboardEvent,
  IKeyboardEvent,
  HandledEventPhase,
} from 'react-native-windows';

const ViewWindows = supportKeyboard(View);

const styles = StyleSheet.create({
  border: {
    borderStyle: 'dotted',
    borderColor: 'black',
  },
  keyComponentRoot: {
    borderWidth: 2,
    flexDirection: 'row',
    marginVertical: 5,
    backgroundColor: 'whitesmoke',
    justifyContent: 'space-around',
  },
  keyEnterVisualizer: {
    margin: 5,
    alignItems: 'center',