NeoChrom / NeoChromVG上でのTouchGFXの使用
このセクションでは、NeoChromグラフィック･アクセラレータを搭載したハードウェア上でTouchGFXを使用する方法について説明します。 このグラフィック･アクセラレータは、テクスチャ･マッピング、画像のスケーリングや回転などの操作性能を著しく向上します。 これはつまり、高いフレームレートを維持しながら、より高度なUIを構築できるということです。
NeoChromグラフィック･アクセラレータは、現在、STM32U599 Discoveryキットなどに含まれるSTM32U5x9マイクロコントローラでのみ利用可能です。
STM32U599 Discoveryボード
NeoChromアクセラレータは、ソース･コードやCubeMXでは、GPU2Dという名前でも知られています。
NeoChromとNeoChromVG
STM32U5G9の導入により、NeoChromアクセラレータが更新され、機能が追加されました。 この機能が向上したアクセラレータは、NeoChromVGといいます。 また、このアクセラレータには、ハードウェア･アクセラレーションによるベクタ･グラフィックスを可能にする拡張機能が搭載されています。
| マイクロコントローラ | アクセラレータ |
|---|---|
| STM32U599 | NeoChrom |
| STM32U5A9 | NeoChrom |
| STM32U5F9 | NeoChromVG |
| STM32U5G9 | NeoChromVG |
NeoChromのグラフィック機能
NeoChromアクセラレータは、基本のビットマップ転送（画像描画）、ブレンディング、スケーリング、回転、およびテクスチャ･マッピングを実行できます。 このような操作はすべて、NeoChromを内蔵したマイクロコントローラ上で実行されるTouchGFXによって自動的に利用されます。
DMA2Dグラフィック･アクセラレータと比べ、NeoChromはより多くのグラフィック処理を高速化できるだけでなく、より豊富な機能セットも組み込まれています。
| グラフィック機能 | DMA2D | GPU2D |
|---|---|---|
| サポート対象フォーマット（TouchGFX使用時） | ARGB8888、RGB888、RGB565、A8、A4、L8 | ARGB8888、RGB888、RGB565、A8、A4、A2、A1 |
| コマンドリスト･ベース | No | Yes |
| 描画 | 長方形 | マルチサンプリング･アンチエイリアシング（MSAA）を使用した長方形、ピクセル、ライン、三角形、四辺形 |
| ビットマップ転送 | コピー、アルファブレンディング、ピクセル･フォーマット変換 | コピー、アルファブレンディング、ピクセル･フォーマット変換、カラー･キーイング |
| テクスチャ･マッピング | No | Yes |
| ベクタ･グラフィックス | No | No* |
* ハードウェア･アクセラレーションによるベクタ･グラフィックスはNeoChromVGで利用可能です。
利用可能なこれらの機能により、さらに多くのTouchGFXウィジェットがNeoChromによって高速化されます。
| ウィジェット | DMA2D | GPU2D |
|---|---|---|
| Box、BoxWithBorder | Yes | Yes |
| Image、AnimatedImage、TiledImage、SnapshotWidget | Yes | Yes |
| Button、ButtonWithIcon、ButtonWithLabel、ToggleButton | Yes | Yes |
| RadioButton、RepeatButton | Yes | Yes |
| PixelDataWidget | Yes | Yes |
| TextArea、TextAreaWithWildcard、Keyboard | 一部 | Yes |
| ScalableImage | No | Yes |
| TextureMapper、AnimatedTextureMapper | No | Yes |
| Circle、Line、Graph、Gauge | No | No |
| SVG | No | No* |
* ハードウェア･アクセラレーションによるSVGはNeoChromVGで利用可能です。
ハードウェアで高速化される以外の操作は、ソフトウェアで描画されます（CPU負荷が増加し、性能が低下します）。 上記のテーブルが示すように、NeoChromはScalableImageやTextureMapperなどのウィジェットを高速化できます。 つまり、高い性能を維持しながら、これらのウィジェットをより一層使用できるようになります。
ベクタ･グラフィックス
この新しいNeoChromVGアクセラレータは、ベクタ･グラフィックスを高速化できます。 この機能は、TouchGFXでSVG画像を描画するときに使用されます。 このグラフィックス･アクセラレータには、ステンシル･バッファと呼ばれる追加のバッファが必要です。 このバッファは、フレームバッファと同じサイズですが、ピクセル当たり1バイトだけです。
たとえば、フレームバッファが24bppで480 x 480の場合、ステンシル･バッファは480 x 480 = 230,400バイトである必要があります。 最適な性能を得るため、このステンシル･バッファを高速SRAMに割り当てることが重要です。
ステンシル･バッファはTouchGFX Generatorによって割り当てられます。 こちらのガイドを参照してください。
NeoChromによる描画時間の改善
次の例では、DMA2Dやソフトウェアによる描画と比較してNeoChromがもたらす高速化について説明します。 Designerを使用して、2つのプロジェクトを作成しました。 最初のプロジェクトは、ボックスのバックグラウンド上に画像を表示します。 2つ目のプロジェクトは、ボックスのバックグラウンド上にTextureMapperウィジェットを表示します。 このウィジェットはすべてのフレームで再描画されます。 どちらの場合でも、ビットマップは128x128のサイズ、ARGB8888フォーマットで、内部Flashに格納されます。 フレームバッファは、RGB565フォーマットです。
Imageプロジェクト
TextureMapperプロジェクト
両方のプロジェクトをSTM32F746およびSTM32U599 Discoveryボードで実行しました。
GPIOをロジック･アナライザに接続して、描画時間を測定しました。
STM32F746でImageプロジェクトを実行
上図は、STM32F746で実行されているときの、フレームレートと描画時間を示しています。 チャネル00は、VSYNC信号を示しています。 59.2 Hzのフレームレートに対応した、16.9 msのフレーム間隔（A1～A2）で表示されていることがわかります。 チャネル01は描画時間を示しており、描画時（B1～B2）は高くなります。 したがって、画像の描画時間は1.3 msです。 STM32F746では画像描画は高速で実行されます。
STM32F746でTextureMapperプロジェクトを実行
上図は、STM32F746で実行中のTextureMapperプロジェクトです。 TextureMapperの描画時間は4.5 msです。 TextureMapperウィジェットは、Imageの場合よりも大幅に時間がかかります。
STM32U599でImageプロジェクトを実行
これは、Imageプロジェクトを実行するSTM32U599 Discoveryキットです。 STM32U599 Discoveryキットのディスプレイは、81.6 Hzのフレームレートに対応した12.26 msのディスプレイ･フレーム間隔で表示されています。 画像の描画時間は0.7 msです。 STM32F746キットの場合よりも、Imageウィジェットが高速であることがわかります。
STM32U599でTextureMapperプロジェクトを実行
TextureMapperの描画時間は1.7 msです。 TextureMapperも、STM32F746よりもSTM32U599上で実行する方が高速になります。
描画時間のまとめ
次の表に、描画時間を示します。
| 要素 | STM32F746 | STM32U599 | 速度向上 |
|---|---|---|---|
| 周波数 | 200 MHz | 160 MHz | 0.8 |
| Image | 1.3 ms | 0.7 ms | ~2x |
| TextureMapper | 4.5 ms | 1.7 ms | ~3x |
クロック周波数が低くとも、STM32U599は、特にTextureMapperの場合に、STM32F746と比べてはるかに優れた性能を発揮します。
これらの測定は、内部Flash内の画像と、STM32F746の場合は外部SDRAMのフレームバッファを使用して行われます。 STM32U599の場合、フレームバッファは内部SRAMにあります（これが通常のシナリオです）。 画像を外部Flashに移動するとき、STM32F746はQSPI Flash（4ビット･バス）を使用しているため遅くなります。一方、STM32U599はそれよりも高速のOSPI Flash（8ビット･バス）を使用しています。
STM32F746 Discoveryキットは、内部RAMで480x272 RGB565フレームバッファを使用して実行できます。 これにより性能は向上しますが（Imageは1.03 msまで短縮）、これはSTM32F746の標準設定ではありません。内部SRAMの大半がフレームバッファ用に使用されるため、他のアプリケーション･コンポーネントに使用できるRAMはほとんど残らないからです。
単一フレームバッファでの実行もまた、すべてのアプリケーションに適しているわけではありません。
より豊富なユーザ･インタフェース
描画パフォーマンスの向上により、より高度なアニメーションを組み込んだユーザ･インタフェースを作成できます。 たとえば、スケーリングや回転が多用された要素などです。
STM32F746の場合、フレーム･リフレッシュ時間は16.8 msでした。 つまり、アプリケーションは、60 fpsのフレームレートを維持するために、描画時間をこの値より低く保持する必要があります。 したがって、画面上では、その複雑さの場合、最大3.75個（16.8 ms / 4.48 ms）のテクスチャ･マッパーが使用可能です。または、サイズが247 x 247の単一の大型のテクスチャ･マッパー（ピクセル数が同じで、描画時間もほぼ同じ）が可能です。
同じ画面リフレッシュレートでSTM32U599 CPUを使用すると仮定すると、14.36個（16.8 ms / 1.17 ms）のテクスチャ･マッパー、またはサイズが485 x 485の単一のテクスチャ･マッパーを使用できます。
次の図は、それぞれSTM32F746およびSTM32U599で実行される2つのアプリケーションを示しています。 ここでは、中央に近づくにつれて要素が拡大され、遠ざかると縮小される、カルーセルのようなメニューを作成することを意図しています（ここでは、すべての要素に対して同じテクスチャを使用しています）。
STM32F746（左）とSTM32U599（右）でテクスチャ･マッパー･ベースのカルーセル･プロジェクトを実行
STM32F746は、3つのアイコン、つまり、係数1.9で拡大された大きいアイコン1つと、2つの小さいアイコンを表示できます。 STM32U599は、7つのアイコンを表示できます。 最大のアイコンは、係数2.7で拡大されています。
STM32F746で、3つのアイコンを持つアプリケーションの描画時間は14.38 msです。 STM32U599で、7つのアイコンを持つアプリケーションの描画時間は14.93 msです。 よって、どちらのUIも60 fpsで動作できますが、STM32U599はより高い解像度ではるかに多くのコンテンツを表示できます。
アクセラレータ･ベクタ･グラフィックス
この新しいNeoChromVGアクセラレータは、ベクタ･グラフィックスを高速化できます。 これにより、アプリケーションの新しいクラスの可能性が開かれ、ビットマップではなく、ベクタ･ベースのグラフィックスが中心的な役割を担うことになります。
その一例がマップ･アプリケーションです。 マップはビットマップから作成できますが、非常に大きなストレージや特定のマップ･セクションの事前ダウンロードが必要な場合がよくあります。
次のビデオは、STM32U5F9で実行されるアプリケーションのデモです。 このアプリケーションでは、ベクタ定義（さまざまな色で塗りつぶされ、ストロークされた複数のポリゴン）から描画されたマップをズーム、回転、パンしています。 このビデオは色深度が16bppの800 x 480ディスプレイの全画面で実行されています。
STM32U5F9でムービング･マップを表示。
座標の制限
NeoChromおよびNeoChromVG上では、1024を超える座標を持つベクタ･グラフィックスはデフォルトで破棄されます。 対応策についてはこちらを参照してください。 SVG画像が拡大されたり、SVG自体に大きな座標が含まれる場合の両方で、これが発生することに注意してください。
プロジェクトの作成
CubeMXとTouchGFX Generatorは、NeoChromに対応しています。 CubeMXでは、このアクセラレータはGPU2Dというコード名で知られています。 GPU2DがCubeMXのTouchGFXの設定で有効になっている場合に、GPU2DアクセラレータはTouchGFXでのみ使用可能です。
TouchGFX Designerが組み込まれているSTM32U599 TBS（テンプレート･プロジェクト）を使用する場合は、これはすでに実行済みです。 独自のカスタム･プロジェクトを作成する場合は、以下に示すように、GPU2Dアクセラレータを必ず有効にしてください。
CubeMXでのGPU2D（NeoChrom）の有効化
GPU2Dを有効化したら、CubeMXの［Generate Code］を押します。 これにより、対象の設定コードが再生成されます。 TouchGFX Designerでプロジェクトを開き、そこでもコードを生成します（F4）。
Designerによりアセット（画像、フォント、テキスト）と、対象の設定に適合するシミュレータ･コードが生成されます。 これで、IARを使用してコードをコンパイルする準備ができました。
Designerからプロジェクトを開始している場合は、何らかのハードウェア設定を変更する必要がないかぎり、CubeMXを開く必要はありません。
サポートされているIDE
STM32U599 TBS（バージョン3.0.0）は現在、IAR Workbenchでのみサポートされています。
最新バージョンのIAR（8.5x.x）が必要です。 ［General Options］を確認して、このプロセッサのバリアント（Discoveryボード用STM32U599NJ）がサポートされていることを確認します。
IAR General Options
フレームバッファのフォーマット
STM32U599 Discoveryボードは、3つのフレームバッファ･フォーマット、RGB565、RGB888、ARGB8888をサポートしています。 これらは、CubeMXから設定可能です。
NeoChromの制約
STM32U599のNeoChromグラフィック･アクセラレータは、L8画像フォーマット（L8_RGB565、L8_RGB888、L8_ARGB8888）には対応していません。
STM32U599で実行されるTouchGFXアプリケーションでこれらの画像フォーマットを使用する場合、画像はDMA2Dを使用して描画されます。 これらのフォーマットをScalableImageまたはTextureMapperで使用する場合、ソフトウェア･フォールバックを使用します。
したがって、STM32U599ではL8画像を使用しないことをお勧めします。