- 投稿日:2020-06-26T17:40:57+09:00
UITextDocumentProxyのsetMarkedTextを(まだ)使ってはいけない。
概要
iOSのKeyboard Extensionを自作するとき、必ず触ることになるのが
UITextDocumentProxy
です。iOS13からは
setMarkedText(_:selectedRange)
というメソッドが追加され、これを使うことで標準の日本語キーボードのような「入力中のテキストの背景の色が変わる」挙動が実現できるように思われます。実際、4月に複数のキーボードで調べたところでは2つのKeyboard Extension(flickとFlick SKK)が
setMarkedText()
を用いていると思われる挙動を示していました。挙動の詳細
チェックした環境はiOS 13.5.1のiPhoneSE(第1世代・第2世代)です。
少し何が起きているかわかりにくいですが、消える瞬間にテキストをタップしています。標準キーボードを利用してきたユーザが期待する動作はカーソルの移動ですが、(何故か)入力中のテキストが全く見えなくなる挙動を示します。
これはFlick SKKについても同一です。そもそもsetMarkedText(_:selectedRange)
がこの挙動を示すので、当然といえば当然です。まだ使うべきではない
入力中のテキストの背景の色が変わるのは標準キーボードで当然の動作ですし、できれば実装したほうがユーザフレンドリーな動作です。が、それによってできることが著しく制限されます。実際に制限されるのは
- 入力中の(キーボードを介さない)カーソル移動
- 入力中の(キーボードを介さない)変換範囲の指定
- 入力中の(キーボードを介さない)誤字の修正
- 入力中の範囲外タップによる入力終了
- flickでは範囲外タップで入力中の文章が消滅する(仕様?)
などなどです。当然バグの温床でもあります。
さらに、この挙動を修正する方法は今のところありません。散々格闘しましたが、標準のキーボードはおそらくsetMarkedText
を使っていないんじゃないかと思います。もし詳しいことをご存知の方いらっしゃいましたら教えてください。
ただ、いろいろなKeyboard Extensionのレビューを見て見ると「入力中の文字の色が変わるようにしてくれ」という要望はかなり多いです。iOS12までは「appleに言ってくれ」が答えでしたが、iOS13では「appleに文句言ってくれ」と答えたいところでしょう。なんでappleはわざわざこんな使えないものを追加したんだ……。参考
- 投稿日:2020-06-26T13:05:03+09:00
【Swift】 Color Setを使うときのちょっとした注意
iOS11(Xcode9)からImage Setのように、色を定義することの出来るColor Setが実装され、Storyboard上での色管理の煩わしさから開放されました。
もちろん、コード上からも使うことが出来てとても便利なのですが、ちょっとした注意点があったので、備忘録として残しておこうかなと思いました。あるプロジェクトで遭遇したことなのですが、Storyboard上で定義したLabelで、コード上からAttributedTextで色を変更しようとしたときのことです。
iOS13で起動したときは確かに色が変わっていたはずなのに、iOS11や12の端末で起動してみると、色が変わらない
という現象が発生しました。
Great Scott!(BTTF大好き)と何度もつぶやきながら調べましたが、どうやら原因は「Storyboard上でColor Setを使用しているから」のようです。特にサイトを調べたりしたわけではなく、Storyboardをいじっていたら発見したことなので本当かは定かではありませんが、少なくともStoryboard上で該当LabelのtextColorを、Xcodeで最初から定義されている色(black, white, default, etc...)に戻して再度アプリを実行すると、
ちゃんと色が変わってる!
という結果が得られました。
まとめ
iOS11や12を対象とするプロジェクトでColor Setを使う場合、Storyboardで設定した色を変更するときは注意が必要です。
意外と見落としがちなところかもしれないので、実際にそういったアプリを制作されている方は少しだけ注意したほうがいいかもしれません
- 投稿日:2020-06-26T01:12:24+09:00
MacでゼロからのFlutter環境構築
ゼロからFlutterの開発環境を構築するには以下の3つの手順が必要です。
- Flutterを導入する
- Xcodeを設定する
- Android Studioを設定する
Flutterを導入する
Flutterのインストール
Flutter公式からインストーラーをダウンロードします。
ダウンロードしたzip
を解答して、flutter
フォルダを任意の場所に置いてください。
私はアプリケーション直下に配置しました。コマンドの有効化
- flutterフォルダの中にある
flutter_console.bat
を実行します。 これでFlutter Consoleからflutterコマンドが使えるようになります。Pathを通す
~/.bashrc
または~/.bash_profile
に以下を記述する。$ export PATH=$PATH:/Applications/flutter/binXcodeを設定する
Xcodeのインストール
App Storeで
Xcode
を検索してインストールします。
Xcodeのインストールにはかなり時間がかかります。時間の余裕がある時にインストールをしておくのをおすすめします。Xcodeの設定を変更する
このコマンドを実装する。これでXcodeが使用できるようになる。
$ sudo xcode-select —switch /Applications/Xcode.app/Contents/Developerライセンスを表示して同意する。
コマンドから行ってもいいし、Xcodeを起動するでもOK。$ sudo xcodebuild -licenseAndroid Studio
Android Studioのインストール
App Storeで
Android Studio
を検索してインストールします。
こちらもなかなかお時間がかかりましたね。。Flutter Pluginのインストール
メニュー>Android Studio>Preference...
を選択する。
横のメニューから
Plugin
を選択。Flutter
を検索してインストールする。
※画像はインストール済み
Android SDK toolsを設定する
Android SDK tools
のパケージ名がAndroid-SDK command line tools
に変わっていて、flutterからAndroid SDKをみにいくのに失敗するようになっていました。
なのでこちらを設定します。先ほどと同様に
メニュー>Android Studio>Preference...
を選択します。
横のメニューのAndroid SDK
を選択した、SDK Tools
の一覧をみます。
こちらしたの方にあるHide Obsolete Packages
のチェックを外すとAndroid SDK tools
が一覧に出てくるのでインストールします。
動作確認
ターミナルで以下を実行。こんな感じで返ってくれば完了です。
No devices available
これはシミュレーターを起動していない時に出るので、実際作業するときはお忘れなく。$ flutter doctor Doctor summary (to see all details, run flutter doctor -v): [✓] Flutter (Channel stable, v1.12.13+hotfix.9, on Mac OS X 10.15.4 19E266, locale ja-JP) [✓] Android toolchain - develop for Android devices (Android SDK version 29.0.3) [✓] Xcode - develop for iOS and macOS (Xcode 11.5) [✓] Android Studio (version 3.6) [!] Connected device ! No devices available ! Doctor found issues in 1 category.