microsoft silverlight · jaoks, mis oleks suuteline töötama igal platvormil. silverlight oli...

Tallinna Ülikool

Informaatika Instituut

Microsoft Silverlight

Seminaritöö

Autor: Ilja Šmorgun

Juhendaja: Jaagup Kippar

Autor: ...................................................... "......" ........................ 2008. a.

Juhendaja: ............................................... "......" ........................ 2008. a.

Instituudi direktor: .................................. "......" ........................ 2008. a.

Tallinn 2008

2

Sisukord

Sissejuhatus ..................................................................................................................................... 3

1. Windows Presentation Foundation........................................................................................... 4

1.1. Rakenduste loomise töövoog ............................................................................................ 4

1.2. Windows Presentation Foundation’i puudused ................................................................ 5

1.3. WPF’i probleemi lahendus ............................................................................................... 5

2. Silverlight ................................................................................................................................. 6

2.1. Silverlighti esimese versiooni puudused ........................................................................... 6

2.2. Silverlight 2.0 .................................................................................................................... 6

2.3. Silverlight vs WPF ............................................................................................................ 7

3. Silverlighti veebipõhine meedia pleier ..................................................................................... 8

3.1. Rakenduse loomine: esimene etapp .................................................................................. 8

3.2. Rakenduse loomine: teine etapp ..................................................................................... 11

3.3. Rakenduse loomine: kolmas etapp ................................................................................. 14

3.4. Rakenduse loomine: neljas etapp .................................................................................... 16

3.5. Töö käigus kasutatud tööriistad ...................................................................................... 17

Kokkuvõte ..................................................................................................................................... 18

Kasutatud kirjandus ....................................................................................................................... 19

Töö materjalid: .............................................................................................................................. 19

3

Sissejuhatus

Siinse töö eesmärgiks on tutvustada uue Microsofti veebitehnoloogiat nimega Silverlight.

Lugedes antud materjali on võimalik teada saada, kuidas ilmus idee tuua töölauarakenduste

omadusi ja .�ET Raamistiku võimalusi interneti brauseri. Selle idee realiseerimise tulemuseks on

viis luua erksaid rakendusi, mis on platvormist sõltumatud ja mis tulevikus muudavad meie

ettekujutust sellest, kuidas peaks toimima töö arvutiga.

Minu tutvumine antud .NET Raamistiku osaga algas Windows Presentation Foundation’ist aastas

2006. Mind hämmastas see, kuidas on võimalik suhteliselt lihtsalt ja kiiresti luua rakenduse, mis

näeb hämmastavalt välja, mis on suuteline kasutama arvuti graafikakaardi ressursse selleks, et

näidata kasutajale animatsioone, graafikuid, pilte ja esitada andmeid ja infot arusaadaval ja

põneval kujul.

Järgmise aasta sügisel oli avalikustatud Silverlight, WPF’st nuditud versioon, mõeldud brauseri

jaoks, mis oleks suuteline töötama igal platvormil. Silverlight oli tõesti WPF’st loogiline samm

edasi, ja kuna kõik tööriistad ja töövoog jäid samaks, siis hakkasin selle uurimist. Kuid reaalne

katsetamine Silverlighti rakendustega algas ainult teise versiooni esimesest beetast (Silverlight

2.0 Beta 1), mis ilmus 2008. aasta alguses. Sellest ajast siiamaani jälgisin antud tehnoloogia

arenguprotsessi suure huviga, mis võimaldas mulle koguda piisavalt infot selleks, et kirjutada

antud tööd.

Töö on jaotatud kolmeks peatükiks. Esimesel jutustatakse sellest, mis on Silverlighti nii

nimetatud eelkäia – Windows Presentation Foundation, selle omapärad, eelised ja puudused.

Teine peatükk on pühendatud Silverlightile – mida kujutas endast tehnoloogia esimene versioon,

millised olid selle puudused; millised muutused olid toodut sisse teises versioonis, mis tuli välja

oma lõppkujul 2008. aasta sügisel.

Kolmas peatükk on pühendatud töö autori poolt loodud Silverlighti rakenduse näitele. Lugeja

saab tutvuda rakenduse loomise etappidega ja tööriistadega, mis olid iga etapi käigus kasutatud.

Kuna Silverlight on veel väga uus tehnoloogia, siis mingisugune eestikeelne materjal sellel

teemal praktiliselt puudub. Loodan, et minu töö suudab äratada huvi ka teiste infotehnoloogia

üliõpilaste seas, ja nad saaksid kasutada seda oma esimeste Silverlighti rakenduste arendamise

katsete käigus.

4

1. Windows Presentation Foundation

Windows Presentation Foundation on Microsofti tehnoloogia, mis võimaldab luua erksa

kujundusega lauarakendusi. Sellised rakendused suudavad kasutada arvuti graafikakaardi

protsessori võimalusi selleks, et demonstreerida rikkaliku graafikat, animatsioone, kõrge

kvaliteediga tekste ja erinevaid efekte. Tähtis on see, et kõik eelnimetatud kasutajaliidese

komponendid on sõltumatud ekraani suurusest. Tulemuseks on see, et rakendus näeb

hämmastavalt hea välja iga monitori peal.

Windows Presentation Foundation on Microsofti .�ET Raamistiku versiooni 3.0 üks osa ja alates

Windows Vistast on see saadaval koos operatsioonisüsteemiga.

1.1. Rakenduste loomise töövoog

WPF klassi rakenduste loomisel on olemas omapärane töövoog, mis koosneb kahest osast. Selle

välja arendamise põhimõtte on lihtne. Kui vaadelda tänapäevast rakenduste arendamise protsessi

lihtsustatud kujul, siis selles osalevad kahe kategooria inimesed: arendajad ja disainerid. Enne

WPF’i programmid olid loodud järgmise skeemi järgi: disainer sai ülesannet luua kasutajaliidese

maketi rakenduse jaoks, mis täidaks mingisuguseid eesmärke. Kujundi kavandamine toimiks

tavaliselt Adobe Illustratoris või siis Adobe Photoshopis, või kasutades mis iganes muud graafika

redigeerimisprogrammi. Tulemuseks olid pildid, või Flashis tehtud animatsioonid, mis näitaksid,

kuidas rakendus peaks käituma ühe või teise stsenaariumi järgi.

Teisel faasil arendaja võttis disaineri poolt ettevalmistatud materjalid ja üritas koodi abil luua

rakenduse, mis näeks välja maksimaalselt sarnaselt sellega, kuidas disainer seda endale ette

kujutas. Kuid antud töö täitmine oli väga raske, kuna olemasolevad arendaja tööriistad ei olnud

mõeldud selleks, et luua rikka kujundusega programme. Sellega tuli teha kompromisse ja

lõpptulemus ei olnud sugugi selline, kui see oli alguses mõeldud.

WPF’i rakenduste kasutajaliidese komponentide loomiseks töötas Microsoft välja spetsiaalse

paketti tööriistu, nimega Expression Studio, mis võimaldavad disaineril võtta oma varem tehtud

materjalid, ja panna neid töötama, ilma koodi teadmata ja ilma, et ta segaks programmeerija tööd.

Kasutajaliidese loomiseks oli loodud spetsiaalne keel XAML, mis on XML’i põhine deklaratiivne

keel, sarnane näiteks HTML’iga. XAMLi abil saab väga lihtsal viisil defineerida erinevaid

5

kasutajaliidese elemente. Näiteks alltoodut koodi abil (vt. koodinäide 1) saab luua sinise taustaga

punase sildiga nuppu, mille peal on kirjutatud „See on nupp“:

<Button Background="Blue" Foreground="Red" Content="See on nupp"/>

Koodinäide 1. !upu deklaareerimine XAML koodis

1.2. Windows Presentation Foundation’i puudused

Tänapäevases maailmas, kus tavainimene omab mitu seadet, näiteks laua- ja sülearvutit ja „tarka“

mobiiltelefoni, on Windows Presentation Foundation’il olemas üks suur puudus – selleks, et

antud tehnoloogial põhinevad rakendused töötaksid, on vaja Windows’i operatsioonsüsteemi.

1.3. WPF’i probleemi lahendus

Selle probleemi lahendamiseks tekkis mõtte luua WPF’ist nuditud versioon, mis oleks

platvormist sõltumatu. Tundub, et selle idee realiseerimiseks kõige lihtsam viis oleks jooksutada

selliseid rakendusi interneti brauseris. Kuna infotehnoloogia tööstusharu kiireneva tempoga

liigub internetipõhise arvutiga töötamise poole, siis sellel lähenemisel kohe tekkivad plussid

juurde.

WPF’i brauseripõhilise versiooni koodnimeks oli WPF/E, mis tähendab Windows Presentation

Foundation Everywhere ehk igal pool. Hiljem tekis nimetus Silverlight.

6

2. Silverlight

Silverlighti esimene versioon ilmus 2007. aasta sügisel. Selle omadused olid piiratud – Silverlight

1.0 oli digitaalse meedia esitamise platvorm. Silverlight võimaldas kliendile vaadata kõrgema,

võrreldes tavalise Flash pleierite, kvaliteediga videoid, ilma et oleks vaja oodata, kuna brauser

laeb piisava tüki sisust. Üks huvitavamatest näidetest oli Foxi filmistuudio poolt loodud

proovirakendus Fox Trailers, kus oli võimalik vaadata peatselt saabuvate filmide klippe.

2.1. Silverlighti esimese versiooni puudused

Rakenduste loomine oli raske, kuna koodi oli võimalik kirjutada ainult kasutades JavaScripti.

Kasutajaliidese loomiseks olid saadaval primitiivsed kujundid, ja selleks, et luua midagi tarka,

arendajal tuli näha päris palju vaeva JavaScripti manipuleerimisega.

2.2. Silverlight 2.0

Tehnoloogiast teine versioon oli välja kuulutatud samal ajal, kui ilmus Silverligthi 1.0

finaalversioon. Arendamisefaas kestis peaaegu aasta, ja 2.0’st finaalversioon ilmus 2008. aasta

oktoobri keskel.

Silverlighti teine versioon toob väga palju uuendusi. Nüüd on saadaval igasugused kasutajaliidese

komponendid, millest igaühe jaoks võib luua oma stiliseeritud kujunduse. Rakenduste koodi

kirjutatakse C#, mis on mitmeid kordi edasijõudnum keel, kui JavaScript. See on ka arusaadav,

kuna JavaScript ei ole selliste ülesannete jaoks mõeldud.

WPF’i rakenduste loomise töövoog on Silverlightis säilinud, sellega kõik vajalikud tööriistad

jäävad samaks. Disainerile läheb vaja Expression Studio 2 tooteid, enamasti Expression Blendi,

mille abil saab ära paigutada kõik kasutajaliidese komponendid, tekitada animatsioone ja määrate

nuppude funktsioonid.

Enda töö jaoks hakkab arendaja kasutama Visual Studio’t 2008, kus on olemas kõik vajalikud

tööriistad selleks, et efektiivselt kirjutada koodi, mis panebki rakenduse täitma püstitatud

eesmärke.

7

2.3. Silverlight vs WPF

Silverlighti ja WPF vahel on olemas mõned erinevused, kuna nagu oli enne mainitud, Silverlight

on WPF’st nuditud versioon. Edasi vaatleme neid tunnuseid, mis Silverlightis puuduvad või on

esitatud teisel kujul.

1. Silverlight ei toeta käske (commanding), mille tugi on olemas WPF’is. Lihtsaim näide

käskudest on näiteks oskus kasutada lõikamist, kopeerimist ja kleepimist (cut, copy,

paste). Järgmiselt (vt. koodinäide 2) on toodut näide, kuidas käsud töötavad WPF’i

rakendustes.

<StackPanel>

<Menu>

<MenuItem Command="ApplicationCommands.Paste" />

</Menu>

<TextBox />

</StackPanel>

Koodinäide 2. WPFis käsu lisamine kasutajaliidese komponendile

2. Dünaamilised ressursid (dynamic resources). Kõik objektid XAMLis on staatilised, kuna

Silverlightis puudub dünaamiliste objektide tugi.

3. Andmete sidumine (data binding). Paljud andmete sidumise võimalused on Silverlightis ja

WPFis samad. Kuid üheks omaduseks, mille järgi puudust kindlasti tunnetakse on

võimalus siduda otseselt XMLi andmetega.

4. Päästikud (triggers). Silverlighti võimlused kasutada triggereid on piiratud EventTriggeri

laetud sündmuse (Loaded event) ja alusta jututahvli (BeginStoryboard) kasutamisega

(Microsoft, Silverlight: WPF Compatibility).

Rohkem infot Silverlighti ja WPF erinevuste kohta on võimalik saada siit:

http://msdn.microsoft.com/en-us/library/cc903925(VS.95).aspx

8

3. Silverlighti veebipõhine meedia pleier

Oma seminaritöö jaoks ehitasin ma valmis meediapleieri rakenduse, mis, ootamatult, näitab

videot. Programm võimaldab videot peatuma, manipuleerida heliga ja vaadata seda täisekraanil.

Rakenduse loomine koosnes kolmest etapist.

3.1. Rakenduse loomine: esimene etapp

Alguses Adobe Illustrator CS3 abil oli loodud rakenduse vektorgraafiline kujundus ja

komponendid jagatud kihtideks (vt. joonis 1). Edasi tuli valmis tehtud komponente välja

eksportida. Kuna pleieri alusel ja heliindikaatoril on suhteliselt keerukas struktuur, siis need olid

salvestatud P�G failidena. PNG formaat on eelistatud sellepärast, et see toetab läbipaistvust.

Sellega alusel võivad olla augud sees ja pärast nende läbi on nähtavad teised kasutajaliidese

komponendid. Antud trikk võimaldas saavutada näiteks seda, et video peal on olemas läige, mis

on tegelikult pleieri aluse pildi osa.

Joonis 1. Rakenduse kujunduse loomine Adobe Illustratoris

Rakenduse prototüüp loodud Adobe Illustratoris. Komponendid on jagatud kolme kihi vahel:

1. VolumeIndicator – sisaldab heli tugevuse indikaatori kujundust

2. PlayPause Btn – sisaldab nuppude kujundust

3. Player – sisaldab pleieri aluse koos läikega

Nuppud olid toodud sisse Expression Design’i

formaadis. Expression Designi omapära seisneb selles, et see on võimeline võt

Illustratoris joonistatud kujunduse ja

kadu, nagu oleks siis, kui nuppudest oleksid tehtud pildid, ja

täpne.

Rakenduse kujunduse loomine Adobe Illustratoris


sisaldab heli tugevuse indikaatori kujundust

sisaldab nuppude kujundust

sisaldab pleieri aluse koos läikega

Expression Design’i (vt. joonis 2) ja siis eksporditud

Expression Designi omapära seisneb selles, et see on võimeline võt

Illustratoris joonistatud kujunduse ja konverteerida seda XAML koodiks.

kadu, nagu oleks siis, kui nuppudest oleksid tehtud pildid, ja lõpprakenduses on graafika ergas ja

9


ja siis eksporditud Silverlight Canvas

Expression Designi omapära seisneb selles, et see on võimeline võtma Adobe

koodiks. Sellega ei teki kvaliteedi

lõpprakenduses on graafika ergas ja

Joonis 2. !upude eksporteerimine Expression Design'i

Nuppud on eksporditud Expression

Edasi on toodut tükk XAML koodist, mille abil luuake

<Path x:Name="Path_274" Width="60.7116"

Canvas.Top="9.32947" Stretch="Fill" Data="F1 M 64.9713,9.32947L 21.8555,9.32947C 19.4707,9.32947 17.2539,10.1342 15.4153,11.5131C 14.7683,12.0912 14.2032,12.7566

13.7369,13.4922C 15.8203,11.0691 18.7579,9.55734 22.01168.8645,9.55734 72.4167,11.8894 74.4485,15.4063C 74.2454,14.8242 73.9869,14.2683

73.6791,13.7448C 71.5664,11.0404 68.4479,9.32947 64.9713,9.32947">

<Path.Fill>

<LinearGradientBrush StartPoint="0.362037,

<GradientStop Color="#FFFFFFFF" Offset="0"/>

<GradientStop Color="#FFFBD89E" Offset="0.497889"/>

<GradientStop Color="#FFF8B23E" Offset="1"/>

</LinearGradientBrush>

</Path.Fill>

</Path>

Koodinäide 3. Stopp nuppu XAML kood

!upude eksporteerimine Expression Design'i

Nuppud on eksporditud Expression Designi, mille abil genereeritakse XAML koodi.

Edasi on toodut tükk XAML koodist, mille abil luuake Stopp nupp (vt. koodinäide 3

<Path x:Name="Path_274" Width="60.7116" Height="6.07681" Canvas.Left="13.7369"


13.7369,13.4922C 15.8203,11.0691 18.7579,9.55734 22.0117,9.55734L 64.8151,9.55734C 68.8645,9.55734 72.4167,11.8894 74.4485,15.4063C 74.2454,14.8242 73.9869,14.2683

73.6791,13.7448C 71.5664,11.0404 68.4479,9.32947 64.9713,9.32947">

<LinearGradientBrush StartPoint="0.362037,-1.41644" EndPoint="0.36

<GradientStop Color="#FFFFFFFF" Offset="0"/>


<GradientStop Color="#FFF8B23E" Offset="1"/>

</LinearGradientBrush>

Stopp nuppu XAML kood

10

XAML koodi.

(vt. koodinäide 3).

Height="6.07681" Canvas.Left="13.7369"


7,9.55734L 64.8151,9.55734C 68.8645,9.55734 72.4167,11.8894 74.4485,15.4063C 74.2454,14.8242 73.9869,14.2683

73.6791,13.7448C 71.5664,11.0404 68.4479,9.32947 64.9713,9.32947">

1.41644" EndPoint="0.362037,1.66199">


3.2. Rakenduse loomine: teine etapp

Nüüd kui kõik vajalikud kasutaja lii

jaoks kasutasin Expression Blendi

Alguses lõin uue projekti ja valisin selle tüübiks

Võrreldes tavalise WPF rakendusega, Silverlighti projektil on olemas mõned omapärad.

Joonis 3. Uue projekti loomine Expression Blend'is

Kõik rakenduse komponendid lisatakse

keel, siis ka komponentide struktuur on puu kujuline. Juurelemendiks on

(Grid), mille nimeks on LayoutRoot

kerimisnäidik (ScrollViewer

objekte oma rakenduses paigutada.

Juur elemendi kasutamine ei ole kohu

teiste elementide paigutust rakenduse ala sees.

tulemuseks on see, et antud ristk

loomine: teine etapp

Nüüd kui kõik vajalikud kasutaja liidese komponendid on olemas, sai

Expression Blendi.

Alguses lõin uue projekti ja valisin selle tüübiks „Silverlight 2.0 rakenduse“

avalise WPF rakendusega, Silverlighti projektil on olemas mõned omapärad.

. Uue projekti loomine Expression Blend'is

Kõik rakenduse komponendid lisatakse User Control objektile. Kuna XAML on XMLi põhine

keel, siis ka komponentide struktuur on puu kujuline. Juurelemendiks on

LayoutRoot. Võrgustiku asemel võib olla raam

ScrollViewer). Juur elemendi tüüpi saab muuta vastavalt sellele, kuidas tahetakse

objekte oma rakenduses paigutada.

elemendi kasutamine ei ole kohustuslik, aga on siiski soovitatav, kuna see võimaldab muuta

teiste elementide paigutust rakenduse ala sees. Võrgustiku asendamise, näiteks ristküülikuga,

antud ristküliku asukoht on staatiline, ning seda ei saa kuidagi muuta.

11

dese komponendid on olemas, sai panna neid kokku. Selle

„Silverlight 2.0 rakenduse“ (vt. joonis 3).

avalise WPF rakendusega, Silverlighti projektil on olemas mõned omapärad.

Expression

Blendis uue

projekti loomise

dialoog aken.

Valime tüübiks

Silverlighti 2.0

rakendus,

määrame nime;

asukoha, kuhu

salvestada ja

programmerimi

s keele. Antud

juhul on see

Visual C#.

Kuna XAML on XMLi põhine

keel, siis ka komponentide struktuur on puu kujuline. Juurelemendiks on nii nimetatud võrgustik

raam, lõuend, kuhjapaneel või

Juur elemendi tüüpi saab muuta vastavalt sellele, kuidas tahetakse

v, kuna see võimaldab muuta

Võrgustiku asendamise, näiteks ristküülikuga,

seda ei saa kuidagi muuta.

Joonis 4. Komponentide puu Expression Blend'is

Kuna Expression Blend ja Visual Studio 2008 on integreeritud tein

jagavad nad teine teisega ka projekti struktuuri

Joonis 5. Expression Blendi projektipuu sarnasus Visual

Studioga

. Komponentide puu Expression Blend'is

Nagu on illustratsioonist näha

alguseks paigutasin juur elemendi sisse veel

ühe võrgustiku nimega

sees on omajärgi kõik teised elemendid, mis

koostavad pleieri. Ainuke element väljaspool

playerFrame’i on VidScUC (Video Scene User

Control). Antud sammu mõtte seisneb selles,

et VidScUC on põhilise kasutajaliidese jaoks

võõras komponent, mis tuleb mängu ainult

siis, kui vajutatakse täisekraan nupu ja

peidetakse kõik teised objektid.

Kuna Expression Blend ja Visual Studio 2008 on integreeritud teineteisega, siis mugavuse mõttes

jagavad nad teine teisega ka projekti struktuuri (vt. joonis 5).

. Expression Blendi projektipuu sarnasus Visual

Expression Blendi projekti puu

samasugune ka Visual Studios.

Vajutades parema hiire nupuga

peale (Solution) on võimalik valida käsu

Redigeeri Visual Studios (Edit in Visual

Studio).

12

Nagu on illustratsioonist näha (vt. joonis 4),

alguseks paigutasin juur elemendi sisse veel

ühe võrgustiku nimega playerFrame, mille

on omajärgi kõik teised elemendid, mis

Ainuke element väljaspool

VidScUC (Video Scene User

Antud sammu mõtte seisneb selles,

on põhilise kasutajaliidese jaoks

võõras komponent, mis tuleb mängu ainult

takse täisekraan nupu ja

peidetakse kõik teised objektid.

teisega, siis mugavuse mõttes

Expression Blendi projekti puu, mis on täiesti

samasugune ka Visual Studios.

Vajutades parema hiire nupuga lahenduse

on võimalik valida käsu

Studios (Edit in Visual

13

Nagu projektipuust on näha (vt. joonis 5), on rakendusele lisatud veel kaks kasutaja kontroll

tüübist elemendi. Need on VideoSceneUC.xaml ja VolumeIndicatorUC.xaml. Loogika on sarnane

näiteks Java programmeerimisega, kus on kombes paigutada klassid eraldi failidesse. Sama idee

on kasutusele võetud ka Silverlighti rakendustes ja tehakse seda selleks, et mitte lasta ühele

XAML failile kasvada liiga suureks, kuna see lõpptulemuseks mõjub rakenduse teostusvõimet.

Selleks, et kasutada ühe kasutaja kontrolli teise sees on vaja täita kaks lihtsat sammu.

1. Defineeritakse põhikontrolli sees uue XML namespace’i (vt. koodinäide 4). See võib näha

välja näiteks nii:

xmlns:MediaPlayer2="clr-namespace:MediaPlayer2"

Koodinäide 4. XML namespace’i defineerimine

2. Paigutakase võrgustiku sees soovitava objekti. Antud juhul on see VideoSceneUC (vt.

koodinäide 5).

<MediaPlayer2:VideoSceneUC x:Name="VidScUC" Visibility="Collapsed" />

Koodinäide 5. Valmisoleva kasutaja kontrolli lisamine

Nagu on koodist näha, alguses on VideoSceneUC nähtavuse omaduseks Collapsed, ehk peidetud.

Pärast on see C# koodi kaudu muudetud nähtavaks.

Kui kõik kasutajaliidese komponendid on ära paigatud, määratakse nuppude funktsioonid ja

liigutakse järgmise etapi juurde.

Joonis 6. !upu funktsioonide määramine Expression

Blendis.

3.3. Rakenduse loomine: kolmas etapp

Kõik edaspidine töö toimub Visual Studio

mingil juhul seda, et rakenduse kujundus peab olema lukus, ja seda ei saa täita ega muuta.

ja Silverlighti töövoo veetlus seisnebki selles, et disainer ja arendaja sa

ilma, et nad teine teist segaksid.

Edasi on toodud koodi jupp, mis paneb helitu nupu töötama nii, nagu on oodatud

6).

private void soundMuteBtnClick(object sender, RoutedEventArgs e)

{

VolumeIndUC.Visibility =

if (videoElement.IsMuted == false)

{

videoElement.IsMuted = true;

VolumeIndUC.VlmIndicator.Width = 0;

}

!upu funktsioonide määramine Expression

Tööriist toob välja kõik antud tüübist

komponendi küljes olevad

(vt. joonis 6). Antud näides on valitud nupu

klõpsamine, mis kutsub välja funktsiooni

soundMuteBtnClick.

Vajutades Enter’it tehakse lahti

kus saab C# koodi abil määrata, mida nupp

hakkab tegema antud sündmuse ajal.

Rakenduse loomine: kolmas etapp

edaspidine töö toimub Visual Studio’s. Kuid nagu oli alguses mainitud, ei tähenda see

mingil juhul seda, et rakenduse kujundus peab olema lukus, ja seda ei saa täita ega muuta.

ja Silverlighti töövoo veetlus seisnebki selles, et disainer ja arendaja saavad teha tööd samal ajal,

ilma, et nad teine teist segaksid.

koodi jupp, mis paneb helitu nupu töötama nii, nagu on oodatud


VolumeIndUC.Visibility = Visibility.Visible;

if (videoElement.IsMuted == false)

videoElement.IsMuted = true;

VolumeIndUC.VlmIndicator.Width = 0;

14

Tööriist toob välja kõik antud tüübist

komponendi küljes olevad sündmused (events)

Antud näides on valitud nupu

klõpsamine, mis kutsub välja funktsiooni

tehakse lahti Visual Studio,

kus saab C# koodi abil määrata, mida nupp

hakkab tegema antud sündmuse ajal.

Kuid nagu oli alguses mainitud, ei tähenda see

mingil juhul seda, et rakenduse kujundus peab olema lukus, ja seda ei saa täita ega muuta. WPF

avad teha tööd samal ajal,

koodi jupp, mis paneb helitu nupu töötama nii, nagu on oodatud (vt. koodinäide


15

else

{

videoElement.IsMuted = false;

soundIndicatorChange();

}

}

Koodinäide 6. Helitu nupu funktsioon

Iseenesest kood on väga lihtne. Alguses on deklareeritud funktsioon soundMuteBtnClick, mis

võtab vastu objekti saatja (sender) ja suunatud sündmust e.

VolumeIndUC.Visibility = Visibility.Visible; -- antud korraldus muudab heli indikaatori

komponendi nähtavaks. Edasi järgneb if-plokk, mis kontrollib, kui video elemendil on heli sees,

siis seda lülitakse välja ja pannakse heli indikaatori pikkust nulliks (vt. joonis 7). Tulemus on

selline:

Joonis 7. Heli indikatori komponent

Heli indikaatori komponent, mis näitab, et

video heli on välja lülitatud.

Edasi järgneb else osa, mis määrab seda, et kui kasutaja vajuta nupu teist korda, siis heli lülitakse

tagasi sisse ja kutsutakse välja funktsioon soundIndicatorChange, mis määrab heli tugevuse

indikaatori õige asukoha.

Programmeerimine Visual Studio’s on väga lihtne ja intuitiivne. Kui koodis juhtub viga või

näpukas, siis seda tõmmatakse punasega alla, nagu näiteks Microsoft Wordis, ja näidatakse ujuv

kast koos seletusega, mis on antud kohal kirjutatud valesti. Minu jaoks kõige mugavam Visual

Studio funktsioon on IntelliSense, mis pakub trükkimise ajal sobivad koodijupid, säästmaks

sellega programmeerija aega (vt. joonis 8).

16

Joonis 8. Visual Studio IntelliSense

IntelliSense pakub

välja võimalikud

koodi jupid, muutes

programmeerimist

mõnusaks ja

kiiremaks

ülesandeks.

3.4. Rakenduse loomine: neljas etapp

Nüüd kui rakendus on valmis, jõudis õige aeg selleks, et teha seda avalikuks. Sellega ka teised

inimesed saavad seda katsetada. Microsoft pakub arendajatele tasuta võimaluse majutada

rakendusi oma serverites läbi Silverlight Streaming’u teenuse. Iga kasutaja saab 10Gb serveri

ruumi ja mugava veebiliidese oma lahenduste administreerimiseks. Selleks, et saada võimalust

antud teenust kasutada läheb vaja Windows Live ID’d, kuid juhul, kui inimene kasutab Windows

Live / MS� Messengeri või Hotmaili on see tal juba olemas.

Selleks, et laadida oma rakenduse üles, enne on vaja teha järgmist:

1. Luua fail manifest.xml ja lisada sinna järgmine koodi jupp (vt. koodinäide 7):

<SilverlightApp>

<version>2.0</version>

<source>MediaPlayer2.xap</source>

<width>800</width>

<height>557</height>

<background>white</background>

<isWindowless>false</isWindowless>

</SilverlightApp>

Koodinäide 7. Silverlighti rakenduse manifest

Antud kood määrab tehnoloogia versiooni, mille põhjal oli rakendus loodud. Antud juhul on

selleks Silverlight 2.0. Edasi määratakse allikas: MediaPlayer2.xap. XAP failid on arhiivid, kuhu

kompilaator pakib kõik rakenduses kasutatud failid. Lihtsustatult vaadates, XAP ongi meie

Silverlighti rakendus. Järgmisena määratakse rakenduse suurust, tausta värvi ja kas rakendusel on

olemas eraldi aken, või mitte.

2. Pakkida .XAP fail ja

joonis 9).

Joonis 9. Silverlight Streamingu administreerimispaneel

Silverlight Streaming’u administreerimispaneel ja olemasoleva rakenduse üles laadimine.

seda, kui protsess on lõppenud,

selleks, et ta saaks lisada enda poolt loodud rakenduse oma veebisaidile või blogile.

Microsofti Silverlight Streaming

3.5. Töö käigus kasutatud tööriistad

Oma seminaritöö rakenduse loomise käigus kasutasin järgmiseid tööriistu:

1. Adobe Illustrator CS3

2. Microsoft Expression Design 2

3. Microsoft Expression Blend 2

4. Microsoft Visual Studio 2008 Professional Edition koos Service Pack 1

5. Microsoft Silverlight 2.0

Järgmisena määratakse rakenduse suurust, tausta värvi ja kas rakendusel on

olemas eraldi aken, või mitte.

ja manifest.xml zip arhiivi ja laadida see teenuse saidi kaudu

. Silverlight Streamingu administreerimispaneel

administreerimispaneel ja olemasoleva rakenduse üles laadimine.

seda, kui protsess on lõppenud, kasutaja saab lingi oma rakendusele ja vajalikud koodi jupid

enda poolt loodud rakenduse oma veebisaidile või blogile.

Microsofti Silverlight Streaming’u teenus asub aadressil: http://silverlight.live.com

Töö käigus kasutatud tööriistad


Adobe Illustrator CS3

Expression Design 2

Expression Blend 2 koos Service Pack 1

Visual Studio 2008 Professional Edition koos Service Pack 1

Microsoft Silverlight 2.0 Tools for Visual Studio 2008 SP1

17

Järgmisena määratakse rakenduse suurust, tausta värvi ja kas rakendusel on

ja laadida see teenuse saidi kaudu üles (vt.

administreerimispaneel ja olemasoleva rakenduse üles laadimine. Pärast

kasutaja saab lingi oma rakendusele ja vajalikud koodi jupid

enda poolt loodud rakenduse oma veebisaidile või blogile.

http://silverlight.live.com


Visual Studio 2008 Professional Edition koos Service Pack 1

18

Kokkuvõte

Silverlight on uus Microsofti poolt välja töötatud tehnoloogia, mis võimaldab arendajatele luua

hämmastavaid veebirakendusi omadustega ja funktsioonidega, mis olid enne võimalikud ainult

lauarakenduste seas. Veelgi tähtsam on see, et sellised programmid on platvormist sõltumatud,

mis tähendab, et nad töötavad sama hästi nii PC, Maci, Linuxi ja tulevikus ka mobiiltelefoni peal.

Mõned võivad arvata, et Silverlight ei ole midagi enam, kui Microsofti versioon Flashist, kuid see

ei ole üldse nii. Silverlighti, kui tehnoloogia, arenduse abil olid toodud valdkonnale paljud

innovatsioonilised lahendused ning on ilmunud ka Flashile konkurents, mis tähendab seda, et

Adobe on sunnitud hakata looma uusi lahendusi. Sellest kõigest lõppude lõppuks võidavad

tavakasutajad, kuna tulevikus veeb annab meile võimalust teha selliseid asju, mille kohta praegu

me isegi ei unista.

19

Kasutatud kirjandus

Microsoft. Kasutamise kuupäev: 21. 10 2008. a., allikas Microsoft Silverlight:

http://silverlight.net

Microsoft. Silverlight: WPF Compatibility. Kasutamise kuupäev: 21. 10 2008. a., allikas MSDN:

http://msdn.microsoft.com/en-us/library/cc903925(VS.95).aspx

Töö materjalid:

http://lin2.tlu.ee/~cgp2elt0/silverlight/

microsoft silverlight · jaoks, mis oleks suuteline töötama igal platvormil. silverlight oli...

Documents