Next we will complete a more common effect-Mosaic. The mosaic of an image uses the color of the same vertex to represent an area of considerable size. It can be regarded as a large-scale reduction of the image resolution, while hiding some details of the image.
Use HLSLCodeImplementationMosaic is very simple. However, some additional steps are also required.
The first step is to convert the texture coordinate to the integer coordinate of the actual image size. Next, we need to quantify the coordinates of the image. For example, the size of the mosaic block is 8x8 pixels. Then we can use the following method to obtain the sample value of the mosaic image. Suppose [x. y] is the integer coordinate of the image:
[X, y] mosaic = [int (X/8) * 8, INT (y/8) * 8].
After obtaining the coordinates, you only need to use the opposite method to convert the integer coordinates to the texture coordinates of 0-1.0.
The specific mosaic effect code is as follows:
The result of the image processed by the shader is as follows:
Figure: Mosaic processing effect
Readers may find that this mosaic is too common and is indeed not novel enough. Next, let's improve it. We hope to achieve this effect: the mosaic area is not square, but circle. Outside the circular area, it is still covered by the original color of the image. In this case, you need to change the code.
First, find the center of the original mosaic area (originally in the upper left corner): then calculate the distance from the image sampling point to the center. If it is within the mosaic circle, use the central color of the area, otherwise, the original color is used. The improved code is as follows. Here, the size of the mosaic area is adjusted to 16x16. The effect is more obvious.
This code is a little more complex than the above Code, and adds a branch if/else. Note that the GPU is a highly parallel processor, and too many branches will reduce the shader running speed. The improved mosaic effect is as follows:
Figure: improved mosaic Effect