Lucrarea 7 – Windows Presentation Foundation

Resurse necesare

• Sistem de calcul dotat cu sistemul de operare Windows 10 sau Windows

7 în configurația monitor, mouse, tastatură;
• Mediu de dezvoltare Visual Studio 2019 sau Visual Studio 2017 instalat.

Obiective

• Prezentarea generică a template-ului Windows Presentation Foundation;

• Prezentarea avantajelor utilizării acestui template prin exemplificare.

Noutățile introduse de Microsoft în domeniul template-urilor prin intermediul

Windows Presentation Foundation (WPF) pentru a facilita dezvoltarea programelor sunt:

- Un layout asemănător aplicațiilor web. Dacă în trecut template-urile utilizate pentru

interfețe grafice dispuneau de controlere fixe (butoane, label-uri, textbox-uri, etc.),
în prezent, WPF a introdus caracteristica numită responsive, adică posibilitatea de
redimensionare a controlerelor în funcție de rezoluția display-ului. Acest lucru
permite utilizarea conținutului dinamic și a dezvoltării aplicațiilor multilingvistice.
În acest fel, conținutul text al aplicației se va adapta în funcție de opțiunea
utilizatorului sau a locației acestuia.
- Controlerele au fost îmbunătățite și adaptate noilor cerințe. Astfel, WPF permite
afișarea unui text bogat și stilizat oriunde în interfața grafică, ca de exemplu, afișarea
în cadrul documentelor sau dispunerea textului pe mai multe coloane pentru a
îmbunătăți lizibilitatea.
- Introducerea animațiilor este un alt pas evolutiv major.
 Template-ul WPF a fost dezvoltat utilizând atât framework-ul .NET, cât și .NET
Core. În cele ce urmează se va realiza o prezentare a instrumentului WPF .NET Core. Acest
instrument permite dezvoltarea interfeței grafice a proiectului accesând fișierul principal
MainWindow.xaml în modul Design. Pentru deschiderea acestui mod se realizează click
dreapta pe numele proiectului, iar din meniul derulat se va alege View Designer, conform
figurii 7.1.

Fig. 7.1. Deschiderea modului de lucru Design pentru implementarea interfeței

grafice a ferestrei principale MainWindow

Obiectele grafice se pot plasa în zona de lucru în două moduri:

- Din meniul Toolbox, prin alegerea obiectului dorit și glisarea acestuia până în
zona de lucru, numită Grid;
- Direct în fișierul XAML prin adăugarea de cod.

Conform referinței [W1], cele mai utilizate controlere pentru crearea interfețelor grafice
sunt:

- Butoanele reprezintă elemente care determină apariția unui eveniment;

- Elemente de afișare: DataGrid, ListView și TreeView;
 - Elemente de afișare și selecție dată: Calendar și DatePicker;
- Ferestre de selecție: OpenFileDialog, PrintDialog și SaveFileDialog;
- Elemente de intrare: TextBox, RichTextBox și PasswordBox;
- Elemente de Layout: Border, Canvas, DockPanel, Grid, GridView, GridSplitter,
GroupBox, Panel, Separator, ScrollBar, ScrollViewer, StackPanel, Viewbox,
Window și WrapPanel;
- Elemente multimedia: Image, MediaElement și SoundPlayerAction;
- Meniuri: ContextMenu, Menu și ToolBar;
- Elemente de selecție: CheckBox, ComboBox, ListBox și RadioButton;
- Elemente de informare utilizator: Label, Popup, ProgressBar, StatusBar,
TextBlock și ToolTip.

Fiecare controler este caracterizat prin proprietăți (numite și atribute) care modifică
estetica obiectului. Elementele care implementează diferite acțiuni la nivelul unui
controler se numește eveniment și este implementat de execuția unei metode.

Pentru a putea modifica proprietăți sau evenimente asociate unui controler, se execută
click dreapta pe controler, iar din meniul derulat se alege opțiunea Properties. Figura 7.2a
prezintă meniul proprietăților din care se pot modifica diferite caracteristici ale unui
controler. Cea mai importantă proprietate a tuturor controlerelor este proprietatea Name,
deoarece aceasta este denumirea utilizată în cod pentru a referi un anumit obiect. Din
acest motiv, de fiecare dată când se va adăuga un obiect, se va completa numele acestuia
în zona <No Name> din partea dreaptă a numelui în meniul Properties sau direct în codul
XAML al controlerului. Tot în figura 7.2a este marcat sub forma unei chei afișarea
proprietăților asociate controlerului.

Trecerea din modul de afișare proprietăți în modul de afișare evenimente se realizează

prin click pe butonul Events marcat în figura 7.2b sub forma unui fulger. În această figură
se poate observa că obiectul analizat, DataGrid, este înzestrat cu o multitudine de
evenimente. Cel mai utilizat eveniment este Loaded(), fiind lansat la încărcarea
controlerului în interfața grafică. Pentru a genera metoda care implementează
evenimentul Loaded(), se realizează dublu click în casuța albă liberă din partea dreaptă a
denumirii. Ulterior, se va genera automat metoda care implementează eveniment, iar
cursorul va fi plasat în zona în care se poate realiza începerea scrierii instrucționilor care
implementează acțiunile dorite.
 a) b)
Fig. 7.2. Controlerele sunt caracterizate de proprietăți și metode care pot fi setate în
meniul Properties: a) Setarea proprietăților; b) Setarea evenimentelor.

Cele mai utilizate acțiuni în cadrul aplicațiilor sunt:

- Listarea datelor;
- Adăugarea de date;
- Editarea de date;
- Ștergerea datelor.

Implementarea acțiunilor este posibilă datorită obiectelor grafice și a codului care

realizează logica de manipulare a datelor.

Aplicația 1. Se cere să se listeze toate produsele extrase în fișierul nume_produse.txt într-

o structură de tip . Aplicația trebuiă să integraze și un meniu care să permită căutarea
produselor care încep cu o anumită denumire sau a celor care conțin o anumită expresie.

Pentru implementare se vor parcurge următoarele etape:

1. Se adaugă clasa de lucru cu produsele care conține numele produsului și prețul

acestuia. Clasa conține și o metodă care va returna lista produselor:

public class Produs

{
public string numeProdus { set; get; }
public double pretProdus { set; get; }
 public List<Produs> preiaLista()
{
string[] produse =
File.ReadAllLines(@"E:\facultate\idp\laborator\laborator_3\test\nume_produse.txt");
string[] preturi =
File.ReadAllLines(@"E:\facultate\idp\laborator\laborator_3\test\pret_20_10.txt");
List<Produs> pList = new List<Produs>();

NumberFormatInfo nfi = new NumberFormatInfo();

nfi.NumberDecimalSeparator = ".";

for (int i = 0; i < produse.Length; i++)

{
Produs p = new Produs();
p.numeProdus = produse.ElementAt(i);
p.pretProdus = Convert.ToDouble(preturi.ElementAt(i), nfi);
pList.Add(p);
}

return pList;
}
}

2. Se adaugă un controler de tip Border în interiorul căruia se vor plasa elementele de

filtrare a datelor și un DataGrid în care se vor lista datele (denumirile produselor):

<Grid>
<Border BorderThickness="1" BorderBrush="Black" Margin="0,0,0,331"/>
<DataGrid Margin="0,103,0,0"/>
</Grid>

Figura 7.3 prezintă fereastra inițială de lucru în care au fost plasate cele două controlere.
 Fig. 7.3. Interfața grafică inițială a aplicației.

3. DataGrid se va numi dataGridFilter;

4. Se generează metoda care implementează evenimentul Loaded() pentru dataGrid.
În cadrul acestei metode se va apela o altă metodă definită de utilizator care
primește ca parametrii secvența de filtrare și criteriul (dacă există) și returnează
lista produselor care îndeplinesc condițiile. La încărcarea aplicației, această
metodă va fi apelată cu 2 parametrii cu valoarea null. Metoda se va numi
populeazăGrid();

private void dataGridFilter_Loaded(object sender, RoutedEventArgs e)

{
populeazaGrid();
}
5. Această metodă trebuie să populeze cu date obiectul dataGrid astfel:
a. Se șterge conținutul obiectului dataGrid pentru a nu păstra date de la o
execuție anterioară. Această instrucțiune este necesară pentru etapa când se
va reîncărca conținului obiectului cu datele care îndeplinesc condițiile de
filtrare;
b. Extrag datele cu care se populează obiectul dataGrid din fișier;
c. Se verifică dacă există expresie de filtrare, caz în care se filtrează datele în
funcție de criteriul ales (dacă începe cu expresia sau dacă conține expresia);
d. Se populează obiectul dataGrid cu datele din listă.

public void populeazaGrid(string expresie = "", string criteriu = "")

{
// Sterg intregul continut al obiectului dataGrid
dataGridFilter.ClearValue(ItemsControl.ItemsSourceProperty);

// Se instantiaza obiectul si se preia lista produselor

Produs pObject = new Produs();
List<Produs> produse = pObject.preiaLista().ToList();

// Daca exista expresie de filtrare

if (expresie != "")
{
// Se verifica daca este criteriul de incepere cu expresia
// in caz contrar, criteriul este de existenta a expresiei in numele produsului
if (criteriu.Equals("Incepe cu"))
produse = produse.Where(x =>
x.numeProdus.ToLower().Contains(expresie.ToLower())).ToList();
else
produse = produse.Where(x =>
x.numeProdus.ToLower().StartsWith(expresie.ToLower())).ToList();
 }
dataGridFilter.ItemsSource = produse;
}
6. Se adaugă în interfața grafică, în interiorul borderului, se adaugă un grid în care
vor fi plasate:
a. Un comboBox care va primi numele criteriuFiltrare și pentru care se vor
seta proprietățile IsReadOnly="True". Ulterior, la încărcarea tuturor
elementelor în interfața grafică, acest element va fi populat cu opțiunile:
i. Începe cu;
ii. Conține;
b. Un textBox în care utilizatorul va insera expresia de filtrare. Proprietatea
Text a acestui controler va fi setată cu string alb. Numele obiectului va fi
expresieFiltrare;
c. Un buton care determină filtrarea datelor și pentru care se va seta
proprietatea Content cu valoarea Filtreaza, iar numele va fi tot filtreaza.
7. Se identifică în cod inițializarea componentelor (linia InitializeComponent();).
După această linie se va realiza popularea comboBox-ului și se va selecta valoarea
predefinită prin care utilizatorul trebuie îndrumat să aleagă una dintre opțiuni:

InitializeComponent(); //================> Se adaugă după această linie

criteriuFiltrare.Items.Add("Selecteaza valoare");
criteriuFiltrare.SelectedIndex = 0;
criteriuFiltrare.Items.Add("Incepe cu");
criteriuFiltrare.Items.Add("Contine");

8. Se generează evenimentul de click pe buton, iar în cadrul metodei se va verifica

dacă există selecție pentru criteriul de filtrare.

private void filtreaza_Click(object sender, RoutedEventArgs e)

{
if ((criteriuFiltrare.SelectedIndex > 0) && (expresieFiltrare.Text != ""))
{
populeazaGrid(expresieFiltrare.Text, criteriuFiltrare.SelectedValue.ToString());
}
}