Development」カテゴリーアーカイブ

列車時刻表(6) – 乗車予定登録後の画面遷移

前記事に引き続いて、乗(下)車予定登録機能を実現する。 乗車指定時 乗車を指定したタイミングでは、まさに列車に「乗っている」状態なので、次のアクションとしては、その列車が通るいずれかの駅で降りることが想定される。そこで、 … 続きを読む

カテゴリー: Development | タグ: , | コメントする

列車時刻表(5) – 乗車/下車予定を登録する

時刻表で調べた乗車・下車時刻と区間を登録できるようにする。実行サンプルはこちら。 列車を選択して「乗車」する 「駅時刻表」で右側のグリッドボタンをクリックして列車を選択して「乗車」する。 乗車内容の確認 列車を選択すると … 続きを読む

カテゴリー: Development | タグ: , | 1件のコメント

列車時刻表(4) – 駅・路線検索ページの作成

作成中の時刻表に、「駅名・路線名」検索ページを追加する。 追加後の実行サンプルはこちら。画面は以下の感じ。 検索文字を入力するテキストボックスの作成は、input要素で type=”search” … 続きを読む

カテゴリー: Development | タグ: , | コメントする

列車時刻表の試作(4) – 上り/下り列車の表示 -

時刻表の表示の際、上り・下り列車を選択的に表示する。選択にはjQuery Mobileの「チェックボックス」を利用する。似たウィジェットである「ラジオボタン」では、複数の選択肢から1つのオプションしか選べないが、チェック … 続きを読む

カテゴリー: Development | タグ: , | コメントする

列車時刻表の試作(3) – 曜日の切り替え -

時刻表データは「平日」「土曜」「休日」の3種類からなり、現在は路線ごとに1つのJSONファイルに格納している。どの曜日のデータを表示するかはナビゲーションバーにより選択する。 時刻の部分のデータ形式は以下のイメージになっ … 続きを読む

カテゴリー: Development | タグ: , | コメントする

jQuery Mobileのナビゲーションバーを使う(2) – 変数との関連付け -

前記事に引き続いて、ナビゲーションバーを使う。今回は、これを ・クリック(タップ)アクションを変数と結びつける ・各ページで状態(値)を保持する(選択している曜日のボタンをアクティブにする) 方法を考える。 作成したナビ … 続きを読む

カテゴリー: Development, Tips | タグ: , , | コメントする

jQuery Mobileのナビゲーションバーを使う(1)

jQuery Mobileのナビゲーションバーを使ってみる。その名のとおり、本来はヘッダーやフッター内に配置されるページ遷移用のバーだが、 ・位置を固定できる(スクロールしても常に表示される) ・値を保持できる(複数のペ … 続きを読む

カテゴリー: Development, Tips | タグ: , | 1件のコメント

jQuery Mobileで列車時刻表を試作(2) – OuDiaのデータを表示

前記事で作成したJSONでファイルを読み込んでjQuery Mobileで作成した画面で表示してみる。 サンプルはこちら。(まだ作成途中なので、動かない部分あり。) まずは以下の画面を作る。 路線リスト 駅リストと列車リ … 続きを読む

カテゴリー: Development | タグ: , | コメントする

予定作成アプリ(PC版)のレベルアップ(3) – 予定の詳細表示 -

前記事に引き続いて、PC版予定表アプリをレベルアップする。今回は、予定の詳細データを表示できるようにする。 画面はこういう感じで、右のパネルに新しいタブ(Plan Detail)を追加し、その中のデータグリッドに、各予定 … 続きを読む

カテゴリー: Development, Location Service | タグ: , , , | コメントする

予定作成アプリ(PC版)のレベルアップ(2) – 予定の保存 -

前記事に続いて、予定作成アプリをレベルアップする。予定を保存する際、これまでは「削除→新規登録」していたが、今回の修正で「既存の予定は更新」し、「新しい予定は新規登録」するように変更する。以下、処理ロジックを説明する。 … 続きを読む

カテゴリー: Development, Location Service | タグ: , , , | 1件のコメント