Question

我正在尝试制作一个自定义键盘来替换我的React Native应用中的本机iOS键盘。但是，当我将Swift委托模式连接到React Native时，我遇到了麻烦。有人知道我能做什么吗？

我完全用Swift开发了一个测试应用程序（以编程方式），以确保自定义键盘可以正常工作并且按钮动作可以注册（可以）。但是，当我将此工作正常的Swift键盘连接到React Native时，这些按钮将停止工作。当我单击文本输入时，键盘会正常显示（目前，它也是在Swift中制作的，但很快就会更改），但是按钮根本不会注册（打印语句不起作用）。

我还尝试从委托模式切换为仅使用回调/函数。这次，按钮注册（打印语句有效），但是文本输入从未更新，并且我用来保存按钮值的任何变量都被重置。

KeyboardViewManager.swift-在测试应用中，这是viewcontroller。


class KeyboardViewManager: RCTViewManager {
  let textField: UITextField = UITextField(frame: CGRect(x: 80, y: 134, width: 255.00, height: 78.00));

  override func view() -> UIView! {
    // initialize custom keyboard
    let keyboardView = Keyboard(frame: CGRect(x: 0, y: 0, width: 375, height: 440))

    // the view controller will be notified by the keyboard whenever a key is tapped
    keyboardView.delegate = self as? KeyboardDelegate 

    textField.inputView = keyboardView

    return textField
  }


  func keyWasTapped(character: String) {
      if (character == "<") {
        textField.deleteBackward()
      } else {
        textField.insertText(character)
      }
  }


  func closeIOSKeyboard() {
      textField.endEditing(true)
  }

}

自定义键盘的类


protocol KeyboardDelegate: class {
  func keyWasTapped(character: String)
  func closeIOSKeyboard()
}

class Keyboard: UIView  {

  weak var delegate: KeyboardDelegate?

  // MARK:- keyboard initialization

  required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    initializeSubviews()
  }

  override init(frame: CGRect) {
    super.init(frame: frame)
    initializeSubviews()
  }


  func makeButtonWithText(text:String, x:Int, y:Int, width:Int, height:Int, fontSize:CGFloat = 24, bgColor:UIColor = UIColor.clear) -> UIButton {
    let myButton = UIButton(type: UIButton.ButtonType.system)
    myButton.frame = CGRect(x: x, y: y, width: width, height: height)

    myButton.setTitle(text, for: UIControl.State.normal)
    myButton.setTitleColor(UIColor.white, for: UIControl.State.normal)
    myButton.titleLabel?.font = .systemFont(ofSize: fontSize)

    myButton.backgroundColor = bgColor

    myButton.addTarget(self,
                       action: #selector(keyTapped),
                       for: .allEvents
    )
    return myButton
  }

  func initializeSubviews() {
    let view = UIView()
    view.backgroundColor = UIColor(red: 42/255, green: 41/255, blue: 39/255, alpha: 1)
    view.addSubview(makeButtonWithText(text: "1",x: 40,y: 40,width: 85,height: 37))

    // similar code for other buttons here

    view.addSubview(makeButtonWithText(text: "OK",x: 0,y: 340,width: 375,height: 50,
                                       fontSize: 15, bgColor: UIColor(red: 15/255, green: 154/255, blue: 142/255, alpha: 1)
    ))

    self.addSubview(view)
    view.frame = self.bounds
  }

  @objc
  @IBAction func keyTapped(sender: UIButton) {

    KeyboardViewManager().keyTapped(sender: sender, character: sender.titleLabel!.text!)

    // When a button is tapped, send that information to the
    // delegate (ie, the view controller)

    self.delegate?.keyWasTapped(character: sender.titleLabel!.text!)
  }


  @objc
  @IBAction func closeKeyboard(sender: UIButton) {
    // When a ok is tapped, close the keyboard
    self.delegate?.closeIOSKeyboard()
  }

}

注意：我觉得这个问题可能与使用RCTViewManager而不是viewController来操纵UIView有关。不幸的是，我是Swift和React Native的新手，我不确定RCTViewManager的工作原理！

我希望每次在键盘上单击按钮时都会更新文本输入。而是，单击按钮时，什么也不会发生。幸运的是，键盘的样式确实正确。

编辑：这是我的React-Native应用程序的示例代码（不是我的实际应用程序，但这是我如何在Swift和React Native之间进行连接的示例）


import React, {Fragment} from 'react';
import {
  View,
  requireNativeComponent,
} from 'react-native';

const CustomKeyboard = requireNativeComponent("KeyboardView");

import {
  Header,
  LearnMoreLinks,
  Colors,
  DebugInstructions,
  ReloadInstructions,
} from 'react-native/Libraries/NewAppScreen';

const App = () => {
  return (
    <View style={{flex: 1, alignItems: "stretch"}}>
      <CustomKeyboard style={{flex: 1, alignItems: "center", justifyContent: "center", position: 'relative', top: -100}}/>

    </View>
  );

如何使Swift委派在React Native iOS App中工作

0 个答案: