インフラジスティックス・ジャパン株式会社Blog

インフラジスティックス・ジャパン株式会社のチームメンバーが技術トレンド、製品Tips、サポート情報からライセンス、日々の業務から感じることなど、さまざまなトピックについてお伝えするBlogです。

UIコントロール選択ガイド - カレンダー、スケジュール

UIコントロール選択ガイド - カレンダー、スケジュール

このエントリは、「アプリケーション開発のためのUIコントロールガイド」の第2章で述べられているUIコントロール選択ガイドからカレンダー、スケジュールについて記したものです。 

全体の目次やPDF版のダウンロードについてはエントリの最後をご覧ください。

コントロールの概要

カレンダーやスケジュールコントロールは人や部屋などを「リソース」と捉えて、その予定やタスク、履歴など日時情報を持つ活動を「アクティビティ」として表示、記録するUIです。表示する内容に合わせ、週、日、時間単位で異なるUIを表現します。

このUIは下記のシナリオで利用されます。

  • 社員や会議室などの予定管理アプリケーション
  • 美容院や飲食店などで利用される予約管理アプリケーション
  • 機器の稼働状況のモニタリングや稼働予定を表すアプリケーション

提供している機能

カレンダー、スケジュールは次のような機能を提供します。

  • カレンダーによる日付選択  アクティビティの追加・編集・削除
  • 1日のスケジュール一覧画面  アクティビティのドラッグ&ドロップ
  • 複数日のスケジュール一覧画面  アクティビティの複製
  • 1月のスケジュール一覧画面  複数リソースの分割・統合表示
  • タイムライン(横方向)でのスケジュール表示

利用ポイント

  • リソースやアクティビティなどスケジュールコンポーネント特有の用語が存在します。これらの用語を理解した上で利用方法を検討しましょう。
  • 既存の予定データが存在する場合は、データのマッピングを行い、コンポーネントが必要とするデータ定義に揃えるようにしましょう。
  • 1画面あたりに表示するリソース数(例:人数)を多くした場合、項目数が多くなり、全体把握が難しくなります。そのため適切な表示数に制限するか、ユーザーに推奨となる表示数を周知するようにしましょう。
  • 細かなタスクの管理(親子関係や進捗、期限など)には向かないため、このようなデータを取り扱う際にはガントチャートの使用を検討しましょう。

対応プラットフォーム 

カレンダーやスケジュールを提供しているプラットフォームは次のとおりです。
(画像をクリック・タップすると製品紹介ページへと遷移します。)

Ultimate UI for Windows Forms  Ultimate UI for WPF  Ignite UI for JavaScript - ASP.NET MVC 

ASP.NET Web Forms  Ignite UI for JavaScript - jQuery  NucliOS

Infragistics Ultimate UI for Xamarin f:id:IGJP:20210329134003j:plain f:id:IGJP:20210720111626p:plain

スクリーンショット

UIコントロール選択ガイド - スケジュール - カレンダーによる日付選択と1日のスケジュール表示

カレンダーによる日付選択と1日のスケジュール表示

UIコントロール選択ガイド - スケジュール - 複数リソースの表示 – 並べて表示

複数リソースの表示 – 並べて表示

UIコントロール選択ガイド - スケジュール - 複数リソースの表示 – 重ね合わせ

複数リソースの表示 – 重ね合わせ

UIコントロール選択ガイド - スケジュール - タイムライン(横方向)のスケジュール表示

タイムライン(横方向)のスケジュール表示

全体目次およびPDF版のダウンロード

「アプリケーション開発のためのコントロールガイド」ではこのエントリの他にも「有償コントロールを利用する意義」やInfragistics Ultimateで提供しているさまざまなUIコントロールの特性や利用ポイントをまとめた「UIコントロール選択ガイド」をご準備しています。

オンライン版では数週間に渡り1つ1つのトピックについて連載します。

blogs.jp.infragistics.comローカル環境で全文をご覧になりたい場合は、こちらよりダウンロード頂けます。

jp.infragistics.com