2D Archives - 87 중 2 번째 페이지

[C#/COMMON/.NET8] Segoe UI Emoji 폰트에서 이모지 문자 여부 구하기

■ Segoe UI Emoji 폰트에서 이모지 문자 여부를 구하는 방법을 보여준다. ▶ Segoe UI Emoji 폰트에서 이모지 문자 여부 구하기 예제 (C#)

[C#/COMMON/.NET8] Typeface 클래스 : 이모지 타입 페이스 객체 만들기

■ Typeface 클래스를 사용해 이모지 타입 페이스 객체를 만드는 방법을 보여준다. ▶ 예제 코드 (C#)


using System.Windows;
using System.Windows.Media;

Typeface emojiTypeface = new Typeface
(
    new FontFamily("Segoe UI Emoji"),
    FontStyles.Normal,
    FontWeights.Normal,
    FontStretches.Normal
);

using System.Windows;

using System.Windows.Media;

Typeface emojiTypeface = new Typeface

(

new FontFamily("Segoe UI Emoji"),

FontStyles.Normal,

FontWeights.Normal,

FontStretches.Normal

);

[C#/WPF/.NET8] Button 엘리먼트 : 클릭시 회전하는 톱니바퀴 버튼 만들기

■ Button 엘리먼트를 사용해 클릭시 회전하는 톱니바퀴 버튼을 만드는 방법을 보여준다. ▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="TestProject"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Window.Resources>
        <Style x:Key="GearButtonStyleKey" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <Ellipse
                                Fill="{TemplateBinding Background}"
                                Width="{TemplateBinding Width}"
                                Height="{TemplateBinding Height}" />
                            <Path Name="gearPath"
                                Width="{TemplateBinding Width}"
                                Height="{TemplateBinding Height}"
                                Stretch="Uniform"
                                Fill="{TemplateBinding Foreground}"
                                RenderTransformOrigin="0.5 0.5"
                                Data="M 495.9 166.6 c 3.2 8.7 .5 18.4 -6.4 24.6 l -43.3 39.4 c 1.1 8.3 1.7 16.8 1.7 25.4 s -0.6 17.1 -1.7 25.4 l 43.3 39.4 c 6.9 6.2 9.6 15.9 6.4 24.6 c -4.4 11.9 -9.7 23.3 -15.8 34.3 l -4.7 8.1 c -6.6 11 -14 21.4 -22.1 31.2 c -5.9 7.2 -15.7 9.6 -24.5 6.8 l -55.7 -17.7 c -13.4 10.3 -28.2 18.9 -44 25.4 l -12.5 57.1 c -2 9.1 -9 16.3 -18.2 17.8 c -13.8 2.3 -28 3.5 -42.5 3.5 s -28.7 -1.2 -42.5 -3.5 c -9.2 -1.5 -16.2 -8.7 -18.2 -17.8 l -12.5 -57.1 c -15.8 -6.5 -30.6 -15.1 -44 -25.4 L 83.1 425.9 c -8.8 2.8 -18.6 0.3 -24.5 -6.8 c -8.1 -9.8 -15.5 -20.2 -22.1 -31.2 l -4.7 -8.1 c -6.1 -11 -11.4 -22.4 -15.8 -34.3 c -3.2 -8.7 -0.5 -18.4 6.4 -24.6 l 43.3 -39.4 C 64.6 273.1 64 264.6 64 256 s 0.6 -17.1 1.7 -25.4 L 22.4 191.2 c -6.9 -6.2 -9.6 -15.9 -6.4 -24.6 c 4.4 -11.9 9.7 -23.3 15.8 -34.3 l 4.7 -8.1 c 6.6 -11 14 -21.4 22.1 -31.2 c 5.9 -7.2 15.7 -9.6 24.5 -6.8 l 55.7 17.7 c 13.4 -10.3 28.2 -18.9 44 -25.4 l 12.5 -57.1 c 2 -9.1 9 -16.3 18.2 -17.8 C 227.3 1.2 241.5 0 256 0 s 28.7 1.2 42.5 3.5 c 9.2 1.5 16.2 8.7 18.2 17.8 l 12.5 57.1 c 15.8 6.5 30.6 15.1 44 25.4 l 55.7 -17.7 c 8.8 -2.8 18.6 -0.3 24.5 6.8 c 8.1 9.8 15.5 20.2 22.1 31.2 l 4.7 8.1 c 6.1 11 11.4 22.4 15.8 34.3 z M 256 336 c 44.2 0 80 -35.8 80 -80 s -35.8 -80 -80 -80 s -80 35.8 -80 80 s 35.8 80 80 80 z">
                                <Path.RenderTransform>
                                    <RotateTransform x:Name="gearRotateTransform" />
                                </Path.RenderTransform>
                            </Path>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <EventTrigger RoutedEvent="Button.PreviewMouseDown">
                                <BeginStoryboard>
                                    <Storyboard>
                                        <DoubleAnimation
                                            Storyboard.TargetName="gearRotateTransform"
                                            Storyboard.TargetProperty="Angle"
                                            To="180"
                                            Duration="00:00:00.1"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </EventTrigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <StackPanel
        HorizontalAlignment="Center"
        VerticalAlignment="Center">
        <Button Name="gearButton1"
            Style="{StaticResource GearButtonStyleKey}"
            Width="32"
            Height="32"
            Background="Transparent"
            Foreground="DarkGray" />
        <Button Name="gearButton2"
            Style="{StaticResource GearButtonStyleKey}"
            Margin="0 10 0 0"
            Width="64"
            Height="64"
            Background="Transparent"
            Foreground="DarkGray" />
        <Button Name="gearButton3"
            Style="{StaticResource GearButtonStyleKey}"
            Margin="0 10 0 0"
            Width="128"
            Height="128"
            Background="Transparent"
            Foreground="DarkGray" />
    </StackPanel>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="800"

Height="600"

Title="TestProject"

FontFamily="나눔고딕코딩"

FontSize="16">

<Window.Resources>

<Setter.Value>

<Grid>

<Ellipse

Fill="{TemplateBinding Background}"

Width="{TemplateBinding Width}"

Height="{TemplateBinding Height}" />

<Path Name="gearPath"

Width="{TemplateBinding Width}"

Height="{TemplateBinding Height}"

Stretch="Uniform"

Fill="{TemplateBinding Foreground}"

RenderTransformOrigin="0.5 0.5"

Data="M 495.9 166.6 c 3.2 8.7 .5 18.4 -6.4 24.6 l -43.3 39.4 c 1.1 8.3 1.7 16.8 1.7 25.4 s -0.6 17.1 -1.7 25.4 l 43.3 39.4 c 6.9 6.2 9.6 15.9 6.4 24.6 c -4.4 11.9 -9.7 23.3 -15.8 34.3 l -4.7 8.1 c -6.6 11 -14 21.4 -22.1 31.2 c -5.9 7.2 -15.7 9.6 -24.5 6.8 l -55.7 -17.7 c -13.4 10.3 -28.2 18.9 -44 25.4 l -12.5 57.1 c -2 9.1 -9 16.3 -18.2 17.8 c -13.8 2.3 -28 3.5 -42.5 3.5 s -28.7 -1.2 -42.5 -3.5 c -9.2 -1.5 -16.2 -8.7 -18.2 -17.8 l -12.5 -57.1 c -15.8 -6.5 -30.6 -15.1 -44 -25.4 L 83.1 425.9 c -8.8 2.8 -18.6 0.3 -24.5 -6.8 c -8.1 -9.8 -15.5 -20.2 -22.1 -31.2 l -4.7 -8.1 c -6.1 -11 -11.4 -22.4 -15.8 -34.3 c -3.2 -8.7 -0.5 -18.4 6.4 -24.6 l 43.3 -39.4 C 64.6 273.1 64 264.6 64 256 s 0.6 -17.1 1.7 -25.4 L 22.4 191.2 c -6.9 -6.2 -9.6 -15.9 -6.4 -24.6 c 4.4 -11.9 9.7 -23.3 15.8 -34.3 l 4.7 -8.1 c 6.6 -11 14 -21.4 22.1 -31.2 c 5.9 -7.2 15.7 -9.6 24.5 -6.8 l 55.7 17.7 c 13.4 -10.3 28.2 -18.9 44 -25.4 l 12.5 -57.1 c 2 -9.1 9 -16.3 18.2 -17.8 C 227.3 1.2 241.5 0 256 0 s 28.7 1.2 42.5 3.5 c 9.2 1.5 16.2 8.7 18.2 17.8 l 12.5 57.1 c 15.8 6.5 30.6 15.1 44 25.4 l 55.7 -17.7 c 8.8 -2.8 18.6 -0.3 24.5 6.8 c 8.1 9.8 15.5 20.2 22.1 31.2 l 4.7 8.1 c 6.1 11 11.4 22.4 15.8 34.3 z M 256 336 c 44.2 0 80 -35.8 80 -80 s -35.8 -80 -80 -80 s -80 35.8 -80 80 s 35.8 80 80 80 z">

<Path.RenderTransform>

</Path.RenderTransform>

</Path>

</Grid>

<ControlTemplate.Triggers>

<DoubleAnimation

Storyboard.TargetName="gearRotateTransform"

Storyboard.TargetProperty="Angle"

To="180"

Duration="00:00:00.1"/>

</Storyboard>

</BeginStoryboard>

</EventTrigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</Window.Resources>

<StackPanel

HorizontalAlignment="Center"

VerticalAlignment="Center">

<Button Name="gearButton1"

Style="{StaticResource GearButtonStyleKey}"

Width="32"

Height="32"

Background="Transparent"

Foreground="DarkGray" />

<Button Name="gearButton2"

Style="{StaticResource GearButtonStyleKey}"

Margin="0 10 0 0"

Width="64"

Height="64"

Background="Transparent"

Foreground="DarkGray" />

<Button Name="gearButton3"

Style="{StaticResource GearButtonStyleKey}"

Margin="0 10 0 0"

Width="128"

Height="128"

Background="Transparent"

Foreground="DarkGray" />

</StackPanel>

</Window>

▶ MainWindow.xaml.cs


using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace TestProject;

/// <summary>
/// 메인 윈도우
/// </summary>
public partial class MainWindow : Window
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Field
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region Field

    /// <summary>
    /// 회전 여부
    /// </summary>
    private bool isRotating = false;

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainWindow()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainWindow()
    {
        InitializeComponent();

        this.gearButton1.Click += settingButton_Click;
        this.gearButton2.Click += settingButton_Click;
        this.gearButton3.Click += settingButton_Click;
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region 기어 버튼 클릭시 처리하기 - settingButton_Click(sender, e)

    /// <summary>
    /// 기어 버튼 클릭시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void settingButton_Click(object sender, RoutedEventArgs e)
    {
        if(!this.isRotating)
        {
            this.isRotating = true;

            Button button = sender as Button;

            Path gearPath = (Path)button.Template.FindName("gearPath", button);

            RotateTransform rotateTransform = gearPath.RenderTransform as RotateTransform;

            DoubleAnimation rotateBackAnimation = new DoubleAnimation
            {
                Duration = TimeSpan.FromSeconds(0.2),
                From     = 180,
                To       = 0
            };

            rotateBackAnimation.Completed += (s, _) =>
            {
                this.isRotating = false;

                rotateTransform.Angle = 0;
            };

            rotateTransform.BeginAnimation(RotateTransform.AngleProperty, rotateBackAnimation);
        }
    }

    #endregion
}

using System;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

namespace TestProject;

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 회전 여부

/// </summary>

private bool isRotating = false;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

this.gearButton1.Click += settingButton_Click;

this.gearButton2.Click += settingButton_Click;

this.gearButton3.Click += settingButton_Click;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 기어 버튼 클릭시 처리하기 - settingButton_Click(sender, e)

/// <summary>

/// 기어 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void settingButton_Click(object sender, RoutedEventArgs e)

{

if(!this.isRotating)

{

this.isRotating = true;

Button button = sender as Button;

Path gearPath = (Path)button.Template.FindName("gearPath", button);

RotateTransform rotateTransform = gearPath.RenderTransform as RotateTransform;

DoubleAnimation rotateBackAnimation = new DoubleAnimation

{

Duration = TimeSpan.FromSeconds(0.2),

From = 180,

To = 0

};

rotateBackAnimation.Completed += (s, _) =>

{

this.isRotating = false;

rotateTransform.Angle = 0;

};

rotateTransform.BeginAnimation(RotateTransform.AngleProperty, rotateBackAnimation);

}

#endregion

}

TestProject.zip

[C#/WPF/.NET8] Window 엘리먼트 : 테두리를 제거하고 모서리가 둥근 윈도우 만들기

■ Window 엘리먼트를 사용해 테두리를 제거하고 모서리가 둥근 윈도우를 만드는 방법을 보여준다. ▶ MainPage.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="TestProject"
    ResizeMode="NoResize"
    Background="Transparent"
    WindowStyle="None"
    AllowsTransparency="True">
    <WindowChrome.WindowChrome>
        <WindowChrome
            ResizeBorderThickness="0"
            CaptionHeight="0" />
    </WindowChrome.WindowChrome>
    <Border
        Margin="10"
        CornerRadius="10"
        Background="White">
        <Border.Effect>
            <DropShadowEffect
                BlurRadius="15"
                Direction="-90"
                RenderingBias="Quality"
                ShadowDepth="2" />
        </Border.Effect>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*"    />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid Grid.Row="0"
                Background="Transparent">
                <StackPanel
                    HorizontalAlignment="Right"
                    Margin="0 10 10 0"
                    Orientation="Horizontal">
                    <Button Name="minimizeButton"
                        Width="30"
                        Height="30">
                        <Path
                            StrokeThickness="2"
                            Stroke="Black"
                            Data="M 0 8 H 10" />
                    </Button>
                    <Button Name="maximizeButton"
                        Width="30"
                        Height="30">
                        <Path
                            StrokeThickness="2"
                            Stroke="Black"
                            Data="M 0 0 H 10 V 10 H 0 Z" />
                    </Button>
                    <Button Name="closeButton"
                        Width="30"
                        Height="30">
                        <Path
                            StrokeThickness="2"
                            Stroke="Black"
                            Data="M 0 0 L 10 10 M 0 10 L 10 0" />
                    </Button>
                </StackPanel>
            </Grid>
            <Grid Grid.Row="1">
                <Ellipse
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Width="200"
                    Height="200"
                    Fill="Gold" />
            </Grid>
            <Grid Name="bottomGrid" Grid.Row="2"
                Height="0"
                Background="#e0e0e0">
                <TextBlock
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Text="Sliding Panel Content" />
            </Grid>
            <Button Name="settingButton" Grid.Row="1"
                VerticalAlignment="Bottom"
                HorizontalAlignment="Left"
                Margin="10"
                Width="30"
                Height="30"
                Padding="3">
                <Path
                    Stretch="Uniform"
                    Fill="Black"
                    Data=" M 12 8 A 4 4 0 0 1 16 12 A 4 4 0 0 1 12 16 A 4 4 0 0 1 8 12 A 4 4 0 0 1 12 8 M 12 10 A 2 2 0 0 0 10 12 A 2 2 0 0 0 12 14 A 2 2 0 0 0 14 12 A 2 2 0 0 0 12 10 M 10 22 C 9.75 22 9.54 21.82 9.5 21.58 L 9.13 18.93 C 8.5 18.68 7.96 18.34 7.44 17.94 L 4.95 18.95 C 4.73 19.03 4.46 18.95 4.34 18.73 L 2.34 15.27 C 2.21 15.05 2.27 14.78 2.46 14.63 L 4.57 12.97 L 4.5 12 L 4.57 11 L 2.46 9.37 C 2.27 9.22 2.21 8.95 2.34 8.73 L 4.34 5.27 C 4.46 5.05 4.73 4.96 4.95 5.05 L 7.44 6.05 C 7.96 5.66 8.5 5.32 9.13 5.07 L 9.5 2.42 C 9.54 2.18 9.75 2 10 2 H 14 C 14.25 2 14.46 2.18 14.5 2.42 L 14.87 5.07 C 15.5 5.32 16.04 5.66 16.56 6.05 L 19.05 5.05 C 19.27 4.96 19.54 5.05 19.66 5.27 L 21.66 8.73 C 21.79 8.95 21.73 9.22 21.54 9.37 L 19.43 11 L 19.5 12 L 19.43 13 L 21.54 14.63 C 21.73 14.78 21.79 15.05 21.66 15.27 L 19.66 18.73 C 19.54 18.95 19.27 19.04 19.05 18.95 L 16.56 17.95 C 16.04 18.34 15.5 18.68 14.87 18.93 L 14.5 21.58 C 14.46 21.82 14.25 22 14 22 H 10 M 11.25 4 L 10.88 6.61 C 9.68 6.86 8.62 7.5 7.85 8.39 L 5.44 7.35 L 4.69 8.65 L 6.8 10.2 C 6.4 11.37 6.4 12.64 6.8 13.8 L 4.68 15.36 L 5.43 16.66 L 7.86 15.62 C 8.63 16.5 9.68 17.14 10.87 17.38 L 11.24 20 H 12.76 L 13.13 17.39 C 14.32 17.14 15.37 16.5 16.14 15.62 L 18.57 16.66 L 19.32 15.36 L 17.2 13.81 C 17.6 12.64 17.6 11.37 17.2 10.2 L 19.31 8.65 L 18.56 7.35 L 16.15 8.39 C 15.38 7.5 14.32 6.86 13.12 6.62 L 12.75 4 H 11.25 Z" />
            </Button>
        </Grid>
    </Border>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="800"

Height="600"

Title="TestProject"

ResizeMode="NoResize"

Background="Transparent"

WindowStyle="None"

AllowsTransparency="True">

<WindowChrome.WindowChrome>

<WindowChrome

ResizeBorderThickness="0"

CaptionHeight="0" />

</WindowChrome.WindowChrome>

<Border

Margin="10"

CornerRadius="10"

Background="White">

<Border.Effect>

<DropShadowEffect

BlurRadius="15"

Direction="-90"

RenderingBias="Quality"

ShadowDepth="2" />

</Border.Effect>

<Grid>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Grid Grid.Row="0"

Background="Transparent">

<StackPanel

HorizontalAlignment="Right"

Margin="0 10 10 0"

Orientation="Horizontal">

<Button Name="minimizeButton"

Width="30"

Height="30">

<Path

StrokeThickness="2"

Stroke="Black"

Data="M 0 8 H 10" />

</Button>

<Button Name="maximizeButton"

Width="30"

Height="30">

<Path

StrokeThickness="2"

Stroke="Black"

Data="M 0 0 H 10 V 10 H 0 Z" />

</Button>

<Button Name="closeButton"

Width="30"

Height="30">

<Path

StrokeThickness="2"

Stroke="Black"

Data="M 0 0 L 10 10 M 0 10 L 10 0" />

</Button>

</StackPanel>

</Grid>

<Ellipse

HorizontalAlignment="Center"

VerticalAlignment="Center"

Width="200"

Height="200"

Fill="Gold" />

</Grid>

<Grid Name="bottomGrid" Grid.Row="2"

Height="0"

Background="#e0e0e0">

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center"

Text="Sliding Panel Content" />

</Grid>

<Button Name="settingButton" Grid.Row="1"

VerticalAlignment="Bottom"

HorizontalAlignment="Left"

Margin="10"

Width="30"

Height="30"

Padding="3">

<Path

Stretch="Uniform"

Fill="Black"

Data=" M 12 8 A 4 4 0 0 1 16 12 A 4 4 0 0 1 12 16 A 4 4 0 0 1 8 12 A 4 4 0 0 1 12 8 M 12 10 A 2 2 0 0 0 10 12 A 2 2 0 0 0 12 14 A 2 2 0 0 0 14 12 A 2 2 0 0 0 12 10 M 10 22 C 9.75 22 9.54 21.82 9.5 21.58 L 9.13 18.93 C 8.5 18.68 7.96 18.34 7.44 17.94 L 4.95 18.95 C 4.73 19.03 4.46 18.95 4.34 18.73 L 2.34 15.27 C 2.21 15.05 2.27 14.78 2.46 14.63 L 4.57 12.97 L 4.5 12 L 4.57 11 L 2.46 9.37 C 2.27 9.22 2.21 8.95 2.34 8.73 L 4.34 5.27 C 4.46 5.05 4.73 4.96 4.95 5.05 L 7.44 6.05 C 7.96 5.66 8.5 5.32 9.13 5.07 L 9.5 2.42 C 9.54 2.18 9.75 2 10 2 H 14 C 14.25 2 14.46 2.18 14.5 2.42 L 14.87 5.07 C 15.5 5.32 16.04 5.66 16.56 6.05 L 19.05 5.05 C 19.27 4.96 19.54 5.05 19.66 5.27 L 21.66 8.73 C 21.79 8.95 21.73 9.22 21.54 9.37 L 19.43 11 L 19.5 12 L 19.43 13 L 21.54 14.63 C 21.73 14.78 21.79 15.05 21.66 15.27 L 19.66 18.73 C 19.54 18.95 19.27 19.04 19.05 18.95 L 16.56 17.95 C 16.04 18.34 15.5 18.68 14.87 18.93 L 14.5 21.58 C 14.46 21.82 14.25 22 14 22 H 10 M 11.25 4 L 10.88 6.61 C 9.68 6.86 8.62 7.5 7.85 8.39 L 5.44 7.35 L 4.69 8.65 L 6.8 10.2 C 6.4 11.37 6.4 12.64 6.8 13.8 L 4.68 15.36 L 5.43 16.66 L 7.86 15.62 C 8.63 16.5 9.68 17.14 10.87 17.38 L 11.24 20 H 12.76 L 13.13 17.39 C 14.32 17.14 15.37 16.5 16.14 15.62 L 18.57 16.66 L 19.32 15.36 L 17.2 13.81 C 17.6 12.64 17.6 11.37 17.2 10.2 L 19.31 8.65 L 18.56 7.35 L 16.15 8.39 C 15.38 7.5 14.32 6.86 13.12 6.62 L 12.75 4 H 11.25 Z" />

</Button>

</Grid>

</Border>

</Window>

▶ MainPage.xaml.cs


using System;
using System.Windows;
using System.Windows.Input;
using System.Windows.Media.Animation;

namespace TestProject;

/// <summary>
/// 메인 윈도우
/// </summary>
public partial class MainWindow : Window
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Field
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region Field

    /// <summary>
    /// 하단 그리드 표시 여부
    /// </summary>
    private bool isBottomGridVisible = false;

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainWindow()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainWindow()
    {
        InitializeComponent();

        MouseMove                  += Window_MouseMove;
        this.minimizeButton.Click  += minimizeButton_Click;
        this.maximizeButton.Click  += maximizeButton_Click;
        this.closeButton.Click     += closeButton_Click;
        this.settingButton.Click   += settingButton_Click;
        this.bottomGrid.MouseLeave += bottomGrid_MouseLeave;
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private
    //////////////////////////////////////////////////////////////////////////////// Event

    #region 윈도우 마우스 이동시 처리하기 - Window_MouseMove(sender, e)

    /// <summary>
    /// 윈도우 마우스 이동시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void Window_MouseMove(object sender, MouseEventArgs e)
    {
        Point mousePoint = e.GetPosition(this);

        if(mousePoint.Y > ActualHeight - 30)
        {
            if(!this.isBottomGridVisible)
            {
                ShowBottomGrid();
            }
        }
    }

    #endregion
    #region 최소화 버튼 클릭시 처리하기 - minimizeButton_Click(sender, e)

    /// <summary>
    /// 최소화 버튼 클릭시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void minimizeButton_Click(object sender, RoutedEventArgs e)
    {
        WindowState = WindowState.Minimized;
    }

    #endregion
    #region 최대화 버튼 클릭시 처리하기 - maximizeButton_Click(sender, e)

    /// <summary>
    /// 최대화 버튼 클릭시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void maximizeButton_Click(object sender, RoutedEventArgs e)
    {
        if(WindowState == WindowState.Maximized)
        {
            WindowState = WindowState.Normal;
        }
        else
        {
            WindowState = WindowState.Maximized;
        }
    }

    #endregion
    #region 닫기 버튼 클릭시 처리하기 - closeButton_Click(sender, e)

    /// <summary>
    /// 닫기 버튼 클릭시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void closeButton_Click(object sender, RoutedEventArgs e)
    {
        Close();
    }

    #endregion
    #region 설정 버튼 클릭시 처리하기 - settingButton_Click(sender, e)

    /// <summary>
    /// 설정 버튼 클릭시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void settingButton_Click(object sender, RoutedEventArgs e)
    {
        MessageBox.Show(this, "Settings button clicked!");
    }

    #endregion
    #region 하단 그리드 마우스 이탈시 처리하기 - bottomGrid_MouseLeave(sender, e)

    /// <summary>
    /// 하단 그리드 마우스 이탈시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void bottomGrid_MouseLeave(object sender, MouseEventArgs e)
    {
        if(this.isBottomGridVisible)
        {
            HideBottomGrid();
        }
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////// Function

    #region 하단 그리드 표시하기 - ShowBottomGrid()

    /// <summary>
    /// 하단 그리드 표시하기
    /// </summary>
    private void ShowBottomGrid()
    {
        DoubleAnimation doubleAnimation = new DoubleAnimation(100, TimeSpan.FromSeconds(0.3));

        this.bottomGrid.BeginAnimation(HeightProperty, doubleAnimation);

        this.isBottomGridVisible = true;
    }

    #endregion
    #region 하단 그리드 숨기기- HideBottomGrid()

    /// <summary>
    /// 하단 그리드 숨기기
    /// </summary>
    private void HideBottomGrid()
    {
        DoubleAnimation doubleAnimation = new DoubleAnimation(0, TimeSpan.FromSeconds(0.3));

        this.bottomGrid.BeginAnimation(HeightProperty, doubleAnimation);

        this.isBottomGridVisible = false;
    }

    #endregion
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

using System;

using System.Windows;

using System.Windows.Input;

using System.Windows.Media.Animation;

namespace TestProject;

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 하단 그리드 표시 여부

/// </summary>

private bool isBottomGridVisible = false;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

MouseMove += Window_MouseMove;

this.minimizeButton.Click += minimizeButton_Click;

this.maximizeButton.Click += maximizeButton_Click;

this.closeButton.Click += closeButton_Click;

this.settingButton.Click += settingButton_Click;

this.bottomGrid.MouseLeave += bottomGrid_MouseLeave;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region 윈도우 마우스 이동시 처리하기 - Window_MouseMove(sender, e)

/// <summary>

/// 윈도우 마우스 이동시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void Window_MouseMove(object sender, MouseEventArgs e)

{

Point mousePoint = e.GetPosition(this);

if(mousePoint.Y > ActualHeight - 30)

{

if(!this.isBottomGridVisible)

{

ShowBottomGrid();

}

#endregion

#region 최소화 버튼 클릭시 처리하기 - minimizeButton_Click(sender, e)

/// <summary>

/// 최소화 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void minimizeButton_Click(object sender, RoutedEventArgs e)

{

WindowState = WindowState.Minimized;

}

#endregion

#region 최대화 버튼 클릭시 처리하기 - maximizeButton_Click(sender, e)

/// <summary>

/// 최대화 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void maximizeButton_Click(object sender, RoutedEventArgs e)

{

if(WindowState == WindowState.Maximized)

{

WindowState = WindowState.Normal;

}

else

{

WindowState = WindowState.Maximized;

}

#endregion

#region 닫기 버튼 클릭시 처리하기 - closeButton_Click(sender, e)

/// <summary>

/// 닫기 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void closeButton_Click(object sender, RoutedEventArgs e)

{

Close();

}

#endregion

#region 설정 버튼 클릭시 처리하기 - settingButton_Click(sender, e)

/// <summary>

/// 설정 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void settingButton_Click(object sender, RoutedEventArgs e)

{

MessageBox.Show(this, "Settings button clicked!");

}

#endregion

#region 하단 그리드 마우스 이탈시 처리하기 - bottomGrid_MouseLeave(sender, e)

/// <summary>

/// 하단 그리드 마우스 이탈시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void bottomGrid_MouseLeave(object sender, MouseEventArgs e)

{

if(this.isBottomGridVisible)

{

HideBottomGrid();

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 하단 그리드 표시하기 - ShowBottomGrid()

/// <summary>

/// 하단 그리드 표시하기

/// </summary>

private void ShowBottomGrid()

{

DoubleAnimation doubleAnimation = new DoubleAnimation(100, TimeSpan.FromSeconds(0.3));

this.bottomGrid.BeginAnimation(HeightProperty, doubleAnimation);

this.isBottomGridVisible = true;

}

#endregion

#region 하단 그리드 숨기기- HideBottomGrid()

/// <summary>

/// 하단 그리드 숨기기

/// </summary>

private void HideBottomGrid()

{

DoubleAnimation doubleAnimation = new DoubleAnimation(0, TimeSpan.FromSeconds(0.3));

this.bottomGrid.BeginAnimation(HeightProperty, doubleAnimation);

this.isBottomGridVisible = false;

}

#endregion

}

TestProject.zip

[C#/WPF/.NET8] DropShadowEffect 엘리먼트 : BlurRadius/Direction/RenderingBias/ShadowDepth 속성을 사용해 그림자 효과 설정하기

■ DropShadowEffect 엘리먼트의 BlurRadius/Direction/RenderingBias/ShadowDepth 속성을 사용해 그림자 효과를 설정하는 방법을 보여준다. ▶ 예제 코드 (XAML)


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="TestProject"
    ResizeMode="NoResize"
    Background="Transparent"
    WindowStyle="None"
    AllowsTransparency="True">
    <WindowChrome.WindowChrome>
        <WindowChrome
            ResizeBorderThickness="0"
            CaptionHeight="0" />
    </WindowChrome.WindowChrome>
    <Border
        Margin="10"
        CornerRadius="10"
        Background="White">
        <Border.Effect>
            <DropShadowEffect
                BlurRadius="15"
                Direction="-90"
                RenderingBias="Quality"
                ShadowDepth="2" />
        </Border.Effect>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*"    />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid Grid.Row="0"
                Background="Transparent">
                <StackPanel
                    HorizontalAlignment="Right"
                    Margin="0 10 10 0"
                    Orientation="Horizontal">
                    <Button Name="minimizeButton"
                        Width="30"
                        Height="30">
                        <Path
                            StrokeThickness="2"
                            Stroke="Black"
                            Data="M 0 8 H 10" />
                    </Button>
                    <Button Name="maximizeButton"
                        Width="30"
                        Height="30">
                        <Path
                            StrokeThickness="2"
                            Stroke="Black"
                            Data="M 0 0 H 10 V 10 H 0 Z" />
                    </Button>
                    <Button Name="closeButton"
                        Width="30"
                        Height="30">
                        <Path
                            StrokeThickness="2"
                            Stroke="Black"
                            Data="M 0 0 L 10 10 M 0 10 L 10 0" />
                    </Button>
                </StackPanel>
            </Grid>
            <Grid Grid.Row="1">
                <Ellipse
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Width="200"
                    Height="200"
                    Fill="Gold" />
            </Grid>
            <Grid Name="bottomGrid" Grid.Row="2"
                Height="0"
                Background="#e0e0e0">
                <TextBlock
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Text="Sliding Panel Content" />
            </Grid>
            <Button Name="settingButton" Grid.Row="1"
                VerticalAlignment="Bottom"
                HorizontalAlignment="Left"
                Margin="10"
                Width="30"
                Height="30"
                Padding="3">
                <Path
                    Stretch="Uniform"
                    Fill="Black"
                    Data=" M 12 8 A 4 4 0 0 1 16 12 A 4 4 0 0 1 12 16 A 4 4 0 0 1 8 12 A 4 4 0 0 1 12 8 M 12 10 A 2 2 0 0 0 10 12 A 2 2 0 0 0 12 14 A 2 2 0 0 0 14 12 A 2 2 0 0 0 12 10 M 10 22 C 9.75 22 9.54 21.82 9.5 21.58 L 9.13 18.93 C 8.5 18.68 7.96 18.34 7.44 17.94 L 4.95 18.95 C 4.73 19.03 4.46 18.95 4.34 18.73 L 2.34 15.27 C 2.21 15.05 2.27 14.78 2.46 14.63 L 4.57 12.97 L 4.5 12 L 4.57 11 L 2.46 9.37 C 2.27 9.22 2.21 8.95 2.34 8.73 L 4.34 5.27 C 4.46 5.05 4.73 4.96 4.95 5.05 L 7.44 6.05 C 7.96 5.66 8.5 5.32 9.13 5.07 L 9.5 2.42 C 9.54 2.18 9.75 2 10 2 H 14 C 14.25 2 14.46 2.18 14.5 2.42 L 14.87 5.07 C 15.5 5.32 16.04 5.66 16.56 6.05 L 19.05 5.05 C 19.27 4.96 19.54 5.05 19.66 5.27 L 21.66 8.73 C 21.79 8.95 21.73 9.22 21.54 9.37 L 19.43 11 L 19.5 12 L 19.43 13 L 21.54 14.63 C 21.73 14.78 21.79 15.05 21.66 15.27 L 19.66 18.73 C 19.54 18.95 19.27 19.04 19.05 18.95 L 16.56 17.95 C 16.04 18.34 15.5 18.68 14.87 18.93 L 14.5 21.58 C 14.46 21.82 14.25 22 14 22 H 10 M 11.25 4 L 10.88 6.61 C 9.68 6.86 8.62 7.5 7.85 8.39 L 5.44 7.35 L 4.69 8.65 L 6.8 10.2 C 6.4 11.37 6.4 12.64 6.8 13.8 L 4.68 15.36 L 5.43 16.66 L 7.86 15.62 C 8.63 16.5 9.68 17.14 10.87 17.38 L 11.24 20 H 12.76 L 13.13 17.39 C 14.32 17.14 15.37 16.5 16.14 15.62 L 18.57 16.66 L 19.32 15.36 L 17.2 13.81 C 17.6 12.64 17.6 11.37 17.2 10.2 L 19.31 8.65 L 18.56 7.35 L 16.15 8.39 C 15.38 7.5 14.32 6.86 13.12 6.62 L 12.75 4 H 11.25 Z" />
            </Button>
        </Grid>
    </Border>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="800"

Height="600"

Title="TestProject"

ResizeMode="NoResize"

Background="Transparent"

WindowStyle="None"

AllowsTransparency="True">

<WindowChrome.WindowChrome>

<WindowChrome

ResizeBorderThickness="0"

CaptionHeight="0" />

</WindowChrome.WindowChrome>

<Border

Margin="10"

CornerRadius="10"

Background="White">

<Border.Effect>

<DropShadowEffect

BlurRadius="15"

Direction="-90"

RenderingBias="Quality"

ShadowDepth="2" />

</Border.Effect>

<Grid>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Grid Grid.Row="0"

Background="Transparent">

<StackPanel

HorizontalAlignment="Right"

Margin="0 10 10 0"

Orientation="Horizontal">

<Button Name="minimizeButton"

Width="30"

Height="30">

<Path

StrokeThickness="2"

Stroke="Black"

Data="M 0 8 H 10" />

</Button>

<Button Name="maximizeButton"

Width="30"

Height="30">

<Path

StrokeThickness="2"

Stroke="Black"

Data="M 0 0 H 10 V 10 H 0 Z" />

</Button>

<Button Name="closeButton"

Width="30"

Height="30">

<Path

StrokeThickness="2"

Stroke="Black"

Data="M 0 0 L 10 10 M 0 10 L 10 0" />

</Button>

</StackPanel>

</Grid>

<Ellipse

HorizontalAlignment="Center"

VerticalAlignment="Center"

Width="200"

Height="200"

Fill="Gold" />

</Grid>

<Grid Name="bottomGrid" Grid.Row="2"

Height="0"

Background="#e0e0e0">

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center"

Text="Sliding Panel Content" />

</Grid>

<Button Name="settingButton" Grid.Row="1"

VerticalAlignment="Bottom"

HorizontalAlignment="Left"

Margin="10"

Width="30"

Height="30"

Padding="3">

<Path

Stretch="Uniform"

Fill="Black"

</Button>

</Grid>

</Border>

</Window>

[C#/WPF/.NET8] DoubleAnimation 클래스 : 윈도우 하단 마우스 위치시 하단 패널 표시 애니메이션 만들기

■ DoubleAnimation 클래스를 사용해 윈도우 하단에 마우스 위치시 하단 패널을 표시하는 애니메이션을 만드는 방법을 보여준다. ▶ MainPage.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Height="600"
    Width="800"
    Title="TestProject"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Grid Name="contentGrid"
        Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"    />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Border Name="bottomGrid" Grid.Row="1"
            Height="0"
            Background="#e0e0e0">
            <TextBlock
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                Text="Sliding Panel Content" />
        </Border>
    </Grid>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Height="600"

Width="800"

Title="TestProject"

FontFamily="나눔고딕코딩"

FontSize="16">

<Grid Name="contentGrid"

Background="White">

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Border Name="bottomGrid" Grid.Row="1"

Height="0"

Background="#e0e0e0">

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center"

Text="Sliding Panel Content" />

</Border>

</Grid>

</Window>

▶ MainPage.xaml.cs


using System;
using System.Windows;
using System.Windows.Input;
using System.Windows.Media.Animation;

namespace TestProject;

/// <summary>
/// 메인 윈도우
/// </summary>
public partial class MainWindow : Window
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Field
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region Field

    /// <summary>
    /// 하단 그리드 표시 여부
    /// </summary>
    private bool isBottomGridVisible = false;

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainWindow()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainWindow()
    {
        InitializeComponent();

        this.contentGrid.MouseMove += contentGrid_MouseMove;
        this.bottomGrid.MouseLeave += bottomGrid_MouseLeave;
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private
    //////////////////////////////////////////////////////////////////////////////// Event

    #region 컨텐트 그리드 마우스 이동시 처리하기 - contentGrid_MouseMove(sender, e)

    /// <summary>
    /// 컨텐트 그리드 마우스 이동시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void contentGrid_MouseMove(object sender, MouseEventArgs e)
    {
        Point mousePoint = e.GetPosition(this);

        if(mousePoint.Y > this.contentGrid.ActualHeight - 30)
        {
            if(!this.isBottomGridVisible)
            {
                ShowBottomGrid();
            }
        }
    }

    #endregion
    #region 하단 그리드 마우스 이탈시 처리하기 - bottomGrid_MouseLeave(sender, e)

    /// <summary>
    /// 하단 그리드 마우스 이탈시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void bottomGrid_MouseLeave(object sender, MouseEventArgs e)
    {
        if(this.isBottomGridVisible)
        {
            HideBottomGrid();
        }
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////// Function

    #region 하단 그리드 표시하기 - ShowBottomGrid()

    /// <summary>
    /// 하단 그리드 표시하기
    /// </summary>
    private void ShowBottomGrid()
    {
        DoubleAnimation doubleAnimation = new DoubleAnimation(100, TimeSpan.FromSeconds(0.3));

        this.bottomGrid.BeginAnimation(HeightProperty, doubleAnimation);

        this.isBottomGridVisible = true;
    }

    #endregion
    #region 하단 그리드 숨기기 - HideBottomGrid()

    /// <summary>
    /// 하단 그리드 숨기기
    /// </summary>
    private void HideBottomGrid()
    {
        DoubleAnimation doubleAnimation = new DoubleAnimation(0, TimeSpan.FromSeconds(0.3));

        this.bottomGrid.BeginAnimation(HeightProperty, doubleAnimation);

        this.isBottomGridVisible = false;
    }

    #endregion
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

using System;

using System.Windows;

using System.Windows.Input;

using System.Windows.Media.Animation;

namespace TestProject;

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 하단 그리드 표시 여부

/// </summary>

private bool isBottomGridVisible = false;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

this.contentGrid.MouseMove += contentGrid_MouseMove;

this.bottomGrid.MouseLeave += bottomGrid_MouseLeave;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region 컨텐트 그리드 마우스 이동시 처리하기 - contentGrid_MouseMove(sender, e)

/// <summary>

/// 컨텐트 그리드 마우스 이동시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void contentGrid_MouseMove(object sender, MouseEventArgs e)

{

Point mousePoint = e.GetPosition(this);

if(mousePoint.Y > this.contentGrid.ActualHeight - 30)

{

if(!this.isBottomGridVisible)

{

ShowBottomGrid();

}

#endregion

#region 하단 그리드 마우스 이탈시 처리하기 - bottomGrid_MouseLeave(sender, e)

/// <summary>

/// 하단 그리드 마우스 이탈시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void bottomGrid_MouseLeave(object sender, MouseEventArgs e)

{

if(this.isBottomGridVisible)

{

HideBottomGrid();

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 하단 그리드 표시하기 - ShowBottomGrid()

/// <summary>

/// 하단 그리드 표시하기

/// </summary>

private void ShowBottomGrid()

{

DoubleAnimation doubleAnimation = new DoubleAnimation(100, TimeSpan.FromSeconds(0.3));

this.bottomGrid.BeginAnimation(HeightProperty, doubleAnimation);

this.isBottomGridVisible = true;

}

#endregion

#region 하단 그리드 숨기기 - HideBottomGrid()

/// <summary>

/// 하단 그리드 숨기기

/// </summary>

private void HideBottomGrid()

{

DoubleAnimation doubleAnimation = new DoubleAnimation(0, TimeSpan.FromSeconds(0.3));

this.bottomGrid.BeginAnimation(HeightProperty, doubleAnimation);

this.isBottomGridVisible = false;

}

#endregion

}

TestProject.zip

[C#/WPF/.NET8] LinearGradientBrush 엘리먼트 : 반투명 유리 패널 만들기

■ LinearGradientBrush 엘리먼트를 사용해 반투명 유리 패널을 만드는 방법을 보여준다. ▶ MainPage.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="TestProject"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Grid>
        <Image
            Stretch="UniformToFill"
            Source="IMAGE/sample.jpg" />
        <Border
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            Width="400"
            Height="400">
            <Border.Background>
                <LinearGradientBrush
                    StartPoint="0 0"
                    EndPoint="1 1"
                    Opacity="0.75">
                    <LinearGradientBrush.GradientStops>
                        <GradientStop Color="WhiteSmoke"  Offset="0.2"  />
                        <GradientStop Color="Transparent" Offset="0.4"  />
                        <GradientStop Color="WhiteSmoke"  Offset="0.5"  />
                        <GradientStop Color="Transparent" Offset="0.75" />
                        <GradientStop Color="WhiteSmoke"  Offset="0.9"  />
                        <GradientStop Color="Transparent" Offset="1"    />
                    </LinearGradientBrush.GradientStops>
                </LinearGradientBrush>
            </Border.Background>
            <TextBlock
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                Margin="10"
                TextWrapping="Wrap"
                xml:space="preserve">
일본 도쿄 서쪽 수도권 지역인 가나가와현에서 9일 오후 규모 5.3의 지진이 발생했다.

일본 기상청에 따르면 이날 오후 7시 57분경 가나가와현 서쪽 지역에서 발생한 지진으로 가나가와현 일부 지역에서는 '진도5'의 흔들림이 감지됐다. 도쿄 일부 지역에서도 진도 4의 흔들림이 감지됐다고 전해졌다.

일본 기상청 지진 등급인 '진도'는 절대 강도를 의미하는 규모와는 달리 해당 지역에 있는 사람의 느낌이나 주변 물체 등의 흔들림 정도를 0∼7의 수치로 나타낸 상대적 개념이다.

진도5는 대부분의 사람이 공포를 느끼고 선반에 있는 식기나 책장의 책이 떨어지기도 하는 수준이다.

가나가와현 야마토시에 거주 중인 교민 이모 씨는 집에 있다가 지진으로 인한 흔들림이 느껴져 깜짝 놀랐다고 전했다.
            </TextBlock>
        </Border>
    </Grid>
</Window>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="800"

Height="600"

Title="TestProject"

FontFamily="나눔고딕코딩"

FontSize="16">

<Grid>

<Image

Stretch="UniformToFill"

Source="IMAGE/sample.jpg" />

<Border

HorizontalAlignment="Center"

VerticalAlignment="Center"

Width="400"

Height="400">

<Border.Background>

<LinearGradientBrush

StartPoint="0 0"

EndPoint="1 1"

Opacity="0.75">

<LinearGradientBrush.GradientStops>

</LinearGradientBrush.GradientStops>

</LinearGradientBrush>

</Border.Background>

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center"

Margin="10"

TextWrapping="Wrap"

xml:space="preserve">

일본 도쿄 서쪽 수도권 지역인 가나가와현에서 9일 오후 규모 5.3의 지진이 발생했다.

일본 기상청에 따르면 이날 오후 7시 57분경 가나가와현 서쪽 지역에서 발생한 지진으로 가나가와현 일부 지역에서는 '진도5'의 흔들림이 감지됐다. 도쿄 일부 지역에서도 진도 4의 흔들림이 감지됐다고 전해졌다.

일본 기상청 지진 등급인 '진도'는 절대 강도를 의미하는 규모와는 달리 해당 지역에 있는 사람의 느낌이나 주변 물체 등의 흔들림 정도를 0∼7의 수치로 나타낸 상대적 개념이다.

진도5는 대부분의 사람이 공포를 느끼고 선반에 있는 식기나 책장의 책이 떨어지기도 하는 수준이다.

가나가와현 야마토시에 거주 중인 교민 이모 씨는 집에 있다가 지진으로 인한 흔들림이 느껴져 깜짝 놀랐다고 전했다.

</TextBlock>

</Border>

</Grid>

</Window>

TestProject.zip

[C#/WPF/.NET8] Image 클래스 : BitmapSource 객체 구하기

■ Image 클래스에서 BitmapSource 객체를 구하는 방법을 보여준다. ▶ Image 클래스 : BitmapSource 객체 구하기 예제 (C#)


using System.Windows.Controls;
using System.Windows.Media.Imaging;

// ...

Image image;

// ...

BitmapSource bitmapSource = GetBitmapSource(image);

using System.Windows.Controls;

using System.Windows.Media.Imaging;

// ...

Image image;

// ...

BitmapSource bitmapSource = GetBitmapSource(image);

▶ Image 클래스 :

[C#/WINUI3/.NET8] Compositor 클래스 : 사각형 그림자 효과 그리기

■ Compositor 클래스를 사용해 사각형에 그림자 효과를 그리는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8"?>
<Page x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mgcux="using:Microsoft.Graphics.Canvas.UI.Xaml"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Grid Name="grid" />
</Page>

<?xml version="1.0" encoding="utf-8"?>

<Page x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:mgcux="using:Microsoft.Graphics.Canvas.UI.Xaml"

Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"

FontFamily="나눔고딕코딩"

FontSize="16">

</Page>

▶ MainPage.xaml.cs


using System.Numerics;

using Microsoft.UI;
using Microsoft.UI.Composition;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Hosting;

namespace TestProject;

/// <summary>
/// 메인 페이지
/// </summary>
public sealed partial class MainPage : Page
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainPage()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainPage()
    {
        this.InitializeComponent();

        Visual gridVisual = ElementCompositionPreview.GetElementVisual(this.grid);

        Compositor compositor = gridVisual.Compositor;

        CompositionColorBrush compositionColorBrush = compositor.CreateColorBrush(Colors.Blue);

        DropShadow dropShadow = compositor.CreateDropShadow();

        dropShadow.BlurRadius = 15.0f;
        dropShadow.Offset     = new Vector3(10, 10, 0);
        dropShadow.Color      = Colors.Black;

        SpriteVisual spriteVisual = compositor.CreateSpriteVisual();

        spriteVisual.Size   = new Vector2(200, 200);
        spriteVisual.Offset = new Vector3(100, 100, 0);
        spriteVisual.Brush  = compositionColorBrush;
        spriteVisual.Shadow = dropShadow;

        ContainerVisual containerVisual = compositor.CreateContainerVisual();

        containerVisual.Children.InsertAtTop(spriteVisual);

        ElementCompositionPreview.SetElementChildVisual(this.grid, containerVisual);
    }

    #endregion
}

using System.Numerics;

using Microsoft.UI;

using Microsoft.UI.Composition;

using Microsoft.UI.Xaml.Controls;

using Microsoft.UI.Xaml.Hosting;

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public sealed partial class MainPage : Page

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

this.InitializeComponent();

Visual gridVisual = ElementCompositionPreview.GetElementVisual(this.grid);

Compositor compositor = gridVisual.Compositor;

CompositionColorBrush compositionColorBrush = compositor.CreateColorBrush(Colors.Blue);

DropShadow dropShadow = compositor.CreateDropShadow();

dropShadow.BlurRadius = 15.0f;

dropShadow.Offset = new Vector3(10, 10, 0);

dropShadow.Color = Colors.Black;

SpriteVisual spriteVisual = compositor.CreateSpriteVisual();

spriteVisual.Size = new Vector2(200, 200);

spriteVisual.Offset = new Vector3(100, 100, 0);

spriteVisual.Brush = compositionColorBrush;

spriteVisual.Shadow = dropShadow;

ContainerVisual containerVisual = compositor.CreateContainerVisual();

containerVisual.Children.InsertAtTop(spriteVisual);

ElementCompositionPreview.SetElementChildVisual(this.grid, containerVisual);

}

#endregion

}

TestProject.zip

[C#/WINUI3/.NET8] ContainerVisual 클래스 : Children 속성에서 VisualCollection 객체의 InsertAtTop 메소드를 사용해 자식 비주얼 제일 앞에 추가하기

■ ContainerVisual 클래스의 Children 속성에서 VisualCollection 객체의 InsertAtTop 메소드를 사용해 자식 비주얼을 제일 앞에 추가하는 방법을 보여준다. ▶ 예제 코드 (C#)


using System.Numerics;

using Microsoft.UI;
using Microsoft.UI.Composition;
using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

CompositionColorBrush compositionColorBrush = compositor.CreateColorBrush(Colors.Blue);

DropShadow dropShadow = compositor.CreateDropShadow();

dropShadow.BlurRadius = 15.0f;
dropShadow.Offset     = new Vector3(10, 10, 0);
dropShadow.Color      = Colors.Black;

SpriteVisual spriteVisual = compositor.CreateSpriteVisual();

spriteVisual.Size   = new Vector2(200, 200);
spriteVisual.Offset = new Vector3(100, 100, 0);
spriteVisual.Brush  = compositionColorBrush;
spriteVisual.Shadow = dropShadow;

ContainerVisual containerVisual = compositor.CreateContainerVisual();

containerVisual.Children.InsertAtTop(spriteVisual);

ElementCompositionPreview.SetElementChildVisual(this.grid, containerVisual);

using System.Numerics;

using Microsoft.UI;

using Microsoft.UI.Composition;

using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

CompositionColorBrush compositionColorBrush = compositor.CreateColorBrush(Colors.Blue);

DropShadow dropShadow = compositor.CreateDropShadow();

dropShadow.BlurRadius = 15.0f;

dropShadow.Offset = new Vector3(10, 10, 0);

dropShadow.Color = Colors.Black;

SpriteVisual spriteVisual = compositor.CreateSpriteVisual();

spriteVisual.Size = new Vector2(200, 200);

spriteVisual.Offset = new Vector3(100, 100, 0);

spriteVisual.Brush = compositionColorBrush;

spriteVisual.Shadow = dropShadow;

ContainerVisual containerVisual = compositor.CreateContainerVisual();

containerVisual.Children.InsertAtTop(spriteVisual);

ElementCompositionPreview.SetElementChildVisual(this.grid, containerVisual);

[C#/WINUI3/.NET8] DropShadow 클래스 : BlurRadius/Offset/Color 속성 사용하기

■ DropShadow 클래스의 BlurRadius/Offset/Color 속성을 사용하는 방법을 보여준다. ▶ 예제 코드 (C#)


using Microsoft.UI;
using Microsoft.UI.Composition;
using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

DropShadow dropShadow = compositor.CreateDropShadow();

dropShadow.BlurRadius = 15.0f;
dropShadow.Offset     = new Vector3(10, 10, 0);
dropShadow.Color      = Colors.Black;

using Microsoft.UI;

using Microsoft.UI.Composition;

using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

DropShadow dropShadow = compositor.CreateDropShadow();

dropShadow.BlurRadius = 15.0f;

dropShadow.Offset = new Vector3(10, 10, 0);

dropShadow.Color = Colors.Black;

[C#/WINUI3/.NET8] Compositor 클래스 : CreateDropShadow 메소드를 사용해 DropShadow 객체 만들기

■ Compositor 클래스의 CreateDropShadow 메소드를 사용해 DropShadow 객체를 만드는 방법을 보여준다. ▶ 예제 코드 (C#)


using Microsoft.UI.Composition;
using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

DropShadow dropShadow = compositor.CreateDropShadow();

using Microsoft.UI.Composition;

using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

DropShadow dropShadow = compositor.CreateDropShadow();

[C#/WINUI3/.NET8] Compositor 클래스 : CreateColorBrush 메소드를 사용해 CompositionColorBrush 객체 만들기

■ Compositor 클래스의 CreateColorBrush 메소드를 사용해 CompositionColorBrush 객체를 만드는 방법을 보여준다. ▶ 예제 코드 (C#)


using System.Numerics;

using Microsoft.UI;
using Microsoft.UI.Composition;
using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

CompositionColorBrush compositionColorBrush = compositor.CreateColorBrush(Colors.Blue);

using System.Numerics;

using Microsoft.UI;

using Microsoft.UI.Composition;

using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

CompositionColorBrush compositionColorBrush = compositor.CreateColorBrush(Colors.Blue);

[C#/WINUI3/.NET8] SpriteVisual 클래스 : Size/Offset/Brush/Shadow 속성 사용하기

■ SpriteVisual 클래스의 Size/Offset/Brush/Shadow 속성을 사용하는 방법을 보여준다. ▶ 예제 코드 (C#)


using System.Numerics;

using Microsoft.UI;
using Microsoft.UI.Composition;
using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(this.grid);

Compositor compositor = gridVisual.Compositor;

CompositionColorBrush compositionColorBrush = compositor.CreateColorBrush(Colors.Blue);

DropShadow dropShadow = compositor.CreateDropShadow();

dropShadow.BlurRadius = 15.0f;
dropShadow.Offset     = new Vector3(10, 10, 0);
dropShadow.Color      = Colors.Black;

SpriteVisual spriteVisual = compositor.CreateSpriteVisual();

spriteVisual.Size   = new Vector2(200, 200);
spriteVisual.Offset = new Vector3(100, 100, 0);
spriteVisual.Brush  = compositionColorBrush;
spriteVisual.Shadow = dropShadow;

using System.Numerics;

using Microsoft.UI;

using Microsoft.UI.Composition;

using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(this.grid);

Compositor compositor = gridVisual.Compositor;

CompositionColorBrush compositionColorBrush = compositor.CreateColorBrush(Colors.Blue);

DropShadow dropShadow = compositor.CreateDropShadow();

dropShadow.BlurRadius = 15.0f;

dropShadow.Offset = new Vector3(10, 10, 0);

dropShadow.Color = Colors.Black;

SpriteVisual spriteVisual = compositor.CreateSpriteVisual();

spriteVisual.Size = new Vector2(200, 200);

spriteVisual.Offset = new Vector3(100, 100, 0);

spriteVisual.Brush = compositionColorBrush;

spriteVisual.Shadow = dropShadow;

[C#/WINUI3/.NET8] Compositor 클래스 : CreateContainerVisual 메소드를 사용해 ContainerVisual 객체 만들기

■ Compositor 클래스의 CreateContainerVisual 메소드를 사용해 ContainerVisual 객체를 만드는 방법을 보여준다. ▶ 예제 코드 (C#)


using Microsoft.UI.Composition;
using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(this.grid);

Compositor compositor = gridVisual.Compositor;

ContainerVisual containerVisual = compositor.CreateContainerVisual();

using Microsoft.UI.Composition;

using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(this.grid);

Compositor compositor = gridVisual.Compositor;

ContainerVisual containerVisual = compositor.CreateContainerVisual();

[C#/WINUI3/.NET8] CanvasControl 클래스 : Draw 이벤트를 사용해 그림자 효과 그리기

■ CanvasControl 클래스의 Draw 이벤트를 사용해 그림자 효과를 그리는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType

[C#/WINUI3/.NET8] IconSourceElement 엘리먼트 : IconSource 속성에서 FontIconSource 엘리먼트 설정해 폰트 아이콘 표시하기

■ IconSourceElement 엘리먼트의 IconSource 속성에서 FontIconSource 엘리먼트를 설정해 폰트 아이콘을 표시하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트

[C#/WINUI3/.NET8] SymbolIcon 엘리먼트 : Symbol 속성을 사용해 심볼 아이콘 표시하기

■ SymbolIcon 엘리먼트의 Symbol 속성을 사용해 심볼 아이콘을 표시하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType

[C#/WINUI3/.NET8] Button 엘리먼트 : FontFamily/Content 속성을 사용해 아이콘 표시하기

■ Button 엘리먼트의 FontFamily/Content 속성을 사용해 아이콘을 표시하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType 태그를

[C#/WINUI3/.NET8] Compositor 클래스 : 화면 배경 브러시 애니메이션 만들기

■ Compositor 클래스를 사용해 화면 배경의 브러시 애니메이션을 만드는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType

[C#/WINUI3/.NET8] CompositionColorGradientStop 클래스 : StartAnimation 메소드를 사용해 브러시 애니메이션 시작하기

■ CompositionColorGradientStop 클래스의 StartAnimation 메소드를 사용해 브러시 애니메이션을 시작하는 방법을 보여준다. ▶ 예제 코드 (C#)


using System;
using System.Numerics;

using Microsoft.UI;
using Microsoft.UI.Composition;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid = null;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

SpriteVisual spriteVisual = compositor.CreateSpriteVisual();

spriteVisual.Size = new Vector2((float)grid.ActualWidth, (float)grid.ActualHeight);

ElementCompositionPreview.SetElementChildVisual(grid, spriteVisual);

CompositionLinearGradientBrush compositionLinearGradientBrush = compositor.CreateLinearGradientBrush();

compositionLinearGradientBrush.StartPoint = new Vector2(0, 0);
compositionLinearGradientBrush.EndPoint   = new Vector2(1, 1);

CompositionColorGradientStop compositionColorGradientStop1 = compositor.CreateColorGradientStop(0.0f, Colors.Transparent);
CompositionColorGradientStop compositionColorGradientStop2 = compositor.CreateColorGradientStop(1.0f, Colors.Blue       );

compositionLinearGradientBrush.ColorStops.Add(compositionColorGradientStop1);
compositionLinearGradientBrush.ColorStops.Add(compositionColorGradientStop2);

spriteVisual.Brush = compositionLinearGradientBrush;

ScalarKeyFrameAnimation offsetScalarKeyFrameAnimation = compositor.CreateScalarKeyFrameAnimation();

offsetScalarKeyFrameAnimation.InsertKeyFrame(0.0f, -1.0f);
offsetScalarKeyFrameAnimation.InsertKeyFrame(1.0f,  1.0f);

offsetScalarKeyFrameAnimation.IterationBehavior = AnimationIterationBehavior.Forever;
offsetScalarKeyFrameAnimation.Duration          = TimeSpan.FromSeconds(1.5);

compositionColorGradientStop1.StartAnimation("Offset", offsetScalarKeyFrameAnimation);
compositionColorGradientStop2.StartAnimation("Offset", offsetScalarKeyFrameAnimation);

using System;

using System.Numerics;

using Microsoft.UI;

using Microsoft.UI.Composition;

using Microsoft.UI.Xaml.Controls;

using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid = null;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

SpriteVisual spriteVisual = compositor.CreateSpriteVisual();

spriteVisual.Size = new Vector2((float)grid.ActualWidth, (float)grid.ActualHeight);

ElementCompositionPreview.SetElementChildVisual(grid, spriteVisual);

CompositionLinearGradientBrush compositionLinearGradientBrush = compositor.CreateLinearGradientBrush();

compositionLinearGradientBrush.StartPoint = new Vector2(0, 0);

compositionLinearGradientBrush.EndPoint = new Vector2(1, 1);

CompositionColorGradientStop compositionColorGradientStop1 = compositor.CreateColorGradientStop(0.0f, Colors.Transparent);

CompositionColorGradientStop compositionColorGradientStop2 = compositor.CreateColorGradientStop(1.0f, Colors.Blue );

compositionLinearGradientBrush.ColorStops.Add(compositionColorGradientStop1);

compositionLinearGradientBrush.ColorStops.Add(compositionColorGradientStop2);

spriteVisual.Brush = compositionLinearGradientBrush;

ScalarKeyFrameAnimation offsetScalarKeyFrameAnimation = compositor.CreateScalarKeyFrameAnimation();

offsetScalarKeyFrameAnimation.InsertKeyFrame(0.0f, -1.0f);

offsetScalarKeyFrameAnimation.InsertKeyFrame(1.0f, 1.0f);

offsetScalarKeyFrameAnimation.IterationBehavior = AnimationIterationBehavior.Forever;

offsetScalarKeyFrameAnimation.Duration = TimeSpan.FromSeconds(1.5);

compositionColorGradientStop1.StartAnimation("Offset", offsetScalarKeyFrameAnimation);

compositionColorGradientStop2.StartAnimation("Offset", offsetScalarKeyFrameAnimation);

[C#/WINUI3/.NET8] Compositor 클래스 : CreateLinearGradientBrush 메소드를 사용해 CompositionLinearGradientBrush 객체 만들기

■ Compositor 클래스의 CreateLinearGradientBrush 메소드를 사용해 CompositionLinearGradientBrush 객체를 만드는 방법을 보여준다. ▶ 예제 코드 (C#)


using System.Numerics;

using Microsoft.UI;
using Microsoft.UI.Composition;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Hosting;

// ...

Grid grid;

// ...

Visual gridVisual = ElementCompositionPreview.GetElementVisual(grid);

Compositor compositor = gridVisual.Compositor;

SpriteVisual spriteVisual = compositor.CreateSpriteVisual();

spriteVisual.Size = new Vector2((float)grid.ActualWidth, (float)grid.ActualHeight);

ElementCompositionPreview.SetElementChildVisual(grid, spriteVisual);

CompositionLinearGradientBrush compositionLinearGradientBrush = compositor.CreateLinearGradientBrush();

compositionLinearGradientBrush.StartPoint = new Vector2(0, 0);
compositionLinearGradientBrush.EndPoint   = new Vector2(1, 1);

CompositionColorGradientStop compositionColorGradientStop1 = compositor.CreateColorGradientStop(0.0f, Colors.Transparent);
CompositionColorGradientStop compositionColorGradientStop2 = compositor.CreateColorGradientStop(1.0f, Colors.Blue       );

compositionLinearGradientBrush.ColorStops.Add(compositionColorGradientStop1);
compositionLinearGradientBrush.ColorStops.Add(compositionColorGradientStop2);

spriteVisual.Brush = compositionLinearGradientBrush;