Создаем эффект размытия изображения на C#

Размытие

В этой статье мы рассмотрим, как реализовать эффект размытия поля изображения в C#.

Размытие достигается с помощью свертки изображения, концепции, которая применяется к широкому спектру фильтров изображений.

Извилина

Свертка — это линейная операция над сигналом и ядром. В этом случае сигналом является изображение, а ядром является фильтр. Более конкретно, в дискретной обработке изображений свертка является точечным произведением каждой точки в сигнале с ядром. Итак, очень простой пример:

signal: &#91;1, 2, 3, 4]
kernel: &#91;5, 6, 7]
convolution: &#91;1 * 5 + 2 * 6 + 3 * 7, 
              2 * 5 + 3 * 6 + 4 * 7, 
              3 * 5 + 4 * 6 + 0 * 7,
              4 * 5 + 0 * 6 + 0 * 7]

signal: [1, 2, 3, 4]

kernel: [5, 6, 7]

convolution: [1 * 5 + 2 * 6 + 3 * 7,

2 * 5 + 3 * 6 + 4 * 7,

3 * 5 + 4 * 6 + 0 * 7,

4 * 5 + 0 * 6 + 0 * 7]

Это очень простой пример, но он показывает основы свертки. Обратите внимание, что это требует значительного количества операций, в этом случае наш простой 4×1, спутанный с 3×1, взял 12 умножений и 8 сложений. Это будет важно учитывать. Также обратите внимание, что у края у нас заканчиваются сэмплы в сигнале, чтобы сделать свертку правильно, поэтому вычисления выполняются с 0. Нулевая прокладка является лишь одним из многих возможных способов решения этой проблемы.

Коробочное ядро

Чтобы размыть изображение, нам нужно применить 2D-свертку (так как изображения имеют ширину и высоту). Вопрос в том, как будет выглядеть ядро. С правильным ядром мы можем просто связать его с любым изображением, чтобы размыть его.

Чтобы придумать ядро, нам нужно некоторое простое понимание процесса свертки. Как описано выше, каждый пиксель является точечным произведением ядра и области вокруг этого пикселя. Другими словами, ядро будет диктовать, как один пиксель сочетается с пикселями вокруг него. Итак, вот пример ядра:

&#91;0, 0, 0]
&#91;0, 1, 0]
&#91;0, 0, 0]

[0, 0, 0]

[0, 1, 0]

[0, 0, 0]

Предположим, что ядро центрировано на каждом пикселе при его применении к изображению. Что произойдет? Абсолютно ничего. Это ядро приводит к значению, которое полностью состоит из текущего пикселя (значение 1) и ничего из соседних пикселей (значение 0). (Кстати, это ядро называется дельта).

Теперь давайте посмотрим на другое ядро:

&#91;0,  0,   0 ]
&#91;0, 0.5, 0.5]
&#91;0,  0,   0 ]

[0, 0, 0 ]

[0, 0.5, 0.5]

[0, 0, 0 ]

Потратьте секунду, чтобы подумать об этом. В этом случае результирующий пиксель представляет собой комбинацию половины значения текущего пикселя и половины значения его правого соседа. Это размытие, потому что каждый пиксель разбросан со своим соседом.

Если мы применим аналогичное ядро к каждому пикселю, мы сделаем что-то очень похожее на усреднение значений пикселей в окрестностях. Усреднение снижает резкость общего изображения, таким образом мы получаем размытие.

Таким образом, мы, наконец, получаем ядро размытия изображения:

&#91;1/9, 1/9, 1/9]
&#91;1/9, 1/9, 1/9]
&#91;1/9, 1/9, 1/9]

[1/9, 1/9, 1/9]

Это ядро будет равномерно распределять значения каждого пикселя в изображении. Как мы контролируем количество размытий? Размер ядра. Большее ядро будет усреднять большую площадь, тем самым уменьшая резкость больше. Маленькое ядро будет размываться гораздо меньше.

Создайте проект, WinForms разместите на форме 2 pictureBox в них будет загружатся оригинальное изображение, а в другое размытое. 2 кнопки одна для загрузки изображения, другая для вывода размытия. Так же понадобится numericUpDown величина размытия.

Листинг программы ниже:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
using System.Diagnostics;

namespace Convolution
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void btnLoad_Click(object sender, EventArgs e)
        {
            using (OpenFileDialog diag = new OpenFileDialog())
            {
                diag.Filter = "Bitmap|*.bmp;*.jpg;*.gif";
                if (diag.ShowDialog() == DialogResult.OK)
                {
                    try
                    {
                        picOriginal.Image = Image.FromFile(diag.FileName);
                    }
                    catch (Exception)
                    {
                        MessageBox.Show("Invalid Image");
                    }
                }
            }
        }

        private void btnApply_Click(object sender, EventArgs e)
        {
            if (picOriginal.Image != null)
            {
                btnApply.Enabled = false;
                this.Cursor = Cursors.WaitCursor;

                picConvolved.Image = FastBoxBlur(picOriginal.Image, (int)nAmount.Value);

                this.Cursor = Cursors.Default;
                btnApply.Enabled = true;
            }
        }

        private Bitmap Convolve(Bitmap input, float[,] filter)
        {
            //Найти центр фильтра
            int xMiddle = (int)Math.Floor(filter.GetLength(0) / 2.0);
            int yMiddle = (int)Math.Floor(filter.GetLength(1) / 2.0);

            //Создать новый образ
            Bitmap output = new Bitmap(input.Width, input.Height);

            FastBitmap reader = new FastBitmap(input);
            FastBitmap writer = new FastBitmap(output);
            reader.LockImage();
            writer.LockImage();

            for (int x = 0; x < input.Width; x++)
            {
                for (int y = 0; y < input.Height; y++)
                {
                    float r = 0;
                    float g = 0;
                    float b = 0;

                    //Применить фильтр
                    for (int xFilter = 0; xFilter < filter.GetLength(0); xFilter++)
                    {
                        for (int yFilter = 0; yFilter < filter.GetLength(1); yFilter++)
                        {
                            int x0 = x - xMiddle + xFilter;
                            int y0 = y - yMiddle + yFilter;

                            //Только если в границах
                            if (x0 >= 0 && x0 < input.Width &&
                                y0 >= 0 && y0 < input.Height)
                            {
                                Color clr = reader.GetPixel(x0, y0);

                                r += clr.R * filter[xFilter, yFilter];
                                g += clr.G * filter[xFilter, yFilter];
                                b += clr.B * filter[xFilter, yFilter];
                            }
                        }
                    }

                    //Нормализовать (основной)
                    if (r > 255)
                        r = 255;
                    if (g > 255)
                        g = 255;
                    if (b > 255)
                        b = 255;

                    if (r < 0)
                        r = 0;
                    if (g < 0)
                        g = 0;
                    if (b < 0)
                        b = 0;

                    //Установка пикселя
                    writer.SetPixel(x, y, Color.FromArgb((int)r, (int)g, (int)b));
                }
            }

            reader.UnlockImage();
            writer.UnlockImage();

            return output;
        }

        /// <summary>
        /// Возвращает ядро 1D с фильтром в формате {1,..,n}
        /// </summary>
        private float[,] GetHorizontalFilter(int size)
        {
            float[,] smallFilter = new float[size, 1];
            float constant = size;

            for (int i = 0; i < size; i++)
            {
                smallFilter[i, 0] = 1.0f / constant;
            }

            return smallFilter;
        }

        /// <summary>
        /// Возвращает ядро 1D с фильтром в формате {1},...,{n}
        /// </summary>
        private float[,] GetVerticalFilter(int size)
        {
            float[,] smallFilter = new float[1, size];
            float constant = size;

            for (int i = 0; i < size; i++)
            {
                smallFilter[0, i] = 1.0f / constant;
            }

            return smallFilter;
        }

        /// <summary>
        /// Возвращает 2D-ядро  с фильтром в формате {1,...,n},...,{1,...,n}
        /// </summary>
        private float[,] GetBoxFilter(int size)
        {
            float[,] filter = new float[size, size];
            float constant = size * size;

            for (int i = 0; i < filter.GetLength(0); i++)
            {
                for (int j = 0; j < filter.GetLength(1); j++)
                {
                    filter[i, j] = 1.0f / constant;
                }
            }

            return filter;
        }

        private Bitmap BoxBlur(Image img, int size)
        {
            //Применение фильтра путем объединения изображения с помощью 2D-ядра
            return Convolve(new Bitmap(img), GetBoxFilter(size));
        }

        private Bitmap FastBoxBlur(Image img, int size)
        {
            //Применение фильтра путем объединения изображения с помощью двух отдельных 1D-ядер (быстрее)
            return Convolve(Convolve(new Bitmap(img), GetHorizontalFilter(size)), GetVerticalFilter(size));
        }
    }
}

using System;
using System.Collections.Generic;
using System.Text;
using System.Drawing;
using System.Drawing.Imaging;

namespace Convolution
{
    unsafe public class FastBitmap
    {
        private struct PixelData
        {
            public byte blue;
            public byte green;
            public byte red;
            public byte alpha;

            public override string ToString()
            {
                return "(" + alpha.ToString() + ", " + red.ToString() + ", " + green.ToString() + ", " + blue.ToString() + ")";
            }
        }

        private Bitmap workingBitmap = null;
        private int width = 0;
        private BitmapData bitmapData = null;
        private Byte* pBase = null;

        public FastBitmap(Bitmap inputBitmap)
        {
            workingBitmap = inputBitmap;
        }

        public void LockImage()
        {
            Rectangle bounds = new Rectangle(Point.Empty, workingBitmap.Size);

            width = (int)(bounds.Width * sizeof(PixelData));
            if (width % 4 != 0) width = 4 * (width / 4 + 1);

            //Блокировка изображения
            bitmapData = workingBitmap.LockBits(bounds, ImageLockMode.ReadWrite, PixelFormat.Format32bppArgb);
            pBase = (Byte*)bitmapData.Scan0.ToPointer();
        }

        private PixelData* pixelData = null;

        public Color GetPixel(int x, int y)
        {
            pixelData = (PixelData*)(pBase + y * width + x * sizeof(PixelData));
            return Color.FromArgb(pixelData->alpha, pixelData->red, pixelData->green, pixelData->blue);
        }

        public Color GetPixelNext()
        {
            pixelData++;
            return Color.FromArgb(pixelData->alpha, pixelData->red, pixelData->green, pixelData->blue);
        }

        public void SetPixel(int x, int y, Color color)
        {
            PixelData* data = (PixelData*)(pBase + y * width + x * sizeof(PixelData));
            data->alpha = color.A;
            data->red = color.R;
            data->green = color.G;
            data->blue = color.B;
        }

        public void UnlockImage()
        {
            workingBitmap.UnlockBits(bitmapData);
            bitmapData = null;
            pBase = null;
        }
    }
}

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

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

using System;

using System.Collections.Generic;

using System.ComponentModel;

using System.Data;

using System.Drawing;

using System.Linq;

using System.Text;

using System.Windows.Forms;

using System.Diagnostics;

namespace Convolution

{

public partial class Form1 : Form

{

public Form1()

{

InitializeComponent();

}

private void btnLoad_Click(object sender, EventArgs e)

{

using (OpenFileDialog diag = new OpenFileDialog())

{

diag.Filter = "Bitmap|*.bmp;*.jpg;*.gif";

if (diag.ShowDialog() == DialogResult.OK)

{

try

{

picOriginal.Image = Image.FromFile(diag.FileName);

}

catch (Exception)

{

MessageBox.Show("Invalid Image");

}

private void btnApply_Click(object sender, EventArgs e)

{

if (picOriginal.Image != null)

{

btnApply.Enabled = false;

this.Cursor = Cursors.WaitCursor;

picConvolved.Image = FastBoxBlur(picOriginal.Image, (int)nAmount.Value);

this.Cursor = Cursors.Default;

btnApply.Enabled = true;

}

private Bitmap Convolve(Bitmap input, float[,] filter)

{

//Найти центр фильтра

int xMiddle = (int)Math.Floor(filter.GetLength(0) / 2.0);

int yMiddle = (int)Math.Floor(filter.GetLength(1) / 2.0);

//Создать новый образ

Bitmap output = new Bitmap(input.Width, input.Height);

FastBitmap reader = new FastBitmap(input);

FastBitmap writer = new FastBitmap(output);

reader.LockImage();

writer.LockImage();

for (int x = 0; x < input.Width; x++)

{

for (int y = 0; y < input.Height; y++)

{

float r = 0;

float g = 0;

float b = 0;

//Применить фильтр

for (int xFilter = 0; xFilter < filter.GetLength(0); xFilter++)

{

for (int yFilter = 0; yFilter < filter.GetLength(1); yFilter++)

{

int x0 = x - xMiddle + xFilter;

int y0 = y - yMiddle + yFilter;

//Только если в границах

if (x0 >= 0 && x0 < input.Width &&

y0 >= 0 && y0 < input.Height)

{

Color clr = reader.GetPixel(x0, y0);

r += clr.R * filter[xFilter, yFilter];

g += clr.G * filter[xFilter, yFilter];

b += clr.B * filter[xFilter, yFilter];

}

//Нормализовать (основной)

if (r > 255)

r = 255;

if (g > 255)

g = 255;

if (b > 255)

b = 255;

if (r < 0)

r = 0;

if (g < 0)

g = 0;

if (b < 0)

b = 0;

//Установка пикселя

writer.SetPixel(x, y, Color.FromArgb((int)r, (int)g, (int)b));

}

reader.UnlockImage();

writer.UnlockImage();

return output;

}

/// <summary>

/// Возвращает ядро 1D с фильтром в формате {1,..,n}

/// </summary>

private float[,] GetHorizontalFilter(int size)

{

float[,] smallFilter = new float[size, 1];

float constant = size;

for (int i = 0; i < size; i++)

{

smallFilter[i, 0] = 1.0f / constant;

}

return smallFilter;

}

/// <summary>

/// Возвращает ядро 1D с фильтром в формате {1},...,{n}

/// </summary>

private float[,] GetVerticalFilter(int size)

{

float[,] smallFilter = new float[1, size];

float constant = size;

for (int i = 0; i < size; i++)

{

smallFilter[0, i] = 1.0f / constant;

}

return smallFilter;

}

/// <summary>

/// Возвращает 2D-ядро с фильтром в формате {1,...,n},...,{1,...,n}

/// </summary>

private float[,] GetBoxFilter(int size)

{

float[,] filter = new float[size, size];

float constant = size * size;

for (int i = 0; i < filter.GetLength(0); i++)

{

for (int j = 0; j < filter.GetLength(1); j++)

{

filter[i, j] = 1.0f / constant;

}

return filter;

}

private Bitmap BoxBlur(Image img, int size)

{

//Применение фильтра путем объединения изображения с помощью 2D-ядра

return Convolve(new Bitmap(img), GetBoxFilter(size));

}

private Bitmap FastBoxBlur(Image img, int size)

{

//Применение фильтра путем объединения изображения с помощью двух отдельных 1D-ядер (быстрее)

return Convolve(Convolve(new Bitmap(img), GetHorizontalFilter(size)), GetVerticalFilter(size));

}

using System;

using System.Collections.Generic;

using System.Text;

using System.Drawing;

using System.Drawing.Imaging;

namespace Convolution

{

unsafe public class FastBitmap

{

private struct PixelData

{

public byte blue;

public byte green;

public byte red;

public byte alpha;

public override string ToString()

{

return "(" + alpha.ToString() + ", " + red.ToString() + ", " + green.ToString() + ", " + blue.ToString() + ")";

}

private Bitmap workingBitmap = null;

private int width = 0;

private BitmapData bitmapData = null;

private Byte* pBase = null;

public FastBitmap(Bitmap inputBitmap)

{

workingBitmap = inputBitmap;

}

public void LockImage()

{

Rectangle bounds = new Rectangle(Point.Empty, workingBitmap.Size);

width = (int)(bounds.Width * sizeof(PixelData));

if (width % 4 != 0) width = 4 * (width / 4 + 1);

//Блокировка изображения

bitmapData = workingBitmap.LockBits(bounds, ImageLockMode.ReadWrite, PixelFormat.Format32bppArgb);

pBase = (Byte*)bitmapData.Scan0.ToPointer();

}

private PixelData* pixelData = null;

public Color GetPixel(int x, int y)

{

pixelData = (PixelData*)(pBase + y * width + x * sizeof(PixelData));

return Color.FromArgb(pixelData->alpha, pixelData->red, pixelData->green, pixelData->blue);

}

public Color GetPixelNext()

{

pixelData++;

return Color.FromArgb(pixelData->alpha, pixelData->red, pixelData->green, pixelData->blue);

}

public void SetPixel(int x, int y, Color color)

{

PixelData* data = (PixelData*)(pBase + y * width + x * sizeof(PixelData));

data->alpha = color.A;

data->red = color.R;

data->green = color.G;

data->blue = color.B;

}

public void UnlockImage()

{

workingBitmap.UnlockBits(bitmapData);

bitmapData = null;

pBase = null;

}

Размытие

Извилина

Коробочное ядро

Добавить комментарий Отменить ответ