アヤポコの雑記*2人目育児中

育児のこと、旅行のこと、仕事のこと。30代の第二子子育て中の雑記です。

【スポンサードリンク】

2歳になって一気に言葉が増えてコミュニケーションが取れるように

一時期は言葉全然喋れないなぁ、他の子に比べて発話が遅いのは、本を読んでいないからかなぁなんて悩んでいたりもしたけれど2歳を過ぎた頃に一気に喋るようになった。
特にそれまでと何か話しかけ方を変えたとか、本をたくさん読むようになったということもなく、本当にいきなり喋り始めた。

1歳半検診で単語の数を聞かれたり、話した言葉を理解しているかをチェックされるのですが、そのタイミングではまだまだ数えられるくらいの単語しか話していなかった。
10月生まれの息子を保育園の同じクラスの子と比べると、4月から6月生まれの子は明らからに話せる言葉の次元が違って焦ったのを覚えている。
お迎えに行くと「〇〇くん(息子の名前)のママ!」と言われて、(えっすごい助詞が使えるの?!同じ2歳なのに)と思って旦那に報告したのをよく覚えている。
f:id:ayapc:20190227092817j:plain

よくコップの水が溢れるように一定量の言葉がストックされたら話すようになるよ。という話は聞いていたが、まさにそんな感じ。
・これ〇〇くんが使ってるのー
・ママの赤ちゃんのお薬
・ばあばんち来月
こんな感じで助詞もちゃんと使えるようになってきた。
私が教えていない言葉や歌も保育園で覚えてきて披露してくれる。
パパは面白がって「ケータイ」とか「ガチ」とかいろんな言葉教えている。
2歳4ヶ月になった今では消せないラジオ状態。

初めての子で、ママも最初だとどんな成長具合が一般的かわからず、保育園のお友達と比べる。
でも保育園のお友達の生まれ月が半年違うと半年分の差があるのは当たり前。そんなことわかっているんだけど、その「半年分の差」っていうのがピンとこないのが新米ママ。
初めの子は手をかけて色々調べて世話を焼くけど2人目は適当になるよというのはこの辺のノウハウの蓄積が大きいのかも。

関連記事teralibre.hatenablog.jp


歌もたくさん、おしゃべりもたくさんできるようになったので、2歳のうちに間に合うようにアプリ作ってみた。そのくらいよく喋る。

アプリ
android
play.google.com

iOS

赤ごろく

赤ごろく

  • Kenji Wakabayashi
  • Lifestyle
  • Free

cordovaで作ったアプリをiosでリリースするまでの手順まとめ

iosのアプリをリリースするにはxcodeを挟まなければいけない。
xcodeでプロジェクトファイルを開く。プロジェクトファイルはアプリフォルダ>platforms>ios>アプリ名.xcodeprojの場所にある。

xcode上で編集した場所

1.plist
cordova内ではこのファイルはどこにあるか見当たらなかった。
xcodeでプロジェクトを開いたところで編集できる。場所はResources>アプリ名-Info.plist
Privacy - Photo Library Usage Descriptionについては、アプリ内では使っていないと思うんだけど、リリースビルドをアップロードしたらApp Store Connectから
「Missing Purpose String in Info.plist File」という内容でメールが来たので追記した。

追記した項目

Localization native development region:Japan
Bundle display name:アプリ名 ※config.xmlの内容が反映されていた
Bundle identifier:id ※config.xmlの内容が反映されていた
Privacy - Microphone Usage Description:Valueをに使徒を記載
Privacy - Photo Library Usage Description:Valueをに使徒を記載


2.General
Signing(Release)のところでprovisioning Profileを設定


3.Build Setting
provisioning Profileを設定

f:id:ayapc:20190223201411j:plain

Development版のprovisioning Profile作成

2.3で設定する証明書についてDevelopmentでビルドするときには以下の手順で動作した。

■キーチェーンアクセスで証明書を発行

キーチェーンアクセス>証明書アシスタント>認証局に証明書を要求

必要情報を入力

ユーザーのメールアドレス ・・・AppleDeveloperのメールアドレス
通称           ・・・アプリのエイリアス
CAのメールアドレス   ・・・空欄
要求の処理       ・・・ディスクに保存と鍵ペア情報を指定を選択
■DeveloperProgramでCertificates, Identifiers & Profilesから証明書を作成する

Certificates>Allを選択
+ボタンを押下してiOS App Developmentを選択してContinue
Upload CSR file.からここでは先ほど作成したCSRを登録してContinue

■DeveloperProgramで新規のappIDを登録する

Identifiers>App IDsを選択
+ボタンを押下して必要事項を入力してContinue

■DeveloperProgramでprovisioning Profileを作る

※開発用のデバイスを登録していない場合には先にDevicesから端末の登録が必要
Provisioning Profile>Allを選択
+ボタンを押下してiOS App Developmentを選択してContinue
先ほど登録したappIDを選択してContinue
先ほど登録したCertificatesを選択してContinue
開発用のデバイスを選択してContinue
Provisioning Profileの名前を設定する

■xcodeで作成した証明書を入れてビルドする

ライトニングケーブルで繋いだ端末に向けてビルドする。
ビルドするときに端末側にProvisioning Profileがないと怒られるので、端末側にもProvisioning Profileを設定する。
Xcode>Window>Devices and Simulators
Connectedで表示されるデバイスをControlを押しながらクリックShow Provisioning Profileを選択
+ボタンから作成した Provisioning Profileを選択してインストール
これで実機でのビルドができるようになる。

参考にしたブログ
https://qiita.com/nogson/items/adeca053de0621064118

f:id:ayapc:20190223201621j:plain

Release版のprovisioning Profile作成

2.3で設定する証明書についてReleaseでビルドするとDevelopmentでリリースした時と同じやり方で作ったファイルだとエラーが発生する。

No signing certificate "iOS Distribution" found 
No "iOS Distribution" signing certificate matching team ID “*************" with a private key was found.

理由がわからず、最初からファイルを作り直して登録したりして四苦八苦していたけど、原因はApple IDを複数台で使い回すときメインマック以外で秘密鍵を作ってprovisioningファイルを登録するとエラーが出るということだった。

■メインで使っているMacからp12形式で証明書を書き出し

メインで使っているMacのキーチェーンアクセスからRelease版用に作った証明書を選択して個人情報交換 .p12の形式で書き出す。
パスワードは2台目に証明書を入れるときに必要になります。

■2台目Macでp12形式フィルを読み込んで証明書登録

メインMacで書き出した.p12ファイルを2台目Macに送って.p12ファイルをダブルクリック。
キーチェーンアクセスが起動して証明書が登録されます。

■Provisioning Profileを作成

作成する際にp12ファイルを受け渡してもらった証明書を選択して作成する。
証明書が揃った状態になるので、Release版のProvisioning Profileを登録してもエラーが出なくなった。

参考にしたブログ
https://makotton.com/2014/10/24/625

iosのリリースビルド

■xcodeでArchiveを作成してリリース

ビルドのデバイスでGeneric iOS Deviceを選んで、Product> Archiveを選択する。
エラーが出なければそのままValidate Appを選択する。
Distribute AppでiOS App Store、Uploadをそれぞれ選択してUploadする。
問題なけれなばApp Store Connectでビルドファイルが30分から1時間後にはみれるということだが、半日待ってもアップされなかった。メールを見てみると冒頭に記載したplistに追加してねの通知が来ていたので、plistに追記をすると問題なくuploadされ、ビルドファイルを選択することできた。

cordovaで作ったアプリをandroidでリリースするまでの手順まとめ

androidアプリのリリースはiosに比べると遥かに簡単だったけど、備忘のためにまとめます。

1.ビルドする

実機につないで動作確認OKとなったらリリース用にビルドします。ここで作られたファイルは[アプリフォルダ]/platforms/android/app/build/outputs/apk/release/の配下に生成されました。

cordova build --release

2.鍵ファイルの作成

署名用の鍵ファイルを作成します。
ここで設定したパスワードは後でたくさん聞かれるので、必ず控えておくこと。
keytool -genkey -v -keystore <鍵ファイル名> -alias <エイリアス名> -keyalg RSA -validity <有効期間>

keytool -genkey -v -keystore keystore.private -alias <エイリアス名> -keyalg RSA -validity 10000

鍵ファイルが生成されたらファイルができたことを以下のコマンドで確認する。
keytool -list -v -keystore <鍵ファイル名> -storepass <パスワード>

keytool -list -v -keystore keystore.private -storepass <パスワード>

3.署名の作成

2で作成した鍵ファイルを使って1のビルドファイルに署名をします。
jarsigner -verbose -keystore <鍵ファイル名> <エイリアス名>

jarsigner -verbose -keystore keystore.private ./platforms/android/app/build/outputs/apk/release/app-release-unsigned.apk <エイリアス名>

4.アプリの最適化

3で生成されたファイルをandroidで読みやすい形に最適化する。
zipalign -v 4 [被最適化apk] [最適化後の名前]

zipalign -v 4 ./platforms/android/app/build/outputs/apk/release/app-release-unsigned.apk ./app-release20190223.apk

zipalignが見つからないよとエラーが出たので実行ファイルをtools配下にコピーして再度コマンドを実行。

cp ~/zipalign /Users/username/Library/Android/sdk/tools/zipalign

コマンド実行できたら最適化できていることを確認する。

zipalign -c -v 4 ./app-release20190223.apk

f:id:ayapc:20190223150803j:plain
生成されたapkファイルを試しに実機に入れてみて動作確認。
問題ないことが確認できたらGooglePlay Consoleにapkをアップロードして完了。

cordovaでのリリース準備:アイコンとスプラッシュ画面の作成

cordovaでのアプリができた、ということでリリース準備を始めることに。
リリースにはアイコンとスプラッシュ画面が必要。(スプラッシュはなくてもいいみたいだけど、一応今回は用意することにした)monacaで開発していた時には、1つの画像を入れたら勝手にmonaca上でリサイズしてくれていたのが、cordovaにはいちいち登録しなくちゃいけないのか・・と思っていたところ、なにやらプラグインで自動的にリサイズしてくれるものがあるらしい。

とりあえずインストールしてみる。

brew install imagemagick
npm install splashicon-generator -g

アプリのresourcesフォルダ配下にicon.pngという1024×1024pxのファイルとsplash.pngという2048×2048pxのファイルを置いておいてプラグインを実行。
コマンドのresourcesの部分は配置したフォルダを指定する。

splashicon-generator --imagespath=“resources"

そうするとresフォルダ配下にandroid、ios、windows、wp8のアイコンとスプラッシュ画面がそれぞれ作成される。
インストールするプラグインの詳細
splashicon-generator - npm

config.xmlというファイルがあるので、そこに生成されたファイルのパスを追記していく。プラグインの詳細にコードが書いてあるのでそれをそのままコピペ。
android、iphoneそれぞれ実機にアプリを入れた時にアイコンとスプラッシュが設定されていることを確認したらOK。
f:id:ayapc:20190223144321p:plain
参考にしたブログ
【ionic】iconとsplashとはから実装まで - Qiita

xcodeでビルドした時に以下のようなwarningが出たけど、AppleWatchのアイコンだったのでスルー。

 The file "AppIcon98x98@2x.png" for the image set "AppIcon" does not exist.

最後に、xcodeでアプリをリリースしようとした際に透過画像だと怒られてしまったので、ios配下のアイコン画像は全てアルファチャンネルを除去して再度ビルドしました。

一人でやってると細かい画像の準備が意外と面倒なんですが、ある程度一括で作ってくれるので助かりました。

cordova開発のライブローディング

アプリ作っていていちいちビルドして確認というのはかなり手間になる。
最初の見た目を作るところまではブラウザである程度確認ができるので、ライブローディングできるプラグインを入れてみた。

cordova plugin add cordova-plugin-browsersync

https://www.npmjs.com/package/cordova-plugin-browsersync

cordova run browser -- --live-reload

上記オプションを付けて実行すると更新の度にブラウザで確認できる。


f:id:ayapc:20190222174825j:plain

【framework7】themeの色はlessファイルを変更で変えられる

今回はテーマの色をデフォルトから変更したかったので、以下のサイトを参考にしてテーマの色を変更してみた。
[discussion] Idea about themes - Questions - Framework7 Forum


①新規lessファイルの配置

wwwのcss配下に新しくlessファイルを作ってcustomカラーを定義する。

-www
   -css
      app.css  
      icons.css
      f7-theme.less ←これ
      


lessファイルの中身。

@import '../../node_modules/framework7/framework7.less';

@themeColorIos: #FFC666;
@themeColorMd: #FFC666;

@colorsIos: red #ff3b30, green #4cd964, blue #007aff, pink #ff2d55, yellow #ffcc00, orange #ff9500, gray #8e8e93, white #ffffff, black #000000, custom #FFC666;
@colorsMd: red #f44336, green #4caf50, blue #2196f3, pink #e91e63, yellow #ffeb3b, orange #ff9800, gray #9e9e9e, white #ffffff, black #000000, custom #FFC666;

元々色を定義していたframework7.lessの中身を上書きしている感じ。
customという色を作って適用した。
f:id:ayapc:20190222174114j:plain

②lessファイルのコンパイル

ファイルをコンパイルしてcssファイルを生成。

SyntaxError: Inline JavaScript is not enabled. Is it set in your options?

と言われるのでオプションをつけて実行した。

lessc --js ./www/css/f7-theme.less ./www/css/f7-theme.css

③生成されたcss配置

先ほどのコンパイルがうまくいくとcssが作成される。

-www
   -css
      app.css  
      icons.css
      f7-theme.less 
      f7-theme.css ←これ
      

index.html内でcssを読み込む。

<link rel="stylesheet" href="css/f7-theme.css”>
(略)
<body class="color-theme-custom”>

とするとカスタムカラーが適用されるようになる。

チェックボックスとインプットエリアだけ作成した色が適用されていなかったので、以下の記述をlessファイルに追加して再度コンパイル。

@import url('../../node_modules/framework7/components/checkbox/checkbox.less');
@import url('../../node_modules/framework7/components/input/input.less’);

最終的なファイルの中身。

@import '../../node_modules/framework7/framework7.less';

@themeColorIos: #FFC666;
@themeColorMd: #FFC666;

@colorsIos: red #ff3b30, green #4cd964, blue #007aff, pink #ff2d55, yellow #ffcc00, orange #ff9500, gray #8e8e93, white #ffffff, black #000000, custom #FFC666;
@colorsMd: red #f44336, green #4caf50, blue #2196f3, pink #e91e63, yellow #ffeb3b, orange #ff9800, gray #9e9e9e, white #ffffff, black #000000, custom #FFC666;

@import url('../../node_modules/framework7/components/checkbox/checkbox.less');
@import url('../../node_modules/framework7/components/input/input.less’);

framework7のv4ではこの辺また変わると書いてあるけど、v3で作る場合にはカスタムカラーは定義が必要でした。

妊娠と体重制限と食欲と

前回妊娠した時には体重なんて全然気にしなかった。
検診で測って毎回お腹回りと同じように増えているなぁといった感じ。
今回初めて体重増加を注意された。
24w妊娠前より3.2kg増加。母子手帳の体重欄に赤いアンダーラインが引かれて助産師さんから「ちょっと増えてるねーこの時期の妊婦さんは可哀想なんだけどね」と言われる。
そう、この検診の日は12月25日。その前までが3連休で温泉に行っていたため毎日毎日飽きもせず食べまくっていたのだ。
次の検診は1月8日のお正月明け。「お正月だからご馳走出るだろうけど増えすぎないようにね」と釘を刺される。
f:id:ayapc:20190217083051j:plain
お酒を飲めない妊娠中は食べることがいちばんの楽しになっていて、成人女性の1.5倍くらいの量を普通に食べていた。コンビニでお昼買うなら大盛りのパスタとオレンジジュースとおにぎりみたいな組み合わせ。
お弁当を会社に持っていってもペロッと食べ終わってコンビニにパスタを追加で買いに行く、メロンパンがどうしても食べたくて食べたくて仕事中もメロンパンのことばっかり考えてお弁当食べた後に追加で買いに行くなんてことをコソコソ繰り返していた。
周りも「2人分だから大丈夫だよ」とか甘やかしてくるから調子に乗って続ける。
ちょっとやりすぎたかなと反省し、お正月も3が日を過ぎてからは野菜中心の節制メニューに。夫も健康診断でコレステロールに引っかかっていたので2人でちょうどいいタイミングで節制協定。

まだあと2ヶ月あるけど現時点では30wで妊娠前より5kg増加。最近は注意されていないしこのペースなら大丈夫かな。冬は汗かかないし代謝落ちているから食べる分カロリーちゃんと消費しにいかないと大変なことになるぞと言う戒め。
お産が辛くなるのは嫌だけど、もっと嫌なのは元の体重に戻らなくなること。
前回はなんだか気づいたら体重戻っていた感じだけど、今回はあれから2年半も年取ってるし、そんなに簡単に体重落ちないかもよ。

と言いながら次の楽しみは来週末のディナーブッフェ。
お酒飲めない分それくらい楽しまないとという言い訳を携えて。

2歳・妊婦・夫の3人がインフルエンザで全滅

息子が保育園でインフルエンザをもらってきた。
結果、今週は一家全滅。

月曜日11時に着信

38度以上になってしまったのでお迎えをお願いします、とのこと。久しぶりのお迎え電話。保育園に着いた時には37.7度と少し落ち着いた状態。他のお友達もお熱の高い子がいて、明日は休んでくださいと言われる。
熱は38度くらいだけどよく食べる。ご本読んでーと甘えたがりがいつもより強い感じだったけどいつもの風邪かなと言う感じ。
念の為夕方夫が病院に連れて行ってくれる。
帰ってくるとインフルエンザA型だったと言うこと。タミフルとカロナール、カルボシステインシロップを処方されて帰ってくる。
登園するためには感染から5日間もしくは解熱から3日間とあるので、今週いっぱい保育園にはいけないことが決定。インフルエンザとの戦いがスタート。

火曜日息子の症状はピークに

朝から熱は39度台と終始高め。ほとんど1日寝ている状態。見ていても辛そう。でも食欲はある。
大人二人は一日在宅で仕事。夕飯後くらいから雲行きが怪しくなる。
体が痛い気がする・・なんか怠いかもと言う感じ。

水曜大人も感染

朝一の内科に夫が行ってインフルエンザA型と診断された。
夫は今年早々と10月にはワクチンを打っていたのにインフルエンザにかかったと不満気。妊婦でも薬処方してくれると言うことを聞いて、同じ内科に行くことに。その時は38度くらい。雨も降ってて歩くのも辛い。「さっきご家族の方来ましたよね」と言われ診察してすぐにインフルエンザの判定。
妊娠8ヶ月ですが飲めますか?と聞いて薬を無事処方してもらった。
f:id:ayapc:20190209074511j:plain

夫:イナビル、カロナール、レスプレン、カルボシステイン
私:イナビル、カロナール、小青湯エキス顆粒

薬の内容は息子だけタミフル、大人はイナビルだった。どっちが効くのかはわからないが、イナビルは処方されたその日に吸引すれば効果があると言うことで毎日飲まなくていいので楽。大きく息を吸ってと言うやり方が多分子供は難しいから大人にしか出なかったのかな。
咳、痰止めが妊婦の私は2人とは異なり漢方に置き換わってました。

この日は私の辛さがMAX。私もインフルエンザ予防接種を打っていたのに。インフルエンザだと言いいながら仕事をしている夫とのこの体調の差は多分妊娠しているのとも関係しているはず。おかげで買い出しとかお願いすることができたので良かったです。

木曜日熱下がり始め

午前中は辛かったものの、午後になって洗濯物を干したり、お昼にラーメン作ったりちょっとずつ動けるようになってきた。夫は相変わらずちょっと体が痛いとか言いながら仕事している。
困ったのは息子が元気を取り戻しつつあり、外に行きたいとかご本を読んで欲しいとか遊んで攻撃の手を緩めないこと。2人とも自分のことで精一杯なのでそんな余裕はなく、かと行ってインフルエンザの病原菌である息子をばあばに預けるわけにもいかず、ゴロゴロしながら持ちこたえました。
f:id:ayapc:20190209074758j:plain

金曜日在宅復帰

朝になるともう熱はなく、頭も回りそう。喉が痛くて声が出ないのと鼻水出るくらいだけど、人と会わないので、まぁ大丈夫そうと言うことで私も在宅で仕事開始。
前2日間は辛かったけどご飯も作れるし、いつも通り動けるようになってきた。イナビル効くのか疑ってごめんなさい。でも予防接種は効果あったのか謎。
息子は鼻水垂らしながらも相変わらず元気。ちょっといつもより昼寝の時間が長いかなと言うくらい。

3人揃ってのインフルエンザ感染は大人がダウンして子供が復活したあたりが辛さのピークでしたが、なんとかレトルト食材とスーパーに助けられて生活できました。
2人とも一発でやられたので今回のインフルエンザ感染力はかなり強そう。まだ病原菌は体に残っていそうなので週末の予定はあえなく全てキャンセル。
久々の呼び出しがヘビーで辛かった。シーズン型違いで2回かかる人もいると言うことを聞いてまた恐怖。

お前の母ちゃんデベソって言うけど多分それは妊娠してたんだ

前回の妊娠ではほとんど気にならなかった。
今回7ヶ月を過ぎた頃からお腹が前に前に尖ってくるようにせり出してきた。
それでも冬だからまだ服を着ていると気づかれないこともある。
妊娠線もまだ7ヶ月だとケア始めるかなーって時期だけど、1個だけ目に見えてすごい変化が出てきたのがおへそ。
気付いた時にはデベソだった。
夫に見せたらびっくりされた。
検診いくのに先生に見られるの恥ずかしいね、と綿棒で一生懸命くるくる掃除した。
多分先生はそんなおへその出てる妊婦はたくさん見てるだろうから気にしないと思うけど。

f:id:ayapc:20190209070457j:plain
悪口で「お前の母ちゃんデベソ」ってあるけど、あれは絶対夏の妊婦さんだったんだと思う。
冬の妊婦は服着てるとわかんないから。
いじめっ子も多分羨ましかったんだろう、その子に弟か妹ができることが。

おへその掃除ができるくらいしかメリットないよこのデベソ。
無駄に出てる。主張してる。

macでcordova環境を作ろうとしてつまづいたところ

monacaから脱出して自分で環境構築しようとしたがたくさんつまづいた。
手順をひきながら調べらながらでやっと到達した。
駆除したエラーの数々。。

npm install -g cordovaが実行できない

→nodebrewのインストールをcurlではなくてbrewでやってみる。

brew install node


brewコマンドを実行するとgccをインストールしなさいと怒られる.

Error: An exception occurred within a child process:
  CompilerSelectionError: nodebrew cannot be built with any available compilers.
Install GNU's GCC

gccを入れる。

brew install gcc

gccを入れてもまたまた怒られる。

xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun

xcrunがなくなったとかなんとか。これは同じ症状の人がたくさんいた。macのOSアップデートしたらなったとかなんとか。

xcode-select --install

これでこのエラーは消えた。

再度実行するも、npmが実行できない
→nodebrewのバージョンを指定すると実行できるように。

nodebrew use  v10.14.2

やっとここまででcordovaコマンドが使えるようになった。

cordova run iosでエラーがでる

CordovaError: Promise rejected with non-error: 'xcode-select: error: tool \'xcodebuild\' requires Xcode, but active developer directory \'/Library/Developer/CommandLineTools\' is a command line tools instance\n'    at cli.catch.err (/Users/username/.nodebrew/node/v10.14.2/lib/node_modules/cordova/bin/cordova:30:15)  at process._tickCallback (internal/process/next_tick.js:68:7)

インストールしているディレクトリがダメだよと怒られているみたい。

xcode-select --switch /Applications/Xcode.app

でこのエラー出なくなった。

またまたcordova run iosで以下のエラー

No target specified for emulator. Deploying to iPhone-X, 12.1 simulator
/Users/username/VoiceApp/platforms/ios/build/emulator/HelloCordova.app/Info.plist file not found.

iosのエミュレータを実行しようとするとplistが見つからないと言われる。

cordova run ios --buildFlag='-UseModernBuildSystem=0’

実行する際にパラメータを指定してやるといいいよということで、こちらでエラーは出なくなった。
でも毎回パラメータつけなくちゃいけないのは面倒。

cordova run android のエラー

Error: Requirements check failed for JDK 1.8 or greater

これはjavaが複数入っていたのが原因みたい。

ここを参考にして前のjavaを全部消して再度java8をインストールする
Cordova向けにJDKを再インストール - Qiita


javaを入れ直したらエラーが変わった。

Could not find an installed version of Gradle either in Android Studio,or on your system to install the gradle wrapper. Please include gradle in your path, or install Android Studio

gradleのパスを通してねということ。

 echo 'export PATH="/Applications/Android Studio.app/Contents/gradle/gradle-4.6/bin":$PATH' >> .bashrc

パスを通してあげる。
gradle -vするとパーミッションで怒られたので権限を変える。

chmod +x /Applications/"Android Studio.app"/Contents/gradle/gradle-4.6/bin/gradle


再度cordova run android でエラーで怒られる。

You have not accepted the license agreements of the following SDK components:
  [Android SDK Platform 27].

ここを参考にSDK Manager の画面からライセンスに同意する。
MacでCordova開発環境を構築した備忘録 - Qiita


再度cordova run android

 PANIC: Cannot find AVD system path. Please define ANDROID_SDK_ROOT

AVDのパスがないよと言われているみたいなので、パスを通してあげる

 echo 'export ANDROID_SDK_ROOT=$HOME/Library/Android/sdk' >> .bashrc

またパニック!と言われる。

PANIC: Broken AVD system path. Check your ANDROID_SDK_ROOT value [/Users/username/Library/Android/sdk]!

adndroid sdkの画面からエミュレータをダウンロードしてみたらエラーが変わった。適当にNexxus_5Xで最新のAPIを選択。

f:id:ayapc:20181230195725p:plain

No emulator specified, defaulting to Nexus_5X_API_28
PANIC: Missing emulator engine program for 'x86’ CPU

今度はまた別のx86が見つからないよ、というエラーになる。
結局古いAPIのエミュレータを入れたら正しく起動できた。cordovaが最新のバージョンのAPIには対応していなかったらしい。

環境構築終わり。長かった。

【framework7】HTML内でのjavascriptの呼び出し方

開発しているとすぐにHTMLの中でjavascriptを呼び出したいという場面が出てくる。framework7の中でHTML内でjavascriptを使うにはちょっとステップを踏まなければいけなかった。
普通にこんな風に書いてみたところでうんともすんとも言わない。

<script>
    app.dialog.alart(“test");
</script>

f:id:ayapc:20181230074120j:plain
Router Component | Framework7 Documentation
ドキュメントを見てみると確かにHTMLの中でJavascriptを呼び出しているし、そんな書き方もできるみたい。
呼び出すのに変更した箇所は2つ。

1.HTML側の先頭と最後にtemplateを追加

<template> 
    <!-- HTML本文 —> 
</template>

<script>
    return { ... } 
</script>

loader.html

こんな構成にする。

2.route.jsでjavascriptを呼び出したいページをcomponentUrlに指定

routes = [
    {
    path: '/',   
    url: './index.html',
    },
    {
    path: '/loader/',
    componentUrl: './pages/loader.html',
    },
・・・
];

この2つの手順を踏むとHTMLの本文内でjavascriptが呼び出せるようになった。


Router Component | Framework7 Documentation

<script>
    return {
// Page Events
        on: {
            pageAfterIn: function(e, page) {
                viewEditMembers();
            },
        }
    }
</script>

あとはこんな書き方をするとonLoadみたいに使うことができる。framework7のアプリ内はシングルページみたいな構成になっていてbodyがindex.htmlにしか出現しないので、これもちょっと困ったところでした。