WPF 用Clip屬性實作蒙闆特效

原文:

WPF 用Clip屬性實作蒙闆特效

上一篇，已簡單介紹Clip屬性的用法，這一篇用它來實作簡單蒙闆功能，很簡單，直接上代碼

<Window x:Class="擦除效果.MainWindow"

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

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

        Title="MainWindow" Height="537" Width="866" MouseMove="canvas_MouseMove" MouseDown="Window_MouseDown" MouseUp="Window_MouseUp">

    <Grid>

        <Rectangle Height="100" HorizontalAlignment="Left" Margin="164,92,0,0" Name="rectangle1" Stroke="Black" VerticalAlignment="Top" Width="200" Fill="Lime" />

        <Button Content="Button" Height="83" HorizontalAlignment="Left" Margin="526,109,0,0" Name="button1" VerticalAlignment="Top" Width="115" Click="button1_Click" />

        <Grid x:Name="grid"  Background="#88FFFFFF" ></Grid>

    </Grid>

    <Window.Background>

        <ImageBrush ImageSource="/擦除效果;component/Images/s01.jpg" />

    </Window.Background>

</Window>

背景：

    public partial class MainWindow : Window

    {

        private bool isDown = false;

        public MainWindow()

        {

            InitializeComponent();

            RectangleGeometry rg = new RectangleGeometry();

            rg.Rect = new Rect(0, 0, this.Width, this.Height);

            gridGeometry = Geometry.Combine(gridGeometry, rg, GeometryCombineMode.Union, null);

            grid.Clip = gridGeometry;

        }

        PathGeometry gridGeometry = new PathGeometry();

        private void canvas_MouseMove(object sender, MouseEventArgs e)

            if (isDown)

            {

                EllipseGeometry rg = new EllipseGeometry();

                rg.Center = e.GetPosition(this);

                rg.RadiusX = 50;

                rg.RadiusY = 50;

                //排除幾何圖形

                gridGeometry = Geometry.Combine(gridGeometry, rg, GeometryCombineMode.Exclude, null);

                grid.Clip = gridGeometry;

            }

        private void button1_Click(object sender, RoutedEventArgs e)

            MessageBox.Show("OK!");

        private void Window_MouseDown(object sender, MouseButtonEventArgs e)

            isDown = true;

        private void Window_MouseUp(object sender, MouseButtonEventArgs e)

            isDown = false;

    }

效果如下：

源碼