現代のユーザーインターフェースにおいて、状態間の遷移やユーザーインターフェースのアニメーションは極めて有益です。これらはQt Quick Ultraliteにおいて、第一級の概念となっています。

このページでは、状態、状態遷移、およびプロパティアニメーションの概念について説明します。どの概念が重要で、その理由、そしてそれらの概念がどのように相互に関連しているかを詳しく解説します。また、これらの概念を実装するためにQt Quick Ultraliteが提供するQML型の詳細へのリンクも掲載しています。

状態

特定のビジュアルアイテムの状態とは、そのビジュアルアイテム内の個々のパーツがどのように、どこに表示されるかを記述する情報の集合、およびその状態に関連付けられたすべてのデータを指します。ユーザーインターフェース上のほとんどのビジュアルアイテムは、状態の数が限られており、それぞれの状態には明確に定義されたプロパティがあります。

たとえば、リスト内の要素は「選択されている」か「選択されていない」かのいずれかであり、選択されている場合は、現在アクティブな単一の選択対象であるか、あるいは選択グループの一部であるかのいずれかになります。

これらの各状態には、それに関連する特定の視覚的外観（通常、ハイライト、展開など）が設定される場合があります。

Qt Quick Ultralite には、そのセマンティクスを定義し、動作やアニメーションをトリガーするために使用できるプロパティを備えた `State ` タイプが用意されています。詳細については、「状態の使用」を参照してください。

遷移

ビジュアルアイテムがある状態から別の状態へ遷移すると、そのアイテムの外観が変化します。遷移とは、2つの状態を結ぶ境界のことです。アプリケーションの他の部分では、特定の状態に入ったり、その状態を離れたりした際に動作がトリガーされる場合があるため、遷移によって他のイベントが発生することもあります。

Qt Quick Transition 型が提供されており、この型には、アプリケーションがある状態から別の状態へ変化する際に何が起こるかを定義するプロパティがあります。遷移の詳細については、「状態変化時の遷移」を参照してください。

アニメーション

状態間の遷移時には、スムーズなアニメーションを使用して、遷移中のユーザーを支援することができます。画面上の表示が突然かつ予期せず変化すると、ユーザー体験が損なわれるため、避ける必要があります。

リスト内の要素が選択された場合、色の変化（通常色からハイライト色へ）にアニメーションを適用できます。また、リスト内での要素の位置が変更された場合は、ユーザーの視線がその変化を追えるよう、滑らかなアニメーションで移動させることができます。

Qt Quick Ultralite では、さまざまなアニメーションおよびトランジションの種類を通じて、こうしたアニメーションがサポートされています。これらの種類や使用方法については、「アニメーションとトランジション」を参照してください。

プロパティの代入のアニメーション化

アニメーションは、状態や状態間の遷移だけに関連するものではありません。たとえば、特定の状態に関連付けられていない他のイベントによって、アニメーションがトリガーされる場合もあります。

変化の原因にかかわらず、視覚要素の特定のプロパティの変更にアニメーションを適用することは、多くの場合有益です（例えば、不透明度のエフェクトなど）。Qt Quick Ultraliteには、プロパティの変更に対するアニメーションの挙動をクライアント側で指定できるBehavior 型が用意されています。

Behavior 型を使用してプロパティの変更をアニメーション化する方法の詳細については、「デフォルトのプロパティアニメーション」を参照してください。

スプライトのアニメーション

Qt Quick Ultraliteでは、スプライトを描画するためにAnimatedSprite 型を提供しています（Qt Quick の実装と比較して、いくつかの制限があります）。また、1つの大きな画像の代わりに、多数のソースファイルを含むディレクトリを使用できるAnimatedSpriteDirectory 型も提供しています。 スプライトアニメーションでディレクトリ内のリソースを使用するには、qmlproject内でImageFiles.MCU.resourceAnimatedSpriteを使用してタグ付けしてください。このようなリソースにタグを付けることで、Qt Quick のUltralite Toolsがコンパイル時にそれらを検出できるようになります。