問題タブ [dropshadow]

ネストされたコンテナを含むItemsControlがあります。メインのItemsControlの各要素の周りにドロップシャドウを追加したいと思います。ただし、代わりに、メインのItemsControl内にある特定のコンテナーに追加しています（シャドウの行を作成します）。エフェクトをさまざまなレベルに配置しましたが、変化はありません。メインのItemsControl内のアイテムの最も外側のコンテナーから始めて、そこから上に移動しました。

これが、現在配置されているドロップシャドウの効果がある場所です。

そして、これがStep5Itemの定義です。影が表示される場所のドキュメントを追加しました:(編集）それは単なるスタイリングなどだったので、要素のコンテンツを削除しました。

下部にも影がありますが、それがItemsControlの最後の要素からのものなのか、それとも最も外側の境界からのものなのかはわかりません。

よろしければ、2番目のコード部分をさらにクリーンアップできます。私はいくつかのものを取り出しましたが、読みやすさのためにそれが最善かもしれないと考えて、要素を残しました。

編集子 要素を追加した後、エフェクトが機能する前に作成されるため、問題が発生しないことを期待して、エフェクトを適用してみました。エフェクトをメインのItemsControlの下部と、Step5Itemの最も外側のグリッドの下部の両方に配置してみました。また、Step5Itemから一部のコンテンツを削除して、読みやすくしたいと思います。

EDIT2

効果がある場合とない場合の2つの画像を次に示します。DropShadowコードを上に配置した場所に正確に残しましたが、前述のように、同じ効果を得るために多くの場所に配置できます。

ドロップシャドウ付き

ドロップシャドウなし

エラーなしhttp://img402.imageshack.us/img402/1456/nodropshadowexample.png

編集3

これは、Ernoのソリューションで使用している境界線とドロップシャドウの効果です。右側には影がなく、下部だけなので、影の深さをもう少し増やしたいと思っています。現在、ShadowDepthを変更すると、シャドウの位置が新しいサイズと同じ距離になるように変更されますが、厚さは1にすぎません。

コンテナが親よりも低いように見えるドロップシャドウをコンテナに作成する方法を考えています。通常、ドロップシャドウは主に右側と下側の外側に適用されます。私が達成したいのは、上部と左側の内側に適用されるドロップシャドウです。アイデアは、コンテナがその親に埋め込まれているように見せることです。

どんなアイデアでも大歓迎です。

私は ASP.NET プロジェクトに取り組んでいます。パネル内に DropShadow エクステンダーを配置すると、新しい影の効果がありますが、別の不透明度の値を設定しても変化しません。シャドウは、値 0、0.1、0.5、および 1 で同じように見えます。1 より大きい値も試しました。なぜそうなのか誰でも知っていますか？

PHPを使用して画像にドロップシャドウを追加する方法を探しています。回答または投票して終了する前に：CSSまたはHTMLを使用してこれを行うことは考えていません。画像ファイルを生成したい。これは、この質問とこの質問の重複ではありません。

非常に特殊な効果を探しています。たとえば、次の入力画像があるとします。

次の画像を作成したいと思います。

TL; DR：上の画像は、Photoshopのドロップシャドウ効果を使用して生成されました。私はそれに非常に似た外観が欲しいです。参考までに、設計チームが使用した設定は次のとおりです。理想的には、角度、距離、不透明度などをコードで同様に制御できます。

私はdebian-linusベースのサーバーに完全にアクセスできるので、GDまたはImageMagickソリューションはすべて機能します。他のFOSSLinuxソフトウェアソリューションと同様に、IMまたはGDはすでにインストールされており、新しいソフトウェアをインストールする必要がないため、IMまたはGDでそれを行う方法をお勧めします。

影は、透明で長方形ではないPNGに配置できる必要があります。

私が質問しているのは、主に、Webで見つけたスクリプトとソリューションが、長方形の影しか生成しないか、まるでうんちのように見えるか、まったく機能しないためです。

GDI で画像にドロップ シャドウを追加する効率的な方法は何ですか?

今、私は自分のイメージから始めます:

ImageAttributes と ColorMatrix を使用して、画像のアルファ マスクを新しい画像に描画します。

次に、Gaussian Blur 畳み込みカーネルを適用し、わずかにオフセットします。

そして、元の画像を上に描画します。

問題は、それが遅すぎることです.ドロップシャドウ付きの画像を生成するには約170ミリ秒かかり、ドロップシャドウなしでは2ミリ秒かかります(70倍遅い):

• ドロップ シャドウあり: 171,332 µs
• ドロップ シャドウなし:2,457us

ユーザー (たとえば私) がアイテムのリストをスクロールしているとき、その余分な 169 ミリ秒の遅延は非常に顕著です。

以下のコードは無視してかまいません。質問や回答には何も追加されません。

関数を使用してグレースケール アルファ マスクを取得します。

コアはガウスぼかしです。

これには 1 次元カーネルが必要です。

そして、ガウス関数の魔法は、2 つの 1D 畳み込みに分離できることです。

私の256x256ソース画像でのサンプル使用法:

プロファイリングは、88.62% の時間が行で費やされていることを示しています。

これは、ピクセルごとのアルファ ブレンディングです。

WindowsとOSXはリアルタイムでウィンドウにドロップシャドウを適用した後、ぼかし効果を適用するソフトドロップシャドウを適用するより良い方法があると思います。

編集：より一般的な質問：私はdivのボックスシャドウが好きですが、ボックスシャドウのdivの真下にdivを配置すると、zインデックスをいじっても、シャドウの下部が上部に重ならないようになります。それで、ボックスシャドウは別のdivをオーバーレイできないように見えますか？どんなアイデアでも素晴らしいでしょう！

元の質問-レイアウトに設計図を使用しています。これは、.containerがあり、その中に.containerが950px含まれていることを意味し#contentます。

この場合、#contentコンテナ全体がいっぱいになるので、もそうです950px。

にドロップシャドウを付けたいのです#contentが、に表示するスペースがないため、シャドウが途切れるという問題があり.containerます。

回避策は、幅を狭くする#contentことですが、それは私がすでに持っているレイアウトの配置を台無しにし、狭すぎるように見えます。

ボックスシャドウを取得して、親コンテナを無視してその上に表示する方法はありますか？これは私が推測する特定の青写真ではありませんが、それは文脈です。ありがとう！

編集：

#contentに直接あり.containerます。ドロップシャドウを付けると#content、幅を縮小するまで表示されません。幅を縮小すると、内側の要素が乱れます。

ある種のポップアップウィンドウとして機能するウィジェットを作成したため、背景から光学的に持ち上げるためにドロップシャドウが周りに必要です。次のように、ポップアップ ウィジェットのコンストラクターでドロップ シャドウ効果を初期化します。

このアプリケーションは、Intel Atom CPU、カスタム Linux ディストリビューション、qws サーバーで実行される Qt v4.7.3 を搭載した組み込みシステムで実行されます。ドロップ シャドウを無効にすると、GUI がアイドル状態のときに CPU 使用率が 10% 未満になります。ドロップ シャドウを有効にすると、CPU 使用率が 80% を超えます。アプリのプロファイリングは、CPU 時間のほとんどが 内で費やされていることを示していますlibQtGui.so.4.7.3。

マウスの動きでさえ、GUIでまったく何も起こっていないにもかかわらず、CPU使用率がこのように爆発する理由を誰かが知っていますか?

編集:ポップアップのサイズを変更すると、CPU 使用量が変わります。サイズを 4 分の 1 に減らすと、CPU 使用率が約 4 分の 1 に減ります。非常に奇妙な。

div に透明なドロップシャドウを追加したいと考えています。コンテナーがあり、その背後にドロップシャドウを配置したいと考えています。ドロップシャドウに色を付けたくありません。これは私がこれまでに持っているものです:

不透明度を追加したいのですが、div全体の不透明度を変更すると。

私のアプリのメインウィンドウはボーダレスです：

そのウィンドウから、他の子ウィンドウも開きます。他の子ウィンドウの間をクリックすると、子ウィンドウがクリックされてフォーカスされたウィンドウになると、子ウィンドウのドロップシャドウが暗く/大きくなります。ただし、メインウィンドウのシャドウは、フォーカスを失ったり、フォーカスを取得したりしても変化しません。したがって、元のプライマリウィンドウが再びフォーカスになったことをユーザーに伝えるフィードバックはあまりありません。

影の変更を有効にするには、ボーダレスウィンドウサブクラスの何かをオーバーライドする必要がありますか？影があり、そのウィンドウがフォーカスされているときに暗く/大きくなることはありません。

私はこの問題について髪を引き裂いてきました。上部以外に、要素全体を囲む単純な影が必要です。Firefox と Chrome で問題なく動作するようになりました。しかし、IE にはこの奇妙な「方向」設定があり、他の 4 つの数字で影を定義します。

上部以外の要素全体に影が付くように、適切な CSS を定義するのを誰かが手伝ってくれますか?