I denne C # programmeringsvejledning vil jeg koncentrere mig om de avancerede kontroller som ComboBoxes, Grids og ListViews og viser dig, hvordan du sandsynligvis bruger dem. Jeg berører ikke data og binder indtil en senere tutorial. Lad os begynde med en simpel kontrol, en ComboBox.
I hjertet af en kombinationsbokse er en samling af varer, og den enkleste måde at udfylde dette på er at slippe en kombinationsbokse på skærmen, vælg egenskaber (hvis du ikke kan se egenskabsvinduerne, skal du klikke på Vis i øverste menu og derefter på Egenskabsvindue), finde elementer og klikke på ellipserne knap. Du kan derefter indtaste strengene, kompilere programmet og trække kombinationsboksen ned for at se valg.
Stop nu programmet og tilføj et par flere numre: fire, fem.. op til ti. Når du kører det, vil du kun se 8, fordi det er standardværdien for MaxDropDownItems. Du er velkommen til at indstille den til 20 eller 3 og derefter køre den for at se, hvad den gør.
Det er irriterende, at når det åbner siger det comboBox1, og du kan redigere det. Det er ikke det, vi ønsker. Find DropDownStyle-ejendommen, og skift DropDown til DropDownList. (Det er en kombinationsboks!). Nu er der ingen tekst, og den kan ikke redigeres. Du kan vælge et af numrene, men det åbnes altid tomt. Hvordan vælger vi et tal til at begynde med? Det er ikke en egenskab, du kan indstille på designtidspunktet, men at tilføje denne linje vil gøre det.
Tilføj denne linje i Form1 () -konstruktøren. Du skal se koden for formularen (højreklik på Fra1.cs i Solution Explorer og klik på Vis kode). Find InitializeComponent (); og tilføj den linje straks efter dette.
Hvis du indstiller DropDownStyle-egenskaben til kombinationen til Simple og kører programmet, får du intet. Det vil ikke vælge eller klikke eller svare. Hvorfor? For på designtidspunktet skal du tage fat i det nederste strækhåndtag og gøre hele kontrollen højere.
I eksempel 2 har jeg omdøbt ComboBox til combo, ændret combo DropDownStyle tilbage til DropDown, så den kan redigeres og tilføjes en Tilføj knap kaldet btnAdd. Jeg har dobbeltklikket på tilføjelsesknappen for at oprette en begivenhed btnAdd_Click () begivenhedshåndterer og tilføjet denne begivenhedslinje.
Når du kører programmet, skal du indtaste et nyt nummer, sige Eleven og klikke på tilføj. Begivenhedshåndtereren tager den tekst, du har indtastet (i kombination) Tekst) og føjer det til Combo's artikelsamling. Klik på Combo, og vi har nu en ny post elleve. Sådan tilføjer du en ny streng til en Combo. At fjerne en er lidt mere kompliceret, da du skal finde indekset for den streng, du vil fjerne, og derefter fjerne den. Metoden RemoveAt vist nedenfor er en indsamlingsmetode til at gøre dette. Du skal bare specificere hvilket element i parameteren Fjernindex.
fjerner strengen i position RemoveIndex. Hvis der er n elementer i kombinationen, er de gyldige værdier 0 til n-1. For 10 poster værdier 0..9.
Hvis dette ikke finder teksten, returnerer det -1, ellers returnerer det 0-baserede indeks for strengen i kombinationslisten. Der er også en overbelastet metode til FindStringExact, som giver dig mulighed for at specificere, hvor du starter søgningen fra, så du kan springe over den første osv., Hvis du har duplikater. Dette kan være praktisk til fjernelse af duplikater på en liste.
Ved at klikke på btnAddMany_Click () ryddes teksten fra kombinationsboksen, ryddes derefter indholdet af kombinationsbokselementerne og kalder derefter kombinationsboksen. AddRange (for at tilføje strengene fra værdierne. Efter at have gjort dette, indstiller den kombinationsboksen SelectedIndex til 0. Dette viser det første element i kombinationsboksen. Hvis du laver tilføjelse eller sletning af elementer i en ComboBox, er det bedst at holde styr på, hvilket element der er valgt. Indstilling af SelectedIndex til -1 skjuler de valgte emner.
Knappen Tilføj partier rydder listen og tilføjer 10.000 numre. Jeg har tilføjet combo. StartUpdate () og combo, EndUpdate () ringer rundt om løkken for at forhindre, at flimmer fra Windows forsøger at opdatere kontrollen. På min tre år gamle pc tager det lidt over et sekund at tilføje 100.000 numre i kombinationsboksen.
Dette er en praktisk kontrol til visning af tabelldata uden kompleksiteten af et gitter. Du kan vise emner som store eller små ikoner, som en liste over ikoner i en lodret liste eller mest nyttigt som en liste over elementer og underemner i et gitter, og det er, hvad vi vil gøre her.
Når du har droppet en ListView på en formular, skal du klikke på egenskaben for kolonner og tilføje 4 kolonner. Disse vil være TownName, X, Y og Pop. Indstil teksten for hver ColumnHeader. Hvis du ikke kan se overskrifterne på ListView (efter at du har tilføjet alle 4), skal du indstille ListViews View-egenskab til Detaljer. Hvis du ser koden til dette eksempel, skal du bladre ned til det, hvor det står Windows Form Designer-kode og udvide det område, du ser koden, der opretter ListView. Det er nyttigt at se, hvordan systemet fungerer, og du kan kopiere denne kode og bruge den selv.
Du kan indstille bredden for hver kolonne manuelt ved at flytte markøren over overskriften og trække den. Eller du kan gøre det i den synlige kode, når du har udvidet formdesignregionen. Du skal se kode som denne:
For populationssøjlen afspejles ændringer i koden i designeren og vice versa. Bemærk, at selv hvis du indstiller den låste egenskab til sand, påvirker dette kun designeren, og du kan ændre størrelsen på kolonnerne på kørselstidspunktet.
ListViews leveres også med et antal dynamiske egenskaber. Klik på (Dynamiske egenskaber), og marker den ønskede egenskab. Når du indstiller en egenskab til at være dynamisk, opretter den en XML .config-fil og tilføjer den til Solution Explorer.
At foretage ændringer på designtidspunktet er en ting, men vi er virkelig nødt til at gøre det, når programmet kører. En ListView består af 0 eller flere genstande. Hvert element (en ListViewItem) har en tekstegenskab og en SubItems-samling. Den første kolonne viser vareteksten, den næste kolonne viser SubItem [0] .text derefter SubItem [1] .text og så videre.
Jeg har tilføjet en knap for at tilføje en række og et redigeringsfelt til bynavnet. Indtast ethvert navn i boksen, og klik på Tilføj række. Dette tilføjer en ny række til ListView med bynavnet sat i den første kolonne og de næste tre kolonner (Underemner [0..2]) udfyldes med tilfældige tal (konverteret til strenge) ved at tilføje disse strenge til dem.
Sæt nu egenskaben ListView Multiselect til falsk. Vi ønsker kun at vælge et element ad gangen, men hvis du ønsker at fjerne mere på én gang, er det ens, medmindre du er nødt til at gå igennem omvendt. (Hvis du sløjfer i normal rækkefølge og sletter poster, er de efterfølgende elementer ikke synkroniseret med de valgte indekser).
Højreklik-menuen fungerer ikke endnu, da vi ikke har nogen menupunkter at vise på den. Så højreklik på PopupMenu (under formularen), og du vil se Kontekstmenu vises øverst på formularen, hvor den normale menueditor vises. Klik på det, og hvor det står Type her, skriv Fjern emne. Egenskabsvinduet viser et MenuItem så omdøbe det til at mniRemove. Dobbeltklik på dette menupunkt, og du skal få menuItem1_Click kodehændelsesfunktion. Tilføj denne kode, så den ser sådan ud.
Hvis du mister fjernelsen af synet, skal du bare klikke på PopupMenu-kontrollen på egen hånd under formularen i formen Designer. Det bringer det tilbage til syne.
Men hvis du kører det og ikke tilføjer et element og vælger det, når du højreklikker og får menuen og klikker på Fjern element, vil det give en undtagelse, fordi der ikke er noget valgt element. Det er dårlig programmering, så her er hvordan du løser det. Dobbeltklik på pop-up-begivenheden, og tilføj denne kodelinje.
En DataGridView er både den mest komplekse og den mest nyttige komponent, der leveres gratis med C #. Det fungerer med begge datakilder (dvs. data fra en database) og uden (dvs. data, som du tilføjer programmatisk). For resten af denne tutorial viser jeg at bruge det uden datakilder. For enklere visningsbehov kan du muligvis finde en almindelig ListView mere egnet.
Hvis du har brugt en ældre DataGrid-kontrol, er dette bare en af dem på steroider: det giver dig flere indbyggede kolonnetyper, kan arbejde med interne såvel som eksterne data, mere tilpasning af display (og begivenheder) og giver mere kontrol over cellehåndtering med fryserækker og kolonner.
Når du designer formularer med gitterdata, er det mest almindeligt at specificere forskellige kolonnetyper. Du har muligvis afkrydsningsfelter i en kolonne, læse eller redigerbar tekst i en anden og med kursusnumre. Disse kolonnetyper er også normalt justeret forskelligt med numre, der generelt er højre justeret, så decimalpunkterne stiller op. På kolonnerniveau kan du vælge mellem Knap, afkrydsningsfelt, ComboBox, Image, TextBox og Links. hvis disse ikke er nok, kan du designe dine egne tilpassede typer.
Den nemmeste måde at tilføje kolonner er ved at designe i IDE. Som vi har set før, skriver dette bare kode for dig, og når du har gjort det et par gange, foretrækker du måske at tilføje koden selv. Når du først har gjort dette et par gange, giver det dig indsigt i, hvordan du gør det programmatisk.
Lad os starte med at tilføje nogle kolonner, slip en DataGridView på formularen og klik på den lille pil i øverste højre hjørne. Klik derefter på Tilføj kolonne. Gør dette tre gange. Det vises en dialogboks Tilføj kolonne, hvor du indstiller navnet på kolonnen, teksten skal vises øverst på kolonnen og lader dig vælge dens type. Den første kolonne er dit navn, og det er standardtekstboksen (dataGridViewTextBoxColumn). Indstil også overskriftteksten til dit navn. Opret den anden kolonne Alder og brug en ComboBox. Den tredje kolonne er tilladt og er en CheckBox-kolonne.
Når du har tilføjet alle tre, skal du se en række med tre kolonner med en kombination i midten (Alder) og et afkrydsningsfelt i kolonnen Tilladt. Hvis du klikker på DataGridView, skal du i egenskabsinspektøren finde kolonner og klikke på (samling). Dette åbner en dialog, hvor du kan indstille egenskaber for hver kolonne, f.eks. Individuelle cellefarver, værktøjstiptekst, bredde, minimumsbredde osv. Hvis du kompilerer og kører, vil du bemærke, at du kan ændre kolonnebredder og køretid. I egenskabsinspektøren for den vigtigste DataGridView kan du indstille AllowUser til at ændre størrelse på kolonner til usand for at forhindre det.
Vi vil tilføje rækker til DataGridView-kontrollen i kode og ex3.cs i eksemplet filen har denne kode. Start med at tilføje en TextEdit-boks, en ComboBox og en knap til formularen med DataGridView på. Indstil egenskaben DataGridView AllowUserto AddRows til falsk. Jeg bruger også labels og kaldes combobox cbAges, knappen btnAddRow og TextBox tbName. Jeg har også tilføjet en Luk-knap til formularen og dobbeltklikket på den for at generere et btnClose_Click-begivenhedshåndterings-skelet. At tilføje ordet Luk () der gør det til at arbejde.
Som standard er egenskaben Tilføj knap aktiveret aktiveret falsk ved start. Vi vil ikke tilføje nogen rækker til DataGridView, medmindre der er tekst i både Name TextEdit-boksen og ComboBox. Jeg oprettede metoden CheckAddButton og genererede derefter en Leave-begivenhedshåndterer til redigeringsfeltet Name Text ved at dobbeltklikke ved siden af ordet Leave i egenskaberne, da det viste begivenhederne. Egenskaber-boksen viser dette på billedet ovenfor. Som standard viser feltet Egenskaber egenskaber, men du kan se begivenhedshåndterere ved at klikke på lynknappen.
Du kunne bruge har brugt TextChanged-begivenheden i stedet, selvom dette vil kalde CheckAddButton () metode til hvert tastetryk i stedet for når kontrol styres, dvs. når en anden kontrol vinder fokus. I aldre-kombinationen brugte jeg TextChanged-begivenheden, men valgte tbName_Leave-begivenhedshåndtereren i stedet for at dobbeltklikke for at oprette en ny begivenhedshåndterer.
Ikke alle begivenheder er kompatible, fordi nogle begivenheder giver ekstra parametre, men hvis du kan se en tidligere genereret handler, ja, kan du bruge den. Det er hovedsageligt et spørgsmål om præference, du kan have en separat begivenhedshåndterer for enhver kontrol, du er bruger eller deler begivenhedshåndterere (som jeg gjorde), når de har en fælles hændelsessignatur, dvs. parametrene er samme.
Jeg omdøbte DataGridView-komponenten til dGView for korthed og dobbeltklikkede på AddRow for at generere et begivenhedshåndterings-skelet. Denne kode nedenfor tilføjer en ny tom række, får rækkerindekset (det er RowCount-1, da det lige er blevet tilføjet og RowCount er 0 baseret) og får derefter adgang til den række via dens indeks og indstiller værdierne i cellerne på den række for kolonnerne YourName og Alder.
Når du designer en formular, skal du tænke på containere og kontroller, og hvilke grupper af kontroller, der skal holdes sammen. I vestlige kulturer læser folk fra top til venstre til højre, så det er lettere at læse på den måde.
En container er en af de kontroller, der kan indeholde andre kontroller. De, der findes i værktøjskassen, inkluderer panelet, FlowLayoutpanel, SplitContainer, TabControl og TableLayoutPanel. Hvis du ikke kan se værktøjskassen, skal du bruge menuen Vis og du finder den. Beholdere holder kontrollerne sammen, og hvis du flytter eller ændrer størrelse på beholderen, vil det påvirke placeringen af kontrollerne. Flyt bare kontrol over containeren i Form Designer, og det vil erkende, at Containeren nu er ansvarlig.
Et panel ligner en GroupBox, men en GroupBox kan ikke rulle, men kan vise en billedtekst og har som standard en ramme. Paneler kan have grænser, men gør det som standard ikke. Jeg bruger GroupBoxes, fordi de ser pænere ud, og det er vigtigt, fordi:
Paneler er også nyttige til gruppering af containere, så du har muligvis to eller flere GroupBoxer på et panel.
Her er et tip til arbejde med containere. Slip en delt beholder på en formular. Klik på det venstre panel og derefter på det højre. Prøv nu at fjerne SplitContainer fra formularen. Det er vanskeligt, indtil du højreklikker på et af panelerne og derefter klikker på Vælg SplitContainer1. Når det hele er valgt, kan du slette det. En anden måde, der gælder for alle kontroller og containere, er tryk på Esc-tasten for at vælge forælder.
Beholdere kan også hekke inde i hinanden. Bare træk en lille oven på en større, så ser du en tynd lodret linje kort for at vise, at den ene nu er inde i den anden. Når du trækker forældrekontaineren, flyttes barnet med det. Eksempel 5 viser dette. Som standard er det lysebrune panel ikke inde i beholderen, så når du klikker på flytknappen flyttes GroupBox, men panelet er det ikke. Træk nu panelet over GroupBox, så det er helt inde i Groupbox. Når du kompilerer og kører denne gang, flyttes begge sammen ved at klikke på knappen Flyt.
En TableLayoutpanel er en interessant container. Det er en tabelstruktur, der er organiseret som et 2D-gitter af celler, hvor hver celle kun indeholder en kontrol. Du kan ikke have mere end en kontrol i en celle. Du kan specificere, hvordan tabellen vokser, når der tilføjes flere kontroller, eller selvom den ikke vokser. Det ser ud til at være modelleret på en HTML-tabel, fordi celler kan spænde over kolonner eller rækker. Selv forankringsadfærd for børnekontroller i containeren afhænger af indstillingerne for margin og polstring. Vi vil se mere om ankre på næste side.
I eksempel Ex6.cs er jeg startet med en grundlæggende tabel med to kolonner og specificeret via dialogboksen Kontrol og række stilarter (vælg kontrol og klik på det lille højre peger trekant beliggende nær øverste højre for at se en liste over opgaver og klikke på den sidste) at den venstre kolonne er 40% og højre kolonne 60% af bredde. Det giver dig mulighed for at specificere kolonnebredder i absolutte pixeltermer, i procent, eller du kan bare lade det AutoSize. En hurtigere måde at komme til denne dialog på er bare at klikke på Samling ud for kolonner i egenskabsvinduet.
Jeg har tilføjet en AddRow-knap og forladt egenskaben GrowStyle med dens standardværdi for AddRows. Når tabellen bliver fuld, tilføjer den en ny række. Alternativt kan du indstille dens værdier til AddColumns og FixedSize, så det ikke kan vokse længere. Når du klikker på knappen Tilføj kontrol, i Ex6, kaldes den metoden AddLabel () tre gange og AddCheckBox () én gang. Hver metode opretter en forekomst af kontrollen og kalder derefter tblPanel. Controls. Tilføj () Når den 2. kontrol er tilføjet, får den tredje kontrol til, at tabellen vokser. Billedet viser det, når knappen Tilføj kontrol er blevet klikket én gang.
I tilfælde af at du spekulerer på, hvor standardværdierne kommer fra i metoderne AddCheckbox () og AddLabel (), som jeg kalder, var kontrollen oprindeligt manuelt tilføjet til tabellen i designeren og derefter koden for at oprette den og initialisere den blev kopieret inde fra dette område. Du finder initialiseringskoden i opkaldet InitializeComponent-metoden, når du klikker på + til venstre for regionen nedenfor:
Du kan vælge flere kontroller på samme tid ved at holde Skift-tasten nede, når du vælger den anden og efterfølgende kontrol, endda kontroller af forskellige typer. Vinduet Egenskaber viser bare de egenskaber, der er fælles for begge, så du kan indstille dem alle til samme størrelse, farve og tekstfelter osv. Selv de samme begivenhedshåndterere kan tildeles flere kontroller.
Afhængig af brugen vil nogle formularer ofte ende med at ændre størrelsen af brugeren. Intet ser værre ud end at ændre størrelse på en form og se kontroller forblive i samme position. Alle kontroller har ankre, der lader dig "fastgøre" dem på de 4 kanter, så kontrollen bevæger sig eller strækker sig, når en fastgjort kant bevæges. Dette fører til følgende opførsel, når en form strækkes fra højre kant:
For knapper som Luk, der traditionelt er nederst til højre, er opførsel 3 det, der er nødvendigt. ListViews og DataGridViews er bedst med 2, hvis antallet af kolonner er nok til at oversvømme formen og skal rulles). Top og venstre ankre er standard. Ejendomsvinduet indeholder en smuk lille redaktør, der ligner England Flag. Klik bare på en af bjælkerne (to vandrette og to lodrette) for at indstille eller rydde det passende anker, som vist på billedet ovenfor.
En egenskab, der ikke får meget omtale, er egenskaben Tag, og alligevel kan den være utroligt nyttig. I egenskabsvinduet kan du kun tildele tekst, men i din kode kan du have en hvilken som helst værdi, der stammer fra Objekt.
Jeg har brugt Tag til at indeholde et helt objekt, mens jeg kun viser et par af dens egenskaber i en ListView. F.eks. Ønsker du muligvis kun at vise et kundenavn og -nummer på en liste over kundeoversigter. Men højreklik på den valgte kunde og åbn derefter en formular med alle kundens detaljer. Dette er let, hvis du bygger kundelisten ved at læse alle kundens detaljer i hukommelsen og tildele en henvisning til kundeklasseobjektet i taggen. Alle kontroller har et mærke.
En TabControl er en praktisk måde at spare formularplads ved at have flere faner. Hver fane kan have et ikon eller tekst, og du kan vælge en hvilken som helst fane og vise dens kontroller. TabControl er en container, men den indeholder kun TabPages. Hver faneblad er også en beholder, der kan tilføjes normale kontroller til den.
I eksempel x7.cs har jeg oprettet et sidepanel med to faner med den første fane kaldet Kontrol med tre knapper og et afkrydsningsfelt på det. Den anden faneside er mærket Logs og bruges til at vise alle de loggede handlinger, der inkluderer at klikke på en knap eller skifte til et afkrydsningsfelt. En metode kaldet Log () kaldes til at logge hvert knapklik osv. Det føjer den medfølgende streng til en ListBox.
Jeg har også tilføjet to popup-menuer med højreklik til TabControl på den sædvanlige måde. Tilføj først en ContextMenuStrip til formularen og indstil den i egenskaben ContextStripMenu i TabControl. De to menuvalg er Tilføj ny side og Fjern denne side. Jeg har dog begrænset fjernelsen af sider, så kun de nyligt tilføjede faneblade kan fjernes og ikke de originale to.
Dette er let, bare oprette en ny faneside, giv den en teksttekst til fanen og føj den derefter til fanen TabPages i Tabs TabControl
Fjernelse af en side er kun et spørgsmål om at kalde TabPages. FjernAt () ved hjælp af fanerne. ValgtIndex for at få den aktuelt valgte fane.
I denne tutorial har vi set, hvordan nogle af de mere sofistikerede kontroller fungerer, og hvordan man bruger dem. I den næste tutorial vil jeg fortsætte med GUI-temaet og se på baggrundens arbejdertråd og vise, hvordan man bruger det.