显示覆盖有纯色的图片 [英] Reveal a picture covered with a solid color

问题描述

我试图建立一个应用程序，揭示了最初覆盖一个纯色（黑色）的图片。这个想法是，当我点击黑色屏幕上的某个地方（最初）在黑色像素周围的圆形区域时，我点击为透明，所以我可以看到背后的图像。

I'm trying to build an application that reveals a picture covered initially with a solid color(black). The idea is that when I click somewhere on that black screen (initially) a circular area around the black pixel I clicked to be made transparent so I can see the image behind.

我想出的解决方案是使用一个帆布与我想覆盖的图片设置为背景。黑色盖子将被划分为像素（存储在矩阵上 - 图像将最大为500x500）。所有这些像素将首先被着色为黑色，然后，知道用户点击的像素使透明（或删除）该像素周围的所有像素，直到我清除了具有预设直径的圆形区域。

The solution that I came up with is to use a canvas with the picture I want covered set as background. The black cover will be divided in pixels (stored on a matrix perhaps - the image will be maximum 500x500). All those pixels will be colored black initially and then, knowing the pixel the user clicks make transparent (or delete) all pixels around that one until I clear a circular area with a preset diameter.

我没有太多的画布经验，这个解决方案对我来说很粗糙。我想要问第二个意见，或者如果有人可以给我一个更好的解决方案。

I don't have much experience with canvases and this solution seems quite rough to me. I wanted ask a second opinion, or if someone can give me a better solution

我正在开发Silverlight中的应用程序，如果相关。

I'm developing the app in Silverlight, if that's relevant.

谢谢！

推荐答案

过了一段时间后， 。夹。这里有一个例子，如果有人喜欢我需要它：

After some time I spend reading about silverlight controls I ended up using Image.Clip. Here's an example in case somebody like me needs it:

  <Image Source="Images/img.jpg" Width="150" Height="150" Canvas.Left="30" Canvas.Top="19">                                                
            <Image.Clip>
                <GeometryGroup FillRule="Nonzero">
                    <EllipseGeometry RadiusX="20" RadiusY="20" Center="100,100"></EllipseGeometry>
                    <EllipseGeometry RadiusX="20" RadiusY="20" Center="80,100"></EllipseGeometry>
                    <EllipseGeometry RadiusX="20" RadiusY="20" Center="80,83"></EllipseGeometry>                        
                    <EllipseGeometry RadiusX="20" RadiusY="20" Center="60,60"></EllipseGeometry>
                </GeometryGroup>
            </Image.Clip>
        </Image>    

当然，椭圆可以编程。

Of course, ellipses can be placed programmatic.

这篇关于显示覆盖有纯色的图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！