6

グラフィカル ユーザー インターフェイスの設計を実装する必要があります。選択したフレームワークは Qt です。

実装に関するいくつかの作業の後、いくつかの問題と疑問が明らかになりました。主なポイントは、グラデーション、一種の 3D 効果、影などを使用した派手なデザイン要素があることです。

現在使用されているアプローチ (私はあまり好きではありません) は、グラフィック デザインのビットマップをさまざまなウィジェットの背景として使用することです。これには、要素の配置とスケーラビリティに応じて、いくつかの非常に厄介な欠点があります。このアプローチでは、かなり静的なユーザー インターフェイスが生成されるため、維持や適応が困難です。

できるだけ多くの Qt のデフォルト ツールを使用して、実行時にすべてのグラフィック要素を動的に生成していただければ幸いです。しかし、そのような複雑な視覚効果を実装する方法がわかりません。例として、次の画像を想定できます。

質問: 以下のような結果を得るには、合理的なアプローチはどのように見えるでしょうか。（正確な解決策は必要ありません。いくつかの指針、一般的なアプローチ、およびベストプラクティスのみです。）

4

4 に答える 4

5

カスタム ウィジェットを使用し、ペイント イベントで効果を構築するのが最善です。ここに例があります:カスタム LED ウィジェットを表示します。カスタム ペイントと、ウィジェットのペイント コマンド内での SVG 画像の使用に関するスライドもいくつかあります: http://saim.pub.ro/ITNQ/L5_Slides_v01.pdf。Paint コマンド内で SVG を使用すると、レイアウト エンジンを使用できるため、固定の BMP グラフィック ファイルを使用する代わりに少し簡単になります。

于 2014-08-20T14:03:13.487 に答える
1

別の解決策は、ウィジェットをカスタマイズできる Qt スタイル シートを使用することです。例を確認してください: Qt スタイル シートの例 | QtWidgets 5.3 | ドキュメンテーション | Qtプロジェクト

これは、画像上のボタンのように「似ている」ように見える QPushButton のスタイルです。しかし、それはあなたの要件には十分かもしれません。

background-color: qradialgradient(spread:pad, cx:0.499807, cy:0.489, radius:0.5, fx:0.499, fy:0.488909, stop:0.0795455 rgba(0, 147, 185, 255), stop:1 rgba(30, 30, 30, 255));
border: 5px solid black;
border-radius: 15px;
于 2014-08-20T14:35:09.460 に答える
1

Qt 5 は、UI の外観をカスタマイズするためのスタイルシートを提供します。

具体的には、ボタンにテクスチャをスタンプする場合は、この例をご覧ください。境界線を使用して、引き伸ばしてはならない領域を指定する方法を示しています。

于 2014-08-20T14:32:46.187 に答える
0

QML でこれと同様のことを行う方法の詳細なウォークスルーについては、この回答を参照してください。QPainter に精通している場合は、C++ を使用してウィジェットに移植できます。

于 2014-08-23T13:07:53.453 に答える