いくつかのネストされたコンテナを含むItemsControlがあります。メインのItemsControlの各要素の周りにドロップシャドウを追加したいと思います。代わりに、メインのItemsControl(シャドウの行を作成する)内にある特定のコンテナに追加します。私はいくつかの異なるレベルでエフェクトを配置しましたが、変更はありません。メインのItemsControl内のアイテムの最も外側のコンテナから始め、そこから上に移動しました。私は現在置かれ、ドロップシャドウの効果を持っているのはここ子要素に適用するDropShadowEffect - Silverlight XAML
がある:私はコンテンツを削除(編集)を:
<ItemsControl >
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<!-- I have tried adding the dropshadow effect within this stackpanel -->
<StackPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<!-- Where I define the dropshadow -->
<ItemsControl.Effect>
<DropShadowEffect BlurRadius="0" ShadowDepth="1" Color="LightGray"/>
</ItemsControl.Effect>
<!-- End of dropshadow definition -->
<ItemsControl.ItemTemplate>
<DataTemplate>
<media:Step5Item />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
そして、ここではStep5Itemの定義ですが、私は影が現れている場所のドキュメントを追加しましたそれは単にスタイリングなどだったので、要素のために。
<!-- This is inserted by the above code's DataTemplate -->
<!-- I have tried adding a border here and giving it a dropshadow effect -->
<Grid >
<!-- I have tried inserting a dropshadow effect here -->
<TextBlock Grid.Row="0"/>
<Border BorderBrush="LightGray" BorderThickness="1" >
<!-- I have tried inserting a dropshadow effect here -->
<Grid>
<Border >
<!-- There is a shadow around this border/grid -->
<Grid Grid.Row="0" >
<TextBlock Grid.Column="0" />
<Button Grid.Column="2"/>
</Grid>
</Border>
<!--There is a shadow around each element in this ItemsControl-->
<ItemsControl Grid.Row="2" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid Margin="0,0,0,4" >
<Path Grid.Row="0">
<Path.Data>
<LineGeometry StartPoint="0,0" EndPoint="1500,0"/>
</Path.Data>
</Path>
<Grid Grid.Row="1">
<Image Grid.Column="0" />
</Grid>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>
</Border>
</Grid>
下部にも影がありますが、ItemsControlの最後の要素からのものか、最も外側の境界からのものかはわかりません。
あなたが望むなら、私は2番目のコード片をもっときれいにすることができます。私はいくつかのものを取り出したが、読みやすさのために最善の考えをして要素に残した。
EDIT は、私は効果が遊びに行く前に、彼らが作成されるので、問題が発生しないということを期待して子要素を追加した後に効果を適用してみました。 Step5Itemの最も外側のグリッドの下部と同様に、メインのItemsControlの両方の下部にエフェクトを配置しようとしました。私はStep5Itemからいくつかのコンテンツを削除して、読みやすくすることを望みました。ここ
EDIT2
効果を有するとせずに2枚の画像があります。私は上に置いたところでDropShadowコードをそのまま残しましたが、私が言ったように、私は同じ効果を得るために多くの場所に置くことができます。ドロップシャドウ
With Error http://img811.imageshack.us/img811/2168/dropshadowerror.pngドロップシャドウ
なし
Without Error http://img402.imageshack.us/img402/1456/nodropshadowexample.png
編集3
で
これは国境であると私はERNOの溶液から使用しています影の効果をドロップします。私は、影の深さをもう少し増やしたいと思っています。なぜなら、右の部分には影がなく、底だけですからです。私はShadowDepthを変更した場合、現在、それは新しいサイズに離れ等しい距離になるように、影の場所に変更しますが、それは1
<Border Margin="0,1,0,0" Height="auto" Width="auto" CornerRadius="5,5,5,5" BorderThickness="1" BorderBrush="LightGray">
<Border.Effect>
<DropShadowEffect BlurRadius="0" ShadowDepth="1" Direction="315" Color="LightGray"/>
</Border.Effect>
</Border>
問題を明確にするためにいくつかのスクリーンショットを投稿できますか? – XAMeLi
@XAMeLi画像を追加しました – StephenT
私はまだ問題を理解していません。コードをスリム化できますか? –