- 投稿日：2020-05-14T20:33:13+09:00
Flutter初心者が100日でアプリリリースするまでの記録
この記事は
Flutterの初心者が100日後にアプリリリースするまでの軌跡()を綴ったものになります。
また、Flutterでアプリ開発をしてみて思った所感などを書いていきます。Flutterからプログラミングやってみようかな? とか
アプリ開発始めてみようかな? とか
Flutterに少しでも興味がある方は特に是非読み進めてください。何故書こうと思った?
実はもう100日チャレンジを始めてから58日が経過しています。何故このタイミングなのか?
,,, 思いつきで書き始めました。強いていうなら、今Flutterについて結構盛り上がっていると思うんですよ、Youtubeとかtwitterとか某フリーランスエンジニアの方とかね。それに乗っかろうかなと思ったわけです。
開発者(筆者)スペック
専門学校で4年間プログラミング、データベース、ネットワーク等々を学び、今年の春から一部上場企業のWebエンジニアとして働いています。
研修中ですが、優しい先輩に囲まれ充実した日々を送っています。(なんか会社に提出する用みたいですね)個人開発は、ちょうど約2年ほど前から初めて,最初に触ったものはSwiftでした。当時からいろいろな言語に手を出すのが好きだった私は、Swiftさんも私の標的になってしまったわけですね。
そんなこんなで今年の2月頭に1作目となる Symplist(AppStoreで配信中)をリリースしたばかりです。
好きな言語はGo,Python3,Dartです。(記事書いている時点では。こんなものはすぐに入れ替わります。)
早速ですがFlutterを始めてみて
結論から言うと、「Flutterめっちゃ書きやすいし楽しいしビジネスとしても結構使えそうで良い！」
こう思った理由は大きく分けて3つありまして、
まず1つめですが、IOSとAndroid両方とも基本的に一つのコードで成立してしまう。
実際に実装し始めてみるとわかるんですが、これが結構感動する。今までIOSもAndroidもリリースしようと思ったら２つコードを書かないと行けなかったですし、何かと不便でした。(2つの言語が楽しめるという利点もありますが。)
次にCSSライクでUIを構築することができる
これは結構でかいんじゃないですかね。ワードプレスやらなんやらが流行っている時代ですからきっとCSSも書ける方多いと思うんです。
flexなんちゃらとか、Alignなんちゃら、padding margin うんぬんカンヌン 親と子の関係が常に成立しているって言うのもなんか似てますよね HTMLっぽいと言うか。最後に、個人開発業として収入を得やすいのでは？
正直リリースしたアプリに広告貼り付けたことないので、広告収入等どんな感じで流れてくるのかはハッキリわかりませんが、flutterで開発してIOSでもAndoroidでもリリースしてしまえば、自分が作ったアプリを少時間で多くの方に使ってもらえる。その結果広告収入も多く入る可能性が高いと言うところですよね。
少時間でと言うのは SwiftとKotlinでわざわざ開発しなくても良いと言うことです。
ただ、これだと完全に個人開発業としての話であって、「Flutterでフリーランスに俺はなる!!」とかはまだ厳しいのではないかなと思ってます。
って言うのはまだ案件が少なすぎるんですよね。それならSwiftとかKotlinとか勉強してしっかりコード書けるようになった方が断然良いです。まとめると、「個人開発で一人でFlutter使って楽しみながらアプリ作って広告収入得るとかは全然ありだけど、ガチで案件探して本気で仕事にしたいとかはまだ厳しいのでは？」です。
これに関しては色々な方の意見聞きたいので是非コメントまで。
どこが課題?
Flutter書きやすいし、楽しいし良いです。しかし完璧ではないです。
そりゃ欠点もあります。人とおんなじです。
IOSでの挙動が少し重い
最近のアップデートで結構軽くなったみたいなんですが、体感やや少し重いです。モーダルとか開くとき結構カクつきます。でもこの辺は解消まで時間の問題な気もするのでそこまで重要視する点ではないのかも(僕のコードが悪い可能性も十分ありますし)
仕事として始めるのはやや不向きである
この辺りはさっきも書いたのですが、自分から仕事探しに行こうとしたら結構難しいと思います。
本気でアプリ開発で仕事をしたいとかだったらFlutterは一旦勉強せずに、Swiftとかやる方をオススメします。でも、スタートアップの企業さんで結構Flutter取り入れているところとかあったりするんです実は。僕もお声かけいただいたことあります。
なので少しずつ流れは来てるのかな ~ と思うところもあるのですが、この辺りは全然ハッキリしないです。オワコン化してくる可能性がなきにしもあらず
今までIOS,Androidどっちも1つのコードで作ることができるフレームワークは他にもありましたよね。覚えてますか？覚えてないですね。僕も覚えてないです。
でも、覚えてないってことはそう言うことなんですよね。要はオワコン化していって誰にも使われなくなるんです。
Flutterもその可能性はないとは言い切れないです。日々情報が入れ替わる業界ですから。なのでFlutterで仕事する際もこの辺も意識して選ぶ必要があると思います。
分析大事です。残りの42日は?
そうですね 最初の方に100日後にリリースするまでの軌跡()と書いたので、気が向いたら続編と言うかFlutter系の記事もちょくちょく上げて行こうかなと思います。
最後に
そこまで長い記事ではないですが、ここまで読んでくださってありがとうございます。
Flutterバンザイ。
- 投稿日：2020-05-14T17:34:06+09:00
【Web2App】ウェブページからアプリで開くをFirebase Dynamic Linksを使って簡単に実装する方法
概要
WEBからAPPに誘導する所謂Web2AppをFirebase Dynamic Linksを利用して
インストールしている・していないに関わらず一つのリンクで挙動を変えて
インストールされていない場合はストアに、されている場合は特定のページに遷移させる流れをざっくり書いておきます。詳しいことは公式ドキュメントに書いてあるのでこちらを見てください。
Firebase Dynamic Linkspage.linkの作り方
- FirebaseコンソールのレフトメニューからDynamicLinkに遷移
- 使いたいドメインを入力（小文字と数字のみを含む 3～100 文字で****.page.linnkの形で入力）
※適当にやっちゃうと、消したあとそのドメインは１ヶ月間使えないので慎重に
独自ドメインを使った方法もあるので使いたい方は公式ドキュメントを見てください
Dynamic Links のカスタム ドメインを設定する - Firebaseの公式ドキュメントリンクの作成
４つの方法がありますが、今回の要件ではWEB2APPでアプリを開くだけでいいので
URLを短くする必要もないため手動で作成します。ダイナミックリンクの作成 - Firebaseの公式ドキュメント
ダイナミックリンクURLを手動で構築する - Firebaseの公式ドキュメントiOS
キー 説明 link 開きたいWEBのURL isi アプリストアのID ius アプリのディープリンク（バンドルIDと同じ場合は省略可能） ibi アプリのバンドルID（Firebase コンソールの [概要] ページで、アプリとプロジェクトが接続されている必要がある） 例
用途 例 アプリで開きたい画面に対応したURL https://example.com/contents/9999 開きたいアプリのバンドルID com.example.app 開きたいアプリのストアのID 999999999 https://example.page.link/?link=https://example.com/contents/9999&ibi=com.example.app&isi=999999999ストアではなくLPなどWEBページを開きたい場合に使うオプションや
ipadで挙動を分けるオプションや
プレビューページを挟まないオプションなど詳しくは公式ドキュメントを見てくださいダイナミックリンクURLを手動で構築する - Firebaseの公式ドキュメント
Android
キー 説明 link 開きたいWEBのURL apn Androidアプリのパッケージ名 例
用途 例 アプリで開きたい画面に対応したURL https://example.com/contents/9999 開きたいアプリのパッケージ名 com.example.app https://example.page.link/?link=https://example.com/contents/9999&apn=com.example.app合体
実際に利用する際はiOSとAndroidどちらでも動くようにしたいので、混ぜます。
例
https://example.page.link/?link=https://example.com/contents/9999&ibi=com.example.app&isi=999999999&apn=com.example.appキャンペーンコードなどの利用も出来るので詳しくは公式ドキュメントを見てください。
ダイナミックリンクURLを手動で構築する - Firebaseの公式ドキュメントアプリ側の処理
iOS
- PodでFirebaseDynamicLinkをインストール
Associated Domainsに 上記で作ったドメインを追加。今回だとapplinks:example.page.linkapplication:continueUserActivity:restorationHandler:に処理を追加application:openURL:options:に処理を追加詳しくは公式ドキュメントに書いてあるのでそちらを見てください。
iOSでダイナミックリンクを受信する - Firebaseの公式ドキュメントAndroid
- GradleでFirebaseDynamicLinkをインストール
- AndroidManifestの開きたいActivityに
intent-filterを追加- 開きたいActivityに処理を追加
詳しくは公式ドキュメントに書いてあるのでそちらを見てください。
iOSでダイナミックリンクを受信する - Firebaseの公式ドキュメント検証方法
- 該当アプリをアンインストールしておく
- 作成したリンクをタップ
- ストアに遷移（ここではインストールしない）
- 実機にインストールしたりFirebaseAppDistributionなどでインストール
- 該当ページに遷移
- アプリのプロセスを落とすなどして最初の画面に戻す
- 作成したリンクをタップ
- 該当ページに遷移
以上です。
- 投稿日：2020-05-14T10:08:14+09:00
SwiftUIでQRコードを表示してみる
はじめに
QRコードを生成するアプリを作ろうと思い、せっかくなのでSwiftUIで作成しました。
コードの解説
QRコードの生成
こちらは、よく検索すると出てくるコードです。いくつか検索していて気付いたのですが、
CIContext().createCGImage()を実行していないコードがあります。
outputImageでciImageが生成されているのでGPUによるレンダリングする必要があるので、長いですが実装が必要なのではないかと思います。あとハマったのは、謝り訂正レベルを指定するパラメーター"inputCorrectionLevel"には、"L"/"M"/"Q"/"H" いずれかを指定する必要があります。（数字だと思い込んでしまった・・・）
QRCodeMaker.swiftfunc make(message:String , level:Int) -> UIImage? { guard let data = message.data(using: .utf8) else { return nil } guard let qr = CIFilter(name: "CIQRCodeGenerator", parameters: ["inputMessage": data, "inputCorrectionLevel": getCorrectionText(index: level)]) else { return nil } let sizeTransform = CGAffineTransform(scaleX: 10, y: 10) guard let ciImage = qr.outputImage?.transformed(by: sizeTransform) else { return nil } guard let cgImage = CIContext().createCGImage(ciImage, from: ciImage.extent) else { return nil } let image = UIImage(cgImage: cgImage) return image }QRコード生成するコードは
QRCodeMaker.swiftとして別ファイルに分離しました。SwiftUI
基本は、VStackを用いて縦にパーツを配置しています。
QRコードの画像は中央、テキスト入力と誤り訂正レベルの選択肢は上部、生成ボタンは下部にしたいので、赤枠の箇所をSpacer()を入れることによって実現しています。
●画面レイアウト（赤枠がSpacer())
Spacer()を用いないと中央によってしまいます。
●Spacer()を用いていない画面
また、起動時はQRコード画像がありません。これは
if文でImageを表示非表示を切り替えています。ContentView.swiftif qrImage != nil { Image(uiImage: qrImage!) }終わりに
サンプルコードは、githubにアップしています。
参考にどうぞ。
- 投稿日：2020-05-14T08:24:10+09:00
【iOS】iOSアプリ開発入門~環境構築編~
iOSアプリ開発について人に教えることがあったのでいい機会だと思い基礎的な部分についてまとめていきます。
いくつか記事を投稿していくかと思うので追っていってもらえると幸いです。今回は環境構築編ということでiOS開発に必要なXcodeのインストールからシミュレータでのアプリ実行までをまとめます。
Xcodeとは
Apple社が提供するiOS、Mac用の統合開発環境(IDE)です。
iOSアプリを作成する際はこのXcodeを使って開発します。XcodeはAppStoreから無料でダウンロードできますが、インストールにはMac環境が必要となるので注意が必要です。若干処理が重いことも多くなるべく新しいMacがおすすめです。
実際にストアに公開する場合はApple Developer Program(ADP)に登録する必要があります(11,800円/年)がこちらは別途記事にします。
Xcodeインストール
こちらから入手をクリックしインストールしてください。
8GB程度あるので時間がかかります。
インストール後LaunchpadにXcodeのアイコンが表示されているはずです。
こちらの記事を投稿した現在Xcodeはバージョン11.4.1までリリースされています。
Xcode11.4.1はmacOS Catalina 10.5.14以降が必要となるのでOSバージョンに注意してください。
OSバージョンの確認は[ツールバー左上の林檎マーク]>[このMacについて]から確認できます。
Xcodeを起動すると初回のみライセンスの確認等が行われます。
基本的にすべてOKで問題ないかと。
このような画面が表示されるとインストール完了です。
プロジェクト作成
サンプルプロジェクトを作成してみます。
先程のXcodeを起動した画面のメニューから[Create a new Xcode project]を選択します。
作るアプリのテンプレートを聞かれるので指定します。
今回はiPhoneアプリなのでOSは[iOS]、アプリは[Single View App]を選択し[Next]をクリックします。
補足：Single View Appは一番シンプルなアプリの指定でなんの変哲もない画面が一つ表示されるアプリです。基本的にはこれを選んでおけばいいと思います。
もちろん後から画面の追加はできるのでご心配なく。
次にプロジェクトの設定を尋ねられるのでそれぞれ設定し[Next]をクリックします。プロジェクトの作成場所を聞かれるので
- Product Name
- プロジェクトの名前。後から変えるのは若干面倒なので考えてつける。
- Team
- ADPに登録するとプルダウンで選択できる。実機ビルドやストア公開の際はアプリへの署名が必要になるため指定する必要がある。あとから簡単に変更できるのでとりあえず[None]でいい。
- Organization Name
- 開発者の名前。ソースコードのコメントに出てくるが練習用なら基本的になんでもいい。
- Organization Identifier
- 開発者のID。他の開発者と被らないようにつける。メールアドレスの逆ドメインでつけることが多い
- Bundle Identifier
- アプリの一意となるID。後から簡単に変えられる。すでに公開されているアプリのIDと被らないように設定する必要がある。
- Language
- 開発言語。Swift or Objective-Cを選択できる。最近はSwiftに移行しているため特別な理由がなければSwiftを選択するのをおすすめする。
- User Interface
- レイアウトの作成方法。Storyboard or SwiftUIを選択できる。SwiftUIはiOS13以降でないと使用できないためしばらくはStoryboardを選択するのが無難。今後はSwiftUIに以降するかと思われる。
このようなプロジェクトの画面が開かれると作成完了です。
アプリビルド
それでは実際にアプリを実行してみましょう。
画面左上から起動するiPhoneのシミュレータを選択し実行ボタンをクリックします。
※command + R でも実行できます。
シミュレータが立ち上がり真っ白な画面が表示されると成功です。
あとはソースコードに処理を書いたりStoryboardでUIを配置していけばアプリらしくなっていきます。最後に
以上で環境構築編は終了です。
これでiOSアプリを開発するための準備は整いました。
途中でStoryboardやBundleIDなどXcodeならではの用語が出てきましたが１つずつ調べながら進めていってください。
更に進めていくとApple様ならではの仕様も多く、iOSアプリ以外を経験したエンジニアでも躓くことは多いようです。
ひとまずあまり深く考えず作りたいものを作ってみてください。質問等あればコメントに頂けると返信できるかと思うのでご遠慮無くどうぞ。
次回はレイアウト作成について説明します。
レイアウト作成編１：https://qiita.com/euJcIKfcqwnzDui/items/ba37adae94e07c89d404
- 投稿日：2020-05-14T08:24:10+09:00
【Swift】iOSアプリ開発入門~環境構築編~
iOSアプリ開発について人に教えることがあったのでいい機会だと思い基礎的な部分についてまとめていきます。
いくつか記事を投稿していくかと思うので追っていってもらえると幸いです。今回は環境構築編ということでiOS開発に必要なXcodeのインストールからシミュレータでのアプリ実行までをまとめます。
Xcodeとは
Apple社が提供するiOS、Mac用の統合開発環境(IDE)です。
iOSアプリを作成する際はこのXcodeを使って開発します。XcodeはAppStoreから無料でダウンロードできますが、インストールにはMac環境が必要となるので注意が必要です。若干処理が重いことも多くなるべく新しいMacがおすすめです。
実際にストアに公開する場合はApple Developer Program(ADP)に登録する必要があります(11,800円/年)がこちらは別途記事にします。
Xcodeインストール
こちらから入手をクリックしインストールしてください。
8GB程度あるので時間がかかります。
インストール後LaunchpadにXcodeのアイコンが表示されているはずです。
こちらの記事を投稿した現在Xcodeはバージョン11.4.1までリリースされています。
Xcode11.4.1はmacOS Catalina 10.5.14以降が必要となるのでOSバージョンに注意してください。
OSバージョンの確認は[ツールバー左上の林檎マーク]>[このMacについて]から確認できます。
Xcodeを起動すると初回のみライセンスの確認等が行われます。
基本的にすべてOKで問題ないかと。
このような画面が表示されるとインストール完了です。
プロジェクト作成
サンプルプロジェクトを作成してみます。
先程のXcodeを起動した画面のメニューから[Create a new Xcode project]を選択します。
作るアプリのテンプレートを聞かれるので指定します。
今回はiPhoneアプリなのでOSは[iOS]、アプリは[Single View App]を選択し[Next]をクリックします。
補足：Single View Appは一番シンプルなアプリの指定でなんの変哲もない画面が一つ表示されるアプリです。基本的にはこれを選んでおけばいいと思います。
もちろん後から画面の追加はできるのでご心配なく。
次にプロジェクトの設定を尋ねられるのでそれぞれ設定し[Next]をクリックします。プロジェクトの作成場所を聞かれるので
- Product Name
- プロジェクトの名前。後から変えるのは若干面倒なので考えてつける。
- Team
- ADPに登録するとプルダウンで選択できる。実機ビルドやストア公開の際はアプリへの署名が必要になるため指定する必要がある。あとから簡単に変更できるのでとりあえず[None]でいい。
- Organization Name
- 開発者の名前。ソースコードのコメントに出てくるが練習用なら基本的になんでもいい。
- Organization Identifier
- 開発者のID。他の開発者と被らないようにつける。メールアドレスの逆ドメインでつけることが多い
- Bundle Identifier
- アプリの一意となるID。後から簡単に変えられる。すでに公開されているアプリのIDと被らないように設定する必要がある。
- Language
- 開発言語。Swift or Objective-Cを選択できる。最近はSwiftに移行しているため特別な理由がなければSwiftを選択するのをおすすめする。
- User Interface
- レイアウトの作成方法。Storyboard or SwiftUIを選択できる。SwiftUIはiOS13以降でないと使用できないためしばらくはStoryboardを選択するのが無難。今後はSwiftUIに以降するかと思われる。
このようなプロジェクトの画面が開かれると作成完了です。
アプリビルド
それでは実際にアプリを実行してみましょう。
画面左上から起動するiPhoneのシミュレータを選択し実行ボタンをクリックします。
※command + R でも実行できます。
シミュレータが立ち上がり真っ白な画面が表示されると成功です。
あとはソースコードに処理を書いたりStoryboardでUIを配置していけばアプリらしくなっていきます。最後に
以上で環境構築編は終了です。
これでiOSアプリを開発するための準備は整いました。
途中でStoryboardやBundleIDなどXcodeならではの用語が出てきましたが１つずつ調べながら進めていってください。
更に進めていくとApple様ならではの仕様も多く、iOSアプリ以外を経験したエンジニアでも躓くことは多いようです。
ひとまずあまり深く考えず作りたいものを作ってみてください。質問等あればコメントに頂けると返信できるかと思うのでご遠慮無くどうぞ。
次回からは実際にアプリ作成の基本部分について投稿していこうかと思います。
- 投稿日：2020-05-14T08:24:10+09:00
【Xcode】iOSアプリ開発入門~環境構築編~
iOSアプリ開発について人に教えることがあったのでいい機会だと思い基礎的な部分についてまとめていきます。
いくつか記事を投稿していくかと思うので追っていってもらえると幸いです。今回は環境構築編ということでiOS開発に必要なXcodeのインストールからシミュレータでのアプリ実行までをまとめます。
Xcodeとは
Apple社が提供するiOS、Mac用の統合開発環境(IDE)です。
iOSアプリを作成する際はこのXcodeを使って開発します。XcodeはAppStoreから無料でダウンロードできますが、インストールにはMac環境が必要となるので注意が必要です。若干処理が重いことも多くなるべく新しいMacがおすすめです。
実際にストアに公開する場合はApple Developer Program(ADP)に登録する必要があります(11,800円/年)がこちらは別途記事にします。
Xcodeインストール
こちらから入手をクリックしインストールしてください。
8GB程度あるので時間がかかります。
インストール後LaunchpadにXcodeのアイコンが表示されているはずです。
こちらの記事を投稿した現在Xcodeはバージョン11.4.1までリリースされています。
Xcode11.4.1はmacOS Catalina 10.5.14以降が必要となるのでOSバージョンに注意してください。
OSバージョンの確認は[ツールバー左上の林檎マーク]>[このMacについて]から確認できます。
Xcodeを起動すると初回のみライセンスの確認等が行われます。
基本的にすべてOKで問題ないかと。
このような画面が表示されるとインストール完了です。
プロジェクト作成
サンプルプロジェクトを作成してみます。
先程のXcodeを起動した画面のメニューから[Create a new Xcode project]を選択します。
作るアプリのテンプレートを聞かれるので指定します。
今回はiPhoneアプリなのでOSは[iOS]、アプリは[Single View App]を選択し[Next]をクリックします。
補足：Single View Appは一番シンプルなアプリの指定でなんの変哲もない画面が一つ表示されるアプリです。基本的にはこれを選んでおけばいいと思います。
もちろん後から画面の追加はできるのでご心配なく。
次にプロジェクトの設定を尋ねられるのでそれぞれ設定し[Next]をクリックします。プロジェクトの作成場所を聞かれるので
- Product Name
- プロジェクトの名前。後から変えるのは若干面倒なので考えてつける。
- Team
- ADPに登録するとプルダウンで選択できる。実機ビルドやストア公開の際はアプリへの署名が必要になるため指定する必要がある。あとから簡単に変更できるのでとりあえず[None]でいい。
- Organization Name
- 開発者の名前。ソースコードのコメントに出てくるが練習用なら基本的になんでもいい。
- Organization Identifier
- 開発者のID。他の開発者と被らないようにつける。メールアドレスの逆ドメインでつけることが多い
- Bundle Identifier
- アプリの一意となるID。後から簡単に変えられる。すでに公開されているアプリのIDと被らないように設定する必要がある。
- Language
- 開発言語。Swift or Objective-Cを選択できる。最近はSwiftに移行しているため特別な理由がなければSwiftを選択するのをおすすめする。
- User Interface
- レイアウトの作成方法。Storyboard or SwiftUIを選択できる。SwiftUIはiOS13以降でないと使用できないためしばらくはStoryboardを選択するのが無難。今後はSwiftUIに以降するかと思われる。
このようなプロジェクトの画面が開かれると作成完了です。
アプリビルド
それでは実際にアプリを実行してみましょう。
画面左上から起動するiPhoneのシミュレータを選択し実行ボタンをクリックします。
※command + R でも実行できます。
シミュレータが立ち上がり真っ白な画面が表示されると成功です。
あとはソースコードに処理を書いたりStoryboardでUIを配置していけばアプリらしくなっていきます。最後に
以上で環境構築編は終了です。
これでiOSアプリを開発するための準備は整いました。
途中でStoryboardやBundleIDなどXcodeならではの用語が出てきましたが１つずつ調べながら進めていってください。
更に進めていくとApple様ならではの仕様も多く、iOSアプリ以外を経験したエンジニアでも躓くことは多いようです。
ひとまずあまり深く考えず作りたいものを作ってみてください。質問等あればコメントに頂けると返信できるかと思うのでご遠慮無くどうぞ。
次回からは実際にアプリ作成の基本部分について投稿していこうかと思います。
- 投稿日：2020-05-14T04:38:52+09:00
マイナンバーカードのパスワード残り試行回数を調べる
本記事は Qrunch とのクロス投稿です。
マイナンバーカードのパスワード残り試行回数を調べる | Qrunch（クランチ）
最近話題のマイナンバーカード。マイナポータルを用いた申請等で必要なカードで、このカード1つに4つのパスワードがそれぞれ設定されています。
パスワードの設定は各々がマイナンバーカードを受け取る際に設定したはずですが…
これらのパスワードはそれぞれ規定回数以上連続で間違えてしまうとロックされ、このロック解除のために役所へ行かないといけなくなります。そしてこの度、Japan NFC Reader では Ver 1.0.5 で「マイナンバーカードのパスワードの残り試行回数」を確認できるようになりました。
また、それに伴い Japan NFC Reader のコア部分を MIT Licence で公開しているライブラリ、treastrain/TRETJapanNFCReader でもマイナンバーカードへの対応作業を開始し、このパスワードの残り試行回数を取得する機能も提供しています。今回はこちらを使って、実際にマイナンバーカードからパスワードの残り試行回数を取得するところまでを試してみます。
なお、この記事を書くために作成したプロジェクトはまるごと GitHub 上で公開しています。もしよろしければ参考にしてください。
treastrain/MyNumberPINRemainingChecker実機の用意
実際のマイナンバーカードからデータを読み取るので、シミュレーターでは動作しません。iOS 13.0 以降を搭載した「リーダーモード対応NFC」が使える iPhone が必要です。
Swift Package Manager でライブラリを導入する
treastrain/TRETJapanNFCReader はマイナンバーカードの他にも、Suica、PASMO といった交通系ICカード、各種電子マネー、運転免許証の読み取りにも対応しており、少しずつ大きなライブラリとなっています。
今回はマイナンバーカードの読み取り機能のみ利用できればよいので、Swift Package Manager を用いて部分的にライブラリを導入します。Xcode で iOS App のプロジェクトを作成したら、「File」>「Swift Packages」>「Add Package Dependency...」に進みます。
「Search or enter package repository URL」に「TRETJapanNFCReader」と入力します。
記事執筆時点ではマイナンバーカードに関する機能は Release version に含まれていないので、master ブランチを選択します。
本来であれば、マイナンバーカードの読み取りに関する Product のみにチェックを入れればよいのですが名称が長くて全て表示されないので、どれにもチェックを入れずに「Finish」します。
Target の「Frameworks, Libraries, and Embedded Content」にて、「TRETJapanNFCReader-MIFARE-IndividualNumber」を「Add」します。
※個人番号カード（マイナンバーカード）は英語で「Individual Number Card」となっています。
これで正しくマイナンバーカードに関する Product のみを取り込めました。
Capability と Entitlements の設定
これ以降は基本的に treastrain/TRETJapanNFCReader の README に示されたとおり進めていくだけです。
まず、Signing & Capabilities で「Near Field Communication Tag Reading」を有効にします。これにより、「Near Field Communication Tag Reader Session Formats」が entitlements ファイルに含まれます。
Info.plist の設定
Info.plist に「Privacy - NFC Scan Usage Description」と「ISO7816 application identifiers for NFC Tag Reader Session」を追加します。
「Privacy - NFC Scan Usage Description」には NFC を何のために使用するのかについての説明を、「ISO7816 application identifiers for NFC Tag Reader Session」の配下には以下の AID を記述します。
- Item 0:
D392F000260100000001- Item 1:
D3921000310001010408- Item 2:
D3921000310001010100- Item 3:
D3921000310001010401
コーディング
以上でもろもろの設定はおしまいです。続いてコーディングしていきます。
すべてViewController.swiftに記述します。全文を見たい場合は GitHub 上の treastrain/MyNumberPINRemainingChecker を見たほうが便利かもしれません。ライブラリをインポートする
まずはライブラリをインポートします。
import UIKit import TRETJapanNFCReader_MIFARE_IndividualNumber
IndividualNumberReaderSessionDelegateに準拠させる
IndividualNumberReaderSessionDelegateプロトコルに準拠させます。
individualNumberReaderSession(didRead:)はマイナンバーカードからの情報の読み取りが終わると呼ばれるものになります。しかし、今回の目的である「パスワードの残り試行回数を調べる」際には特に使用しません。
japanNFCReaderSession(didInvalidateWithError:)は NFC 通信でのエラーハンドリングに使用します。今回は省略します。class ViewController: UIViewController, IndividualNumberReaderSessionDelegate { // ... func individualNumberReaderSession(didRead individualNumberCardData: IndividualNumberCardData) { // ... } func japanNFCReaderSession(didInvalidateWithError error: Error) { // ... } // ... }
IndividualNumberReaderを初期化するマイナンバーカードの読み取りには
IndividualNumberReaderを使用します。var reader: IndividualNumberReader! override func viewDidLoad() { super.viewDidLoad() self.reader = IndividualNumberReader(delegate: self) // ... }パスワードの種別を指定する
treastrain/TRETJapanNFCReader では、マイナンバーカードの4つのパスワードの残り試行回数の取得に対応しています。それは
IndividualNumberCardPINTypeに次のように定義されています。TRETJapanNFCReader/Sources/MIFARE/IndividualNumber/IndividualNumberCardPINType.swiftpublic enum IndividualNumberCardPINType { /// 署名用電子証明書（公的個人認証 署名用） case digitalSignature /// 利用者証明用電子証明書（公的個人認証 利用者証明用） case userAuthentication /// 券面事項入力補助用 case cardInfoInputSupport /// 個人番号カード用（住民基本台帳事務用） case individualNumber }ここでは、署名用電子証明書のパスワードを取得します。
// ... self.reader = IndividualNumberReader(delegate: self) let pinType = IndividualNumberCardPINType.digitalSignature // ...
IndividualNumberReader.lookupRemainingPIN(pinType:completion:)を呼び出す以上の準備ができたら、
IndividualNumberReader.lookupRemainingPIN(pinType:completion:)を呼び出します。completionのInt?に残り試行回数が含まれています。エラーが発生した場合はnilとなり、NFC 通信に起因するエラーの場合は先述のjapanNFCReaderSession(didInvalidateWithError:)にエラー内容が送られてきます。// ... self.reader = IndividualNumberReader(delegate: self) let pinType = IndividualNumberCardPINType.digitalSignature self.reader.lookupRemainingPIN(pinType: pinType) { (remaining) in if let remaining = remaining { print(pinType.description, "残り試行回数:", remaining) } else { // 取得エラー } }実行結果
それでは実行してみましょう。以下のように残り試行回数がコンソールに表示されれば成功です。
もしよろしければ GitHub にて Star をしていただけると嬉しいです…！
- treastrain/TRETJapanNFCReader : 今回使用したライブラリ
- treastrain/MyNumberPINRemainingChecker : 今回の記事のために作成したサンプルプロジェクト環境
- 開発
- Xcode Version 11.4.1 (11E503a)
- Apple Swift version 5.2.2 (swiftlang-1103.0.32.6 clang-1103.0.32.51)
- macOS Catalina 10.15.4 (19E287)
- 実機
- iPhone X (A1902、MQAY2J/A)
- iOS 13.3.1 (17D50)
- iPhone 11 Pro (A2215、MWCC2J/A)
- iOS 13.5 (17F5065a)
- 投稿日：2020-05-14T04:20:17+09:00
【SwiftUI】入力開始時に TextField の Placeholder の文字列を非表示にする
はじめに
SwiftUI ではデフォルトでは入力開始時に
TextFieldの
Placeholder の文字列は表示されたままですが，
入力開始時に Placeholder を非表示にできるのかについて
検証をする機会があったので備忘録です。通常はデフォルトのままで大丈夫だとは思います。
実装
結果的に Placeholder の文字列を定数にせず，
バインドすることで実現できました。
TextFieldを生成する際に下記を使って入力開始/終了時の処理で
placeholder の文字列を変更しています。init<S>(_ title: S, text: Binding<String>, onEditingChanged: @escaping (Bool) -> Void = { _ in }, onCommit: @escaping () -> Void = {}) where S : StringProtocolサンプルコードはこちらです。
1つ目のTextFieldがデフォルトのシンプルなもの，
2つ目のTextFieldが入力時に非表示になるものです。ContentView.swiftimport SwiftUI struct ContentView: View { @State private var firstTextFieldStr = "" @State private var secondTextFieldStr = "" @State private var placeholderStr = "文字列を入力" var body: some View { NavigationView { VStack(alignment: .leading) { TextField("文字列を入力", text: $firstTextFieldStr) .textFieldStyle(RoundedBorderTextFieldStyle()) .padding(.vertical, 16.0) TextField(self.placeholderStr, text: $secondTextFieldStr, onEditingChanged: { (hasChanged) in // 編集を始めたらtrue，終えたらfalseになる if hasChanged && self.secondTextFieldStr.isEmpty { // 編集開始時に文字列が入力されていなければplaceholderを空文字に self.placeholderStr = "" } else if !hasChanged && self.secondTextFieldStr.isEmpty { // 編集終了時に文字列が入力されていなければplaceholderをデフォルトに self.placeholderStr = "文字列を入力" } }) { // returnキーが押された際の処理 } .textFieldStyle(RoundedBorderTextFieldStyle()) Spacer() } .padding(.horizontal, 20.0) .navigationBarTitle("TextField Placeholder test", displayMode: .inline) } } }動作
おわりに
SwiftUI 2では痒いところに手が届くように色々期待です。
参考
https://developer.apple.com/documentation/swiftui/textfield/3338359-init
- 投稿日：2020-05-14T01:43:05+09:00
FlutterアプリをiOS版ビルドに必要な手順のまとめ(debug/release)とTestFlightに上げるまで
FlutterアプリのiOS版をビルドするのに必要な手順をまとめます。
debugビルドと、releaseビルドの両方を載せます。releaseビルドは、TestFlightに上げるまでの手順です。なお、個人開発者として登録する方法となっています。
組織の場合は必要な手順が異なりますので、以下のサイトなどを参考にして下さい。
https://dev.classmethod.jp/articles/ios-app-how-to-release-2018/環境など
まず、リリースビルドをアップロードする際、iOS13に対応しないと行けません。
iOS13に対応するには、Xcodeが11.0以上でなければなりません。これはMacOSをCatlinaに上げなきゃダメか・・・と思っていましたが！
MacOS Mojave(10.14.6)で動かせるのはXcode10.2までだと思ってましたが、以下によれば、Xcode11.3.1まで使えるようでした！
https://en.wikipedia.org/wiki/Xcode#Version_comparison_table
なので、まずXcodeを11.3.1アップデートし、Flutterも最新版(Stable)・・・といいたいところですが、17.0は出たばかりでちょっと怖いので、v1.12.13+hotfix.9に更新しました。
Xcodeの古いバージョンはこちらからダウンロード可能です。
https://developer.apple.com/download/more/Command Line Toolsもお忘れなく。
そしてCommand Line Toolsをインストールしたらライセンス同意が必要なのでsudo xcodebuild -licenseもお忘れなく。
ツールなど バージョンなど MacBook Air Early2015 macOS Mojave 10.14.6 Android Studio 3.6.1 Java 1.8.0_131 Flutter 1.12.13+hotfix.9 Dart 2.7.2 Xcode 11.3.1 デバッグ実行するなのに必要な手順
Flutterアプリを、XcodeやAndroidStudio等から実機でデバッグ実行するために必要な手順です。なお、このセクションの内容は、数年前から非課金で行えるようになっています。(昔は実機デバッグをするにはデベロッパー登録/有料が必要でした)
1.開発者用Appleアカウントの作成
後でやるデベロッパー登録のことを考えると、この時点で、開発専用のAppleアカウントを作ってやった方が良いようです。そして登録内容は、すべて英語にするのが良さそうです。
私はiPadやMacを買ったときのアカウントでやってしまい、住所や氏名登録が日本語な為、本人確認に免許証などの公的に住所を証明する書類のアップロードを要求されました。
(pendingのまま審査が数ヶ月進まなかったため問い合わせてやっと理由が分かりました)2.iOS Developer用の証明書の作成
Xcodeから生成出来ます。
これは初めてアカウントを作る場合の手順です。一度でも作成済みの場合は、作成済みのチームを選ぶだけでビルド、デバッグ実行が出来ます。(1)XcodeでFlutterプロジェクトを開く
Flutterプロジェクトルート/ios/RunnerをXcodeで開きます。(2)targetsの
Runnerを選ぶ
- プロジェクトルートの
Runnerをクリック赤枠の箇所をクリックしてtargets/Runnerを選ぶ
(3)Sigining設定をする
- [General]タブのSigning項目の[Auto sigining]にチェックを入れる
- Teamのドロップダウンをクリックする
- [Add Account]を選ぶ
- Accountsアプリが開くので、Apple IDでログインする
- この時、開発用のアカウントを作っていれば、そちらを追加してログインして下さい。
- ログイン後、[Manage Certificates...]をクリック
- 左下の[+]アイコンをクリックして、iOS Developmentを選ぶ
- [Download Manual Profiles]をクリック
- Accountsを閉じてXcodeに戻る
- Teamのドロップダウンで今作成したチームが増えているので、それを選ぶ
これでデバッグビルド・実行が出来るようになりました。
3.Debugビルド用にBundle Idやアプリ名を変える
Androidでやったように、iOS版も、debugビルドのBundle Idを変えて、releaseビルドとdebugビルドが同時にインストールできるようにします。
(1)Bundle Idを変える
正式には、Bundle Identifierです。
Xcodeでは、[Targets]-[Runner]-[General]タブにあります。
ただ、Debug版とRelease版で切り替えるには、まず、User Defined Settingを追加する必要があります。
- [Project]-[Runner]を選ぶ
- [Build Settings]タブで、[+]-[Add User-Defined Setting]をクリック
BUNDLE_ID_SUFFIXと入力する- Debugに
.debugと入力する
- [Tragets]-[Runner]を選び、Packagingを探す
- Product Bundle Identifierの項目の箇所をダブルクリックし、
${BUNDLE_ID_SUFFIX}を末尾に追加する
(2)Debugビルドのアプリ表示名を変える
DebugビルドとReleaseビルドが同時にインストールできるようになると、ホーム画面でどっちがどっちか分かりづらくなるので、一番簡単な「アプリ表示名」(Bundle Name)を変えて分かりやすくします。
- [Project]-[Runner]-[Build Config]タブで、Add User-Defined Settingsし、
PRODUCT_NAME_SUFFIXというのを追加し、Debugビルド版のみ(d)とする
- [Targets]-[Runner]-[Info]タブで、Custom iOS Target ProperitesのBundle nameを探し、
${PRODUCT_NAME_PREFIX}アプリ表示名とする
これで、debugビルドのアプリが分かりやすくなりました。
(3)GoogleService-Info.plist
上記のようにBundleIdを変えると、厄介なのがFirebaseを使うときに配置しておかなければならない
GoogleService-Info.plistファイルです。これは、デバッグ用/リリース用それぞれの
GoogleService-Info.plistファイルをダウンロードして、-Release.plist,-Debug.plistなどとリネームして配置しておき、Build Phaseにスクリプトを作って、ビルドコンフィグに合わせてコピーして使う、という手段を取ります。※Androidは、debug用もrelease用も全く同じファイルがDLされてくるので、恐らく以前のように
main/debugなどに分けて置いておく必要も無くなっているようで、より簡単です。まず、
ios/Runner/Configsなどのフォルダを作って、それぞれのplistを保存します。
Xcodeで
ios/Runnerを開き、[target]-[Runner]の[Build Phase]を表示します。Run scriptを探し、開きます。
無ければ、左上の[+]ボタンから、[New Run Script Phase]してください。shellに、以下のように記入します。
if [ "${CONFIGURATION}" == "Release" ]; then cp "${PROJECT_DIR}/${PROJECT_NAME}/Configs/GoogleService-Info-release.plist" "${BUILT_PRODUCTS_DIR}/${PRODUCT_NAME}.app/GoogleService-Info.plist" else cp "${PROJECT_DIR}/${PROJECT_NAME}/Configs/GoogleService-Info-debug.plist" "${BUILT_PRODUCTS_DIR}/${PRODUCT_NAME}.app/GoogleService-Info.plist" fi
これで、デバッグ実行とリリース実行のそれぞれに対応する
GoogleService-Info.plistを使うことが出来るようになりました。リリースビルドしてApp Store Connectにアップロードするまでの手順
1.デベロッパー登録
Apple Developer ProgramへのEnrollが必要です。
日本語ページから行けますが、登録ページは英語のみです。https://developer.apple.com/jp/programs/enroll/
前述の通り、アカウントは開発専用アカウントを作ってやった方が良いようです。
登録をすると、Apple様への$99/年のお布施が必要になります。
※Googleさんは登録時に1回こっきりの請求なので、敷居が低くて良いんだけどなー。まあ敷居が低いからこそ私みたいに払ってから10年も何もリリースしてないようなのも発生してしまうんでしょうが^^;
2.リリースビルドするまでの手順
(1)iOS Distribution用の証明書の作成
- メニューの[Xcode]-[Prefernce]から、[Accounts]タブを表示する
- [Manage Certificats...]をクリック
- debug用のiOS Developer用の証明書の作成でやったのと同じ手順で、今度はiOS Distributionを選んで追加する
- [Done]をクリック
- [Download Manual Profiles]をクリック
(2)flutterコマンドでリリースビルド準備をする
コマンドラインで以下を実行する。
なお、事前にcleanはやっておいた方が望ましい模様です。$ flutter clean $ flutter build iosプロジェクトルートで実行して下さい。
(3)XcodeでArchiveビルドする
- Xcodeのメニューの[Product]-[Archive]をクリックする
- しばらく待つと、ビルドが完了します。以下のような[Archives]画面が開くので、Identifierなどが正しいことを確認します。
3.App Store Connectでアプリ情報を登録する
(1)App Store Connectページへ行く
https://appstoreconnect.apple.com/
最初のアクセスの場合は、利用許諾ページが表示されるので、良く読んで同意します。
(2)アプリを登録する
- マイAppをクリック
- 左上の[+]-[新規App]をクリックして追加ページを開く
- 必要な情報を入力し、保存する
- SKUの項目は、特に管理方針などが無ければ、Bundle Identifierと同じで良いかと思います。
4.アプリケーションファイルをアップロードする
先ほど、Xcodeでアプリケーションファイルを作りました。
最後に表示されたページに、[Distribute App]というボタンがあったと思います。
※もし、ページを消してしまっていた場合は、Xcodeのメニュー[Window]-[Organizer]から開けます。なお、これらの操作中、Macがとても重くなります(MacBook Airの場合)。あまり他の作業はしない方が吉かと思います。
- [Distribute App]をクリック
- Uploadを選択して[Next]をクリック
- 初めての場合、表示されない場合もあるかも
- 必要があればオプションを選択し、[Next]をクリック
- [Automatically manage signing]を選択して[Next]をクリック
- Review Runner.ipa contentが表示されたら、内容を確認して、[Upload]をクリック
アップロードが完了したら30分ほどでメールが来るようなので、他のことをして待ちましょう。
これで、アプリケーションファイルは出来ました。
これをテスト用に配信するために、TestFlightというのを利用します。TestFlightで配布する
TestFlightについては、以下などをご参照下さい。
https://developer.apple.com/jp/testflight/要するに、リリース前のアプリをテスターに配信できる公式のツールと思って下さい。
今回は、外部テスターに公開することにします。1.プライバシーポリシーページを作る
必須みたいです。(GoogleのPlayストアは、有料だったり13歳未満向けでなければ不要でしたが)
そもそもFirebaseAnalytics入れたので必要ですね。例えGoogleでも。
ということで、こちらの記事でFirebase Hostingを使ってプライバシーポリシーページを作りましたのでご参考下さい。2.テスト情報ページの入力
App Store Connectでアプリを選び、[TestFlight]のタブをクリックすると、左側のメニューの下の方に、テスト情報というのがあると思います。
注意アイコンが付いていると思いますが、最低限、以下の内容を設定すれば消えます。
- ベータ版Appの説明
- フィードバックメールアドレス
- プライバシーポリシーURL
- ベータ版App Review情報の連絡先情報(全部)
サインインが必要なアプリの場合は、Appleさんがレビューするときに使えるアカウントを作っておいて、そのアカウント情報を設定する必要があります。
特にサインインなどないアプリなら、[ サインインが必要です]のチェックを外しておきましょう。それと、[App Store]タブのApp情報ページにもプライバシーポリシーページURLを設定する箇所があります。忘れずに入力しておきましょう。
3.輸出コンプライアンスの設定をする
[TestFlight]タブで、左側のメニューの[iOS]を選ぶと、アップロードしたアプリのバージョンなどが見られますが、[輸出コンプライアンスがありません]となっていてまたまた警告アイコンが出ています。
このままでは配信を開始できないので、そこをクリックし、[輸出コンプライアンス情報を提出]をクリックします。
以降は、以下のサイトなどを参考に、ご自分のアプリに即した回答をして下さい。
https://qiita.com/osamu1203/items/35df25d93e9d12b11222
https://www.ateliee.com/archives/3363
https://www.webbanana.org/goroku/2019/06/12/374.php最後に[内部テストを開始]をクリックします。
これで準備が出来ました。
なお、これでアプリの審査が始まります。本配信よりは簡略化されたレビューだとは思いますが、一応されるそうです。4.テスターの登録
今回は外部テスターを使いたいので、[外部テスターを追加]をクリックし、グループを作成します。グループ名は任意です。
(1)テスターの登録
- 上記で作成したグループを選び、[テスター]タブを表示
- 配布したい人のメールアドレスを登録する
(2)ビルドの設定
- [ビルド]タブに切り替える
- ビルドを選び、[追加]をクリック
審査が終わって配信可能になるのを待ちましょう。
配信可能になると、テスターに登録したメールアドレスへ通知が行くようです。※世界的に新型コロナ対策期間中でした。審査通るのには3日ほどかかりました。これが通常なのかどうかは不明です。
(3)テスト用アプリの更新をするとき
以下の手順を毎回行う必要があります。
2.(2)flutterコマンドでリリースビルド準備をする
2.(3)XcodeでArchiveビルドする
3.(4)アプリケーションファイルをアップロードする
3.輸出コンプライアンスの設定をする
4.(2)ビルドの設定そして、提出の度に審査があります。2回目からは比較的早いとは聞いていますが・・・
参考サイト
Flutter公式の手順解説
https://flutter.dev/docs/deployment/iosBundle Identifierをdebug版で切り替える方法などの参考にしました。
https://qiita.com/Todate/items/a2e6a26731c79bd23e02表示名をdebug版で切り替える方法などの参考にしました。
https://medium.com/swift2go/different-app-display-name-based-on-xcode-scheme-d709307d0c01ステップなどの概要確認に参考になりました。
https://dev.classmethod.jp/articles/ios-release-build-2015-11/
https://dev.classmethod.jp/articles/ios-app-how-to-release-2018/XCodeでのAutomatic Signingについて参考になりました。
https://qiita.com/nerd0geek1/items/0b36c68897ee87e0a0c6Testflight登録時のテスト情報の必須項目について参考になりました。
https://dev.classmethod.jp/articles/how-to-distribute-app-with-testflight-public-link/GoogleService-Info.plistの切替について参考になりました。
https://medium.com/flutter-jp/flavor-b952f2d05b5d
https://qiita.com/ko2ic/items/53f97bb7c28632268b5a
