====== Jednoduchý kreslící program - dialog s parametry barevné výplně ======

https://gitlab.fjfi.cvut.cz/culikzde/pw

===== BrushManipulator =====

Vytvoříme pomocnou třídu, kterou zobrazíme v propertyGridu

V **Solution Exploreru** pravou myší klikneme na //projekt Draw// \\
Z kontextového menu vybereme **Add**, **Class** \\
Soubor pojmenujeme **BrushManipulator.cs**

Před **class** připíšeme **public**, aby třída byla dostupná i z jiných jmenných prostorů

Deklarujeme **vlastnost** Color1
<code C#>
        public Color Color1 { get; set; }
</code>

  * Není to proměnná v deklaraci jsou navíc { }  
  * Není to funkce v deklaraci nejsou ( )
  * Vlastnost (property) představuje dvojici funkcí pro čtení a zápis hodnoty, ale v programu s ní pracujeme jako s porměnnou
  * Nejjednodušší implemenace  { get; set; } vytvoří skrytou proměnnou a dvě funkce pro čtení a změmu proměnné
  * PropertyGrid zobrazuje právě vlastnosti, proto vlastnost programujeme

<code C#>
        [Category ("Colors")]
        [DisplayName ("FirstColor")]
        [Description ("First Color ...")]
        public Color Color1 { get; set; }
</code>

Vlastnosti můžeme přidat **attributy**, které překladač uloží spolu s dalšími typovými informacemi do přeloženého programu. \\
Attributy se vztahují k dané deklaraci (může to být i deklarace proměnné, funkce nebo třídy

Category ovlivní rozdělení vlastností do skupin v PropertyGrid \\
DisplayName nahradí identikátor Color1 ve vzniklé tabulce

Podobně přidáme **Color2** a celočíselné vlastnosti **X1**, **Y1**, **X2** a **Y2**, 

Doplníme konstruktor s dvěmi barvami zadanými jako parametry

<code C#>
        public BrushManipulator (Color first, Color second) { ... }
</code>

A funkci **createBrush**, která ze zdadaných vlastností vytvoří štětec

<code C#>
        public LinearGradientBrush createBrush ()
        {
            return new LinearGradientBrush (new PointF (X1, Y1),
                                            new PointF (X2, Y2),
                                            Color1,
                                            Color2);
        }
</code>

Celá třída BrushManipulator

<code C#>
using System;
using System.ComponentModel;
using System.Drawing;
using System.Drawing.Drawing2D;

namespace Draw
{
    public class BrushManipulator
    {
        public BrushManipulator (Color first, Color second)
        {
            Color1 = first;
            Color2 = second;
            
            X1 = 0;
            Y1 = 0;

            X2 = 100;
            Y2 = 100;
        }

        public LinearGradientBrush createBrush ()
        {
            return new LinearGradientBrush (new PointF (X1, Y1),
                                            new PointF (X2, Y2),
                                            Color1,
                                            Color2);
        }

        [Category ("Colors")]
        [DisplayName ("FirstColor")]
        [Description ("First Color ...")]
        public Color Color1 { get; set; }

        [Category ("Colors")]
        [DisplayName ("SecondColor")]
        [Description ("Second Color ...")]
        public Color Color2 { get; set; }

        [Category ("From")]
        public int X1 { get; set; }

        [Category ("From")]
        public int Y1 { get; set; }

        [Category ("To")]
        public int X2 { get; set; }

        [Category ("To")]
        public int Y2 { get; set; }

    }
}
</code>

[[https://gitlab.fjfi.cvut.cz/culikzde/pw/-/blob/master/Draw/BrushManipulator.cs|BrushManipulator.cs]]




===== Úpravy hlavního okna DrawForm =====

Proměnné brush a brushColor nahradíme proměnnou **manipulator**

<code C#>
        private BrushManipulator manipulator;
</code>

V konstruktoru manipulator vytvoříme

<code C#>
            pen = new Pen (colorTools[0].BackColor); // modra barva podle prvniho panelu

            manipulator = new BrushManipulator (colorTools[1].BackColor, // zluta podle druheho panelu
                                                colorTools[2].BackColor); // cervena podle tretiho panelu
</code>

V metodě **pictureBox_MouseMove** pomocí manipulátoru vytvoříme štětec a uložíme ho do lokální proměnné

<code C#>
        private void pictureBox_MouseMove (object sender, MouseEventArgs e)
        {
            if (press)
            {
                Graphics g = Graphics.FromImage (pictureBox.Image);
                g.DrawImage (save, 0, 0);

                Brush brush = manipulator.createBrush ();
</code>

Ve funkci **colorPanel_MouseDown**, pokud klikneme pravou myší na barevný panel, změníme obě barvy manipulátoru na stejnou barvu.

<code C#>
        private void colorPanel_MouseDown (object sender, MouseEventArgs e)
        {
            Panel panel = sender as Panel;
            // Panel panel = (Panel) sender;

            if (e.Button == MouseButtons.Left && Control.ModifierKeys != Keys.Shift)
            {
                pen.Color = panel.BackColor;
                refreshPen ();
            }
            else if (e.Button == MouseButtons.Right)
            {
                manipulator.Color1 = panel.BackColor;
                manipulator.Color2 = panel.BackColor; // !? jednobarevny stetec
                refreshBrush ();
            }
            else if (e.Button == MouseButtons.Middle || e.Button == MouseButtons.Left && Control.ModifierKeys == Keys.Shift)
            {
                colorDialog.Color = panel.BackColor;
                if (colorDialog.ShowDialog () == DialogResult.OK)
                {
                    panel.BackColor = colorDialog.Color;
                    pen.Color = panel.BackColor;
                    refreshPen ();
                }
            }
        }
</code>

[[https://gitlab.fjfi.cvut.cz/culikzde/pw/-/blob/master/Draw/DrawForm.cs|DrawForm.cs]]

===== Reakce na změnu tužky =====

Parametry tužky a štetce budeme zobrazovat v dialogových oknech.
Šířka tužky se navíc zobrazuje v horním //toolPanelu//.
Pokud změníme parametry tužky nebo štetce, chceme parametry také znovu zobrazit.


Vytvoříme //událost// informující různé části programu o změně tužky


//Delegát// připomíná deklaraci funkce a uvedeme v něm parametr typu //Pen//.

<code C#>
        public delegate void PenHandler (Pen p);
</code>

//Událost// pojmenujeme **penChanged** a bude obsahovat posloubnost funkcí (s halvičkami dle předchozí deklarace), které se mají zavolat

<code C#>
        public event PenHandler penChanged;
</code>

Funkce **refreshPen** jednotlivé funkce zavolá

<code C#>
        public void refreshPen ()
        {
            if (penChanged != null)
                penChanged (pen);
        }
</code>


V konstruktoru pak do seznamu funkcí přidáme metodu **updatePenWidth**

<code C#>
            penChanged += updatePenWidth;
</code>


Až //refreshPen// zavolá všechny funkce z posloupnosti, //updatePenWidth// zobrazí šířku tužky v horní částsti okna

<code C#>
        private void updatePenWidth (Pen p)
        {
            penWidthNumeric.Value = (int) p.Width;
        }
</code>

Ve funkci **penMenuItem_Click** přidáme metodu dialogu **setPen** do seznamu funkcí, které se mají zavolat

<code C#>
        private void penMenuItem_Click (object sender, EventArgs e)
        {
            PenDialog dlg = new PenDialog ();
            dlg.setPen (pen);
            penChanged += dlg.setPen;  // dialog bude informovan o zmenach
            dlg.form = this; // dialog bude pomoci form.refreshPen informovat o zmenach
            dlg.Show ();
        }
</code>

A dialogovému oknu předáme odkaz na hlavní okno. \\
Pokocí **form.refreshPen ()** dialog oznámí hlavnímu oknu, že změnil tužku


V //PenDialogu// v "design režimu" vybereme //propertyGrid//, v //Poperties// přejdeme na událostmi klikneme na **PropertyValueChanged** a vznikne funkce //propertyGrid_PropertyValueChanged//

Pokud tedy v dialogovém boxu změníme vlastnosti tužky, zavoláme //refreshPen// v hlavním okně.

A naopak, pokud někdo zavolá //refreshPen//, je zavolána metoda **setPen**, ktrá v tabulce zobrazí nový objekt.

Zdrojový text dialogového okna
<code C#>
    public partial class PenDialog : Form
    {
        public PenDialog ()
        {
            InitializeComponent ();
        }

        public void setPen (Pen p)
        {
            propertyGrid.SelectedObject = p;
        }

        public DrawForm form;

        private void propertyGrid_PropertyValueChanged (object s, PropertyValueChangedEventArgs e)
        {
            if (form != null)
                form.refreshPen ();
        }
    }
</code>

[[https://gitlab.fjfi.cvut.cz/culikzde/pw/-/blob/master/Draw/PenDialog.cs|PenDialog.cs]]


===== Reakce na změnu štětce =====

Obdobobně pro štětec v //DrawForm.cs// deklarujeme typ pro jednotlivé funkce a proměnnou obsahující seznam funkcí, které chceme zavolat při změně štětce

<code C#>
        public delegate void BrushHandler (BrushManipulator b);
        public event BrushHandler brushChanged;
</code>

( Přesněji: posloupnost neobsahuje obyčejné funkce, ale dvojice objekt a jeho metoda. )

Metoda, která zavolá funkce z uložené posloupnosti

<code C#>
        public void refreshBrush ()
        {
            if (brushChanged != null)
                brushChanged (manipulator);
        }
</code>

Vrátíme se do "designu" hlavního okna **DrawForm** \\
Do "Edit" menu přidáme položku "&Brush Properties", pojmenujeme ji **brushMenuItem** \\

Dvakrát kliknenme na novou položku menu (třídu BrushDialog ještě nemáme)

<code C#>
        private void brushMenuItem_Click (object sender, EventArgs e)
        {
            BrushDialog dlg = new BrushDialog ();
            dlg.setBrushManipulator (manipulator);
            brushChanged += dlg.setBrushManipulator;
            dlg.form = this; 
            dlg.Show ();
        }
</code>


===== BrushDialog =====

Podobně jako v [[draw4#Dialogové okno s parametry pro kreslení čar|minulé kapitole]]

V **Solution Exploreru** pravou myší klikneme na //projekt Draw// \\
Z kontextového menu vybereme **Add**, **Form (Windows Forms)** \\
Soubor pojmenujeme **BrushDialog.cs**

  * Do vzniklého okna přidáme z **Toolbox** ze skupiny **All Windows Forms** prvek **PropertyGrid**
  * přejmenujeme na **propertyGrid**
  * nastavíme **Dock** na **Fill**
  * mezi událostmi klikneme na **PropertyValueChanged** a vznikne funkce //propertyGrid_PropertyValueChanged//

//BrushDialog// v //propertyGridu// zobrazuje parametry //BrushManipulátoru//

<code C#>
    public partial class BrushDialog : Form
    {
        public BrushDialog ()
        {
            InitializeComponent ();
        }

        public void setBrushManipulator (BrushManipulator b)
        {
            propertyGrid.SelectedObject = b;
        }

        public DrawForm form;

        private void propertyGrid_PropertyValueChanged (object s, PropertyValueChangedEventArgs e)
        {
            if (form != null)
                form.refreshBrush ();
        }
    }
</code>

[[https://gitlab.fjfi.cvut.cz/culikzde/pw/-/blob/master/Draw/BrushDialog.cs|BrushDialog.cs]]

{{draw_brush_prop.png}}