Omówienie cieni

interfejsy programowania aplikacji platformy :AttachedCardShadow, AttachedDropShadow

Obecnie dostępne są dwa typy cieni przylegających: AttachedCardShadow i AttachedDropShadow. Zaleca się korzystanie z AttachedCardShadow, gdzie to możliwe, jeśli nie przeszkadza Ci zależność od Win2D. AttachedCardShadow zapewnia łatwiejszą obsługę, wyższą wydajność i łatwiejsze stosowanie do całego zestawu elementów, zakładając, że elementy te mają kształt zaokrąglonych prostokątów. AttachedDropShadow zapewnia obsługę masek i może być używany w dowolnej aplikacji UWP bez dodawania dodatkowej zależności.

Porównanie możliwości

Poniższa tabela przedstawia różne możliwości każdego typu cienia, a także porównuje je z poprzednią implementacją DropShadowPanel:

Capability	Cień dołączonej karty	AttachedDropShadow	DropShadowPanel (przestarzałe/usunięte)
Zależność/pakiet NuGet	🟡 Win2D za pośrednictwem CommunityToolkit.WinUI.Media	✅ Tylko struktura (efekt kompozycji) CommunityToolkit.WinUI.Effects	✅ Tylko struktura (efekt kompozycji) Microsoft.Toolkit.Uwp.UI.Controls (starsza wersja)
Warstwa	Kompozycja śródliniowa + Geometria klipów Win2D	Kompozycja za pośrednictwem Tło elementu docelowego	Kompozycja za pośrednictwem ContentControl Kontener
Modyfikowanie drzewa wizualnego	✅ Nie	🟡 Zwykle wymaga pojedynczego elementu docelowego, nawet w przypadku wielu cieni	❌ Indywidualnie zawijaj każdy element wymagający cienia
Nadmierna głębokość drzewa wizualnego	✅ 0	🟡 1 na każdy element równorzędny, aby nałożyć jeden lub więcej cieni na	❌ 4 na każdy zacieniony element
Maskowanie/Geometria	🟡 Tylko prostokąty/zaokrąglone prostokąty	✅ Może maskować obrazy, tekst i kształty (kosztem wydajności)	✅ Może maskować obrazy, tekst i kształty (kosztem wydajności)
Performance	✅ Szybka, stosuje prostokątną przyciętą geometrię	🟡 Wolniejsze, szczególnie w przypadku maskowania (ustawienie domyślne); może używać optymalizacji zaokrąglonych prostokątów	❌ Najwolniejsze, brak optymalizacji dla zaokrąglonych prostokątów
Obsługa usługi ResourceDictionary	✅ Tak	✅ Tak	❌ W ograniczonym zakresie, przy użyciu w pełni niestandardowego stylu kontrolki + nadal trzeba opakowować każdy element do zastosowania
Do użycia w stylach	✅ Tak, w dowolnym miejscu, w tym na poziomie aplikacji	🟡 Tak, ale w ograniczonym zakresie ze względu na cel elementu	❌ Nie
Obsługuje elementy przezroczyste	✅ Tak, cień jest obcięty i niewidoczny	❌ Nie, cień prześwituje przez przezroczysty element	❌ Nie, cień jest widoczny przez przezroczysty element
Obsługa animacji	✅ Tak, w języku XAML za pośrednictwem AnimationSet	🟡 Częściowe przesuwanie/przenoszenie elementu może spowodować desynchronizację cienia	❌ Nie

AttachedCardShadow (Win2D)

AttachedCardShadow to najłatwiejszy w użyciu i najwydajniejszy cień. Zaleca się użycie go tam, gdzie to możliwe, jeśli użycie zależności Win2D nie jest problemem. Jedynymi wadami są konieczność użycia dodatkowej zależności oraz to, że obsługuje tylko geometrie prostokątne oraz prostokąty o zaokrąglonych rogach (jak opisano w powyższej tabeli).

Wielką korzyścią AttachedCardShadow jest to, że nie jest wymagana dodatkowa powierzchnia lub element, aby dodać cień. Zmniejsza to złożoność wymaganą podczas opracowywania i umożliwia łatwe dodawanie cieni w dowolnym momencie procesu programowania. Obsługuje również przezroczyste elementy bez wyświetlania cienia za nimi!

AttachedDropShadow (kompozycja)

AttachedDropShadow zapewnia obsługę maskowania dla szerokiej gamy elementów, w tym obrazów przezroczystych, kształtów i tekstu. Maskowanie do niestandardowego kształtu, który nie jest prostokątny ani prostokątny z zaokrąglonymi rogami, to główny przypadek użycia, w którym przydatny będzie AttachedDropShadow. W przeciwieństwie do swojego poprzednika, DropShadowPanel, element AttachedDropShadow nie musi obejmować elementu, na który nakładany jest cień; wymaga jednak innego elementu, na który może rzucać cień.

Sprawia to, że jest nieco bardziej skomplikowane do użycia niż AttachedCardShadow i DropShadowPanel, ale ponieważ wiele AttachedDropShadow elementów może współdzielić tę samą powierzchnię, sprawia to, że znacznie bardziej wydajne niż jego poprzednik.

Remarks

Chociaż DropShadowPanel hermetyzowano złożoność dodawania cienia, dodano dużą głębokość i złożoność do drzewa wizualnego. AttachedDropShadow zamiast tego wymaga podania powierzchni, na którą mają być rzutowane cienie, na przykład wspólnego elementu będącego tłem. Oznacza to, że każdy cień może korzystać z tej samej współdzielonej powierzchni, zamiast tworzyć własny element tła dla każdego cienia (jak robiło to DropShadowPanel). Ten niewielki kompromis w celu ułatwienia użytkowania jest wzrostem wydajności. Jednak oznacza to, że nie może być tak elastyczny w niektórych przypadkach użycia z manipulowaniem elementem. W takich przypadkach zalecamy zamiast tego spróbować użyć AttachedCardShadow albo opakować element i jego tło w kontrolce niestandardowej.