Programovanie pokročilých formátov v C #

click fraud protection

V tomto tutoriále o programovaní v jazyku C # sa sústredím na pokročilé ovládacie prvky, ako sú ComboBoxy, mriežky a ListViewy, a ukážem vám, ako ich budete pravdepodobne používať. Nedotýkam sa údajov a nezaväzujem sa, až kým nebudem mať výučbu. Začnime jednoduchým ovládaním, ComboBoxom.

Srdcom komba je zbierka položiek a najjednoduchší spôsob, ako naplniť toto je rozbaľovacie zoznam na obrazovke, vyberte vlastnosti (ak nevidíte okná vlastností, kliknite na Zobraziť v hornej ponuke a potom na Okno Vlastnosti), vyhľadajte položky a kliknite na elipsy. Tlačidlo. Potom môžete napísať reťazce, skompilovať program a rozbaľovacím zoznamom zobraziť možnosti.

Teraz zastavte program a pridajte niekoľko ďalších čísiel: štyri, päť.. až desať. Keď ho spustíte, uvidíte iba 8, pretože to je predvolená hodnota MaxDropDownItems. Neváhajte ho nastaviť na 20 alebo 3 a potom ho spustiť, aby ste videli, čo robí.

Je nepríjemné, že keď sa otvorí, hovorí comboBox1 a môžete ho upraviť. To nie je to, čo chceme. Nájdite vlastnosť DropDownStyle a zmeňte DropDown na DropDownList. (Jedná sa o kombináciu!). Teraz neexistuje žiadny text a nie je možné ho upravovať. Môžete si vybrať jedno z čísel, ale vždy sa otvorí prázdne. Ako vyberieme číslo, ktoré sa má začať? Nie je to vlastnosť, ktorú môžete nastaviť v čase návrhu, ale pridaním tohto riadku to urobíte.

instagram viewer

Pridajte tento riadok do konštruktora Form1 (). Musíte zobraziť kód formulára (v aplikácii Solution Explorer kliknite pravým tlačidlom myši na From1.cs a kliknite na položku Zobraziť kód. Nájsť InitializeComponent (); a tento riadok pridajte hneď za týmto.

Ak nastavíte vlastnosť DropDownStyle pre kombinovaný zoznam na Simple a spustíte program, nedostanete nič. Nevyberie ani neklikne ani neodpovie. Prečo? Pretože v čase návrhu musíte chytiť spodnú rukoväť a natiahnuť celú kontrolu.

V príklade 2 som premenoval ComboBox na combo, zmenil combo DropDownStyle späť na DropDown, aby sa dal editovať a pridal tlačidlo Add s názvom btnAdd. Dvakrát som klikol na tlačidlo pridať, aby som vytvoril obsluhu udalosti btnAdd_Click () a pridal som tento riadok udalosti.

Po spustení programu zadajte nové číslo, povedzte Jedenásť a kliknite na tlačidlo pridať. Obsluha udalosti vezme text, ktorý ste zadali (v kombinovanom zozname). Text) a pridá ho do zbierky položiek Combo. Kliknite na Combo a teraz máme nový záznam Jedenásť. Takto pridáte nový reťazec do kombinovaného zoznamu. Odstránenie jedného je trochu zložitejšie, pretože musíte nájsť index reťazca, ktorý chcete odstrániť, a potom ho odstrániť. Metóda RemoveAt znázornená nižšie je kolekčnou metódou, ako to urobiť. stačí zadať, ktorá položka v parametri Removeindex.

odstráni reťazec na pozícii RemoveIndex. Ak je v rozbaľovacej ponuke n položiek, platné hodnoty sú 0 až n-1. Pre 10 položiek, hodnoty 0..9.

Ak to nenájde text, ktorý vracia -1, v opačnom prípade vráti index založený na 0 reťazci v zozname combo. K dispozícii je tiež preťažená metóda FindStringExact, ktorá vám umožňuje určiť, odkiaľ sa má vyhľadávanie začať, takže môžete vynechať prvý atď., Ak máte duplikáty. Mohlo by to byť užitočné pri odstraňovaní duplikátov zo zoznamu.

Kliknutím na btnAddMany_Click () dôjde k vymazaniu textu z rozbaľovacieho zoznamu, potom k vymazaniu obsahu zbierky rozbaľovacích položiek a potom k rozbaleniu. AddRange (na pridanie reťazcov z poľa hodnôt. Po vykonaní tohto nastaví combo's SelectedIndex na 0. Zobrazí sa prvý prvok v kombinovanom zozname. Ak robíte pridávanie alebo mazanie položiek v ComboBoxe, je najlepšie sledovať, ktorá položka je vybraná. Nastavenie SelectedIndex na -1 skryje vybrané položky.

Tlačidlo Pridať položky vymaže zoznam a pridá 10 000 čísel. Pridal som kombináciu. BeginUpdate () a combo, EndUpdate () volá okolo slučky, aby sa zabránilo akémukoľvek blikaniu Windows, ktoré sa pokúša aktualizovať ovládací prvok. Na mojom trojročnom počítači trvá viac ako sekundu, kým do kombo pridám 100 000 čísel.

Toto je šikovný ovládací prvok na zobrazovanie tabuľkových údajov bez zložitosti mriežky. Môžete zobraziť položky ako veľké alebo malé ikony, ako zoznam ikon vo vertikálnom zozname alebo najužitočnejšie ako zoznam položiek a podpoložiek v mriežke a to urobíme tu.

Po vypustení ListView do formulára kliknite na vlastnosť stĺpcov a pridajte 4 stĺpce. Budú to TownName, X, Y a Pop. Nastavte text pre každý ColumnHeader. Ak nevidíte nadpisy v zozname ListView (po pridaní všetkých 4), nastavte vlastnosť zobrazenia ListView na Podrobnosti. Ak zobrazíte kód pre tento príklad, prejdite nadol na miesto, kde je uvedený kód Windows Form Designer, a rozbaľte oblasť, kde sa nachádza kód, ktorý vytvára ListView. Je užitočné vidieť, ako systém funguje a môžete tento kód skopírovať a použiť ho sami.

Šírku každého stĺpca môžete nastaviť ručne presunutím kurzora nad hlavičku a jeho presunutím. Alebo to môžete urobiť v kóde viditeľnom po rozšírení oblasti návrhára formulárov. Mali by ste vidieť tento kód:

V stĺpci populácie sa zmeny v kóde odrážajú v dizajnérovi a naopak. Všimnite si, že aj keď nastavíte vlastnosť Locked na true, bude to mať vplyv iba na dizajnéra a pri spustení môžete zmeniť veľkosť stĺpcov.

ListViews tiež prísť s radom dynamických vlastností. Kliknite na (Dynamické vlastnosti) a označte požadovanú vlastnosť. Keď nastavíte vlastnosť na dynamickú, vytvorí súbor XML .config a pridá ho do Solution Explorer.

Vykonávanie zmien v čase návrhu je jedna vec, ale skutočne to musíme urobiť, keď je program spustený. ListView sa skladá z 0 alebo viacerých položiek. Každá položka (ListViewItem) má vlastnosť text a kolekciu SubItems. Prvý stĺpec zobrazuje text položky, ďalší stĺpec zobrazuje SubItem [0] .text, potom SubItem [1] .text atď.

Pridal som tlačidlo na pridanie riadku a textového poľa pre názov mesta. Do poľa zadajte ľubovoľný názov a kliknite na Pridať riadok. Týmto sa do zoznamu ListView pridá nový riadok s názvom mesta vloženým do prvého stĺpca a nasledujúcich troch stĺpcov (SubItems [0..2]) sú vyplnené náhodnými číslami (prevedené na reťazce) pridaním týchto reťazcov do ne.

Teraz nastavte vlastnosť ListView Multiselect na false. Chceme vybrať iba jednu položku naraz, ale ak chcete odstrániť viac naraz, je to podobné, okrem toho, že musíte opakovať opak. (Ak slučíte v normálnom poradí a odstraňujete položky, nasledujúce položky nie sú synchronizované s vybratými indexmi).

Ponuka s pravým tlačidlom myši zatiaľ nefunguje, pretože v nej nemáme žiadne položky ponuky. Kliknite pravým tlačidlom myši na položku PopupMenu (pod formulárom) a v hornej časti formulára sa zobrazí kontextová ponuka, kde sa zobrazuje normálny editor ponuky. Kliknite na ňu a tam, kde sa píše Typ, napíšte Odstrániť položku. V okne vlastností sa zobrazí MenuItem tak premenované, že sa mniRemove. Dvakrát kliknite na túto položku ponuky a mali by ste získať funkciu kódu obsluhy udalosti menuItem1_Click. Pridajte tento kód, aby vyzeral takto.

Ak stratíte prehľad o odstránenej položke, kliknite jednoducho na ovládací prvok PopupMenu pod formulárom vo formulári Designer. To ho privedie späť na vedomie.

Ak ju však spustíte a nepridáte položku a nevyberiete ju, keď kliknete pravým tlačidlom myši a dostanete ponuku a kliknete na Odstrániť položku, udelí výnimku, pretože neexistuje žiadna vybraná položka. To je zlé programovanie, tak to napravíte. Dvakrát kliknite na rozbaľovaciu udalosť a pridajte tento riadok kódu.

DataGridView je najkomplexnejší a zároveň najužitočnejší komponent poskytovaný zadarmo s C #. Funguje s oboma zdrojmi údajov (t. J. Údajmi z databázy) a bez nich (tj s údajmi, ktoré pridávate programovo). Po zvyšok tohto tutoriálu ukážem jeho použitie bez zdrojov údajov. Pre jednoduchšie potreby zobrazenia môže byť vhodný obyčajný ListView.

Ak ste použili staršiu kontrolu DataGrid, potom je to len jeden z tých na steroidoch: získate viac zabudovaných typov stĺpcov, s ktorými môžete pracovať interné aj externé údaje, viac prispôsobenia displeja (a udalostí) a poskytuje väčšiu kontrolu nad manipuláciou s bunkami pomocou zmrazených riadkov a stĺpy.

Pri navrhovaní formulárov s mriežkovými údajmi je najbežnejšie určiť rôzne typy stĺpcov. V jednom stĺpci by ste mohli mať začiarkavacie políčka, text na čítanie alebo upraviteľný text v inom a čísla kurzov. Tieto typy stĺpcov sú zvyčajne zarovnané rozdielne s číslami, ktoré sú spravidla zarovnané doprava, takže desatinné miesta sú zarovnané. Na úrovni stĺpca si môžete vybrať z tlačidiel, začiarkavacieho políčka, kombinovaného poľa, obrázka, textového poľa a odkazov. ak to nie je dosť, môžete defibrovať svoje vlastné typy.

Najjednoduchší spôsob, ako pridať stĺpce, je navrhnúť v IDE. Ako sme už videli, tento kód píše len pre vás a keď ste to niekoľkokrát urobili, môžete ho pridať sami. Keď to niekoľkokrát urobíte, získate prehľad o tom, ako to urobiť programovo.

Začnime pridaním niekoľkých stĺpcov, do formulára vložte DataGridView a kliknite na malú šípku v pravom hornom rohu. Potom kliknite na Pridať stĺpec. Urob to trikrát. Zobrazí sa dialógové okno Pridať stĺpec, v ktorom nastavíte názov stĺpca, text zobrazený v hornej časti stĺpca a umožní vám vybrať jeho typ. Prvý stĺpec je YourName a je to predvolený textBox (dataGridViewTextBoxColumn). Nastavte tiež text hlavičky na svoje meno. Vytvorte druhý stĺpec Vek a použite ComboBox. Tretí stĺpec je povolený a je to stĺpec CheckBox.

Po pridaní všetkých troch by ste mali vidieť rad troch stĺpcov s kombo v strede (vek) a začiarkavacie políčko v stĺpci Povolené. Ak kliknete na DataGridView, potom v inšpektore vlastností by ste mali vyhľadať stĺpce a kliknúť na (kolekcia). Zobrazí sa dialógové okno, v ktorom môžete nastaviť vlastnosti pre každý stĺpec, ako sú napríklad jednotlivé farby buniek, text s popisom, šírka, minimálna šírka atď. Ak kompilujete a spustíte, všimnete si, že môžete zmeniť šírku stĺpca a čas spustenia. V inšpektore vlastností pre hlavný DataGridView môžete nastaviť AllowUser tak, aby zmenil veľkosť stĺpcov na false, aby ste tomu zabránili.

Chystáme pridať riadky do ovládacieho prvku DataGridView v kóde a súbor ex3.cs v tomto príklade má tento kód. Počnúc pridaním TextEdit box, ComboBox a tlačidlo do formulára s DataGridView na ňom. Nastavte vlastnosť DataGridView AllowUserto AddRows na false. Tiež používam menovky a nazýval som kombobox cbAges, tlačidlo btnAddRow a TextBox tbName. Pridal som tiež tlačidlo Zatvoriť pre formulár a dvakrát naň klikol, aby som vygeneroval kostru obsluhy udalostí btnClose_Click. Pridaním slova Close () to funguje.

V predvolenom nastavení je vlastnosť tlačidla Pridať riadok povolená na začiatku nastavená na hodnotu false. Nechceme pridať žiadne riadky do DataGridView, pokiaľ v poli Name TextEdit a ComboBox nie je text. Vytvoril som metódu CheckAddButton a potom som generoval obslužný program udalostí Leave pre editovacie pole Názov textu dvojitým kliknutím vedľa slova Nechať vo vlastnostiach, keď sa zobrazovali udalosti. Toto pole je zobrazené na obrázku vyššie. V predvolenom nastavení je v poli Vlastnosti zobrazené vlastnosti, ale obslužné rutiny udalostí môžete zobraziť kliknutím na tlačidlo Blesk.

Namiesto toho by ste mohli použiť udalosť TextChanged, aj keď to bude volať CheckAddButton () spôsob pre každé stlačenie klávesu, nie keď je ovládací prvok opustený, to znamená, keď získa iný ovládací prvok zamerať. V Ages Combo som použil udalosť TextChanged, ale namiesto dvojitého kliknutia som vybral obslužný program udalosti tbName_Leave namiesto vytvorenia nového obslužného programu udalosti.

Nie všetky udalosti sú kompatibilné, pretože niektoré udalosti poskytujú ďalšie parametre, ale ak vidíte predtým vygenerovaný obslužný program, môžete ho použiť. Je to väčšinou záležitosť preferencie, môžete mať samostatného obsluhy udalostí pre každú kontrolu, ktorú ste použitie alebo zdieľanie obsluhy udalostí (ako ja), keď majú spoločný podpis udalosti, t. j. parametre sú to isté.

Premenoval som komponent DataGridView na dGView pre stručnosť a dvakrát klikol na AddRow, aby som vygeneroval kostru obsluhy udalostí. Tento kód pridáva nový prázdny riadok, získa tento index riadkov (je to RowCount-1, pretože bol práve pridaný a RowCount je 0) založené) a potom sprístupní tento riadok prostredníctvom svojho indexu a nastaví hodnoty v bunkách v tomto riadku pre stĺpce YourName a Vek.

Pri navrhovaní formulára by ste mali zvážiť, čo sa týka kontajnerov a kontrol a ktoré skupiny kontrol by sa mali držať pohromade. Aj v západných kultúrach ľudia čítajú zhora zľava doprava, takže čítanie týmto spôsobom je jednoduchšie.

Kontajner je akýkoľvek z ovládacích prvkov, ktorý môže obsahovať ďalšie ovládacie prvky. Medzi tie, ktoré sa nachádzajú v Paneli nástrojov, patria Panel, FlowLayoutpanel, SplitContainer, TabControl a TableLayoutPanel. Ak sa vám panel nástrojov nezobrazuje, použite ponuku Zobraziť a nájdete ju. Kontajnery držia ovládacie prvky pohromade a ak premiestnite alebo zmeníte veľkosť kontajnera, ovplyvní to umiestnenie ovládacích prvkov. Stačí presunúť ovládacie prvky nad kontajnerom v Návrhári formulárov a zistí, že kontajner je teraz zodpovedný.

Panel je podobný GroupBoxu, ale GroupBox sa nemôže posúvať, ale môže zobraziť popis a predvolene má ohraničenie. Panely môžu mať hranice, ale v predvolenom nastavení nie. Používam GroupBoxes, pretože vyzerajú krajšie a je to dôležité, pretože:

Panely sa hodia aj na zoskupovanie kontajnerov, takže na paneli môžete mať dve alebo viac skupín GroupBox.

Tu je tip na prácu s kontajnermi. Zahodiť split kontajner na formulár. Kliknite na ľavý a potom na pravý. Teraz skúste odstrániť SplitContainer z formulára. Je ťažké, kým nekliknete pravým tlačidlom myši na jeden z panelov a potom kliknite na príkaz Vybrať SplitContainer1. Keď je všetko vybraté, môžete ho odstrániť. Ďalším spôsobom, ktorý sa vzťahuje na všetky ovládacie prvky a kontajnery, je stlačte kláves Esc vybrať rodiča.

Kontajnery môžu hniezdiť aj vo vnútri seba. Jednoducho potiahnite malú na vrchole väčšej a krátko uvidíte tenkú zvislú čiaru, ktorá ukazuje, že jedna je teraz vo vnútri druhej. Keď ťaháte nadradený kontajner, dieťa sa s ním presunie. Príklad 5 to ukazuje. Svetle hnedý panel nie je predvolene vo vnútri kontajnera, takže po kliknutí na tlačidlo presunu sa presunie GroupBox, ale panel nie je. Teraz panel presuňte cez GroupBox tak, aby bol úplne vnútri Groupboxu. Keď kompilujete a spustíte tento čas, kliknutím na tlačidlo Move (Presunúť) sa budete pohybovať spoločne.

TableLayoutpanel je zaujímavý kontajner. Je to tabuľková štruktúra usporiadaná ako 2D mriežka buniek, kde každá bunka obsahuje iba jeden ovládací prvok. V bunke nemôžete mať viac ako jednu kontrolu. Môžete určiť, ako sa bude tabuľka rozširovať, keď sa pridajú ďalšie ovládacie prvky, alebo dokonca, ak sa nerozrastie, vyzerá to, že je modelovaná v tabuľke HTML, pretože bunky môžu preklenúť stĺpce alebo riadky. Dokonca aj správanie kotvenia detských ovládacích prvkov v kontajneri závisí od nastavení Margin a Padding. Viac informácií o kotvách nájdete na ďalšej stránke.

V príklade Ex6.cs som začal so základnou tabuľkou s dvoma stĺpcami a určil som ju v dialógovom okne Štýl riadenia a štýlov (vyberte ovládací prvok a kliknite na malú pravý smerový trojuholník, ktorý sa nachádza vpravo hore, aby ste videli zoznam úloh a kliknite na posledný), že ľavý stĺpec je 40% a pravý stĺpec 60% šírky. Umožňuje zadať šírku stĺpca v absolútnych pixloch, v percentách, alebo ho môžete nechať len na automatickú zmenu veľkosti. Rýchlejší spôsob, ako sa dostať do tohto dialógového okna, je iba kliknúť na kolekciu vedľa stĺpcov v okne Vlastnosti.

Pridal som tlačidlo AddRow a vlastnosť GrowStyle som nechal s jej predvolenou hodnotou AddRows. Keď sa tabuľka naplní, pridá ďalší riadok. Prípadne môžete nastaviť jeho hodnoty na AddColumns a FixedSize, aby už nemohli rásť. V prípade Ex6, keď kliknete na tlačidlo Pridať ovládacie prvky, zavolá metódu AddLabel () trikrát a AddCheckBox () raz. Každá metóda vytvorí inštanciu ovládacieho prvku a potom volá tblPanel. Controls. Pridať () Po pridaní druhého ovládacieho prvku tretie ovládacie prvky spôsobia rast tabuľky. Obrázok je zobrazený po kliknutí na tlačidlo Pridať kontrolu.

V prípade, že vás zaujíma, odkiaľ pochádzajú predvolené hodnoty v metódach AddCheckbox () a AddLabel (), ktoré volám, kontrola bola pôvodne ručne pridané do tabuľky v návrhári a potom kód, z ktorého bol vytvorený a inicializovaný, bol skopírovaný z tohto región. Inicializačný kód nájdete vo volaní na metódu InitializeComponent, keď kliknete na + vľavo od oblasti nižšie:

Pri výbere druhého a následných ovládacích prvkov, dokonca aj ovládacích prvkov rôznych typov, môžete vybrať viacero ovládacích prvkov súčasne. V okne Vlastnosti sú zobrazené iba tie vlastnosti, ktoré sú spoločné obom, takže ich môžete nastaviť na rovnakú veľkosť, farebné a textové polia atď. Dokonca rovnaké ovládače udalostí môžu byť priradené viacerým ovládacím prvkom.

V závislosti od použitia môžu niektoré formuláre často zmeniť veľkosť používateľa. Nič nevyzerá horšie ako zmena veľkosti formulára a videnie ovládacích prvkov zostáva v rovnakej polohe. Všetky ovládacie prvky majú kotvy, ktoré ich umožňujú „pripevniť“ k 4 okrajom tak, aby sa ovládací prvok pohyboval alebo pretiahol, keď sa posúva pripojená hrana. To vedie k nasledujúcemu správaniu, keď je formulár natiahnutý od pravého okraja:

Pre tlačidlá ako Close, ktoré sú tradične vpravo dole, je potrebné správanie 3. ListViews a DataGridViews sú najlepšie s 2, ak je počet stĺpcov dostatočný na pretečenie formulára a vyžaduje rolovanie). Horná a ľavá kotva sú predvolené. Okno vlastností obsahuje šikovný malý editor, ktorý vyzerá ako anglická vlajka. Stačí kliknúť na niektorý z pruhov (dva horizontálne a dva vertikálne) a nastaviť alebo vyčistiť príslušnú kotvu, ako je to znázornené na obrázku vyššie.

Jednou vlastnosťou, ktorá sa veľmi nezmieňuje, je vlastnosť Tag a napriek tomu môže byť nesmierne užitočná. V okne Vlastnosti môžete priradiť iba text, ale v kóde môžete mať ľubovoľnú hodnotu, ktorá pochádza z objektu.

Značku som použil na držanie celého objektu, zatiaľ čo v ListView som zobrazoval iba niekoľko jeho vlastností. Môžete napríklad chcieť zobraziť iba meno zákazníka a číslo v zozname zákazníkov. Kliknite pravým tlačidlom myši na vybratého zákazníka a potom otvorte formulár so všetkými jeho údajmi. Je to ľahké, ak pri zostavovaní zoznamu zákazníkov čítate všetky údaje o zákazníkovi v pamäti a priraďujete v značke odkaz na objekt triedy zákazníka. Všetky ovládacie prvky majú značku.

TabControl je praktický spôsob, ako ušetriť priestor formulárov tým, že má viac kariet. Každá karta môže mať ikonu alebo text a môžete si vybrať ktorúkoľvek kartu a zobraziť jej ovládacie prvky. TabControl je kontajner, ale obsahuje iba TabPages. Každá TabPage je tiež kontajner, do ktorého je možné pridať bežné ovládacie prvky.

V príklade x7.cs som vytvoril panel s dvoma záložkami, pričom prvá karta s názvom Ovládacie prvky má tri tlačidlá a začiarkavacie políčko. Stránka s druhou kartou je označená Denníky a používa sa na zobrazenie všetkých prihlásených akcií, ktoré zahŕňajú kliknutie na tlačidlo alebo prepnutie začiarkavacieho políčka. Vyvolá sa metóda s názvom Log () na zaznamenanie každého kliknutia na tlačidlo atď. Pridá dodaný reťazec do zoznamu.

Obvyklým spôsobom som do ovládacieho panela TabControl pridal aj dve položky s pravým tlačidlom myši. Najprv do formulára pridajte ContextMenuStrip a nastavte ho do vlastnosti ContextStripMenu tabControl. Dve možnosti ponuky sú Pridať novú stránku a Odstrániť túto stránku. Odstránenie stránky som však obmedzil, takže je možné odstrániť iba novo pridané stránky kariet, nie pôvodné dve.

Je to ľahké, stačí vytvoriť novú stránku na karte, dať jej textový nadpis pre kartu a potom ho pridať do kolekcie TabPages na karte TabControl.

Odstránenie stránky je iba vecou volaní TabPages. RemoveAt (), pomocou kariet. SelectedIndex, aby ste získali aktuálne vybranú kartu.

V tomto návode sme videli, ako fungujú niektoré sofistikovanejšie ovládacie prvky a ako ich používať. V nasledujúcom návode budem pokračovať v téme GUI a pozriem sa na vlákno pracovníka na pozadí a ukážem, ako ho používať.

instagram story viewer