460 likes | 589 Views
WinForms: GUI Programmering i .NET. Kilde: Joe Hummel, kursus i .Net, jan. 2003. Mål.
E N D
WinForms: GUI Programmering i .NET Kilde: Joe Hummel, kursus i .Net, jan. 2003
Mål “.NET supports two types of form-based apps, WinForms and WebForms. WinForms are the traditional, desktop GUI apps. The great news is that Visual Studio .NET enables quick, drag-and-drop construction of form-based applications…” • Event-drevet, code-behind programmering • Visual Studio .NET • WinForms • Controls
Del 1 • Event-drevet, code-behind programmering…
Event-driven applications • Ideen er meget simpel: • “user actions” bliver til “events” • events overføres en for en til applikationen, som processererer eventen vha. en eventhandler • Sådan programmeres de fleste GUI’er… GUI App
Eksempel på GUI-baserede events • Mouse move • Mouse click • Mouse double-click • Key press • Button click • Menu selection • Change in focus • Window activation • etc.
Code-behind • Events håndteres af metoder (eventhandlere) som ligger “bagved” den synlige GUI • I MS-termer kendt som "code-behind" • Vores job bliver at programmere disse metoder…
Call-backs • Events er et call fra et objekt back til os… • Hvordan oprettes forbindelsen? • Visual Studio etablerer forbindelsen via auto-genereret kode
Del 2 • Visual Studio .NET…
Visual Studio .NET (VS.NET) • Ét IDE til alle former for .NET udvikling • Fra klassebiblioteker over form-baserede apps til web services • Du kan bruge C#, VB, C++, J#, etc.
design run break Basal operation • Visual Studio opererer i 1 af 3 tilstande: • design • run • break • Se VS title bar hvis du er i tvivl…
Eksempel: en windows-applikation • GUI apps baseres på forms og controls… • en form repræsenterer et vindue • en form indeholder 0 eller flere controls • en control interagerer med brugeren • Lad os implementere en GUI app i en række skridt…
Step 1 • Opret et nyt projekt af typen “Windows Application” • VS. Opretter automatisk en form…
Step 2 — GUI design • Vælg de ønskede controls fra toolbox’en… • placer musen over toolbox for at se controls • drag-and-drop til formen • placer og tilpas størrelsen på dine control
GUI design … • En simpel regnemaskine: • Placer og konfigurer controls • klik for at vælge • sæt properties via Propertiesvinduet
Step 3 — kodedesign • Implementer formens “Code behind”… • Dobbeltklik på den control du vil implementere • kodeviduet popper automatisk frem
Step 4 — run mode • Kør!
Break mode? • Igangsættes i denne app eksempelvis ved forkert indtastning…
Arbejde med Visual Studio • I Visual Studio arbejder vi med source files, projects & solutions • Source files indeholder kode • extension .cs, .vb, etc. • Et projekt repræsenterer 1 assembly • bruges af VS til at holde styr på source files • alle source files skal skrives i samme sprog • extension .csproj, .vbproj, etc. • Solution (*.sln) files holder styr på projekter • så man kan arbejde med flere projekter
Del 3 • WinForms…
WinForms • Et andet navn for traditionelle, Windowsagtige GUI-applikationer • i modsætning til WebForms, som er web-baserede • Implementeres vha. FCL • dvs. portabelt til enhver .NET platform
object Abstraktion • FCL fungerer som abstraktion • adskiller WinForm app fra den underlæggende platform instance of FCL class System.Windows.Forms.Form CLR Windows OS
Form properties • Form properties kontrollerer formens visuelle fremtræden: • AutoScroll • BackgroundImage • ControlBox • FormBorderStyle (sizable?) • Icon • Location • Size • StartPosition • Text (fx window's caption) • WindowState (minimized, maximized, normal) Form1 form; form = new Form1(); form.WindowState = FormWindowState.Maximized; form.Show();
Form metoder form.Hide(); . . . form.Show(); • Actions der kan udføres på en form: • Activate: giv denne form fokus • Close: luk & frigør tilknyttede ressourcer • Hide: gem, men hold fast i ressourcerne til senere visning. • Refresh: redraw • Show: gør formen synlig på skærmen & activate
Form events • Events du kan reagere på: • find propertiesvinduet • dobbeltklik på event-navnet • Load: lige før formen vises første gang • Closing: når formen lukkes (mulighed for cancel) • Closed: når formen helt sikkert lukkes • Resize: når brugerer ændrer på formstørrelsen • Click: når brugeren klikker på formens baggrund • KeyPress: når brugeren trykker en tast mens formen har fokus
Eksempel • Spørg brugeren før formen lukkes: private void Form1_Closing(object sender, System.ComponentModel.CancelEventArgs e) { DialogResult r; r = MessageBox.Show("Do you really want to close?", "MyApp", MessageBoxButtons.YesNo, MessageBoxIcon.Question, MessageBoxDefaultButton.Button1); if (r == DialogResult.No) e.Cancel = true; }
Part 4 • Controls…
Controls • Brugerinterfaceobjekter på formen: • labels • buttons • text boxes • menus • list & combo boxes • option buttons • check boxes • etc.
object object object object object object Abstraction • Som forms, er controls baseret på klasser i FCL: • System.Windows.Forms.Label • System.Windows.Forms.TextBox • System.Windows.Forms.Button • etc. • Controls er objekter af disse klasser
Hvem opretter alle disse objekter? • Hvem er ansvarlig for oprettelsen af control-objekter? • koden auto-genereres af Visual Studio • Efter formobjektet er oprettet oprettes control-objekterne…
Naming conventions • Sæt dine controllers navne via Name property • The Microsoft Naming Convention: • cmdOK refererer til en command-knap • lstNames refererer til en List Box Control • txtFirstName refererer til en Textbox Control
Labels • Til statisk visning af tekst • bruges til at label andre ting på formen • eller til visning af read-only resultater • Interesting properties: • Text: Det som brugeren ser • Font: Hvordan brugeren ser det
Command-knapper • Til at klikke på og derved få udført en handling • Interessante properties: • Text: Knaptekst • Font: Hvordan knapteksten vises • Enabled: Kan den klikkes på? • AcceptButton: Sat til at klikke knappen på ENTER • CancelButton: Sat til at klikke knappen på ESC • Interessante events: • Click: Når der trykkes på knappen
Text boxes • Mest almindelige control! • Til visning af text • til data fra eksempelvis db • Masser af features…
Text box properties • Basale properties: • Text: tekstboksens indhold (string) • Modified: er teksten modificeret af brugeren? (boolean) • ReadOnly: hvis brugeren ikke skal kunne modificere • Multi-line text boxes? • MultiLine: True tillader flere linier • Lines: array of strings, en for hver linie i tekstboksen • ScrollBars: none, horizontal, vertical eller både horiz. & vert. • AcceptsReturn & AcceptsTab: skal brugeren kunne bruge tabulator og return
Text box methods • Interessante metoder: • Clear: fjern indholdet • Cut, Copy, Paste: interaktion med clipboard’et • Undo: undo sidste rettelse i tekstboksen • Select, SelectAll: vælg noget af/alt indholdet
Text box hændelser • Interesante hændelser: • Enter, Leave: forekommer, når fokus ændres • KeyPress: forekommer når en ascii tast aktiveres • KeyDown, KeyUp: forekommer ved alle taste kombinationer • TextChanged: forekommer når teksten ændres • Validating and Validated • Validating giver dig mulighed for at afvise invalide input
Eksempel: input invalidation • Text boxe kræver ofte validering • .NET tilbyder Validating event • bliver trigget når box’en mister focus cmdOk.CausesValidation = True cmdCancel.CausesValidation = False private void txtName_Validating(object sender, System.ComponentModel.CancelEventArgs e) { if (this.textBox1.Text.Trim() == "") { // invalid input! MessageBox.Show("Please enter name or id..."); e.Cancel = true; // cancel returns focus back to text box } }
Caveats • Validating event’en har nogle “punkter"… • Dels er den fejlbehæftet: • hvis cancel knappen er sat til blive trigget af ESC, bliver den stadig valideret • hvis brugeren klikker X for at lukke form’en, bliver den stadig valideret • Dels, må boksen få fokus: • hvad hvis brugeren trigger OK via Enter (default)? • hvad hvis brugeren klikker OK før den får fokus?
Work-arounds… • Skjul boksen • Lad være med at sætte form’ens CancelButton property • Sikre validation i OK knap: private void cmdOK_Click(object sender, System.EventArgs e) { foreach (Control c in this.Controls) if (c is TextBox) { // check for valid input... c.Focus(); // give control focus, then validate if (!this.Validate()) return; } }
Radio buttons og Check boxes • Tillader brugeren at vælge en eller flere options • Radio buttons: • brugeren kan kun vælge én (mutually-exclusive) • Check boxes: • brugeren kan vælge en eller flere (uafhængige) • Properties & events: • Checked: True hvis valgt, False hvis ikke • CheckedChanged forekommer når "Checked" ændres
Group boxes • Visuel gruppering af controls • Tillader iteration gennem gruppens elementer… foreach (RadioButton rb in this.groupBox1.Controls) if (rb.Checked) MessageBox.Show(rb.Name);
List Boxes • God til at vise /vedligeholde en liste af data • liste af strings • liste af object (list box kalder selv ToString()) Customer[] customers; . . // create & fill array with objects... . // display customers in list box foreach (Customer c in customers) this.listBox1.Items.Add(c); // display name of selected customer (if any) Customer c; c = (Customer) this.listBox1.SelectedItem; if (c == null) return; else MessageBox.Show(c.Name);
Advarsler • Skriv ikke kode der afhænger af rækkefølgen af events… • rækkefølgen er aldrig garanteret • Hver event behandles uafhængigt af andre • Noget kode trigger events bagved koden… • en naturlig sideeffekt af event-drevet programmering this.textBox1.Text = "new value" // triggers TextChanged
Kun toppen af isbjerget… • Menuer, dialoger, toolbars, etc. • Tusinder af andre controls • .NET and ActiveX • højreklik på Toolbox • "Customize Toolbox"
Opsamling • Event-drevet programmering er meget intuitivt i GUI apps • Forms er det første skridt i GUI design • hver form repræsenterer et vindue på skærmen • Konstruktion af GUI foregår ved drag-and-drop • Brugeren interagerer primært med formens control-objekter • labels, text boxes, buttons, etc. • GUI programmering er control programmering!!!
Referencer • Books: • S. Lippman, "C# Primer" • R. Grimes, "Developing Applications with Visual Studio .NET" • De bedste bøger om GUI er pt VB-baserede: • J. Savage, "The VB.NET Coach" (introductory) • F. Balena, "Programming Microsoft VB .NET (Core Reference)" (broad coverage, intermediate level)