UWP：在XAML中創建陰影

我目前正在嘗試在UWP中創建一個帶有兩個橢圓元素的圓形按鈕，並希望其中一個按特定角度投射陰影。我找到了一種方法在WPF這樣做，看起來像這樣：UWP：在XAML中創建陰影

WPF XAML：

<Ellipse> 
    <Ellipse.BitmapEffect> 
    <DropShadowBitmapEffect Color="Black" Direction="-50" ShadowDepth="50" Softness=".7"/> 
    </Ellipse.BitmapEffect> 
</Ellipse>

是什麼在UWP等價？

來源

2017-09-05 Nigel-Lee

最簡單的方法是從使用DropShadowPanel UWP社區工具包。

所以第一隻安裝

安裝，包裝Microsoft.Toolkit.Uwp.UI.Controls -Version 2.0.0

然後用下面的代碼在你的XAML

<controls:DropShadowPanel Color="Black" 
          OffsetX="-50" 
          OffsetY="-50" 
          BlurRadius="50" 
          ShadowOpacity=".7" 
          Width="120" 
          Height="120" 
          HorizontalContentAlignment="Stretch" 
          VerticalContentAlignment="Stretch"> 
    <Ellipse /> 
</controls:DropShadowPanel>

來源

2017-09-05 10:52:58

快速正確的答案，非常感謝！ –

在UWP中有一個不同的組件來完成這項工作。它被稱爲Composition API，可在NuGet包「Win2D.uwp」中找到。

基本上你需要得到合成器爲您的視覺對象與

_compositor = ElementCompositionPreview.GetElementVisual(this).Compositor;

，並使用合成器創建一個陰影。

_compositor = ElementCompositionPreview.GetElementVisual(this).Compositor; 

// create a red sprite visual 
var myVisual = _compositor.CreateSpriteVisual(); 
myVisual.Brush = _compositor.CreateColorBrush(Colors.Red); 
myVisual.Size = new System.Numerics.Vector2(100, 100); 

// create a blue drop shadow 
var shadow = _compositor.CreateDropShadow(); 
shadow.Offset = new System.Numerics.Vector3(30, 30, 0); 
shadow.Color = Colors.Blue; 
myVisual.Shadow = shadow; 

// render on page 
ElementCompositionPreview.SetElementChildVisual(this, myVisual);

不利的一面，這不是非常簡單。您可以使用不同的畫筆來顯示圖像，純色或其他東西，它不適用於屏幕上的現有視覺效果（據我瞭解）。你可以閱讀更多關於基本知識here。 Probalby你需要使用表面刷，它可以容納各種不同的視覺類型，如圖像。目前看起來不存在用於橢圓的現成組件。

或者，存在一個xaml擴展名，它將爲您使用純xaml，might be worth a shot並可能還支持省略號。

作爲結束語，所有這些目前都是微軟部分正在開展的工作，將來應成爲UWP API的本地部分。

來源

2017-09-05 11:02:21 CShark

UWP：在XAML中創建陰影

回答

相關問題