はじめに

Cordova Android アプリのビルド時に This project uses AndroidX dependencies, but the 'android.useAndroidX' property is not enabled. Set this property to true in the gradle.properties file and retry. のエラーとなる場合の対処方法。

TL;DR

  • platforms/android/gradle.properties を修正する
  • before_compile フックを使うと良い
    • JS ファイルを作成して config.xml に追加
  • Vue + Cordova で npm run cordova-serve-android を使う場合は after_prepare フックも設定
1
2
3
4
5
6
7
8
9
<?xml version='1.0' encoding='utf-8'?>
<widget id="example.app" version="1.0.4" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
...
<platform name="android">
...
<hook type="after_prepare" src="scripts/android_before_compile.js" /> <!-- ***追加*** -->
<hook type="before_compile" src="scripts/android_before_compile.js" /> <!-- ***追加*** -->
</platform>
</widget>
続きを読む

はじめに

Cordova iOS アプリ, Android アプリで Twitter Timeline の埋め込みを実現する方法。

TL;DR

1
2
3
4
<allow-navigation href="https://*twitter.com/*" />
<allow-navigation href="https://cdn.syndication.twimg.com/*" />
<allow-navigation href="about:*" />
<!-- <allow-navigation href="*" /> 1つでも OK -->
続きを読む

はじめに

NativeScript でアプリのバージョン情報などを取得する方法。

TL;DR

続きを読む

はじめに

NativeScript でデバイスの輝度(明るさ)を制御する方法。

TL;DR

続きを読む

はじめに

モバイルアプリ(スマホアプリ)の強制アップデート(アップデートのお知らせ)に関して調べたり、検討したりしたので簡易的なメモを残しておく


強制アップデート(アップデートのお知らせ)とは、↓のようなアプリ起動時に「最新版があるよ」と通知するようなやつ。


iOSアプリのアップデートをお知らせする | スーパーソフトウエア東京 より引用

TL;DR

  • 案1: 自サーバ内でバージョン情報を管理
  • 案2: Firebase Remote Config
  • 案3: アプリ内で App Store, Google Play にアクセス(スクレイピング)
  • 案4: 案3’ と 案1(もしくは案2) との組合せ
  • 案5: ライブラリを利用して実装
  • NativeScript のみ: NativeScript AppSync
続きを読む

はじめに

NativeScript で入力範囲外エリアのタップでキーボードを非表示にする方法

TL;DR

  • Android: dismissSoftInput() を使う
  • iOS: tns-core-modules/application/ios を使って ios.nativeApp.sendActionToFromForEvent('resignFirstResponder', null, null, null)
  • ScrollView あたりに tap イベントのハンドラとして設定
  • iOS は以下の問題があるため使用に注意
    • ロングタップによる入力補助が上手く効かなくなる
    • iOS 12以下だと入力エリアへのフォーカスが効かなくなる
続きを読む

はじめに

NativeScript(NativeScript-Vue) の ListView の表示を強制的に更新する方法。

シチュエーションとしては、「お知らせ一覧」のようなものがあって、詳細を確認したら未読アイコンが消える、というような状況。

「お知らせ詳細」から戻るボタンで ListView に戻ってきても、未読アイコンが消えずにかなりハマった。

なお、Android だと上記の問題は起きなかったため、主に iOS 向けの内容。

TL;DR

  • Pageloaded イベントなどにハンドラを設定
  • ハンドラ内で ListView.refresh() を実行する
  • NativeScript-Vue の場合は $refs を使うと楽
続きを読む

はじめに

NativeScript(NativeScript-Vue) でプラットフォームごとにファイルやプロパティを切り替える方法。

チートシート

種別 iOS Android
View ファイル分割 xx.ios.vue xx.android.vue
View 内で分岐 <ios></ios> <android></android>
プロパティで分岐 ios:prop android:prop
スタイルシートファイル分岐 xx.ios.(s)css xx.android.(s)css
JS ファイル分岐 xx.ios.js xx.android.js
JS 内で分岐 isIOS isAndroid

TL;DR

  • ios, android をファイル名や、プロパティの prefix などに使う
  • 詳細は チートシート や各事例を参照
続きを読む

はじめに

NativeScript で Skeleton Screen を表示する方法。

TL;DR

  • CSS で Skeleton Screen のアニメーションを作成
  • Skeleton Screen を表示したい箇所に↑のクラスを適用
  • 実レイアウトにあわせて width, height, border-radius などを調整
  • 本物のコンテンツを表示する際に Skeleton Screen は非表示にする
続きを読む

r17n


Softwear Engineer


Fukuoka