ADATKÖTÉS WINDOWS FORMS

KÖRNYEZETBEN

Segédlet a Kliens oldali technológiák c. tárgyhoz

Kővári Bence
2020.

Szerzői jogok

Jelen dokumentum a BME Villamosmérnöki és Informatikai Kar hallgatói számára készített

elektronikus jegyzet. A dokumentumot a Kliensoldali technológiák c. tantárgyat felvevő
hallgatók jogosultak használni, és saját céljukra 1 példányban kinyomtatni. A
dokumentum módosítása, bármely eljárással részben vagy egészben történő másolása
tilos, illetve csak a szerző előzetes engedélyével történhet.
Adatkötés Windows Forms környezetben 2/7

BEVEZETÉS

CÉLKITŰZÉS
A labor során megismerjük az adatkötés jelentőségét és működését Windows Forms környezetben.

ELŐFELTÉTELEK
A labor elvégzéséhez szükséges eszközök:

• Microsoft Visual Studio 2017

AMIT ÉRDEMES ÁTNÉZNED

• Windows Forms programozása (Szoftvertechnikák jegyzet)

LEBONYOLÍTÁS
A gyakorlat anyagát távolléti oktatás esetén önállóan, jelenléti oktatás esetében számítógépes laborban,
gyakorlatvezetői útmutatással kell megoldani.

BEADÁS
Amennyiben elkészültél a megoldással, távolíts el belőle a fordítási binárisokat és fordítási
segédmappákat („bin” mappa, „obj” mappa, „Visual Studio” mappa, esetleges nuget/node csomagok,
majd az így elkészült anyagot egy zip fájlba becsomagolva töltsd fel a Moodle rendszerbe. Amennyiben
a zip fájl mérete 10 MB fölött van, valószínűleg nem töröltél ki belőle mindent a korábbi felsorolásból.
Jegyzőkönyv készítése nem szükséges, azonban amennyiben beadott kódoddal kapcsolatban kérdések
merülnek fel, megkérhetünk arra, hogy működésének egyes részleteit utólag is magyarázd el.

ÖSSZEFOGLALÁS
Korábbi félévekben megismerkedtünk a Windows Forms alapú fejlesztéssel. A technológia a .NET
Framework megjelenése óta jelen van, s bár nagy mértékben testreszabott felületek fejlesztésére nem
alkalmas, gyors fejlesztési lehetőségek miatt máig népszerű pl. alkalmazások prototipizálására.

FELADATOK

1. FELADAT – ADATKÖTÉS VEZÉRLŐK KÖZT

Az első feladatban kialakítjuk a környezetet, melyben a továbbiakban az adatkötés működését és
lehetőségeit vizsgáljuk.

1. Hozzunk létre egy Windows Forms projektet Visual Studioban! A projekt neve a Neptun
kódunk legyen!
2. Adjunk hozzá a felülethez egy szövegdobozt, hagyjuk meg az eredeti nevét (textBox1)
3. Kattintsunk duplán az ablak fejlécére a designerben, ezzel felíratkozunk a Load eseményére.
Hozzunk létre egy adatkötést az alábbi sor beírásával.

private void Form1_Load(object sender, EventArgs e)

{
this.DataBindings.Add("Text", textBox1, "Text");
}

Copyright © 2021. Kővári Bence, Automatizálási és Alkalmazott Informatikai Tanszék

Adatkötés Windows Forms környezetben 3/7

Ez a sor a következő hatást éri el: A Form objektumhoz (this) felveszünk egy adatkötést, melyben jelöljük,
hogy a Form Text tulajdonsága (első paraméter) mindig frissítendő, ha a forrás (második paraméter) Text
tulajdonsága (harmadik paraméter) megváltozik.

4. Futtassuk az alkalmazást! Figylejük meg, hogy a szövegdoboz tartalmának (textBox1.Text)

változtatásával az ablak fejléce (Form.Text) is együtt változik!
5. Húzzunk be egy TrackBar-t a felületre. Állítsuk be a Maximum tulajdonságát 1000-re a Value
tulajdonságát 600-ra, majd adjuk hozzá a következő következő kódrészletet a Form1_Load
függvényhez.

this.DataBindings.Add("Width", trackBar1, "Value");

textBox1.DataBindings.Add("Text", trackBar1, "Value");

6. Futtassuk a programot!

Vegyük észre a következőket:

• az adatkötés bármilyen két vezérlő között lehetséges (fenti példában trackbar és textbox között)
• az adatkötés kétirányú, hiszen textBox szövegét átírva módosul a többi érték is
• az adatkötés string-int konverziót is elvégez, hiszen a két oldalnak itt a típusa is más
• az adatkötés láncszerűen is működik, hiszen az ablak fejléce is leköveti az adatváltozásokat

2. FELADAT – ADATKÖTÉS VEZÉRLŐK ÉS SAJÁT OBJEKTUMOK KÖZT

1. Adjunk hozzá a projekthez egy új osztályt Pokemon néven! Az osztálynak egy string típusú
Name és egy double típusú Weight tulajdonsága legyen.

class Pokemon
{
public string Name { get; set; }
public double Weight { get; set; }
}

Az üres get és set metódusok úgynevezett “autoimplementált” tulajdonságot generálnak. Ilyenkor a C#

fordító automatikusan egy privát mezőt vezet be, melynek értékeit a get és a set metódusok lekérdezik,
illetve állítják.

Copyright © 2021. Kővári Bence, Automatizálási és Alkalmazott Informatikai Tanszék

Adatkötés Windows Forms környezetben 4/7

2. Húzzunk egy ListBox vezérlőt a felületre, majd egészítsük ki a Load függvényt a következő
sorokkal:

List<Pokemon> list = new List<Pokemon>();

list.Add(new Pokemon { Name = "Pikachu", Weight = 13.2 });
list.Add(new Pokemon { Name = "Mew", Weight = 8.8 });
list.Add(new Pokemon { Name = "Charmander", Weight = 18.7 });
listBox1.DataSource = list;
listBox1.DisplayMember = "Name";

Fordítsuk és teszteljük a projektet. Figyeljük meg, hogy mi történik, ha az utolsó sort kikommentezzük.
A jelenség oka, hogy egyéb információ hiányában a ListBox az objektumok ToString függvényével
határozza meg, hogy mit jelenítsen meg, ami alapértelmezésben a típus nevét adja vissza. Ha van időnk,
kísérletképpen megpróbálhatjuk felülírni is (override).

pPikachu Mew Charmander

A fenti mechanizmus jól használható egyszerűbb esetekben, ám komplexebb helyzetekben, ha több

vezérlőt szeretnénk összekötni, érdemes egy központi komponenst is bevezetni

3. Adjunk hozzá egy új adatforrást a projektünkhöz. Ehhez használjuk a bal oldalon látható „Data
Sources” panelt, amelyet szükség esetén a „View / Other Windows / Data Sources”
menüpontban tudunk előhozni.
4. Kattintsunk az „Add New Data Source…” linkre, majd válaszuk az „Object” opciót, jelöljük ki a
„Pokemon” osztályunkat majd nyomjuk meg a Finish gombot.

Az eddigi lépéseknek még közvetlen hatásuk nem lesz a kódunkra. Mindössze tudattuk a designerrel,
hogy az adatkötések tervezésekor számoljon az osztályunkkal, így a további lépésekben az
automatikusan felkínálja azt a választások között.

Copyright © 2021. Kővári Bence, Automatizálási és Alkalmazott Informatikai Tanszék

Adatkötés Windows Forms környezetben 5/7

5. Húzzunk be egy BindingSource komponenst a Form-ra. Állítsuk át a Name tulajdonságát

„pokemonBindingSource”-ra. Ez a komponens segíteni fog a saját osztályunk példányainak UI-
hoz kötésében. A DataSource tulajdonságál az Other Data Sources kategóriában keressük meg
a Pokemon osztályt.

6. Módosítsuk a korábbi ListBox vezérlőt. A smart tagjének (jobb felső sarokban található nyilacska)
használatával állítsuk be az adatforrást pokemonBindingSource-ra, a megjelenítendő
tulajdonságot Name-re! (korábbi ténykedésünknek hála, ezeket magától felkínálja a rendszer).

7. Végül rakjunk adatokat is a listába. Módosítsuk a Load függvényt:

listBox1.DataSource = list;
listBox1.DisplayMember = "Name";
pokemonBindingSource.DataSource = list;

8. Teszteljük az alkalmazást!
9. Állítsuk le az alkalmazás futtatását, ellenkező esetben a következő lépések nem fognak működni!

Copyright © 2021. Kővári Bence, Automatizálási és Alkalmazott Informatikai Tanszék

Adatkötés Windows Forms környezetben 6/7

10. A Data Sources panelről húzzuk be a Person node-ot. Ez egy GridView-t fog létrehozni, mely
már automatikusan a binding source-unkat fogja használni.
11. A Data Sources panelen használjuk a Pokemon node legördülő menüjét, hogy Details nézetre
kapcsoljuk. Ismét húzzuk be a Formra! Ez két, a binding source-hoz kötött szövegdobozt fog
létrehozni.

A két létrejött vezérlőt kódbol, vagy designerből is bekonfigurálhattuk volna. A data sources panel célja,
hogy gyorsítsa és nagyrészt automatizálja ezt a folyamatot.

12. Futtassuk az alkalmazást! Elemezzük a látottakat

3. FELADAT – KÉTIRÁNYÚ ADATKÖTÉS SAJÁT OBJEKTUMOKKAL

1. Húzzunk be egy gombot a Form-ra. Kattintsunk rá duplán és a megjelenő eseménykezelőben
módosítsuk az összes Pokemon súlyát.

private void button1_Click(object sender, EventArgs e)

{
var list = (List<Pokemon>)pokemonBindingSource.DataSource;
foreach (var pokemon in list)
{
pokemon.Weight++;
}

2. Futtassuk az alkalmazást! Vegyük észre, hogy bár az adatok a háttérben a frissülnek a UI ezt nem
követi le, csak ha kijelölünk elemeket.
3. Annak érdekében, hogy az objektum is tudjon visszajelzést küldeni az állapotváltozásairól,
módosítsuk a kódját a következőképpen az INotifyPropertyChanged interfész
implementálásával:
class Pokemon: INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
private double weight;
public double Weight
{
get { return weight; }
set
{
weight = value;
if (PropertyChanged != null)
PropertyChanged(this,
new PropertyChangedEventArgs("Weight"));
}
}

Copyright © 2021. Kővári Bence, Automatizálási és Alkalmazott Informatikai Tanszék

Adatkötés Windows Forms környezetben 7/7

Technikailag mindent, amit a mai laboron eddig láttunk a fenti interfész működtet. Ha megnézzük,
minden vezérlő és a binding source is implementálja ezt az interfészt. Ezen keresztül tudnak értesülni
egymás értékeinek megváltozásairól és frissíteni ennek függvényében saját tartalmukat.

4. Teszteljük az alkalmazást!

4. FELADAT – ÖNÁLLÓ FELADAT

A tanultak alkalmazásával egészítsd ki az alkalmazást a következő elemekkel:

1. Bővítsd a Pokemonok listáját egy új taggal, melynek neve a saját Neptun kódod legyen!

2. Bővítsd ki az alkalmazást egy ComboBox-szal, melynek elemei a mindenkori Pokemonok

legyenek!
Tipp: a ComoBox viselkedése nagyon hasonló a ListBox viselkedéséhez

3. Bővítsd ki az alkalmazást egy gombbal, mely az aktuálisan kiválasztott Pokemon súlyát

kétszeresére növeli!
Tipp: az aktuális Pokemon objektumot a BindingSource Current tulajdonságából tudod kiolvasni.

Copyright © 2021. Kővári Bence, Automatizálási és Alkalmazott Informatikai Tanszék