Galerie foto

și
mini editor
Ananii Ioan-Daniel Galerie foto și mini editor
Cuprins
Introducere...........................................................................................................................................2
Interfață proiect....................................................................................................................................3
Funcționalitatea aplicației....................................................................................................................4
Coduri...................................................................................................................................................8
Bibliografie.........................................................................................................................................16

Figură 1 Interfață aplicație

Figură 2 Bara de meniu

Figură 3 Buton info1

Figură 4 Buton info2

Figură 5 Imagine selectată

Figură 6 Aplicare filtru prestabilit

Figură 7 Utilizare trackbar-uri

Figură 8 Decupare imagine

Figură 9 Imagine neselectată

1
 Introducere
În cadrul proiectului realizat la materia Prelucararea
Numerică a Imaginilor(PNI), proiect sub denumirea de
„Galerie foto și mini editor”, am realizat un proiect care prin
denumire se observa ce rol are, și anume acela de a încărca
imagini dintr-un folder din PC și de a edita imaginile
respective. Prin încărcare de imagini mă refer că utilizatorul
poate prelua un întreg folder cu imagini sau poate prelua o
imagine dintr-un anumit folder sau o selecție de imagini. Iar
prin editare mă refer prin editarea contrastului imaginii
selectate, prin anumite filtre prestabilite sau prin schimbarea
celor 3 culori primare(RGB) sau prin decuparea unei anumite
portiuni din imagine. De asemenea utilizatorul poate salva
imaginea respectiva fără modificări sau cu modificări, depinde
de alegerea sa, astfel utilizatorul poate să-și creeze propria
galerie foto.

2
 Interfață proiect
Interfața grafică precum și întregul proiect a fost realizat
în Visual Studio 2017. În momentul în care utilizatorul
deschide aplicația i se va afișa interfața care este reprezentată
în imaginea următoare.

Figură 1 Interfață aplicație

După cum se poate observa în imaginea anterioară

interfața dispune de trei „ecrane”, de 3 trackbar-uri și de o
mulțime de butoane pentru informații, pentru salvarea
imaginilor, pentru ștergerea imaginilor din lista de imagini și
pentru editarea imaginii selectate. Cele trei „ecrane” sunt
reprezentate de un list view file, de un flow layout panel și de
in picture box. Pe lângă putoane și ”ecrane” se mai poate
observa și o bară de meniu prin care utilizatorul poate efectua
respectivele comenzi.

3
 Funcționalitatea aplicației
În primul rând ca utilizatorul să poate interacționa cu
aplicaștia acesta trebuie să se folosească de bara de meniu.
Prin intermediul acesteia el poate adăuga un folder cu imagini
sau o imaginie sau mulțime de imagini.

Figură 2 Bara de meniu

În bara de meniu se poate observa încă o comandă prin

care utilizatorul poate șterge ori imaginile din list view file sau
imaginile din flow layout panel.
În ceea ce privește acele butoane info, fiecăruia îi este
atașat un MessageBox, iar dacă sunt activate vor afișa mesajul
respectiv. Informațiile din MessageBox-uri sunt afișate în
următoarele 2 imagini.

4
 Figură 3 Buton info1

Figură 4 Buton info2

După cum scrie și în primul MessageBox după ce am

selectat o imagine din list view file această imagine va apărea
în picture box. După ce această imagine a apărut în picture
box se poate realiza editarea sau salvarea imaginii respective.
Pe lângă butoanele de editare și salvare mai există și butonul
delete care dacă este apăsat după ce am selecta imaginea,
această imagine va fi ștearsă și din list view file și din picture
box.

5
 Figură 5 Imagine selectată

Imaginii poate fi schimbată fie prin aplicarea unui

filtru(Winter, Gray, Spike, Flash, Frozen, Sepia) pe care le
avem reprezentate deasupra imaginii prin butoane fie prin cele
trei trackbar-uri ce reprezintă cele 3 culori primare.

Figură 6 Aplicare filtru prestabilit

6
 Figură 7 Utilizare trackbar-uri

Pe lângă butoanele de filtru se mai pot observa încă două

butoane. Unul este reprezentativ pentru resetarea imaginii la
momentul inițial în caz că utilizatorul dorește să editeze
imaginea altfel. Iar butonul „CUT” permite utilizatorului să
decupeze o parte din imagine și în loc să salveze imaginea
inițială acesta va salva noua imagine decupată.

Figură 8 Decupare imagine

7
 Iar dacă în cazul în care utilizatorul dorește să editeze sau
sa folosească butoanele fără să fi selectat imaginea acestuia îi
va apărea un mesaj de eroare.

Figură 9 Imagine neselectată

8
 Coduri
Codul reprezentativ pentru introducerea imaginilor in list
view file:
private void addImageToolStripMenuItem_Click(object sender, EventArgs e)
{
using (OpenFileDialog ofd = new OpenFileDialog() { Multiselect = true,
ValidateNames = true, Filter = "|*.BMP;*.JPG;*.GIF;*.PNG;*.TIFF;JPEG|*.jpg|" })
{
if (ofd.ShowDialog() == DialogResult.OK)
{
foreach (string fileName in ofd.FileNames)
{
fi = new FileInfo(fileName);
fileNames.Add(fi.FullName);
listViewFile.Items.Add(fi.Name, 0);
}
}
}
}

Codul reprezentativ pentru introducerea imaginilor in

flow layout panel:
private void toolToolStripMenuItem_Click(object sender, EventArgs e)
{
AddImages();
}

private void AddImages()

{
flowLayoutPanel1.Controls.Clear();

FolderBrowserDialog folder = new FolderBrowserDialog();

String[] LocImg = new String[200];
String[] LocImg1 = new String[200];
String[] LocImg2 = new String[200];
String[] LocImg3 = new String[200];
String[] LocImg4 = new String[200];

if (folder.ShowDialog() == DialogResult.OK)
{
LocImg = Directory.GetFiles(folder.SelectedPath, "*jpg",
SearchOption.TopDirectoryOnly);
LocImg1 = Directory.GetFiles(folder.SelectedPath, "*.bmp",
SearchOption.TopDirectoryOnly);
LocImg2 = Directory.GetFiles(folder.SelectedPath, "*.gif",
SearchOption.TopDirectoryOnly);
LocImg3 = Directory.GetFiles(folder.SelectedPath, "*.png",
SearchOption.TopDirectoryOnly);
LocImg4 = Directory.GetFiles(folder.SelectedPath, "*.tiff",
SearchOption.TopDirectoryOnly);
LenLocal = folder.SelectedPath.Length;

9
for (int count = 0; count < LocImg.Length; count++)
{
PictureBox pcb = new PictureBox();
pcb.SizeMode = PictureBoxSizeMode.StretchImage;
pcb.ImageLocation = LocImg[count];

pcb.Width = 50;
pcb.Height = 50;

pcb.MouseMove += new MouseEventHandler(move);

pcb.MouseLeave += new EventHandler(leave);
pcb.MouseClick += new MouseEventHandler(click);

flowLayoutPanel1.Controls.Add(pcb);
}
for (int count = 0; count < LocImg1.Length; count++)
{
PictureBox pcb = new PictureBox();
pcb.SizeMode = PictureBoxSizeMode.StretchImage;
pcb.ImageLocation = LocImg1[count];

pcb.Width = 50;
pcb.Height = 50;

pcb.MouseMove += new MouseEventHandler(move);

pcb.MouseLeave += new EventHandler(leave);
pcb.MouseClick += new MouseEventHandler(click);

flowLayoutPanel1.Controls.Add(pcb);
}
for (int count = 0; count < LocImg2.Length; count++)
{
PictureBox pcb = new PictureBox();
pcb.SizeMode = PictureBoxSizeMode.StretchImage;
pcb.ImageLocation = LocImg2[count];

pcb.Width = 50;
pcb.Height = 50;

pcb.MouseMove += new MouseEventHandler(move);

pcb.MouseLeave += new EventHandler(leave);
pcb.MouseClick += new MouseEventHandler(click);

flowLayoutPanel1.Controls.Add(pcb);
}
for (int count = 0; count < LocImg3.Length; count++)
{
PictureBox pcb = new PictureBox();
pcb.SizeMode = PictureBoxSizeMode.StretchImage;
pcb.ImageLocation = LocImg3[count];

pcb.Width = 50;
pcb.Height = 50;

pcb.MouseMove += new MouseEventHandler(move);

pcb.MouseLeave += new EventHandler(leave);
pcb.MouseClick += new MouseEventHandler(click);

flowLayoutPanel1.Controls.Add(pcb);
}
for (int count = 0; count < LocImg4.Length; count++)

10
 {
PictureBox pcb = new PictureBox();
pcb.SizeMode = PictureBoxSizeMode.StretchImage;
pcb.ImageLocation = LocImg4[count];

pcb.Width = 50;
pcb.Height = 50;

pcb.MouseMove += new MouseEventHandler(move);

pcb.MouseLeave += new EventHandler(leave);
pcb.MouseClick += new MouseEventHandler(click);

flowLayoutPanel1.Controls.Add(pcb);
}
}
}

Codul reprezentativ pentru ștergerea imaginilor din flow

layout panel respectiv din list view file:
Ștergere din flow layout panel:
private void fromAlbumToolStripMenuItem_Click(object sender, EventArgs e)
{
flowLayoutPanel1.Controls.Clear();
}

Ștergere din list view file:

private void fromToolStripMenuItem_Click(object sender, EventArgs e)
{
fileNames.Clear();
listViewFile.Items.Clear();
pictureBox1.Image = null;
}

Codurile reprezentative pentru proprietățile din flow

layout panel:
Marirea si afișarea numelui imaginii din flow layout panel:
private void move(object sender, EventArgs e)
{
PictureBox pcb = (PictureBox)sender;
Graphics gra = pcb.CreateGraphics();
string name = pcb.ImageLocation.Remove(0, LenLocal + 1);

pcb.Width = 75;
pcb.Height = 75;

if (pcb.Top + pcb.Height > this.Height - 30)

{
flowLayoutPanel1.VerticalScroll.Value =
flowLayoutPanel1.VerticalScroll.Maximum;
}

gra.DrawString(name, new Font("Paladino Linotype", 10), new

SolidBrush(Color.White), 0, 0);
}

Revenirea la marimea inițială a imaginii din flow layout panel:

private void leave(object sender, EventArgs e)

11
{
PictureBox pcb = (PictureBox)sender;

pcb.Width = 50;
pcb.Height = 50;
pcb.Refresh();
}

Afișarea imaginii in mărime naturală din flow layout panel:

private void click(object sender, EventArgs e)
{
PictureBox pcb = (PictureBox)sender;
string name = pcb.ImageLocation.Remove(0, LenLocal + 1);

Form frm = new Form();

frm.Width = pcb.Image.Width;
frm.Height = pcb.Image.Height;
frm.BackgroundImage = pcb.Image;
frm.BackgroundImageLayout = ImageLayout.Stretch;
frm.FormBorderStyle = FormBorderStyle.SizableToolWindow;

frm.Text = name;
frm.ShowDialog();
}

Codurile reprezentative pentru selectarea imaginii din list

view file, pentru proprietatea dublu click, pentru salvare și
pentru ștergere:
Afișarea imaginii in mărime naturală din list view file:
private void listViewFile_ItemActivate(object sender, EventArgs e)
{
if (listViewFile.FocusedItem != null)
{
Form frm = new Form();
Image img = Image.FromFile(fileNames[listViewFile.FocusedItem.Index]);
frm.Width = img.Width;
frm.Height = img.Height;
frm.BackgroundImage = img;
frm.BackgroundImageLayout = ImageLayout.Stretch;
frm.FormBorderStyle = FormBorderStyle.SizableToolWindow;

frm.Text = "Image on Real Size!";

frm.ShowDialog();

}
}

Selectarea și afișarea in picture box a imaginii din list view file:

private void listViewFile_ItemSelectionChanged(object sender,
ListViewItemSelectionChangedEventArgs e)
{
selectImg();
}

void selectImg()
{
if (listViewFile.SelectedItems.Count > 0)
{
foreach (ListViewItem itm in listViewFile.SelectedItems)
{

12
 int imgIndex = itm.ImageIndex;
if (imgIndex >= 0 && imgIndex < this.imageList1.Images.Count)
{
pictureBox1.Image = this.imageList1.Images[imgIndex];
Image img =
Image.FromFile(fileNames[listViewFile.FocusedItem.Index]);
pictureBox1.Image = img;
if (img.Width < pictureBox1.Width)
pictureBox1.Width = img.Width;
else
pictureBox1.Width = 841;
if (img.Height < pictureBox1.Height)
pictureBox1.Height = img.Height;
else
pictureBox1.Height = 561;
}
}
}
}

Ștergerea imaginii selectate:

private void button3_Click(object sender, EventArgs e)
{
if (listViewFile.SelectedItems.Count > 0)
{
pictureBox1.Image = null;
fileNames.RemoveAt(listViewFile.SelectedIndices[0]);
foreach (ListViewItem eachItem in this.listViewFile.SelectedItems)
{
this.listViewFile.Items.Remove(eachItem);
}
}
}

Salvarea imaginii selectate:

private void button2_Click(object sender, EventArgs e)
{
SaveImageCapture(pictureBox1.Image);
}

public static void SaveImageCapture(Image image)

{
SaveFileDialog s = new SaveFileDialog();
s.FileName = "Image";
s.DefaultExt = ".Jpg";
s.Filter = "Image |JPEG|*.jpg|";
ImageFormat format = ImageFormat.Jpeg;

s.InitialDirectory =
Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData);
s.RestoreDirectory = true;
try
{
if (s.ShowDialog() == DialogResult.OK)
{
string filename = s.FileName;

using (FileStream fstream = new FileStream(filename,

FileMode.Create))
{
image.Save(fstream, format);
fstream.Close();

13
 }
}
}
catch
{
MessageBox.Show("Error: Didn't selected a image!");
}
}

Codurile reprezentative pentru track bar-uri:

void RGB()
{
try
{
float changered = trackBarRed.Value * 0.001f;
float changegreen = trackBarGreen.Value * 0.001f;
float changeblue = trackBarBlue.Value * 0.001f;

Image img = pictureBox1.Image;

Bitmap bmpInverted = new Bitmap(img.Width, img.Height);

ImageAttributes ia = new ImageAttributes();

ColorMatrix cmPicture = new ColorMatrix(new float[][]
{
new float[]{1+changered, 0, 0, 0, 0},
new float[]{0, 1+changegreen, 0, 0, 0},
new float[]{0, 0, 1+changeblue, 0, 0},
new float[]{0, 0, 0, 1, 0},
new float[]{0, 0, 0, 0, 1}
});
ia.SetColorMatrix(cmPicture);
Graphics g = Graphics.FromImage(bmpInverted);

g.DrawImage(img, new Rectangle(0, 0, img.Width, img.Height), 0, 0,

img.Width, img.Height, GraphicsUnit.Pixel, ia);

g.Dispose();
pictureBox1.Image = bmpInverted;
}
catch
{
MessageBox.Show("Error: Didn't selected a image!");
}

private void trackBarRed_ValueChanged(object sender, EventArgs e)

{
RGB();
}

private void trackBarGreen_ValueChanged(object sender, EventArgs e)

{
RGB();
}

private void trackBarBlue_ValueChanged(object sender, EventArgs e)

{
RGB();
}

14
 Codurile reprezentative pentru filtre:
void Winter()
{
try
{
Image img = pictureBox1.Image;
Bitmap bmpInverted = new Bitmap(img.Width, img.Height);

selectImg();
ImageAttributes ia = new ImageAttributes();
ColorMatrix cmPicture = new ColorMatrix(new float[][]
{
new float[]{1,0,0,0,0},
new float[]{0,1,0,0,0},
new float[]{0,0,1,0,0},
new float[]{0, 0, 0, 1, 0},
new float[]{0, 0, 1, 0, 1}
});
ia.SetColorMatrix(cmPicture);
Graphics g = Graphics.FromImage(bmpInverted);

g.DrawImage(img, new Rectangle(0, 0, img.Width, img.Height), 0, 0,

img.Width, img.Height, GraphicsUnit.Pixel, ia);

g.Dispose();
pictureBox1.Image = bmpInverted;
}
catch
{
MessageBox.Show("Error: Didn't selected a image!");
}
}

private void button6_Click(object sender, EventArgs e)

{
selectImg();
trackBarBlue.Value = 0;
trackBarGreen.Value = 0;
trackBarRed.Value = 0;
Winter();
}

Asemănător este și pentru celelalte filtre, singurul lucru

care se schimbă în cod este matricea culorilor.
Codul reprezentativ pentru reload:
private void button12_Click(object sender, EventArgs e)
{
selectImg();
trackBarBlue.Value = 0;
trackBarGreen.Value = 0;
trackBarRed.Value = 0;
selectImg();
}

Folosește același cod de la selectarea imaginii.

15
 Codurile reprezentative pentru decuparea imaginii:
private void pictureBox1_MouseDown(object sender, MouseEventArgs e)
{
if (e.Button == System.Windows.Forms.MouseButtons.Left)
{
Cursor = Cursors.Cross;
cropX = e.X;
cropY = e.Y;
cropPen = new Pen(Color.Black, 1);
cropPen.DashStyle = DashStyle.DashDotDot;
}
pictureBox1.Refresh();
}

private void pictureBox1_MouseMove(object sender, MouseEventArgs e)

{
if (pictureBox1.Image == null)
return;
if (e.Button == System.Windows.Forms.MouseButtons.Left)
{
pictureBox1.Refresh();
cropWidth = e.X - cropX;
cropHeight = e.Y - cropY;
pictureBox1.CreateGraphics().DrawRectangle(cropPen, cropX, cropY,
cropWidth, cropHeight);
}
}

private void button13_Click(object sender, EventArgs e)

{
Cursor = Cursors.Default;
if (cropWidth < 1)
{
return;
}
Rectangle rect = new Rectangle(cropX, cropY, cropWidth, cropHeight);
Bitmap OriginalImage = new Bitmap(pictureBox1.Image, pictureBox1.Width,
pictureBox1.Height);
Bitmap _img = new Bitmap(cropWidth, cropHeight);
Graphics g = Graphics.FromImage(_img);
g.InterpolationMode =
System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;
g.PixelOffsetMode = System.Drawing.Drawing2D.PixelOffsetMode.HighQuality;
g.CompositingQuality = System.Drawing.Drawing2D.CompositingQuality.HighQuality;
g.DrawImage(OriginalImage, 0, 0, rect, GraphicsUnit.Pixel);
pictureBox1.Image = _img;
pictureBox1.Width = _img.Width;
pictureBox1.Height = _img.Height;
button3.Enabled = false;
}

16
 Bibliografie
https://stackoverflow.com/questions/
https://www.youtube.com/watch?v=xsOJjnyw2e4
https://www.youtube.com/watch?v=d0AHKq7lDF4
https://www.daniweb.com/programming/software-
development/threads/228060/how-to-select-particular-control-
from-flowlayout-panel
https://github.com/oozcitak/imagelistview/wiki/ImageListVie
wRenderer
https://www.codeproject.com/Articles/43265/ImageListView

17