Fluid 2D shapesパン/スクロール

Question

複雑なフローチャート（私の場合は.NETのもの）を描画しているアプリケーションがあるとします。ユーザは許容可能で一貫したフレームレートでフローチャートをナビゲートする必要があります。たとえば、10 FPSとします。これは、フローチャートが巨大であれば、UIをブロックせずにすべてを描画することができないことを意味します。

さらに、形状の複雑さが大きく異なり、動的な移動中に何も欠けていないという印象をユーザーに与えるために、できるだけ多くの図形を描画したいと考えています。

私がテストした最初のアプローチは、（10 FPSを維持するために）1つのフレームを描き、その閾値を打った後に描画を停止する必要がある時間を計算し、明らかに画面からシェイプをスキップします。

結果は良好ではありません。最初に描画するものに何の論理もなく、図面はいくつかの複雑な図形に貼り付けられ、単純な図形の大部分をスキップすることができます（グラフを失ったという印象をユーザに与えます）。さらに、推定されるフレームレートはかなり変化し、結果として描かれる形状の数も変化する可能性がある。

あなたはより良いアプローチを知っていますか？あなたはその件に関する記事を知っていますか？

ありがとうございました。

Answer 1

最初に最適化するのは、複雑さの低いものから複雑なものに並べ替えることです。この方法では一般的にオブジェクトをスキップする必要があります。つまり、画面上のオブジェクトが多くなります。 ユーザーが移動を停止すると、完全な図面を実行できます。私は、PDFファイルのいくつかのベクター図面で同様の動作に気づいたと思います。

もう1つの方法は、既に描画されたイメージを可能な限り再利用することです。 2D矩形パラメータを図面コードに追加し、各オブジェクトが矩形に当たっているかどうかをテストします。矩形は図面の境界ボックスとして使用されます。 ユーザーがフローチャートを動かすと、左に10ピクセル、現在のイメージをコピーしてその10ピクセルで移動し、右側に10ピクセル幅の縦線のみを描画します。 このアプローチは、多くのトリックと最適化を伴うQt 2Dシーンで実装され、コーダにとって実質的に透過的です。非常に面白い実装ですが、読みにくいです:)。

また、スレッドと、それはあなたを与えるすべてのposibilitiesを探ることがあります。

あなただけのGUIをブロックしないように、別のスレッドで図面を行うことができます。スレッドが画像の描画を終了した場合、ウィンドウに表示されます。

グラフを四角形/四角形に分割し、各四角形に異なるスレッドを割り当てることができます。ビューが動いて新しい四角形が目に見えるようになると、描画が実行されます。メインスレッドでは、既に実行されているものをチェックし、それをコピー先の位置にコピーします。モバイルWebブラウザは、Webページを同様の方法でレンダリングします。

動きの中でどのように見えるかについてのあなたの正確な内容や好みに応じて、グラフをいくつかのレイヤーに分割することもできます。例えば、メインスレッドでは、他人を待っている。