CompositionObject クラス

定義

ビジュアル ツリー構造のノードを表すコンポジション API の基本クラス。

コンポジション オブジェクトは、コンポジション API の他のすべての機能が使用および構築されるビジュアル ツリー構造です。 API を使用すると、開発者は Visual ツリー内の 1 つのノードを表す 1 つまたは複数の Visual オブジェクトを定義して作成できます。

[WebHostHidden]
public ref class CompositionObject : IClosable
public ref class CompositionObject : IClosable
public ref class CompositionObject : IClosable, IAnimationObject
/// [Windows.Foundation.Metadata.ContractVersion(Windows.Foundation.UniversalApiContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
[WebHostHidden]
class CompositionObject : IClosable
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
/// [Windows.Foundation.Metadata.ContractVersion(Windows.Foundation.UniversalApiContract, 131072)]
class CompositionObject : IClosable
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
/// [Windows.Foundation.Metadata.ContractVersion(Windows.Foundation.UniversalApiContract, 131072)]
class CompositionObject : IClosable, IAnimationObject
[Windows.Foundation.Metadata.ContractVersion(typeof(Windows.Foundation.UniversalApiContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public class CompositionObject : System.IDisposable
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
[Windows.Foundation.Metadata.ContractVersion(typeof(Windows.Foundation.UniversalApiContract), 131072)]
public class CompositionObject : System.IDisposable
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
[Windows.Foundation.Metadata.ContractVersion(typeof(Windows.Foundation.UniversalApiContract), 131072)]
public class CompositionObject : System.IDisposable, IAnimationObject
Public Class CompositionObject
Implements IDisposable
Public Class CompositionObject
Implements IAnimationObject, IDisposable
継承
Object Platform::Object IInspectable CompositionObject
派生
属性
実装

Windows の要件

デバイス ファミリ
Windows 10 (10.0.10240.0 で導入)
API contract
Windows.Foundation.UniversalApiContract (v1.0 で導入)

このサンプルでは、XAML、WWA、または DirectX を使用せずにコンポジション API を使用して自己完結型アプリを作成する方法を示します。 このサンプルでは、新しい コンポジターを初期化し、2 つの SpriteVisual オブジェクトを含むシーン グラフを作成します。

using System;
using System.Numerics;

using Windows.ApplicationModel.Core;
using Windows.UI;
using Windows.UI.Composition;
using Windows.UI.Core;

namespace HelloCompositionCs
{
    public sealed class HelloComposition : IFrameworkView
    {
        //------------------------------------------------------------------------------
        //
        // HelloComposition.Initialize
        //
        // This method is called during startup to associate the IFrameworkView with the
        // CoreApplicationView.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Initialize(CoreApplicationView view)
        {
            _view = view;
        }


        //------------------------------------------------------------------------------
        //
        // HelloComposition.SetWindow
        //
        // This method is called when the CoreApplication has created a new CoreWindow,
        // allowing the application to configure the window and start producing content
        // to display.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.SetWindow(CoreWindow window)
        {
            _window = window;
            InitNewComposition();
        }


        //------------------------------------------------------------------------------
        //
        // HelloComposition.Load
        //
        // This method is called when a specific page is being loaded in the
        // application.  It is not used for this application.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Load(string unused)
        {

        }


        //------------------------------------------------------------------------------
        //
        // HelloComposition.Run
        //
        // This method is called by CoreApplication.Run to actually run the
        // dispatcher's message pump.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Run()
        {
            _window.Activate();
            _window.Dispatcher.ProcessEvents(CoreProcessEventsOption.ProcessUntilQuit);
        }


        //------------------------------------------------------------------------------
        //
        // HelloComposition.Uninitialize
        //
        // This method is called during shutdown to disconnect the CoreApplicationView,
        // and CoreWindow from the IFrameworkView.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Uninitialize()
        {
            _window = null;
            _view = null;
        }


        //------------------------------------------------------------------------------
        //
        // HelloComposition.InitNewComposition
        //
        // This method is called by SetWindow, where we initialize Composition after
        // the CoreWindow has been created.
        //
        //------------------------------------------------------------------------------

        void InitNewComposition()
        {
            //
            // Set up Windows.UI.Composition Compositor, root ContainerVisual, and associate with
            // the CoreWindow.
            //

            _compositor = new Compositor();

            _root = _compositor.CreateContainerVisual();
            _view.CompositionRootVisual = _root;


            //
            // Create a simple scene.
            //

            var child1 = _compositor.CreateSpriteVisual();
            child1.Offset = new Vector2(50.0f, 50.0f);
            child1.Size = new Vector2(200, 200);
            child1.Brush = _compositor.CreateColorBrush(Color.FromArgb(0xFF, 0x00, 0xCC, 0x00));

            _root.Children.InsertAtTop(child1);

            var child2 = _compositor.CreateSpriteVisual();
            child2.Offset = new Vector2(50.0f, 50.0f);
            child2.Size = new Vector2(200, 200);
            child2.Brush = _compositor.CreateColorBrush(Color.FromArgb(0xFF, 0x00, 0x00, 0xCC));

            child1.Children.InsertAtTop(child2);

        }


        // CoreWindow / CoreApplicationView
        private CoreWindow _window;
        private CoreApplicationView _view;

        // Windows.UI.Composition
        private Compositor _compositor;
        private ContainerVisual _root;
    }


    public sealed class HelloCompositionFactory : IFrameworkViewSource
    {
        //------------------------------------------------------------------------------
        //
        // HelloCompositionFactory.CreateView
        //
        // This method is called by CoreApplication to provide a new IFrameworkView for
        // a CoreWindow that is being created.
        //
        //------------------------------------------------------------------------------

        IFrameworkView IFrameworkViewSource.CreateView()
        {
            return new HelloComposition();
        }


        //------------------------------------------------------------------------------
        //
        // main
        //
        //------------------------------------------------------------------------------

        static int Main(string[] args)
        {
            CoreApplication.Run(new HelloCompositionFactory());

            return 0;
        }
    }

} // namespace HelloCompositionCs

このサンプルでは、XAML、WWA、または DirectX を使用せずに不透明度を変更するために、ビジュアルの単純なツリーを構築してウォークする方法を示します。 このサンプルは、前のサンプルに基づいて構築されており、子ビジュアルの作成、追加、およびプロパティの変更方法を示しています。

このシナリオでは、ビジュアルのビジュアル ツリー階層が構築されます。 コンポジターが作成されると、それを使用してオブジェクトを作成し、それを管理できます。

//  Copyright (c) Microsoft Corporation. All rights reserved.

using System;
using System.Numerics;

using Windows.ApplicationModel.Core;
using Windows.Foundation;
using Windows.UI;
using Windows.UI.Composition;
using Windows.UI.Core;

namespace VisualTreeCs
{
    public sealed class VisualTree : IFrameworkView
    {
        //------------------------------------------------------------------------------
        //
        // VisualTree.Initialize
        //
        // This method is called during startup to associate the IFrameworkView with the
        // CoreApplicationView.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Initialize(CoreApplicationView view)
        {
            _view = view;
            _random = new Random();
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.SetWindow
        //
        // This method is called when the CoreApplication has created a new CoreWindow,
        // allowing the application to configure the window and start producing content
        // to display.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.SetWindow(CoreWindow window)
        {
            _window = window;
            InitNewComposition();
            _window.PointerPressed += OnPointerPressed;
            _window.PointerMoved += OnPointerMoved;
            _window.PointerReleased += OnPointerReleased;
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.OnPointerPressed
        //
        // This method is called when the user touches the screen, taps it with a stylus
        // or clicks the mouse.
        //
        //------------------------------------------------------------------------------

        void OnPointerPressed(CoreWindow window, PointerEventArgs args)
        {
            Point position = args.CurrentPoint.Position;

            //
            // Walk our list of visuals to determine who, if anybody, was selected
            //
            foreach (var child in _root.Children)
            {
                //
                // Did we hit this child?
                //
                Vector2 offset = child.Offset;
                Vector2 size = child.Size;

                if ((position.X >= offset.X) &&
                    (position.X < offset.X + size.X) &&
                    (position.Y >= offset.Y) &&
                    (position.Y < offset.Y + size.Y))
                {
                    //
                    // This child was hit. Since the children are stored back to front,
                    // the last one hit is the front-most one so it wins
                    //
                    _currentVisual = child;
                    _offsetBias = new Vector2((float)(offset.X - position.X),
                                              (float)(offset.Y - position.Y));
                }
            }

            //
            // If a visual was hit, bring it to the front of the Z order
            //
            if (_currentVisual != null)
            {
                ContainerVisual parent = _currentVisual.Parent as ContainerVisual;
                parent.Children.Remove(_currentVisual);
                parent.Children.InsertAtTop(_currentVisual);
            }
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.OnPointerMoved
        //
        // This method is called when the user moves their finger, stylus or mouse with
        // a button pressed over the screen.
        //
        //------------------------------------------------------------------------------

        void OnPointerMoved(CoreWindow window, PointerEventArgs args)
        {
            //
            // If a visual is selected, drag it with the pointer position and
            // make it opaque while we drag it
            //
            if (_currentVisual != null)
            {
                Point position = args.CurrentPoint.Position;
                _currentVisual.Opacity = 1.0f;
                _currentVisual.Offset = new Vector2((float)(position.X + _offsetBias.X),
                                                    (float)(position.Y + _offsetBias.Y));
            }
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.OnPointerReleased
        //
        // This method is called when the user lifts their finger or stylus from the
        // screen, or lifts the mouse button.
        //
        //------------------------------------------------------------------------------

        void OnPointerReleased(CoreWindow window, PointerEventArgs args)
        {
            //
            // If a visual was selected, make it transparent again when it is
            // released
            //
            if (_currentVisual != null)
            {
                _currentVisual.Opacity = 0.8f;
                _currentVisual = null;
            }
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.Load
        //
        // This method is called when a specific page is being loaded in the
        // application.  It is not used for this application.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Load(string unused)
        {

        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.Run
        //
        // This method is called by CoreApplication.Run to actually run the
        // dispatcher's message pump.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Run()
        {
            _window.Activate();
            _window.Dispatcher.ProcessEvents(CoreProcessEventsOption.ProcessUntilQuit);
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.Uninitialize
        //
        // This method is called during shutdown to disconnect the CoreApplicationView,
        // and CoreWindow from the IFrameworkView.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Uninitialize()
        {
            _window = null;
            _view = null;
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.InitNewComposition
        //
        // This method is called by SetWindow, where we initialize Composition after
        // the CoreWindow has been created.
        //
        //------------------------------------------------------------------------------

        void InitNewComposition()
        {
            //
            // Set up Windows.UI.Composition Compositor, root ContainerVisual, and associate with
            // the CoreWindow.
            //

            _compositor = new Compositor();

            _root = _compositor.CreateContainerVisual();
            _view.CompositionRootVisual = _root;

            //
            // Create a few visuals for our window
            //
            for (int index = 0; index < 20; index++)
            {
                _root.Children.InsertAtTop(CreateChildElement());
            }
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.CreateChildElement
        //
        // Creates a small sub-tree to represent a visible element in our application.
        //
        //------------------------------------------------------------------------------

        Visual CreateChildElement()
        {
            //
            // Each element consists of two visuals, which produce the appearance
            // of a framed rectangle
            //
            var visual = _compositor.CreateSpriteVisual();

            //
            // Position this visual randomly within our window
            //
            visual.Offset = new Vector2((float)(_random.NextDouble() * 400), (float)(_random.NextDouble() * 400));

            //
            // The outer rectangle is always white
            //
            visual.Brush = _compositor.CreateColorBrush( Color.FromArgb(0xFF, 0xFF, 0xFF, 0xFF) );
            visual.Size = new Vector2(100.0f, 100.0f);

            //
            // The inner rectangle is inset from the outer by three pixels all around
            //
            var child = _compositor.CreateSpriteVisual();
            visual.Children.InsertAtTop(child);
            child.Offset = new Vector2(3.0f, 3.0f);
            child.Size = new Vector2(94.0f, 94.0f);

            //
            // Pick a random color for every rectangle
            //
            byte red = (byte)(0xFF * (0.2f + (_random.NextDouble() / 0.8f)));
            byte green = (byte)(0xFF * (0.2f + (_random.NextDouble() / 0.8f)));
            byte blue = (byte)(0xFF * (0.2f + (_random.NextDouble() / 0.8f)));
            child.Brush = _compositor.CreateColorBrush( Color.FromArgb(0xFF, red, green, blue) );

            //
            // Make the subtree root visual partially transparent. This will cause each visual in the subtree
            // to render partially transparent, since a visual's opacity is multiplied with its parent's
            // opacity
            //
            visual.Opacity = 0.8f;

            return visual;
        }

        // CoreWindow / CoreApplicationView
        private CoreWindow _window;
        private CoreApplicationView _view;

        // Windows.UI.Composition
        private Compositor _compositor;
        private ContainerVisual _root;
        private Visual _currentVisual;
        private Vector2 _offsetBias;

        // Helpers
        private Random _random;
    }


    public sealed class VisualTreeFactory : IFrameworkViewSource
    {
        //------------------------------------------------------------------------------
        //
        // VisualTreeFactory.CreateView
        //
        // This method is called by CoreApplication to provide a new IFrameworkView for
        // a CoreWindow that is being created.
        //
        //------------------------------------------------------------------------------

        IFrameworkView IFrameworkViewSource.CreateView()
        {
            return new VisualTree();
        }

        //------------------------------------------------------------------------------
        //
        // main
        //
        //------------------------------------------------------------------------------

        static int Main(string[] args)
        {
            CoreApplication.Run(new VisualTreeFactory());

            return 0;
        }
    }

} // namespace VisualTreeCs

注釈

オブジェクトは、 コンポジター オブジェクトを使用して作成されます。 コンポジション オブジェクトは、コンテナーのみにすることも、コンテンツを保持することもできます。 この API では、使いやすさを考慮して、特定のタスクに合わせて一連の Visual オブジェクトが階層化されています。

  • Visual – ベース オブジェクト。プロパティの大半はここにあり、他のビジュアル オブジェクトによって継承されます。

  • ContainerVisualVisual から派生し、子ビジュアル オブジェクトを作成できます。

  • SpriteVisualContainerVisual から派生し、画像、効果、スワップチェーンの形式のコンテンツを含みます。

  • コンポジター – アプリケーションとシステム コンポジター プロセスの間の関係を管理します。 アニメーションは、アニメーション化可能なコンポジション オブジェクト (Visual など) のプロパティを更新します。 アニメーションには次の 2 種類があります。

  • KeyFrameAnimation: 2 つ以上のキー フレームを含む時間ベースのアニメーション。 これらのフレームはマーカーであり、開発者は、指定した時刻にアニメーション値を定義できます。 アニメーションは、キー フレーム間で値を補間 (ブレンド) する方法を指定することで、さらに微調整できます。 KeyFrameAnimation には、それぞれ異なる種類のキー フレーム値をサポートするサブクラスが多数あります。

  • ExpressionAnimation: 数式を使用して、各フレームのアニメーション値の計算方法を指定するアニメーション。 式は、コンポジション オブジェクトからプロパティを参照できます。 ExpressionAnimationは時間ベースではなく、各フレーム (必要な場合) に処理されます。

プリミティブ ビジュアル

プリミティブ ビジュアル ( SpriteVisual など) は、画面上のビジュアル コンテンツと、そのコンテンツに適用されるレンダリング オプションを記述します。

エフェクト

エフェクトをビジュアル ツリーにアタッチすると、画像やビジュアルのツリーなどのソース コンテンツに動的なピクセル変更を加えることができます。

効果としては、彩度の下がりなどの単純な操作、ぼかしなどの複雑な操作、クロス フェードなどの非常に複雑な A B ブレンド操作などが考えられます。

効果の作成と使用の詳細については、「 CompositionEffectBrush 」の「解説」セクションを参照してください。

バージョン履歴

Windows のバージョン SDK バージョン 追加された値
1607 14393 解説
1607 14393 ImplicitAnimation
1607 14393 StartAnimationGroup
1607 14393 StopAnimationGroup
1709 16299 DispatcherQueue
1803 17134 TryGetAnimationController
1809 17763 PopulatePropertyInfo
1809 17763 StartAnimationGroupWithIAnimationObject
1809 17763 StartAnimationWithIAnimationObject

プロパティ

Comment

CompositionObject に関連付ける文字列。

Compositor

この CompositionObject の作成に使用するコンポジター

Dispatcher

CompositionObject のディスパッチャー。

DispatcherQueue

CompostionObject の DispatcherQueue を取得します。

ImplicitAnimations

このオブジェクトにアタッチされている暗黙的なアニメーションのコレクション。

Properties

CompositionObject に関連付けられているプロパティのコレクション。

メソッド

Close()

CompositionObject を閉じ、システム リソースを解放します。

ConnectAnimation(String, CompositionAnimation)

接続とアニメーション。

DisconnectAnimation(String)

アニメーションを切断します。

Dispose()

アンマネージ リソースの解放またはリセットに関連付けられているアプリケーション定義のタスクを実行します。

PopulatePropertyInfo(String, AnimationPropertyInfo)

アニメーション化できるプロパティを定義します。

StartAnimation(String, CompositionAnimation, AnimationController)

アニメーションをオブジェクトの指定したプロパティに接続し、アニメーションを開始します。

StartAnimation(String, CompositionAnimation)

アニメーションをオブジェクトの指定したプロパティに接続し、アニメーションを開始します。

StartAnimationGroup(ICompositionAnimationBase)

アニメーション グループを開始します。

CompositionObject の StartAnimationGroup メソッドを使用すると、CompositionAnimationGroup を開始できます。 グループ内のすべてのアニメーションは、オブジェクトで同時に開始されます。

StartAnimationGroupWithIAnimationObject(IAnimationObject, ICompositionAnimationBase)

指定したターゲットでアニメーション グループを開始します。

StartAnimationWithIAnimationObject(IAnimationObject, String, CompositionAnimation)

アニメーションをターゲット オブジェクトの指定したプロパティに接続し、アニメーションを開始します。

StopAnimation(String)

指定したプロパティからアニメーションを切断し、アニメーションを停止します。

StopAnimationGroup(ICompositionAnimationBase)

アニメーション グループを停止します。

TryGetAnimationController(String)

指定したプロパティで実行されているアニメーションの AnimationController を返します。

適用対象

こちらもご覧ください