Dialogit Juha Järvensivu juha.jarvensivu@tut.fi 2007
Dialogi
Yleistä Käyttöliittymäkirjastot tarjoavat valmiin toteutuksen tavallisimmista UI-komponenteista.NET: System.Windows.Forms Peruskomponentteja yhdistelemällä voidaan rakentaa monimutkaisempia komponentteja.net: UserControl Kirjastot tarjoavat myös joitakin valmiita dialogeja FileDialog ColorDialog FontDialog MessageDialog PrintPreview
Haasteita Dialogin selkeä rakenne Rymittele (rivit, sarakkeet, ryhmät (groupbox)) Jaa kokonaisuus useampaan osaan (välilehdet) Noudata annettuja tyyliohjeita (esim kahden komponentin välinen etäisyys) Ikkunan koon muutokset (skaalautuvuus) Suunnittele miten komponentit venyvät, kun ikkunan kokoa muutetaan UI-tekstien muutokset (esim lokalisointi) Varaa aina riittävästi tilaa UI-teksteille
Layout Absoluuttisiin koordinaatteihin perustuva dialogi Helppo toteuttaa Layoutmanageriin perustuva dialogi Parempi tuki skaalautuvuudelle Kahden edellisen yhdistelmä Objektien ankkurointi
Hierarkisuus UI-komponentit voivat sijaita toisen UIkomponentin sisällä
.NET (absoluuttiset koordinaatit)
System.Windows.Forms.Form Ikkunan toteuttava luokka top-level window Dialogi Form.Show() Avaa ikkunan ruudulle Form.DesktopLocation Määrittää ikkunan sijainnin työpöydällä Huom! Pitää kutsua Show-metodin kutsumisen jälkeen ennen ikkunan piirtämistä ruudulle. Esimerkiksi Load eventin käsittelijässä
Modaalisuus // Esim 1. Modaaliton dialogi Form1 f1 = new Form1(); f1.show (); // Esim 2. Modaalinen dialogi Form f1 = new Form1(); f1.showdialog ();
System.Windows.Forms.Panel UI-komponentti, joka sisältää toisia UIkomponentteja (Container) Käytetään komponenttien ryhmittelyyn esim. radiopainikkeet Helpottaa kaikille komponenteille yhteisien ominaisuuksien toteuttamista Esim komponenttien disablointi
Panel p = new Panel(); Button b = new Button(); Textbox tb = new Textbox(); // Init panel p.color = Color.White; p.size = new Size(231,98); p.location = new Point(12,12); p.borderstyle = new BorderStyle.Fixed3D; // Add controls to panel p.controls.add(tb); p.controls.add(b); // Add panel to form this.controls.add(p); Panel
UI-komponenttien lisääminen Oletustoiminta formiin Lisättävälle komponentille annetaan sijaintikoordinaatit ja koko Komponentti lisätään ikkunan Controls propertyyn Mikäli komponentteja lisätään useita, kannattaa layoutin toiminta keskeyttää lisäyksen ajaksi SuspendLayout(); ResumeLayout();
Esimerkkikoodi private void InitializeComponent() { this.button1 = new Button(); this.textbox1 = new Text Box(); SuspendLayout(); // button1 button1.location = new Point(120,116); button1.size = new Size(75,23); button1.text = button1 ; // textbox textbox1.location = new Point(120,146); textbox1.size = new Size(100,23); // form1 this.controls.add(this.button1); this.controls.add(this.textbox1); ResumeLayout(); }
.NET (objektien ankkurointi)
Objektien ankkurointi (Anchor) Kiinnittää komponentin reunan suhteessa isäntäikkunan reunaan ikkunaa venytettäessä komponentin ja ikkunan reunojen välinen etäisyys pysyy vakiona AnchorStyles { BOTTOM,LEFT,RIGHT,TOP, NONE} Oletusarvo LEFT ja TOP
Objektien ankkurointi (Anchor) Button btn = new Button(); btn.anchor = AnchorStyles.BOTTOM AnchorStyles.RIGHT; this.controls.add(btn); 20pix 20pix
Skaalautuvuus Ankkuroinnin avulla voidaan toteuttaa myös komponenttien skaalautuminen ikkunan kokoa muutettaessa Komponentti venyy ikkunan kokoa muutettaessa mikäli se ankkuroidaan vastakkaisista reunoistaan
Skaalautuvuus
Dock-property Kiinnittää komponentin ikkunan reunaan Komponentin koko muuttuu ikkunan koon muuttuessa DockStyle { BOTTOM,LEFT,RIGHT,TOP,FILL,NONE} Oletusarvo NONE Komponentit kiinnittyvät Z-arvon mukaisessa järjestyksessä
Dock-property buttont.dock = DockStyle.TOP; this.controlsadd(buttont);
Ikkunan jakaminen (splitting)
Ikkunan jakaminen
System.Windows.Forms.Splitter Ikkuna voidaan jakaa osiin splitterkomponentin avulla Container Left panel Splitter Right panel
System.Windows.Forms.Splitter panel1 = new Panel(); panel1.backcolor = Color.DarkGray; panel1.dock = DockStyle.LEFT; panel2 = new Panel(); panel2.backcolor = Color.LightGray; panel2.dock = DockStyle.FILL; splitter = new Splitter(); splitter.backcolor = Color.Black; this.controls.add(panel1); this.controls.add(splitter); this.controls.add(panel2);
Valikot
Valikot
Valikot Kaksi vaihtoehtoista tapaa toteuttaa MenuStrip +ToolStripMenuItem (.NET 2.0) MainMenu + MenuItem (.NET 1.0) Eventtejä Click Kutsutaan kun valikkoalkiota klikattiin DropDownMenuOpening Kutsutaan kun valikkoa ollaan avaamassa
Hierarkinen toteutus MenuStrip File New Project File Open Save Help
Esimerkki MenuStrip File New Project File Open Save Help menustrip1 = new MenuStrip(); filemenuitem = new ToolStripMenuItem(); newmenuitem = new ToolStripMenuItem(); menustrip1.items.add(filemenuitem); filemenuitem.items.add(newmenuitem); // Liitetään kokonaisuus formiin this.mainmenustrip = menustrip1;
Valikon pikavalinnat Pikanäppäin (shortcutkey) Esim Ctrl +N. mymenuitem.shortcutkeys = Keys.Control Keys.N; mymenuitem. ShowShortcutKeys = true; Alt-tag Esim. File mymenuitem.text = &File ;
Työkalupalkki
System.Windows.Forms.ToolStrip ToolStrip ts1 = new ToolStrip(); // Lisätään uusi tekstityyppinen itemi ts1.items.add( item1 ); // Näytetään tekstinä (ts1.items[0]).displaystyle = ToolStripItemDisplayStyle.Text; // Liitetään tapahtumakuuntelija (ts1.items[0]).click +=new EventHandler(item_Click); // Liitetään ToolStrip formiin this.controls.add(ts1); ToolStripItem DisplayStyle: Text Image None Image+Text
ToolStripItem Kantaluokka objekteille, joita voidaan lisätä työkalupalkkiin, valikkoon ja tilariville ToolStripButton ToolStripLabel ToolStripSeparator ToolStripControlHost ToolStripComboBox ToolStripTextBox ToolStripProgressBar ToolStripDropDownItem ToolStripMenuItem ToolStripSplitButton ToolSTripDropDownButton ToolStripStatusLabel
Oman komponentin tekeminen
System.Windows.Forms.UserControl Mahdollista luoda omia komponentteja kirjaston tarjoamia komponentteja yhdistelemällä. Uutta komponenttia voidaan käyttää, kuten muitakin UI-komponentteja Hyödyllinen erityisesti silloin, jos samanlaista komponenttia tarvitaan monta kertaa (Esim osoitetietojen kysyminen)
Formin periyttäminen Myös formeja voi periyttää kuten muitakin luokkia Perityn formin komponentit näkyvät editorissa, mutta niiden asetuksia ei pääse muokkaamaan.
Esimerkki Valikko + pikanäppäimet Ikkunan jakaminen (splitter) UserControl + objektien ankkurointi Formin periyttäminen Lista-komponentti
Lähteitä How to: Create a windows forms application http://msdn2.microsoft.com/en-us/library/ms235634.aspx Windows forms controls http://msdn2.microsoft.com/en-us/library/ettb6e2a.aspx System.Windows.Forms.Panel http://msdn2.microsoft.com/enus/library/system.windows.forms.panel.aspx System.Windows.Forms.Form http://msdn.microsoft.com/library/default.asp?url=/library/enus/cpref/html/frlrfsystemwindowsformsformclasstopic.asp