著者アーカイブ 村上

村上 著者:村上

【Cordova】外部サイトをアプリ内ブラウザで表示する方法

実際に試してはいないのですが、今後実装すると思われるので、その備忘録としてまとめ。

見つけた記事はこちらです。

PhoneGap/Cordovaでの外部サイトリンク 内部表示/アプリ内ブラウザ/標準のブラウザ – Qiita
https://qiita.com/tsunet111/items/272f3e052c332ddf9b9d

 

実装方法ですが、Cordova の初期テンプレートに最初から追加済みのプラグイン「cordova-plugin-whitelist」を使います。
まず、config.xml にアプリ内で表示したいアドレスを追加します。
記述例は下記のとおりです。

<allow-navigation href="https://cpoint-lab.co.jp/*" />

上の例では、このサイト全体の表示を許可しています。

<a href="https://cpoint-lab.co.jp/">株式会社シーポイントラボ</a>

あとは、aタグでリンクを設置します。
作業としては以上です。
こちらを実行すると、ホワイトリストに追加したアドレスであれば、内部ブラウザで表示されます。
なお、それ以外のアドレスにアクセスした場合は、端末のデフォルトブラウザが起動しますので、ご注意ください。

 

以上、Cordovaアプリのアプリ内ブラウザで外部サイトを表示する方法でした。
もし、上記の方法でうまくいかない場合は、「cordova plugin add cordova-inappbrowser」を使う方法もあるとのこと。
ホワイトリストが働かない場合は、こちらのプラグインもお試しください。

村上 著者:村上

【Android】XMLデータから特定のタグの値を取得する方法

もしかしたらもっとスマートなやり方があるのかもしれませんが…問題なく動作しますので、XMLの扱いでお悩みの方は是非。
XMLデータから、特定のタグの値を取得する方法です。
なお、参考にしたサイトをうっかり失念してしまったので、今回はリンクはありません。

 

では早速、コードはこちら。

private void getXmlData(String xml) throws XmlPullParserException, IOException {
    XmlPullParserFactory factory = XmlPullParserFactory.newInstance();
    XmlPullParser parser = factory.newPullParser();
    parser.setInput(new StringReader(xml));
    int eventType = parser.getEventType();

    String data;
    List<String> arrData = new ArrayList<>();

    while (eventType != XmlPullParser.END_DOCUMENT) {
        if (eventType == XmlPullParser.START_TAG) {
            switch (parser.getName()) {
                // データを取得したいタグが一つ
                case "[データを取得したいタグ名]":
                    parser.next();
                    data = parser.getText();
                    break;
                // データを取得したいタグが複数
                case "[データを取得したいタグ名]":
                    parser.next();
                    arrData.add(parser.getText());
                    break;
            }
        }
        eventType = parser.next();
    }
}

こんな感じです。
関数にしているので、そのままコピー&ペーストしてもらえば動作するかと思います。
なお、渡すXMLでデータは 文字列 に変換しています。

重要そうな部分だけを説明すると、10行目から XMLデータを while で、タグやデータなど 1つずつ見ていって、それが開始タグで、かつそれがデータを取得したいタグだった場合はそのタグの値を取得しています。
また、14行目からの case句は、タグが一つしかない場合のデータの取得方法で、対して 19行目からの case句は、タグが複数あった場合のデータの取得方法です。
といっても、データを格納する変数が StringList かの違いしかないのですけどね。

これでデータの取得ができますので、あとはこのデータを行いたい処理などに使ってください。

 

以上、XMLデータから特定のタグのデータを取得する方法でした。
やり方を変えれば、全タグのデータも取得できるかと思いますので、是非ご活用ください。

村上 著者:村上

【Cordova】FCMを導入した時の「Error: Invalid data, chunk must be a string or buffer, not object」エラー対処法

今回は、Cordovaアプリに cordova-plugin-fcm を導入した際に発生したエラーについてです。
なお、端末は Android です。
エラーはこちら。

Error: Invalid data, chunk must be a string or buffer, not object

翻訳すると、「エラー:無効なデータです。チャンクはオブジェクトではなく文字列またはバッファでなければなりません」とのこと。
これだけだとよく分かりませんが、FCM の導入時に作成した google-services.json が関係しているのでしょうか。
が、ファイルを置く場所はあっているし、内容もダウンロードした時のままなので、間違っているはずもなく…。

 

そして調べたところ、下記の記事がヒットしました。

Cordovaで cordova-plugin-fcm を追加すると発生するエラーを消す方法 – 備忘録
https://kagasu.hatenablog.com/entry/2018/10/04/215302

まさに求めていた内容そのもの!
原因は分かりませんでしたが、対処法としては、fcm_config_files_process.js というファイルを、下記の内容に置き換えて実行するだけでした。
なお、fcm_config_files_process.js の場所は、下記にあります。
[プロジェクト名]/plugins/cordova-plugin-fcm/scripts/fcm_config_files_process.js

書き換えるファイルの内容については、下記をまるっとコピー&ペーストしてください。

Invalid data, chunk must be a string or buffer, not object・Issues #213・fechanique/cordova-plugin-fcm・GitHub
https://github.com/fechanique/cordova-plugin-fcm/issues/213#issuecomment-357162384

あとは、通常通りビルドしたところ、発生していたエラーが表示されなくなりました。

 

以上、cordova-plugin-fcm 導入時に発生したエラーの対処法でした。

村上 著者:村上

【Android】EditTextでの文字の複数行入力とInputTypeの種類

Androidアプリ開発では、文字を入力できる項目として EditText があります。
今回は、この EditText で文字を複数行入力するときの指定方法と、それ以外の入力タイプについて簡単にまとめ。
完全私的見解ですが、特によく使いそうなものをピックアップしました。

なお、今回参考にさせていただいた記事はこちらから。

Androidアプリ入門 No.09 EditTextの入力制限関連属性 – コンピュータクワガタ
https://kuwalab.hatenablog.jp/entry/20101213/p1

 

まず最初に、文字を複数行入力するときの設定について。
入力する値は inputType で指定します。
で、複数行の入力を許可するときには textMultiLine という値を指定します。
サンプルは下記のとおりです。

<EditText
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:inputType="textMultiLine" />

最終行で、inputType に textMultiLine を指定しています。
これがあることで、改行が可能になります。

 

それ以外の設定値については下記のとおりです。

設定値 説明
none 入力禁止
text 通常のテキスト
textMultiLine 複数行に渡るテキスト
textPassword パスワード
textEmailAddress メールアドレス
textPersonName 人名
textPostalAddress 住所
phone 電話番号
datetime 日付・時刻
date 日付
time 時刻
number 数値
numberSigned 符号付き数値
numberDecimal 少数

他にもまだいくつかありますが、個人的に使いそうなものだけをピックアップしました。
ほかの入力パターンを知りたい場合は、上で挙げた参考記事をご確認ください。

 

以上、AndroidのEditTextで複数行を入力する方法と、入力タイプの種類についてでした。
意外とこういう設定値って、毎回忘れてその都度調べたりするので…調べる時間を節約したくて今回まとめてみました。
皆様の参考になれば幸いです。

村上 著者:村上

【アプリ】絶対に起きられる悪魔のアラーム「おこしてME」

GIGAZINE で何とも面白そう?なアラームアプリを見つけたのでご紹介。
通称「悪魔のアラーム」という、どんなに朝が弱い人でも絶対に起きられるアラームとのこと。
私が読んだ GIGAZINE の記事はこちらから。

パズルやカメラで二度寝を強力に阻止する無料の爆音目覚ましアプリ「おこしてME」を使ってみた – GIGAZINE
https://gigazine.net/news/20181107-okoshite-me/

私の各記事よりもはるかに面白いので、こちらを読むことをおすすめしたいです。

アプリ名は「おこしてME」と言います。

「悪魔」らしからぬ、可愛らしい名前ですね。

インストールはこちらから。

Android:https://play.google.com/store/apps/details?id=droom.sleepIfUCan
iOS:https://itunes.apple.com/jp/app/id1163786766

 

で、このアプリの何が「悪魔的」かというと、アラームの解除方法にあります。
なんと、あらかじめ指定しておいた物を写真で撮ったり、決められた回数端末をふるふると振ったり、計算問題を解いたりしないと解除できないしようとなっています。
もしくは、事前に設定しておいたもののバーコードを読み込んだり、という方法もあるとのこと。
もちろん、上記に挙げたような手順を踏まず、通常の方法で解除する方法もあるようです。
また、アラームの音は数種類から選ぶことができ、時間経過とともにだんだんと音が大きくなるとのこと。

これならば確実に起きられはしそうですね。
…ただ、正直かなりイライラしてしまいそうなので、一日がこれで始まるのは避けたいところ。
どうしても起きなければならない!というときの最終手段の一つとして候補に入れておきたいですね。

 

以上、絶対に起きられるアラーム「おこしてME」のご紹介でした。
個人的には、バーコードリーダーを使って止める機能が面白いと思いましたね。
例えば、洗面所やキッチンにあるもののバーコードを登録しておけば、朝起きてから次の動作につなげやすいのではないでしょうか。
ただし、アラームを停止しないと、音がだんだんと大きくなるそうなので、近隣住民の方や一緒に寝ている方のご迷惑にならないようにご注意ください。

村上 著者:村上

【Cordova】ローカル通知機能を実装するためのプラグイン「cordova-plugin-local-notifications」

今回は、アプリにローカル通知を送る方法について。
アプリから通知を送るには、以前にも何度か記事に取り上げた cordova-plugin-fcm など、インターネット経由で外部サービスと連携してプッシュ通知を送る方法がありますが、ローカル通知はアプリ自身が通知を送る仕組みです。

プラグインは「cordova-plugin-local-notifications」を使用しています。
GitHubはこちらから。

GitHub – katzer/cordova-plugin-local-notifications: Cordova Local-Notification Plugin
https://github.com/katzer/cordova-plugin-local-notifications

 

まずインストール方法ですが、下記のコマンドを実行します。

cordova plugin add cordova-plugin-local-notification

ローカル通知を送るには、下記のコードを実行します。

cordova.plugins.notification.local.schedule({
    title: '[タイトル]',
    text: '[メッセージ]',
    foreground: true
});

最低限、上記のタイトルやメッセージテキストなどを指定すれば、即時に通知が送付されます。
他にも指定できる項目があり、添付ファイルや、”Yes”、”No” などのボタン、更には文字の入力欄を追加することもできます。

また、trigger という項目を指定することで、送付するタイミングや、繰り返し通知することもできます。
現時点では使ってはいませんが、こちらも便利そうですね。
サンプルコードはこちら。

// 指定した時間にローカル通知を送付
cordova.plugins.notification.local.schedule({
    title: '[タイトル]',
    text: '[メッセージ]',
    trigger: { at: new Date([年], [月], [日], [時]) }
});

// 指定した回数だけ毎日通知する
cordova.plugins.notification.local.schedule({
    title: '[タイトル]',
    text: '[メッセージ]',
    trigger: { every: 'day', count: [回数] }
});

個人的には、あるエリアに行くと通知する、という下記のコードも便利そうだと思います。

cordova.plugins.notification.local.schedule({
    title: '[タイトル]',
    text: '[メッセージ]',
    trigger: {
        type: 'location',
        center: [lat, long],
        radius: [通知半径],
        notifyOnEntry: true
    }
});

ただし、こちらの位置による通知は iOS 未対応のようです。
ご利用になる際には、その点だけご注意ください。

 

以上、アプリにローカル通知を送信する方法についてでした。
予定のリマインドなど自分自身に通知を送りたいだけの時には、こちらのプラグインで十分だと思います。

村上 著者:村上

【Cordova】ダイアログを表示するためのプラグイン「cordova-plugin-dialogs」

今回は、Cordovaで開発しているアプリでダイアログを表示させる方法です。
使用したプラグインは、「cordova-plugin-dialogs」です。
GitHubのページは下記からご確認ください。

GitHub – Apache Cordova Plugin dialogs: apache/cordova-plugin-dialogs
https://github.com/apache/cordova-plugin-dialogs

シンプルなダイアログを簡単に表示することができます。

 

インストールは、下記のコマンドを実行してください。

cordova plugin add cordova-plugin-dialogs

次に使い方ですが、まず一般的なダイアログの表示には、navigator.notification.alert メソッドを使います。
サンプルコードは下記の通りです。

navigator.notification.alert(
    '[ダイアログのメッセージ]',
    function(){
        // ダイアログのボタンが押下された後に実行する処理
    },
    '[ダイアログのタイトル]',
    '[ボタンのテキスト]'
);

サンプルはこんな感じ。
なお、ボタンのテキストのデフォルトは「OK」です。
ボタンのテキストがこちらで問題がなければ省略しても大丈夫です。

次に、「OK」「キャンセル」など、ボタンが複数あるダイアログの表示方法です。
メソッドは、navigator.notification.confirm を使います。

navigator.notification.confirm(
    '[ダイアログのメッセージ]',
    function(buttonIndex){
        // ダイアログのボタンが押下された後に実行する処理
    },
    '[ダイアログのタイトル]',
    '[ボタンのテキスト(配列で指定する)]'
);

navigator.notification.alert とほぼ同じですが、違う点はボタンのテキストを配列で指定しているところと、コールバック関数に引数があるところですね。
ちなみに、ボタンは最初に指定した方が右側に表示されますのでご注意ください。
また、コールバック関数の引数には、押されたボタンのインデックスが渡されます。
ボタンごとに処理を変えたい場合は、この数値を参考にしてください。

最後は、navigator.notification.prompt メソッドです。
こちらは、テキストの入力欄があるダイアログです。
サンプルコードはこちら。

navigator.notification.prompt(
    '[ダイアログのメッセージ]',
    function(result){
        // ダイアログのボタンが押下された後に実行する処理
        // ボタンのインデックス:results.buttonIndex
        // テキストエリアの入力値:results.input1
    },
    '[ダイアログのタイトル]',
    '[ボタンのテキスト(配列で指定する)]'
    '[入力欄のデフォルトテキスト]'
);

コードにも記載しましたが、このメソッドのボタン押下後のコールバックでは、ボタンのインデックスと入力エリアのテキストが取得できます。
それぞれ、result.buttonIndexresult.input1 と指定して取得します。

ダイアログのメソッドについては以上です。
他にも、ビープ音を鳴らせたりもしますが、今回は使わなかったので割愛します。

 

以上、ダイアログを表示する方法でした。
このプラグインで表示できるダイアログはかなりシンプルなものなので、使い勝手はいいと思います。
ただ、デザインのカスタマイズをしたい!という場合には向かないですね。
どちらかと言うと、ちょっとデザインに手を加えたりしたいので、他にもダイアログを表示できるプラグインがないか調べてみたいと思います。

村上 著者:村上

【Webサービス】インストール不要で使えるビデオチャットツール「appear.in」

少し前からアカウント作成が必須にはなりましたが、それでも便利です。

今回ご紹介するのは「appear.in」というテレビ会議ツールです。
ビデオチャットツールといった方が分かりやすいでしょうか?

サイトはこちらから。

appear.in – Easy video conversations
https://appear.in/

以前はアカウント登録なしで使えたのですが、現在は登録必須です。
が、それは「部屋」を作るために必要なだけなので、参加者のだれか一人がアカウント登録・ルーム作成を行えば、それ以外の人は、登録なしで使用できます。
ちなみに、無料アカウントの場合、作成できるルーム数は1つのみです。

なお、無料アカウントでも、作成したルームには最大4人(4台)が当時に接続できます。
また、音声・マイクのON/OFFや画面共有、チャットなど、基本的なことは一通りできますので、大人数でさえなければ無料プランでも問題ありませんね。
ちなみに、有料プランだと最大12名と同時に接続でき、ルームも10まで作成できます。
なお、有料プランは月額 $9.99 です。

弊社では他社様とのテレビ会議の時によく使っていますが、音声も途切れないし、映像もキレイです。
なにより、アプリをダウンロードしたりせず、URLを共有するだけでブラウザで使えるというのが凄く楽でおすすめです!
ちなみに、使用できるブラウザは下記の3つです。

  • Chrome
  • FireFox
  • Opera

 

以上、おすすめのテレビ会議ツール「appear.in」のご紹介でした。
今回だけ使いたい!など、手軽に使えるツールをお探しの場合は、是非ご検討ください。

村上 著者:村上

【Android】アプリ内にデータを保存できる「SharedPreferences」

Androidでアプリを開発する際、ちょっとしたデータを保存したいときがあるかと思います。
Webであれば、Cookie や LocalStorage が使えますが、Android の場合でもよく似た仕組みがあります。
それがこちらの「SharedPreferences」です。

参考にさせていただいたサイトはこちら。

[Android] データを保存し Android Studio で確認 SharedPreferences
https://akira-watson.com/android/sharedpreferences.html

 

早速使い方はこちら。

SharedPreferences dataStore = getSharedPreferences("DataStore", MODE_PRIVATE);
Editor editor = dataStore.edit();
// 保存するデータを追加
editor.putString("input", "abcdefg");
editor.apply();

なお、getSharedPreferences() の第2引数で指定している MODE_PRIVATE とは「このアプリからのみ読み書き可能」という意味になります。
基本的には、これでOKだと思います。

また、データはほかにも下記の型を保存できます。

editor.putInt("DataInt", 123);
editor.putBoolean("DataBoolean", true);
editor.putLong("DataLong", 12345678909876L);
editor.putFloat("DataFloat", 12.345f);

そして、読み出しは下記のようになります。

String dataString = dataStore.getString("input", null);

読み出しについてはいたってシンプルですね。
なお、第二引数には、データを取得できなかった場合の代用値を指定します。

他の型の取得については下記のとおりです。

int dataInt = dataStore.getInt("DataInt", 0);
boolean dataBoolean = dataStore.getBoolean("DataBoolean", false);
long dataLong = dataStore.getLong("DataLong", 0);
float dataFloat = dataStore.getFloat("DataFloat", 0);

 

以上、アプリ内にデータを保存できる SharedPreferences の使い方でした。
データベースに保存するまでもないような、小さなデータなどでしたらこれで事足りるかと思います。
是非、便利に使ってください。

村上 著者:村上

【Android】XMLをJSONに変更できるライブラリ「JSONIC」

結論から言うと、私の環境ではうまく使えなかったので、実際の使用は見合わせました。
が、かなり便利そうだったので、いつか使うとき用に備忘録としてまとめます。

今回紹介するのは、「JSONIC」というJava用のシンプルかつ高機能なJSONエンコーダー・デコーダーライブラリです。
GitHubはこちらから。

GitHub – hidekatsu-izuno/jsonic: simple json encoder/decoder for java
https://github.com/hidekatsu-izuno/jsonic

…しかし、よく見たら、今後機能強化が行われることがないメンテナンスモードに移行するとのこと。
もし利用する場合は、jackson への移行をおすすめしているとのことでした。

 

使い方のサンプルコードはこちら。

import net.arnx.jsonic.JSON;

// POJOをJSONに変換します
String text = JSON.encode(new Hoge());

// JSONをPOJOに変換します
Hoge hoge = JSON.decode(text, Hoge.class);

いたってシンプルです。

また、XMLをJSONに変換したい場合は、下記のようにします。

Document doc = builder.parse(new File([変換したいXMLファイル]));
String xmljson = JSON.encode(doc);

例えば、下記のようなXMLファイルを変換すると、

<feed xmlns="http://www.w3.org/2005/Atom">
  <title>Feed Title</title>
  <entry>
    <title>Entry Title</title>
  </entry>
</feed>

変換後のJSONは下記のようになります。

["feed", {"xmlns": "http://www.w3.org/2005/Atom"},
    ["title", "Feed Title"],
    ["entry",
        ["title", "Entry Title"],
    ]
]

なお、この時、タグ間の空白文字も TextNodeとして出力されるらしいので、これが不要な場合は、DOM作成時に取り除く必要があるとのことでした。

 

以上、簡単ではありますが、JSONIC ライブラリの使い方でした。
もし、JSONのエンコード・デコードをシンプルに行えるライブラリをお探しでしたら、参考にしていただければと思います。
が、最初に書いたように、JSONIC は今後機能強化を行わないとのことでしたので、利用する場合は、jackson を使用するようにしてください。