Programiranje naprednih winform-ova u C #

U ovom udžbeniku za programiranje C # usredotočit ću se na napredne kontrole kao što su ComboBoxes, Grids i ListViews i prikazati vam način na koji ćete ih najvjerovatnije koristiti. Ne diram podatke i obvezujuće sve do kasnijeg vodiča. Započnimo s jednostavnom kontrolom, ComboBoxom.

U središtu Comboa je kolekcija predmeta, a najjednostavniji način puštanja toga je ispuštanje kombinacije na zaslon, odabir svojstava (ako ne možete vidjeti prozore svojstava, kliknite Pogled na gornjem izborniku, a zatim Svojstvo prozor), pronađite stavke i kliknite elipse dugme. Nakon toga možete upisati žice, sastaviti program i povući kombinaciju prema dolje da biste vidjeli izbore.

Sada zaustavite program i dodajte još nekoliko brojeva: četiri, pet.. do deset. Kad ga pokrenete vidjet ćete samo 8 jer je to zadana vrijednost MaxDropDownItems. Slobodno ga postavite na 20 ili 3, a zatim ga pokrenite da vidite što radi.

Iritantno je da kada se otvori, piše comboBox1 i možete je urediti. To nije ono što želimo. Pronađite svojstvo DropDownStyle i promijenite DropDown u DropDownList. (To je kombinacija!). Sada nema teksta i nije ga moguće uređivati. Možete odabrati jedan od brojeva, ali on se uvijek otvara prazan. Kako odabrati broj za početak? Pa to nije svojstvo koje možete postaviti u vrijeme dizajniranja, ali dodavanje ove linije će to učiniti.

instagram viewer

Dodajte taj redak u konstruktor Form1 (). Morate pogledati kod za obrazac (u pregledniku Solution Explorer desnom tipkom miša kliknite From1.cs i kliknite View Code. Nađi InitializeComponent (); i dodajte tu liniju odmah nakon ovoga.

Ako svojstvo DropDownStyle za kombo postavite na Jednostavno i pokrenete program, nećete dobiti ništa. Neće odabrati ili kliknuti ili odgovoriti. Zašto? Jer u vrijeme dizajniranja morate zgrabiti ručicu za niže rastezanje i cijelu kontrolu učiniti višom.

U primjeru 2, preimenovao sam ComboBox u combo, promijenio Combo DropDownStyle natrag u DropDown kako bi se mogao urediti i dodao gumb Add koji se zove btnAdd. Dvaput sam kliknuo gumb za dodavanje da bih stvorio događaj za obradu događaja btnAdd_Click () i dodao ovu liniju događaja.

Sada kada pokrenete program, utipkajte novi broj, recimo Eleven i kliknite dodaj. Voditelj događaja uzima tekst koji ste upisali (u kombinaciji). Tekst) i dodaje ga u zbirku predmeta Combo. Kliknite na Combo i sada imamo novi unos Eleven. Tako dodajete novi niz u kombinirani. Da biste uklonili jedan je malo složenije jer morate pronaći indeks niza koji želite ukloniti i uklonite ga. Metoda RemoveAt prikazana dolje je metoda prikupljanja za to. morate samo odrediti koja stavka u parametru Removeindex.

će ukloniti niz na položaju RemoveIndex. Ako u kombinaciji postoji n stavki, tada su važeće vrijednosti od 0 do n-1. Za 10 predmeta vrijednosti 0..9.

Ako ne nađe tekst, vraća se -1, inače vraća 0 na nizu indeksa na kombiniranom popisu. Postoji i preopterećena metoda FindStringExact koja vam omogućuje da odredite odakle pokrećete pretraživanje, tako da možete preskočiti prvu itd. Ako imate duplikate. Ovo bi moglo biti korisno za uklanjanje duplikata s popisa.

Klikom na btnAddMany_Click (), briše se tekst iz kombinacije, a zatim se briše sadržaj zbirke kombiniranih predmeta, a zatim se naziva kombinacija. AddRange (za dodavanje žice iz niza vrijednosti. Nakon što to učini, postavi kombinirani SelectedIndex na 0. Ovo pokazuje prvi element u kombinaciji. Ako dodajete ili brišete stavke u ComboBoxu, tada je najbolje pratiti koji je predmet odabran. Postavljanje SelectedIndex na -1 skriva odabrane stavke.

Gumb Add Lots briše popis i dodaje 10 000 brojeva. Dodao sam kombinaciju. BeginUpdate () i kombinirano, EndUpdate () poziva oko petlje da se spriječi bilo kakav treper od Windows-a koji pokušava ažurirati kontrolu. Na mom trogodišnjem računalu potrebno je nešto više od sekunde da u kombo dodate 100.000 brojeva.

Ovo je praktična kontrola za prikaz tabelarnih podataka bez složenosti mreže. Stavke možete prikazati kao velike ili male ikone, kao popis ikona na okomitom popisu ili najkorisnije kao popis stavki i podnaslova u mreži i to ćemo učiniti ovdje.

Nakon što ispustite ListView na obrascu, kliknite svojstvo stupaca i dodajte 4 stupca. To će biti TownName, X, Y i Pop. Postavite tekst za svaki ColumnHeader. Ako ne vidite naslove na ListView (nakon što ste dodali svih 4), postavite svojstvo ViewView ListView na Detalji. Ako pregledavate kôd za ovaj primjer, tada potražite mjesto na kojem piše kôd Windows Designer Code i proširite regiju na kojoj vidite kôd koji stvara ListView. Korisno je vidjeti kako sustav funkcionira i možete kopirati ovaj kôd i sami ga koristiti.

Širinu za svaki stupac možete postaviti ručno pomicanjem kursora preko zaglavlja i povlačenjem ga. Ili to možete učiniti u kodu koji je vidljiv nakon što ste proširili područje dizajnera oblika. Trebali biste vidjeti kôd ovako:

Za stupac populacije, Promjene koda odražavaju se u dizajnu i obrnuto. Imajte na umu da čak i ako svojstvo Zaključana postavite na true, to utječe samo na dizajnera i na vrijeme izvođenja možete promijeniti veličinu stupaca.

ListViews također dolazi s brojnim dinamičkim svojstvima. Kliknite (Dynamic Properties) i označite željenu nekretninu. Kad svojstvo postavite na dinamički način, stvara XML .config datoteku i dodaje je u Solution Explorer.

Uvođenje promjena u vrijeme dizajniranja jedna je stvar, ali to stvarno trebamo učiniti kada se program pokreće. ListView se sastoji od 0 ili više stavki. Svaka stavka (ListViewItem) ima tekst svojstvo i zbirku SubItems. Prvi stupac prikazuje tekst predmeta, a sljedeći stupac prikazuje SubItem [0] .text, zatim SubItem [1] .text i tako dalje.

Dodao sam gumb za dodavanje retka i okvir za uređivanje Naziv grada. Unesite bilo koje ime u okvir i kliknite Dodaj red. Ovo dodaje novi redak ListViewu s nazivom grada postavljenim u prvi stupac i sljedeća tri stupca (SubItems [0..2]) popunjava se slučajnim brojevima (pretvara se u žice) dodavanjem tih nizova u ih.

Sada postavite svojstvo ListView Multiselect na false. Želimo odabrati samo jednu stavku odjednom, ali ako želite ukloniti više odjednom slično je, osim što ćete je morati obrnuti unazad. (Ako petljate u normalnom redoslijedu i brišete stavke, tada se sljedeći predmeti ne sinkroniziraju s odabranim indeksima).

Izbornik desnog klika još uvijek ne radi jer na njemu nemamo stavke izbornika. Tako desnom tipkom miša kliknite PopupMenu (ispod obrasca) i vidjet ćete Kontekstni izbornik pri vrhu obrasca gdje se pojavljuje uobičajeni uređivač izbornika. Kliknite i tamo gdje piše Upišite ovdje, upišite Remove Item. Prozor s svojstvima prikazat će MenuItem pa preimenovati taj u mniRemove. Dvaput kliknite ovu stavku izbornika i trebali biste dobiti menuItem1_Click funkciju kôda za obradu događaja. Dodajte ovaj kôd tako da izgleda ovako.

Ako izgubite iz vida Ukloni predmet, samo kliknite PopupMenu kontrolu pod obrascem u obrascu Dizajner. To će ga vratiti u obzir.

Međutim, ako je pokrenete i ne dodate stavku i ne odaberete je, desnim klikom miša i otvaranjem izbornika te pritiskom na Ukloni stavku, dat će se izuzetak jer nema odabrane stavke. To je loše programiranje, pa evo kako ćete to popraviti. Dvaput kliknite skočni događaj i dodajte ovu liniju koda.

DataGridView je i najsloženija i najkorisnija komponenta koja se besplatno nudi s C #. Radi s izvorima podataka (tj. Podacima iz baze podataka) i bez (tj. S podacima koje programsko dodajete). Za ostatak ovog vodiča prikazat ću ga koristeći bez izvora podataka. Za jednostavnije potrebe prikaza možda ćete naći jednostavniji ListView.

Ako ste koristili stariju kontrolu DataGrid-a, ovo je samo jedan od onih na steroidima: on vam pruža više ugrađenih tipova stupaca, može raditi s unutarnjih i vanjskih podataka, više prilagođavanja prikaza (i događaja) i daje veću kontrolu nad upravljanjem ćelijom sa zamrzavajućim redovima i stupovi.

Kada dizajnirate obrasce s mrežnim podacima, najčešće je navesti različite vrste stupaca. Možda imate potvrdne okvire u jednom stupcu, samo za čitanje ili uređivanje teksta u drugom i brojeve tečaja. Te se vrste stupaca također obično različito poravnavaju s brojevima koji su obično ispravno poravnani, tako da se decimalne točke nalaze prema gore. Na razini stupca možete birati gumb, potvrdni okvir, ComboBox, sliku, TextBox i veze. ako vam to nije dovoljno možete oskvrnuti vlastite prilagođene vrste.

Najlakši način dodavanja stupaca je dizajniranjem u IDE-u. Kao što smo vidjeli prije ovoga, samo piše kod za vas i kad to učinite nekoliko puta, radije dodajte kôd sami. Nakon što to učinite nekoliko puta, pruža vam uvid u to kako to programsko učiniti.

Započnimo dodavanjem nekih stupaca, ispustite DataGridView na obrazac i kliknite malu strelicu u gornjem desnom kutu. Zatim kliknite Dodaj stupac. Učinite to tri puta. Pojavit će se dijaloški okvir Dodaj stupac u kojem ste postavili naziv stupca, tekst koji će se prikazati na vrhu stupca i omogućuje vam odabir njegove vrste. Prvi stupac je YourName i to je zadani TextBox (dataGridViewTextBoxColumn). Postavite tekst zaglavlja i na svoje ime. Napravite drugi stupac Age i koristite ComboBox. Treći stupac je Dopušteno i stupac je CheckBox.

Nakon dodavanja sva tri trebali biste vidjeti red od tri stupca s kombinacijom u sredini (Dob) i potvrdnim okvirom u stupcu Dozvoljeno. Ako kliknete DataGridView, tada u inspektoru svojstava pronađite stupce i kliknite (zbirka). Otvara se dijaloški okvir u kojem možete postaviti svojstva za svaki stupac, poput pojedinačnih boja ćelija, teksta alata, širine, minimalne širine itd. Ako sastavite i pokrenete primijetit ćete da možete promijeniti širinu stupca i vrijeme izvođenja. U inspektoru svojstava za glavni DataGridView možete postaviti AllowUser da promijeni veličinu Column u false da to spriječi.

Dat ćemo retke kontroli DataGridView u kodu, a ex3.cs u datoteci primjera ima ovaj kôd. Započinjući dodavanjem TextEdit okvira, ComboBoxa i gumba u obrazac s DataGridView na njemu. Postavite svojstvo DataGridView AllowUserto AddRows na false. Koristim i naljepnice i nazvao sam kombinirani okvir cbAges, gumb btnAddRow i TextBox tbName. Za obrazac sam također dodao gumb za zatvaranje i dvaput ga kliknuo da bih stvorio kostur za obradu događaja btnClose_Click. Dodavanje riječi Close () čini to.

Prema zadanim postavkama svojstvo s omogućenom tipkom Dodaj redak postavljeno je na početak. Ne želimo dodavati nijedne retke u DataGridView osim ako u polju Name TextEdit i ComboBox ne postoji Text. Napravio sam metodu CheckAddButton, a zatim generirao alat za obradu događaja Ostavite za okvir za uređivanje Imena teksta dvostrukim klikom pored riječi Ostavite u Svojstvima kada je prikazivao događaje. Okvir Svojstva to pokazuje na gornjoj slici. Prema zadanim postavkama, u okviru okvira Properties (Svojstva) prikazana su svojstva, ali upravljače događajima možete vidjeti klikom na gumb munje.

Možete umjesto toga koristiti tekst TextChanged, iako će se to zvati CheckAddButton () metoda za svako pritiskanje tipke, a ne kada se prepusti kontrola, tj. kada se dobije druga kontrola usredotočenost. Na Ages Combo koristio sam TextChanged događaj, ali sam odabrao obrađivač događaja tbName_Leave umjesto da dvaput kliknem da bih stvorio novi rukovatelj događaja.

Nisu svi događaji kompatibilni jer neki događaji daju dodatne parametre, ali ako možete vidjeti prethodno generirani rukovatelj onda da, možete ga koristiti. Uglavnom je stvar preferencije, možete imati zaseban program za obradu događaja za svaku kontrolu korištenje ili dijeljenje alata za obradu događaja (kao što sam to učinio) kad imaju zajednički potpis događaja, tj. parametri su isti.

Preimenovao sam komponentu DataGridView u dGView radi sažetosti i dvaput kliknuo na AddRow da bih stvorio kostur za obradu događaja. Ovaj kôd u nastavku dodaje novi prazni red, dobiva indeks redaka (to je RowCount-1 kao što je upravo dodan i RowCount je 0 temelji se), a zatim pristupi tom retku preko indeksa i postavlja vrijednosti u ćelijama u tom retku za stupce YourName i Dob.

Prilikom dizajniranja obrasca trebate razmisliti u smislu spremnika i kontrola i koje skupine kontrola treba držati zajedno. U zapadnim kulturama ionako ljudi čitaju od gore lijeve do donje desne strane tako da je lakše čitati na taj način.

Spremnik je svaka od kontrola koja može sadržavati druge kontrole. Oni koji se nalaze u Toolbox-u uključuju Panel, FlowLayoutpanel, SplitContainer, TabControl i TableLayoutPanel. Ako ne vidite okvir alata, koristite izbornik View i naći ćete ga. Kontejneri drže komande zajedno i ako pomaknete ili promijenite veličinu spremnika, to će utjecati na pozicioniranje kontrola. Samo premjestite kontrole nad spremnikom u Oblikovaču obrasca i on će prepoznati da je Kontejner sada glavni.

Panel je sličan GroupBox-u, ali GroupBox se ne može pomicati, ali može prikazati naslov i zadano ima obrub. Ploče mogu imati obrube, ali prema zadanim postavkama ne. Koristim GroupBoxe jer izgledaju ljepše, a ovo je važno jer:

Ploče su zgodne i za grupiranje spremnika, tako da na ploči možete imati dva ili više GroupBox-a.

Evo savjeta za rad s spremnicima. Na obrascu bacite split kontejner. Kliknite lijevu ploču, a zatim desnu. Sada pokušajte i ukloniti SplitContainer iz obrasca. Teško je dok desnom tipkom miša ne kliknete na jednu od ploča, a zatim kliknete Select SplitContainer1. Kad je sve odabrano, možete ga izbrisati. Drugi način koji se odnosi na sve kontrole i spremnike je pritisnite tipku Esc za odabir roditelja.

Kontejneri se mogu gnijezditi i jedan u drugom. Jednostavno povucite malu na većoj i vidjet ćete da se nakratko pojavljuje tanka okomita linija koja pokazuje da je jedna sada unutar druge. Kad povučete roditeljski spremnik, dijete se pomiče sa sobom. Primjer 5 to pokazuje. Prema zadanom svijetlo smeđa ploča nije unutar spremnika, tako da kada kliknete gumb za pomicanje GroupBox bude premješten, ali ploča nije. Sada prevucite ploču preko GroupBoxa tako da je potpuno unutar Groupboxa. Kada ovaj put sastavite i pokrenete, klikom na gumb Premjesti premjestite se zajedno.

TableLayoutpanel je zanimljiv spremnik. To je struktura tablice organizirana poput 2D mreže ćelija gdje svaka ćelija sadrži samo jednu kontrolu. Ne možete imati više kontrola u ćeliji. Možete odrediti kako tablica raste kad se doda više kontrola ili čak i ako ne raste, čini se po uzoru na HTML tablicu jer ćelije mogu obuhvaćati stupce ili retke. Čak i ponašanje sidrenja dječjih kontrola u spremniku ovisi o postavkama Margin i Padding. Na sidrištu ćemo vidjeti više o sidrištima.

U primjeru Ex6.cs, započeo sam s osnovnom tablicom s dva stupca i odredio preko dijaloškog okvira Stilovi upravljanja i stilova reda (odaberite kontrolu i kliknite malo desni usmjereni trokut smješten u gornjem desnom kutu da biste vidjeli popis zadataka i kliknite posljednji) da je lijevi stupac 40%, a desni stupac 60% širina. Omogućuje vam određivanje širine stupaca u apsolutnim pikselima, u postocima, ili jednostavno dopuštanje automatske veličine. Brži način da dođete do ovog dijaloškog okvira jest samo Zbirka pored stupaca u prozoru Svojstva.

Dodao sam AddRow gumb i ostavio GrowStyle svojstvo sa zadanom AddRows vrijednošću. Kad se tablica napuni, dodaje se još jedan redak. Alternativno, njegove vrijednosti možete postaviti na AddColumns i FixedSize tako da više ne može rasti. U programu Ex6, kada kliknete gumb Dodaj kontrole, tri puta poziva metodu AddLabel (), a jednom AddCheckBox (). Svaka metoda stvara instancu kontrole, a zatim poziva tblPanel. Kontrole. Dodavanje () Nakon dodavanja druge kontrole treća kontrola uzrokuje rast tablice. Na slici je prikazano nakon što je jednom pritisnuta tipka Dodaj Control.

U slučaju da se pitate odakle dolaze zadane vrijednosti u metodama AddCheckbox () i AddLabel () koje ja zovem, kontrola je bila izvorno ručno dodan u tablicu dizajnera, a zatim je kôd za njegovo stvaranje i inicijalizaciju kopiran iz ovoga regija. Inicijalni kôd pronaći ćete u pozivu metode InitializeComponent nakon što kliknete + s lijeve strane regije u nastavku:

Možete odabrati više kontrola istovremeno pritiskom tipke Shift kad odaberete drugu i sljedeće kontrole, čak i kontrole različitih vrsta. Prozor Svojstva prikazuje samo ta svojstva zajednička za oba, tako da ih možete postaviti na istu veličinu, polja boje i tekstualna polja itd. Čak se i isti poslužitelji događaja mogu dodijeliti na više kontrola.

Ovisno o uporabi, neki će obrasci često mijenjati veličinu od strane korisnika. Ništa ne izgleda gore od mijenjanja veličine obrasca i gledanja kontrola kako ostaju u istom položaju. Sve komande imaju sidra koja vam omogućavaju da ih "pričvrstite" na 4 ruba tako da se kontrola pomiče ili proteže kad se pomakne neki rub. To dovodi do sljedećeg ponašanja kada se obrazac ispruži s desne ivice:

Za gumbe poput Close koji su tradicionalno u donjem desnom kutu potrebno je ponašanje 3. ListViews i DataGridViews su najbolji s 2 ako je broj stupaca dovoljan da se prepuni obrazac i treba se pomicati). Gornja i lijeva sidra su zadana. Prozor imovine sadrži sjajni urednik koji nalikuje engleskoj zastavi. Samo kliknite bilo koju šipku (dvije vodoravne i dvije okomite) da biste postavili ili očistili odgovarajuće sidro, kao što je prikazano na gornjoj slici.

Jedno svojstvo koje se ne spominje puno je svojstvo Tag, a ipak može biti nevjerojatno korisno. U prozoru Svojstva možete dodijeliti samo tekst, ali u vašem kodu možete imati bilo koju vrijednost koja potiče od Objekta.

Upotrijebio sam oznaku za držanje cijelog objekta dok sam u ListView prikazivao samo nekoliko njegovih svojstava. Na primjer, možda želite prikazati samo korisničko ime i broj na popisu korisničkih sažetaka. Ali desnom tipkom miša kliknite odabranog kupca, a zatim otvorite obrazac sa svim pojedinostima o kupcu. To je lako ako prilikom sastavljanja popisa kupaca čitate sve pojedinosti o kupcu u memoriji i dodijelite referencu na objekt klase korisnika u oznaci. Sve kontrole imaju oznaku.

TabControl je zgodan način za uštedu prostora obrasca pomoću više jezičaka. Svaka kartica može imati ikonu ili tekst, a možete odabrati bilo koju karticu i prikazati njezine kontrole. TabControl je spremnik, ali sadrži samo TabPages. Svaka TabPage je također spremnik koji joj može dodati normalne kontrole.

Na primjer x7.cs, stvorio sam ploču stranice s dvije kartice s prvom karticom pod nazivom Kontrole s tri gumba i potvrdnim okvirom na sebi. Stranica na drugoj kartici je označena kao Dnevnici i koristi se za prikaz svih zabilježenih radnji koje uključuju klikom na gumb ili prebacivanje potvrdnog okvira. Metoda zvana Log () poziva se za bilježenje svakog klika gumba itd. U ListBox dodaje isporučeni niz.

Također sam na uobičajeni način dodao TabControl dva padajuća izbornika desnim klikom. Prvo obrascu dodajte ContextMenuStrip i postavite ga u svojstvo ContextStripMenu TabControl. Izbori dva izbornika su Dodaj novu stranicu i Ukloni ovu stranicu. No ograničio sam uklanjanje stranice tako da se mogu ukloniti samo novo dodane stranice s karticama, a ne dvije originalne.

To je jednostavno, samo stvorite novu stranicu kartice, dajte joj tekst teksta za karticu, a zatim je dodajte u kolekciju TabPages u Tabs TabControl

Uklanjanje stranice samo je stvar pozivanja na TabPages. UkloniteAt () pomoću kartica. SelectedIndex za dobivanje trenutno odabrane kartice.

U ovom smo vodiču vidjeli kako djeluju neke sofisticiranije kontrole i kako ih koristiti. U sljedećem tutorialu ću nastaviti s temom GUI-ja i pogledati pozadinu radnika u pozadini i pokazati kako se koristiti.