今回は、Onsen UIのons-carouselにドットナビゲーションを表示する方法を紹介します。
【Monaca】Onsen UI ons-splitterとons-navigatorを組み合わせる
Monacaの「Onsen UI V2 JS Splitter」のサンプルやOnsen UIのons-splitterの実例では、ons-splitter-contentのloadメソッドでページの切り替えを行っていますが、ons-navigatorを組み合わせてページ遷移を行うサンプルがないので、どのようにすればよいか悩む方も多いと思います。
ons-splitter-content内にons-navigatorを組み込み、メニューで項目を選択した場合、ons-splitter-contentではなく、ons-navigatorのページを切り替えることで実現できます。
Continue reading
【Cordova】phonegap-plugin-mobile-accessibilityプラグインがインストールできない
【Monaca】フォントサイズを変更しても画面デザインが崩れないようにするという記事のアクセスが急増しているので、いろいろと調べていたところ、Androidのプラットフォームが存在する場合にphonegap-plugin-mobile-accessibilityプラグインがインストールできない状態であることがわかりました。
実際にcordovaでインストールしようとすると、以下のようなエラーが発生します。
C:\app\test>cordova plugin add https://github.com/phonegap/phonegap-mobile-accessibility.git
Failed to fetch plugin https://github.com/phonegap/phonegap-mobile-accessibility.git via registry.
Probably this is either a connection problem, or plugin spec is incorrect.
Check your connection and plugin name/version/URL.
Error: npm: Command failed with exit code 1 Error output:
npm ERR! path git
npm ERR! code ENOENT
npm ERR! errno ENOENT
npm ERR! syscall spawn git
npm ERR! enoent Error while executing:
npm ERR! enoent undefined ls-remote -h -t https://github.com/phonegap/phonegap-mobile-accessibility.git
npm ERR! enoent
npm ERR! enoent
npm ERR! enoent spawn git ENOENT
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoentnpm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\xxxxx\AppData\Roaming\npm-cache\_logs\2019-07-10T00_56_27_188Z-debug.log
【Monaca】Onsen UI pushPageでパラメーターを渡す
最近、Onsen UIが動かないということで、当ブログのOnsen UI関連の記事にアクセスしてくださる方が多く見られます。
おそらくOnsen UI V1の時代のブログ記事を読んで、そのサンプルコードがうまく動作せず躓いているように思いました。
最新版のOnsen UI V2は、V1と互換性のない箇所がいくつかあります。
今回は何件か検索履歴にありました、Onsen UI V2のpushPageでパラメーターを渡す方法を紹介します。
※AngularJSを使用します。
Continue reading
【Monaca】Onsen UIでGoogleマップを切り替える
【Monaca】Onsen UIでGoogleマップを表示する その2
ちょうど1年ほど前に【Monaca】Onsen UIでGoogleマップを表示するという記事を書き、たくさんのアクセスをいただきました。
Maps JavaScript APIを使った方法のため、APIキーの取得や有料化の問題など面倒な部分が多かったと思います。
今回はiframeを使用して無料でGoogleマップを表示する方法を紹介します。
Continue reading
【Cordova】Ver.8.1.2「cordova-plugin-crypt-file」ENOENT: no such file or directory, open ‘DecryptResource.java’ エラー回避方法 その2
2019/07/01現在、Cordova Ver.8.1.2において、「cordova-plugin-crypt-file」プラグインを使用した場合、ビルドにおいて下記のエラーが発生します。
このエラーの回避方法について説明します。
ENOENT: no such file or directory, open ‘C:\xxxxx\yyyyy\platforms\android\src\com\tkyaji\cordova\DecryptResource.java’
Continue reading
【Monaca】ツールバーとコンテンツの間に固定のヘッダーを作成する
下図は「シンプル利益計算」の画面ですが、ツールバーの下に日付・期間・グラフを表示し、その下にリストを表示するように作成しています。
リストをスクロールすると、日付・期間・グラフの表示位置は固定のため、スクロールに影響することなく表示することができます。
今回はツールバーとコンテンツの間に固定のヘッダーを作成する方法を説明します。
Continue reading
【Monaca】EaselJSを使用してスクラッチアプリを作成する
EaselJSを使用してスクラッチアプリを作成してみました。
もとになったネタはStackOverflowのCreate Eraser in EaselJs – what nextで、eraseの機能を使えばスクラッチぽい動きになるかと思いました。
Continue reading