最高・最低気温、日の出・日の入時間、湿度を表示。ブロック・コード的には、復習。特別目新しい事項はないが、関数実行の順序などで勘違いし解決するのに随分時間を使った。(例えば、変数Aに値を設定する関数A-funcが実行される前に変数Aを使うなど、初心者がよくやる行き当たりばったりのコーディングからくる間違い。)
日の出・日の入時間については、以前と同様、time zoneによる補正を行った。日付 (date) についても、一応補正を行った。実質的には何も変わらないが。
アプリ実行のビデオ:
スクリーン・デザイン:
変更点は、右上端に配置していた日の出・日の入時間の表示ボタンを削除したこと。
ブロック・コード:
最高・最低気温、日の出・日の入時間、湿度を表示する部分のみを要約の形で。
1. デコードする前のDBより取得したJSONデータは以下の通り(最初の関係する部分のみ)。単位は、時間・日付はUnix Time、温度は°C、湿度は、%。
1=>該当都市のtime zone(GMTとの時差)を取得し、変数targetCityTimeZoneに格納
2=>日の出、日の入時間を取得し、7日間のデータを変数sunriseTimeListおよび変数sunsetTimeList(省略)に格納。
関数getSunriseDate(赤黄点線内):取得した日の出時間 (Unix Time)をHH:mmフォーマットに変換する前に、(日の出時間 (Unix Time) + time zone) - 32400 を計算して補正の上、1000倍(MIT App Inventor2が扱うミリ秒へ換算)してからフォーマットしている。
なお、今回、同様の補正を日付に対しても行った。
3=>最低・最高気温を取得
キー、値を順番に辿って7日間のデータを取得し、変数maxTempListおよび変数minTempListに格納
4=>湿度を取得
キー、値を順番に辿って7日間のデータを取得し、変数humidityListに格納
2. 日本語と英語の切り替え機能を備えているので、見出しなどを日英両言語でリスト形式であらかじめ設定した。
変数sunriseLabelおよび変数sunsetLabel(後者は省略)
変数maxTempLabelおよび変数minTempLabel(後者は省略)
変数humidityLabel
3. 上記1.のデータと2.の見出しを、選択された言語に応じListViewに表示。
ListView1に表示するデータは、「call ListView1.CreateElement」ブロックを利用するのが便利。データの挿入口は3つあるが、その内 detailText「サブテキスト」に取得したデータを挿入。
スクリーンでそれぞれのデータを見ると以下の通り。今回追加したのは、サブテキストの部分。
実際のブロック(最高気温の部分のみ、他のデータはこの下に続く)を見ると、以下のように選択された言語に応じ、ラベルをピックアップしデータと結合して表示する。
*********************以下続くが省略*********************
\nは改行マークだが、MIT App Inventor2 の場合、この改行マークではなくHTMLの br を使用しないと改行しない場合がある。この場合分けの基準は不明、と言うか私が知らないだけと思う。
*******************************************************************************
前回までのブログ:
MIT App Inventor 2で遊ぶ (Weather App New 4)
MIT App Inventor 2で遊ぶ (Weather App New 3)
※コメント投稿者のブログIDはブログ作成者のみに通知されます