Silverlight Luka Abrus TechnologySpecialistlukaa@microsoft.com Microsoft Hrvatska http://lukaa.bloger.hr/
Sadržaj • Što je i kako radi Silverlight? • Glavne prednosti Silverlighta • Alati i izrada aplikacija • Silverlight danas i sutra • Video streaming
Što je Silverlight? • Tehnologija za izradu multimedijalnih sadržaja i bogatih interaktivnih aplikacija • Dodatak za web-preglednike, podržan na više platformi i više preglednika • Windows, Mac OS • Internet Explorer, Firefox, Safari • U razvoju: Linux, Nokia, Windows Mobile, Opera… • 1.5+ milijuna instalacija dnevno
Silverlight 1.0 i Silverlight 2.0 • Silverlight 1.0 • Finalna verzija dostupna od rujna 2007. • Veličina oko 1.3 MB • Razvoj: programiranje u JavaScriptu, sučelje u XAML-u • Silverlight 2.0 • Trenutno u Beta 1 verziji • Beta 2 = lipanj; Finalna verzija = poslije ljeta • Veličina oko 4.3 MB • Razvoj: isto kao SL 1.0 + podrška za .NET
DEMO • Silverlight TV • Silverlight Advertising • Silverlight Puzzle
Kako rade Silverlight aplikacije? • Izvršavaju se u pregledniku • Neovisne o poslužitelju • Koriste poznate tehnologije • XAML za opisivanje sučelja • JavaScript za programiranje (1.0 i 2.0) • .NET za programiranje (2.0) • Potpuna integracija u web-stranicu
XAML – eXtensible Application Markup Language • Deklarativni jezik – čisti XML • Opisuje izgled i ponašanje • Generiraju ga Microsoft Expression alati • + Adobe Illustrator, Fireworks, Autodesk… • Koristi ga Windows Presentation Foundation • Odvojenost sučelja od programskog koda
Suradnja developera i dizajnera =
XAML primjeri (1/3) • Pozicioniranje elemenata <Canvas xmlns="..." xmlns:x="..." Background="Light Gray"> <Rectangle Canvas.Top="25" Canvas.Left="25" Width="200" Height="150" Fill="Black" /> <Canvas Canvas.Top=“50" Canvas.Left="50" Width="150" Height="100" Background="Orange"> <Ellipse Canvas.Top="25" Canvas.Left="25" Width="150" Height="75" Fill="Red" /> </Canvas> </Canvas>
XAML primjeri (2/3) • Vektorski oblici • <Rectangle /> • <Ellipse /> • <Line /> • <Polygon /> • <PolyLine /> • <Path />
Transformacije <RotateTransform /> <ScaleTransform /> <SkewTransform /> <TranslateTransform /> <MatrixTransform /> XAML primjeri (3/3)
Silverlight 1.0 - Arhitektura • XML opis sučelja (XAML) • Korištenje tekstualnih datoteka • Odvojenost sučelja od koda • Programiranje u JavaScriptu • Integracija s DOM-om • Korištenje poznatih metoda, klasa, AJAX-a…
Silverlight 1.0 - Video • Video je običan element u XAML-u • Rotacija, prozirnost, transformacije, preklapanje, više simultanih video-zapisa… • Implementiran industrijski standard – VC-1 • Podrška za WMV, WMA, MP3 • Besplatan Encoder SDK • Integracija s Windows Media Serverom • Besplatan hosting video-zapisa (10 GB) • http://silverlight.live.com/
Silverlight 1.0 - Razno • Rad s fontovima - TTF • Uključite u projekt posebne TTF-ove • WPF model animacija • Temeljen na vremenu (početak / kraj) • Downloader objekt • Dohvaćanje eksternih elemenata (XAML, TTF…) • Pakiranje u ZIP datoteke • AJAX kao funkcionalni pokretač
Alati za razvoj Silverlight 1.0 aplikacija • Expression Blend • Verzija 2.0 ili novija • Alat prvenstveno namijenjen dizajnerima za izradu XAML-a • Vaš omiljeni web-editor • Podrška za JavaScript, HTML • Expression Web • Zapravo… • Dovoljan je i Notepad
DEMO • Izrada Silverlight 1.0 aplikacije • Animacija • Eventi • JavaScript • XAML • HTML • VideoBrush
Silverlight 2.0 – programiranje • .NET programiranje • Podskup .NET klasa • Donosi funkcionalnosti kao što su… • LINQ, Generics, Threading, DataBinding • Klase za dohvaćanje podataka • REST, SOAP/WS*, RSS, JSON, XML HTTP, Sockets API • … i mnoge druge za koje ima smisla u web-okruženju • Prvi put .NET na Linuxu, Macu…
Silverlight 2.0 – Razne funkcionalnosti • Novosti u XAML-u • Pozicioniranje elemenata (Grid, StackPanel) • Korištenje stilova (slično HTML/CSS-u) • Niz dostupnih kontrola • Izrada vlastitih, customizacija postojećih • Tehnikalije • Potpuna dvosmjerna integracija s HTML-om i JavaScriptom • Pristup JavaScript funkcijama iz .NET-a i obrnuto • Open File Dialog za pristup datotekama korisnika • IsolatedStorage za spremanje podataka kod korisnika • Evolucija cookiea • DeepZoom tehnologija
Alati za razvoj Silverlight 2.0 aplikacija • Expression Blend • Trenutno aktualna verzija 2.5 March Preview • Alat prvenstveno namijenjen dizajnerima • Visual Studio 2008 • + Silverlight Tools Beta 1 for VS 2008 • Alat prvenstveno namijenjen programerima • Međusobno kompatibilni i neovisni • Omogućavaju rad na istim projektima
DEMO • Kontrole • Deep Zoom tehnologija
Microsoftove razvojne tehnologije Web Desktop JSP / PHP ColdFusion Mac OS Server Vista AJAX Libraries Linux “Apollo” LAMP Media & RIA Microsoft Flash & Flex Quicktime & drugi Drugi
Video – načini dostave • Progressive Download • Za: Datoteka na HTTP serveru, malo korištenje resursa, lako upravljanje, rad preko SSL-a, vatrozida, cache servisa, proxya… • Protiv: Nema live broadcasta, ne podržava napredno “premotavanje” naprijed i natrag, dugo bufferiranjekad je bitrate video zapisa veći od brzine veze • Streaming • Za: Mnogo naprednih mogućnosti, optimizacija bandwidtha, live broadcasting • Protiv: Posebna infrastruktura, nemoguće dostaviti sadržaj kodiran na većem bitrateu nego što je brzina veze
Progressive Streaming - danas
IIS7 Media Pack • Sustav za dostavu multimedijalnog sadržaja na Windows Serveru 2008 i IIS-u 7 • Bit Rate Throttling, Web Server Playlist • Poboljšanja za progressive downloadmodel • Besplatno preuzimanje - www.iis.net
Progressive Download - sutra
Resursi • http://silverlight.net • Microsoft Expression alati (180-day trials)http://www.microsoft.com/Expresssion • SDKhttp://msdn2.microsoft.com/bb188266.aspx
DEMO • Popfly Mashups • Popfly Game Creator
