Silverlight Vezérlők a gyakorlatban

Silverlight Vezérlők a gyakorlatban

Mielőtt ezzel jobban megismerkedhetnénk, fel kell telepíteni a Silverlight Toolkit-et. Ezt nagyon egyszerűen letölthetjük a silverlight oldaláról, majd a referenciához hozzá kell adni a System.Windows.Controls.Toolkit.dll-t. Névtérnél is hozzá kell adni: xmlns:toolkit=”clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit” sor beírásával.

ContentControl:

Osztályból származó vezérlők a Content tulajdonságukon keresztül jelenítik meg a tartalmat. Object tipusú. A ContentControl érdekes vonása,hogy önmagában is használható. Összetett objektumokat is képes fogadni.

Button:

A legismertebb ContentControl vezérlők a különböző nyomógombvariánsok. A ButtonBase osztályból származnak.

RepeatButton:

Lényegében nem különbözik a hagyományos gombtól, egy fontosabb tulajdonság kivételével. Nyomva tartásával folyamatosan küldi a Click eseményeket.

HyperlinkButton:

Nevéhez híven átjárót biztosít egy külső weboldalra vagy valamilyen tartalomra.

CheckBox és RadioButton:

Ez a két vezérlő a ToggleButton osztályból származnak. Háromféle állapota lehet: jelölt (checked), nem jelölt (unchecked) és határozatlan (undetermined). A harmadik állapot akkor létezik, ha az adott vezérlőn az IsThreeState tulajdonságot igazra állítjuk. Az alapállapot minden esetben unchecked lesz.

Label:

Funkciója hasonlít a TextBlock-ra, annál jelentősen több lehetőséget biztosít. Valódi vezérlő. Segítségével informatív űrlapokat hozhatunk létre, amivel az adatok érvényességét is képes jelezni. Ez a vezérlő az SDK részét képezi. A SilverlightTools telepítésekor automatikusan hozzáadódik. A label erősen épít az adatkötésre.

ToolTip:

Segítségével információt köthetünk egy-egy vezérlőelemhez. Önmagában is használható, ekkor úgy viselkedik, mint egy label. A leggyakrabban egy másik vezérlőhöz kötjük hozzá, a ToolTipService osztály tulajdonságaival. A ToolTipService objektum Placement tulajdonsága jelöli, hogy a ToolTip a vezérlőhöz képest milyen pozícióban jelenjen meg.

ItemsControl:

Az ItemsControl osztályból származó vezérlők, lehetővé teszik egyszerre több elem megjelenítését. Hasonlóan a ContentConrol-hoz ez is használható önmagában. Ez az elemek kiválasztásának a rovására megy, ugyanis onnantól kezdve ez a lehetőség megszűnik. Az ItemsControls leszármazottak az ItemsSource tulajdonságon keresztül kapják meg a megjelenítendő listára hivatkozó referenciát. Összetett objektumok is lehetnek a lista elemei, ekkor meg kell adnunk, hogy mit akarunk megjeleníteni. Ha nem adunk meg neki semmit, akkor az osztály neve jelenik meg.

ListBox:

A ListBox az ItemsControl-ból eredő Selector osztályból származik. Lehetővé teszi, hogy elemeket válasszunk ki a megjelenített listából. A ListBox minden elemének egy-egy ListBoxItem objektum feleltethető meg, amely a ContentControl osztályból származik. Az elemek kiválasztásának módját a SelectionMode tulajdonsággal állíthatjuk be. Alapértelmezett módon csak egy elemet választhatunk ki. A Multiple és Extended értékek megengedik több elem kiválasztását is. A SelectChanged eseménnyel kezelhetjük a kiválasztott elemek listáját, ennek az eseménynek az eseménykezelője SelectionChangedEventArgs típusú paramétert kap. AddedItems illetve RemovedItems tulajdonságai tömbben tárolják az aktuálisan vagy az előzőleg kiválasztott elemeket.

ComboBox:

A ComboBox vezérlő valójában két részből áll. Egy TextBox-ból és egy lenyíló ListBox-ból. Egy elemet tudunk kiválasztani. Az elemeket a ComboBoxItem jelenítni meg. A ComboBox eseményei és tulajdonságai megegyeznek a ListBox jellemzőivel.

TreeView:

Ez a vezérlő fa-struktúrában képes megjeleníteni az elemeket. Minden eleme TreeViewItem típusú, amely maga is ItemsControl leszármazott, vagyis tartalmazhat több elemet, beleértve további TreeViewItem objektumokat is. A TreeViewItem osztály a HeaderedItemsControl osztályból származik, ezért a tartalmazott listán kívül egy fejléccel (Header) is rendelkezik. A TreeView működése hasonló a ListBox-éhoz, a SelectedItemChanged esemény mutatja a kiválasztott elem változását, amelyet a SelectedItem tulajdonság segítségével kérhetünk le.

TabControl:

A TabControl vezérlő segítségével az alkalmazás ugyanazon területét oszthatjuk szét több elem között. Ez a vezérlő is saját típust használ gyermekei leírására (TabItem), amely a HeaderedItemsControl osztályból származik, és a Header tulajdonság értéke jelenik meg az egyes lapok tetején.  A TabControl kiválóan alkalmas a Silverlightban nem támogatott MDI (Multiple Document Interface) megjelenítési. A TabControl eseményeinek és tulajdonságainak használata megegyezik a többi ItemsControl leszármazottéval.

 

 

 

Második feladatok – 1. rész

Mostani feladataim a következők:

  • win8 könyv átnézése
  • alkalmazás életciklusa és ennek debuggolása
  • windows 8 telepítése a laborban, majd Visual Studio 2012 telepítése
  • mvvm mintapélda készítése
  • animációk készítése: egy villogó gomb, gomb lenyomásra induljon el egy animáció (mozgás), összetettebb animáció
  • képek kezelésével kapcsolatban: le kell tölteni legalább 2db képet. Feladat: jelenjen meg az alkalmazásban (Hogy adod hozzá a projecthez?, milyen control-hoz köttöd és hogyan? Milyen megjelenítési módok vannak?).
  • Layout vezérlők közül pedig az alábbiakat kell tüzetesebben megnézni: FlipView, ListView, Virtualization.

 

A mai nap folyamán telepítettem a windows 8-at, illetve a Visual Studio-t. Ezen kívül megismerkedtem a windows 8 kinézetével, stb. Illetve az mvvm mintapéldához kerestem anyagokat, amivel még később jelentkezem.

Sok szenvedés, kevés haladás Azure + WCF

Hello,

A mai napon még visszatértem az Sql Azure és a WCF kapcsolat felállításához.

Megpróbáltam meg csinálni, hogy telefonról lehessen regisztrálni majd bejelentkezni az adott adatokkal. Tehát a programom loginját szerettem volna megcsinálni. Több gondba is ütköztem és nem is sikerült a haladnom ezzel kapcsolatban.
Első problémám az volt, hogy a saját hibámból kifolyólag elfelejtettem az Sql szerver jelszavamat + felhasználó nevemet. El tartott egy darabig, mire megtaláltam, hol lehet megnézni egyáltalán a felhasználó nevet.
Ha esetleg más is beleszaladna ebbe a buta hiába, akkor egy tipp:
Kiválasztva egy adatbázist, jobb oldalt található egy Show Connection String gomb, amely az alábbi információval szolgál:

Server=tcp:jo9ac2ptj6.database.windows.net,1433;Database=parkoloor;User ID=szucsd@jo9ac2ptj6;Password={your_password_here};Trusted_Connection=False;Encrypt=True;Connection Timeout=30;

Innen legalább a felhasználó nevet meg lehet tudni, szerencsére a jelszót műr innen tudtam.
Szerencsére a tábla kreálás, gyorsan és zökkenőmentesen ment query alapján. Egy észrevétel viszont, hogy amíg a varázslóból készített tábla, egyből megjelenik a baloldali felsorolásban, addig ha query-vel készítjük el, nem fog a varázsló által készítettek között megjelenni, csak később. Ez egy kicsit megzavart, de szerencsére ha újrafuttatjuk a queryt, akkor közli velünk, hogy már létezik az a tábla amit létre akartunk hozni.

Majd nekiálltam az Azure Projectnek VS-ben. Refactoringot használva átnevezgettem a project neveket.
A következő nehézségbe, akkor futottam bele, amikor az ADO .NET Entity Data Model -t szerettem volna elkészíteni a projectemhez. A már meglévő táblám alapján szerettem volna elkészíteni ezt a Data Modelt. Azonban, kitöltve a szerver kapcsolódási adatokat egy hibába futottam bele. Érdekes módon a Test Connection hibátlanul működött, tudtam válogatni az adatbázisaim között, viszont ha tovább szerettem volna lépni, akkor az alábbi error fogadott:

failed to retrieve data for this request. unknown property primaryfilepath 

Gyorsan próbáltam keresni valami megoldást de nem találtam egyenlőre. Legközelebb még a héten, ezt meg szeretném oldani, hiszen ez egy elég fontos része a dolgozatomnak. Remélhetőleg gyorsan találok rá valami megoldást.

Legközelebbi cél, hogy a reg/logint működésre bírjam és a WP7 funkciókat szépen implementáljam. Köztük a fénykép készítést, gps logolást, interface kialakítása, adatküldés és tárolás azureban.

Üdv.

Dávid

 

Sztringműveletek és XML létrehozás C#-ban

Sziasztok!

Windows Phone-ra fogok elkészíteni egy szegedi menetrend alkalmazást. A menetrend adatait XML állományokban fogom eltárolni. Egy weboldal forráskódjában sikerült megtalálnom a megállók neveit és koordinátáit. A feladatom az volt, hogy ebből a forráskódból kiszedjem a nekem megfelelő szövegrészeket, a megállók neveit és koordinátáit. Ehhez írtam C#-ban egy kis programot, ami ezt végrehajtja.

Az oldal forráskódját egy egyszerű szöveges fájlba mentettem el. Ahhoz, hogy a szövegből kiszedjem a megfelelő adatokat, meg kellett határoznom egy reguláris kifejezést, ami illeszkedik a szegedi megállók nevére (később a koordinátájára). Ehhez van egy osztály C#-ban, mégpedig a Regex (Regular Expression). Continue reading

SQL Azure

Az alábbiakban egy kis ismertetőt szeretnék adni az Azure-ral kapcsolatban.

A Microsoft a Windows 7-el párhuzamosan kezdte el fejleszteni, még Windows Cloud néven. A platformot 3 fő részre lehet osztani. Windows Azure, SQL Azure és az Azure AppFabric. 
Számomra az SQL Azure lesz a leglényegesebb és az általam használt, hiszen mind a WP7 és a Silverlight programom ezt az adatbázist fogja használni.
Az SQL Azure a helyi SQL Server felhőbe vitt verziója. A két termék olyannyira kompatibilis egymással, hogy az adatbázis sikeres felhőbe migrálása után elég a connection string-et módosítani, és alkalmazásunk észre sem veszi, hogy változás történt.

Tapasztalat:

Gyors regisztráció után (90 nap ingyenes próbaverzió) használatba is vehetjük az Azure szolgáltatásait. Bejelentkezés után, egy egyszerű és látványos felület fogad.
Meglepetésemre nagyon felhasználó barát és könnyen kezelhető, egyszerűen tudunk létrehozni adatbázisokat és táblákat. Az egész webes kezelőfelület Silverlight alapú.

Ami számomra lényeges, az a kapcsolat felállítása WP7 és az SQL Azure között. Ahogy olvasgattam ez csak WCF segítségével lehetséges. WCF-ről részletesebben legközelebb írok, amikor is azzal ismerkedek meg jobban. Most csak követve egy tutorialt, létrehoztam egy test adatbázist és létrehoztam a kapcsolatot egy WP7 app és az adatbázis között.

Hasznos linkek:

http://breathingtech.com/2011/how-to-use-wcf-services-to-access-sql-azure-database-from-windows-phone-7-app-part-1/   -> Egy kicsit outdated, de mégis hasznos tutorial, a WP7 + SQL Azure kapcsolathoz, WCF-et használva.
http://www.slideshare.net/DeanWillson/windows-phone-7-wcf-and-sql-azure  -> Rövid és látványos bemutató a fennálló kapcsolatokról és az életciklusokról.
https://www.windowsazure.com/en-us/pricing/free-trial/  -> Végül pedig az ingyenes regisztráció. (bár 1 euróval beterhelik a bankkártyát, gondolom a validitás miatt.)

Legközelebb WCF szolgáltatásokkal foglalkozok részletesebben.

Üdv.
Dávid

Elvégzendő feladat

Hello!

A feladatom az elkövetkezendő 1 évben létrehozni egy Parkolóőr alkalmazást .Net alapokon.

Az első lépések a program által használt technológiák megismerése, amelyek a következőek:

Azure:
–       sql azure
–       web role

Silverlight (wp7):
–        layout
–        control
–        animations
–        térkép
–        push notification

WCF:
–          konfigrálás
–          egy, több irányú kapcsolat
–          ASP.NET-ben WCF használat
–          egyedi tipus küldése
–          hiba kezelés

Elsőként az Azure-ral ismerkedem meg, amellyel a következő postban találkozhattok.

Első feladatok – Silverlight

Az elmúlt 3-4 hét történései.

 

A Silverlight könyvet kellett röviden áttekintenem, illetve az alábbi témakörökre nagyobb figyelmet kellett szentelnem:

  • Alkalmazás életciklusa
  • Fejlesztői környezet beállítása
  • Mvvm tervezési minta
  • Animációk
  • Képek kezelése (controllok)
  • Layout vezérlők

Ezen témakörök nagy része megtalálható volt a Silverlight könyvben.

 

Az egyes témakörökről pár lényeges mondat:

  •  Alkalmazás életciklusa

A Windows 8-nál a Metro alkalmazások életciklusa nagymértékben különbözik a megszokott, hagyományos alkalmazásokétól. A lehető legjobb felhasználói élmény biztosításának érdekében az alkalmazások életciklusa feletti hatalmat a Microsoft kivette a felhasználók kezéből, és inkább a rendszer szerves részévé tette.

  • Fejlesztői környezet beállítása

A fejlesztői környezet olyan programozási eszközök, könyvtárak és beállítások csoportja, melyekkel a szoftverfejlesztés során a felhasznált programozási nyelven, vagy nyelveken létrehozott forráskódokat futás kész állapotba lehet hozni és azt tesztelni. Ez jelentheti a fordítást, vagy nem önálló programok futtatási környezetbe helyezését. Mindkét esetben a környezet általában tartalmazza a futtatókörnyezetet is a tesztelés miatt.

  • Mvvm tervezési minta
    • A Mode-View-ViewModel architektúrális mintát a prezentációs rétegben célszerű bevezetni. Ennek segítségével alkalmazásunk felhasználói felülete tesztelhető, karbantartható lesz, és jelentősen egyszerűsíti a fejlesztő és dizájner közötti együttműködését.  Ebben a megközelítési módban több elem is segíti a hatékony projektmunkát:
      • A ViewModel-ek koncepciója
      • A View-val való laza integráció
      • A ViewModel-ben exponált tulajdonságok, és parancsok, melyeket Command pattern, illetve Behavior-ök segítségével elérhetővé tettük
      • Illetve az Expression Blend és a ViewModel-jeinkbe beépített tervezésidejű támogatás.
  • Animációk
    • Animációk alkalmazásával, sokkal szórakoztatóbbá és látványosabbá tehetjük a felületet, életre kelthetjük azt. A Silverlight segítségével számos lehetőségünk van színek animálására, különböző időzített mozgások elkészítésére, vagy akár oldalak közötti átfedések kialakítására. Minden animáció azonos elv alapján működik. Ahhoz, hogy animációt tudjunk létrehozni, először is szükségünk lesz egy Storyboard objektumra, amely definiálja, hogy a létrehozandó animációkat mely objektumra szeretnénk érvényesíteni, illetve azon belül is melyik tulajdonságra. Megszabja az animáció viselkedését is — milyen hosszan játsszuk le, ismételjük-e meg, ha véget ért, stb. —, és még sok más dologban segít nekünk. Az Expression Blend egyik legnagyobb erőssége az animációk készítésében rejlik.
  • Képek kezelése (controlok)
    • A főbb controlok Silvterlightban:
      • UserControl
        • A UserControlok leggyakoribb használati területe a nézetek világa. A komplex felhasználói felület kisebb, önálló funkcionális egységekre való darabolásában játszanak fontos szerepet. Természetesen klasszikus értelemben vett, egyszerűbb vezérlők létrehozására is használhatók, de a testreszabhatóságnak komoly korlátokat szabnak.
      • Custom Control
        • Custom Controlok segítségével a legegyszerűbb vezérlőktől a legkomplexebbekig bármit készíthetünk, biztosítva az utólagos teljes testreszabhatóságot. A vezérlő megjelenése és a hozzá tartozó logika egymástól szinte teljesen elkülönül.
  • Layout vezérlők
    • Grid: a legsokoldalúbb és ezáltal leggyakrabban használt konténer. Ez a vezérlő lehetővé teszi tetszőleges számú és méretű oszlop illetve sor definiálását. Alapértelmezés szerint egy sor és egy oszlop létezik, amennyiben többet szeretnénk, megfelelő számú RowDefinition és ColumnDefinition objektumot kell készítenünk. A ShowGridLines tulajdonság állításával láthatóvá tehetjük a Grid oszlopait és sorait határoló vonalakat. Ha egy-egy vezérlőnek egynél több cellára van szüksége a Grid-en belül, ekkor a ColumnSpan és RowSpan tulajdonságokkal beállíthatjuk, hogy az hány sort/oszlopot foglalhat.
    • Canvas: lehetővé teszi, hogy explicit módon koordináták segítségével pozícionáljuk a vezérlőinket. Az x/y koordinátákat a Canvas.Left illetve a Canvas.Top attached propertykkel állítjuk be, amelyekkel a Canvas bal oldalának és felső részének a bounding boxtól való távolságát szabályozzuk. Amennyiben ezeket az értékeket nem adjuk meg, akkor automatikusan a bal felső sarokba (0;0) pozíciónál.
    • StackPanel: segítségével vízszintes vagy függőleges sorba rendezhetjük a vezérlőinket. Az Orientation tulajdonsággal vízszintes irányba állíthatjuk az elemeket.
    • WrapPanel: nem része az alapcsomagnak, a Silverlight Toolkit keretében juthatunk hozzá. Hasonló szerepet tölt be, mint a StackPanel, viszont van egy apró különbség, mégpedig az, hogy a lehető legoptimálisabban kitölti a rendelkezésre álló helyet, vagyis a vezérlők több sorban is megjelenhetnek. Lehetőségünk van arra is, hogy minden elem számára uniform méretet adjunk meg, amely akkor is érvényes marad, ha a vezérlőnek így kevés hely jut. Erre a célra az ItemHeight és ItemWidth tulajdonságokat használhatjuk. A FlowDirection tulajdonsággal a vezérlőelemek megjelenítésének sorrendjét szabályozhatjuk. Ez csak soronként érvényes, nem globálisan, vagyis ha egy elem eredetileg az utolsó sor utolsó tagja lenne, az nem kerülhet fel az első sorba.
    • DockPanel: segítségével a vezérlőelemeket egy-egy oldalhoz „ragaszthatjuk”.

 

 

A legtöbb információt a Silverlight könyvből nyertem. A könyv elejét (az első 7 fejezetet) részletesen néztem át, az utolsó fejezeteket inkább átlapoztam. De a könyvet sikerült megszereznem elektronikus formában, így a későbbiekben is utána lehet nézni dolgokat, akár a maradék részeket is el lehet olvasni.

Hasznos dolgokat találtam a devportal.hu-n. Szerintem ezt az oldalt a későbbiekben is sűrűn meglátogatom.

Megvalósítandó célok

Sziasztok!

A feladatom az, hogy egy játékvezérlőt készítsek, ami képes feldolgozni a Kinectről érkező adatokat, és átalakítani input jellé egy játék számára.

A fő feladat előtt készítenem kell kisebb alkalmazásokat, amelyek bemutatják a Kinect lehetőségeit. A főbb témák:

  • Az RGB kamera használata: Egy egyszerű alkalmazás, amely bemutatja, hogy hogyan kell használni a kamerát. Megjeleníti a képet és készít egy fotót.
  • Az IR mélységi szenzor használata: Az alkalmazás megjeleníti a mélységi adatokból készült képet, és kiírja a bal kéz távolságát az eszköztől.
  • Skeletal Tracking bemutatása

A későbbiek folyamán az alkalmazások listája és funkcióik bővülni fognak.

Üdvözlettel: Álb Csaba