React Native 解決 iOS 上鍵盤遮擋 TextInput 問題

我們在用 React Native 開發應用的時候,總會碰到讓用戶輸入某些內容的需求和功能,那麼也總會有當我們的輸入框在屏幕下半部分並且 focus 這個輸入框時,鍵盤彈出並會遮擋在其上,使用戶在輸入時完全不知道自己在輸什麼。

IQKeyboardManager 這個第三方庫通過了解,是目前在 github 上 star 數最高的解決問題的第三方插件。

它描述自己的插件具有如下有點:

” Codeless, Zero Line Of Code ” - 不需要任何插入代碼
” Works Automatically ” - 完全自動化
” No More UIScrollView ” - 不需要任何 UIScrollView 組件
” No More Subclasses ” - 不需要子類
” No More Manual Work ” - 不需要配置性的工作
” No More #imports ” - 不需要 import

在使用它之前,我查到一款管理第三方庫的管理工具 - cocoaPod。安裝過程不太複雜,但是比較好時間,但是需要注意的時候,要替換國外資源,使用淘寶的國內鏡像,你可以從這篇文章中學會如何安裝

gem sources --add https://gems.ruby-china.org/ --remove https://rubygems.org/

假設你已經安裝成功 cocoaPod ,首先進入到 React Native 的項目的根目錄,然後進入 根目錄/ios 目錄,在該文件夾下有項目的 ios 的 xcode 工程文件,執行命令:

pod init

會在當前目錄下生成 PodfilePodfile.lock 文件,然後通過 vim 打開 Podfile

# Uncomment the next line to define a global platform for your project
# ios 平臺版本
platform :ios, '9.0'    

target 'xxx' do 
  # Uncomment the next line if you're using Swift or would like to use dynamic frameworks
  # use_frameworks!

  # Pods for xxx
   # pod 第三方插件
  pod "IQKeyboardManager"  

end

之後 :wq 保存退出,執行:

pod install

等待安裝完成。

至此,第三方插件已經下載並依賴到了開發的項目上,但是當我們在 XCode 上進行編譯調試的時候,會報如下這種錯誤:

library not found for -lIQKeyboardManager

通過報錯的信息發現,是因爲 XCode 在編譯的時候,沒有找到 IQKeyboardManager 的 Library,並且打開 Frameworks 文件夾發現裏面的 libPods-xxx.a 是紅色的,因此可能是 IQKeyboardManager 的 Library 沒有進行關聯,但是在 根目錄/ios/Pods 中並咩有發現任何的關於 IQKeyboardManager 的 Library,由於本人對 IOS 開發剛剛起步,因此抱着試試看的想法將 Pod.xcodeproj 文件拖放到 Libraries 文件夾下,重新啓動發現問題解決了。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章