Używanie świateł

API Microsoft.UI.Composition w Windows App SDK umożliwiają tworzenie animacji i efektów w czasie rzeczywistym. Oświetlenie kompozycji umożliwia oświetlenie 3D w aplikacjach 2D. W tym omówieniu przedstawimy funkcje konfigurowania świateł kompozycji, identyfikacji elementów wizualnych w celu odbierania każdego światła oraz używania efektów celem zdefiniowania materiałów dla twojej zawartości.

Uwaga / Notatka

Dowiedz się, jak obiekty XamlLight stosują CompositionLights do oświetlania elementów UI XAML; aby uzyskać więcej informacji, zobacz oświetlenie XAML.

Oświetlenie kompozycji umożliwia tworzenie interesującego interfejsu użytkownika, zezwalając na:

  • Przekształcanie światła niezależnego od innych obiektów na scenie w celu umożliwienia immersyjnych scenariuszy, takich jak sceny odtwarzania muzyki.
  • Możliwość sparowania obiektu ze światłem, aby poruszały się synchronicznie i niezależnie od reszty sceny, umożliwiając tym samym scenariusze takie jak wyróżnienie za pomocą Fluent Reveal.
  • Przekształcanie światła i całej sceny w ramach grupy w celu tworzenia tekstur i głębi.

Oświetlenie kompozycji obsługuje trzy kluczowe koncepcje: Light, Targets i SceneLightingEffect.

Światło

Funkcja CompositionLight umożliwia tworzenie różnych świateł i umieszczanie ich w przestrzeni współrzędnej. Te światła są przeznaczone do oświetlania elementów wizualnych, które chcesz oświetlić za pomocą tych świateł.

Typy światła

Typ Opis
Ambientlight Źródło światła, które emituje światło niekierunkowe, które pojawia się odbite przez wszystko w scenie.
DistantLight Nieskończenie duże odległe źródło światła emitujące światło w jednym kierunku. Podobnie jak słońce.
Punktowe światło Punktowe źródło światła, które emituje światło we wszystkich kierunkach. Jak żarówka.
SpotLight Źródło światła emitujące wewnętrzne i zewnętrzne stożki światła. Jak latarka.

Cele

Gdy światła są kierowane na obraz (dodaj do listy Elementów docelowych), obraz i wszystkie jego elementy podrzędne są świadome tego źródła światła i reagują na nie. Może to być coś tak prostego jak ustawienie źródła PointLight na korzeniu drzewa, gdzie wszystkie wizualizacje poniżej reagują na animację zmiany kierunku światła punktowego.

Wykluczenia z Celów umożliwiają usuwanie oświetlenia wizualizacji lub jej poddrzewa w podobny sposób jak dodawanie celów. Podrzędne elementy w drzewie, zakorzenione przez wizualizację, która jest pominięta, nie są w rezultacie oświetlone.

Przykład (cele)

W poniższym przykładzie użyjemy kontrolki PointLight, aby wskazać element TextBlock języka XAML.

    _pointLight = _compositor.CreatePointLight();
    _pointLight.Color = Colors.White;
    _pointLight.CoordinateSpace = text; //set up co-ordinate space for offset
    _pointLight.Targets.Add(text); //target XAML TextBlock

Dodając animację do przesunięcia światła punktowego, efekt błyszczący jest łatwo osiągany.

_pointLight.Offset = new Vector3(-(float)TextBlock.ActualWidth, (float)TextBlock.ActualHeight / 2, (float)TextBlock.FontSize);

Zobacz kompletny przykład Text Shimmer na GitHub, aby dowiedzieć się więcej.

Ograniczenia

Podczas określania, która zawartość będzie oświetlana przez mechanizm CompositionLight, należy wziąć pod uwagę kilka czynników.

Pojęcie Szczegóły
Światło otoczenia Dodanie światła innego niż otoczenia do sceny spowoduje wyłączenie całego istniejącego światła. Elementy nieoświetlone przez światło kierunkowe będą wyglądać na czarne. Aby oświetlać otaczające wizualizacje, które nie są celem światła w naturalny sposób, należy użyć światła otoczenia w połączeniu z innymi światłami.
Liczba świateł Można użyć dowolnych dwóch świateł kompozycji nieambientowej w dowolnej kombinacji w celu kierowania interfejsem użytkownika. Oświetlenie ambientowe nie jest ograniczone; światła punktowe, punktowe i odległe są ograniczone.
Życie Funkcja CompositionLight może mieć warunki istnienia (na przykład: moduł odśmiecania pamięci może odzyskać obiekt światła przed jego zastosowaniem). Zalecamy zachowanie odwołania do światła przez dodanie świateł jako elementu członkowskiego, aby ułatwić aplikacji zarządzanie okresem istnienia.
przekształcenia Światła należy umieścić w węźle powyżej interfejsu użytkownika, który używa efektów, takich jak przekształcenia perspektywy w strukturze wizualizacji, aby były rysowane prawidłowo.
Przestrzeń docelowa i współrzędna CoordinateSpace to przestrzeń wizualna, w której należy ustawić wszystkie właściwości światła. Element CompositionLight.Targets musi znajdować się w drzewie CoordinateSpace.

Właściwości oświetlenia

W zależności od typu używanego światła światło może mieć właściwości tłumienia i przestrzeni. Nie wszystkie typy świateł używają wszystkich właściwości.

Majątek Opis
Kolor Kolor światła. Wartości kolorów oświetlenia są definiowane przez D3D Diffuse, Ambient i Specular, które definiują emitowany kolor. Oświetlenie używa wartości RGBA dla świateł; składnik koloru alfa nie jest używany.
Kierunek Kierunek światła. Kierunek, w którym światło jest skierowane, określa się względem jego wizualnej reprezentacji CoordinateSpace.
Przestrzeń współrzędnych Każdy obiekt wizualny ma domyślną przestrzeń współrzędnych 3D. Kierunek X jest od lewej do prawej. Kierunek Y jest od góry do dołu. Kierunek Z jest osią wychodzącą poza płaszczyznę. Oryginalny punkt tej współrzędnej to lewy górny róg wizualizacji, a jednostka to Device Independent Pixel (DIP). Przesunięcie światła jest definiowane w tej współrzędnej.
Stożki wewnętrzne i zewnętrzne Reflektory emitują stożek światła, który ma dwie części: jasny stożek wewnętrzny i stożek zewnętrzny. Kompozycja umożliwia sterowanie kątami i kolorem stożka wewnętrznego i zewnętrznego.
Przesunięcie Przesunięcie źródła światła względem jego przestrzeni współrzędnej Wizualizacja.

Uwaga / Notatka

Gdy wiele świateł pada na ten sam obiekt wizualny lub gdy wartość koloru światła staje się na tyle duża, że przekracza 1,0, kolor światła może ulec zmianie z powodu ograniczenia kanału koloru światła.

Zaawansowane właściwości oświetlenia

Majątek Opis
Intensywność Steruje jasnością światła.
Tłumienie Tłumienie określa, jak intensywność światła zmniejsza się w kierunku maksymalnej odległości określonej przez właściwość zakresu. Można użyć właściwości tłumienia stałych, kwadratowych i liniowych.

Wprowadzenie do oświetlenia

Wykonaj następujące ogólne kroki, aby dodać światła:

  • Utwórz i umieść światła: utwórz światła i umieść je w określonej przestrzeni współrzędnej.
  • Zidentyfikować obiekty do oświetlenia: Skierować światło na odpowiednie wizualizacje.
  • [Opcjonalnie] Zdefiniuj sposób reagowania poszczególnych obiektów na światła: użyj kontrolki SceneLightingEffect z elementem EffectBrush, aby dostosować odbicie światła do wyświetlania elementu SpriteVisual. Domyślne ustawienia odbicia obsługują oświetlenie elementów podrzędnych w przestrzeni współrzędnych źródła światła. Wizualizacja malowana za pomocą elementu SceneLightingEffect zastępuje domyślne oświetlenie tej wizualizacji.

SceneLightingEffect

Funkcja SceneLightingEffect służy do modyfikowania domyślnego oświetlenia zastosowanego do zawartości elementu SpriteVisual objętego elementem CompositionLight.

Funkcja SceneLightingEffect jest często używana do tworzenia materiału. ScenaLightingEffect jest efektem używanym, gdy chcesz osiągnąć coś bardziej złożonego, takiego jak włączenie właściwości odbijających się na obrazie i/lub zapewnienie iluzji głębokości z normalną mapą. Efekt oświetlenia sceny umożliwia dostosowywanie interfejsu użytkownika przy użyciu właściwości oświetlenia, takich jak intensywność odbicia i rozproszenia. Możesz dodatkowo dostosować efekty oświetlenia, korzystając z pozostałej części potoku przetwarzania efektów, co pozwala na indywidualne mieszanie i komponowanie różnych reakcji oświetlenia z zawartością.

Uwaga / Notatka

Oświetlenie sceny nie generuje cienia; jest to efekt ukierunkowany na renderowanie 2D. Nie uwzględnia scenariuszy oświetlenia 3D, które obejmują rzeczywiste modele oświetlenia, w tym cienie.

Majątek Opis
Mapa normalna NormalMaps tworzą efekt tekstury, w której normalne wskazujące w stronę światła będą jaśniejsze, a normalne odwrócone od światła będą przyciemniane. Aby dodać NormalMap do docelowej wizualizacji, użyj elementu CompositionSurfaceBrush przy użyciu funkcji LoadedImageSurface w celu załadowania zasobu NormalMap.
Środowiskowy Właściwości otoczenia są najczęściej używane do kontrolowania ogólnego odbicia koloru.
Specularne Odbicie widmowe tworzy wyróżnienia na obiektach, dzięki czemu wydają się błyszczące. Można kontrolować poziom odbicia widmowego, a także poziom blasku. Te właściwości są manipulowane w celu tworzenia efektów materiałowych, takich jak błyszczące metale lub błyszczący papier.
Rozproszony Rozproszone odbicie rozprasza światło we wszystkich kierunkach.
Model odbicia Model odbicia pozwala wybrać między Blinn Phong i Blinn Phong oparty na fizyce. Możesz wybrać fizycznie bazujący model Blinn-Phong, gdy chcesz mieć skondensowane punkty refleksyjne.

Przykład (SceneLightingEffect)

W poniższym przykładzie pokazano, jak dodać normalną mapę do kontrolki SceneLightingEffect.

CompositionBrush CreateNormalMapBrush(ICompositionSurface normalMapImage)
{
    var colorSourceEffect = new ColorSourceEffect()
    {
        Color = Colors.White
    };
    var sceneLightingEffect = new SceneLightingEffect()
    {
        NormalMapSource = new CompositionEffectSourceParameter("NormalMap")
    };

    var compositeEffect = new ArithmeticCompositeEffect()
    {
        Source1 = colorSourceEffect,
        Source2 = sceneLightingEffect,
    };

    var factory = _compositor.CreateEffectFactory(sceneLightingEffect);

    var normalMapBrush = _compositor.CreateSurfaceBrush();
    normalMapBrush.Surface = normalMapImage;
    normalMapBrush.Stretch = CompositionStretch.Fill;

    var brush = factory.CreateBrush();
    brush.SetSourceParameter("NormalMap", normalMapBrush);

    return brush;
}
  • Last updated on