My name is Edward Tanguay. I am a web developer in Berlin, Germany. I learn everything I can and record it on this site. Other things you might be looking for: My Ubuntu Tutorial My Datapod Project My Blog Feed:  |
 This video is in German. If you don't understand German, well then, you are out of luck. Please tell me where I can get videos of this quality in English.Other videos I am currently learning from:
|
Microsoft Silverlight 2
Good way to get up to speed on Silverlight.
Silverlight verstehen
Was ist Silverlight? [watch this video free online] ( finished) Silverlight is nothing more than a way to write platform-agnostic applications, you just need to have a silverlight player, microsoft have a complex ecosystem for the developer: Expression Studio (Expression Blend [user inteface builder for WPF and Silverlight], Expression Web [Frontpage], Expression Design [Raster and Vector graphics editor], Expression Media, Expression Encoder), silverlight works with firefox, explorer, safari, and will work on mac, linux, windows, moonlight is silverlight for linux, this is a mono project, silverlight, XBAP (XAML Browser Applications), kind of like AIR, says you can program it in IronRuby and IronPython, says there was a lot added in Silverlight 2 (LINQ, threading, templates, C# support, generics). Rich Applications
Sinn und Unsinn von Rich Applications (todo) Beispiele von Rich Applications (todo) Workflow und Werkzeuge
Designer und Developer Workflow [watch this video free online] ( finished) Says big problme in most applications is the designer/developer workflow, has powerpoint with eggs, says with silverlight it is much more efficient, says most workflows are a one-way street (from designer to developer and finished, no updating), XAML fixes that, designer=blend, developer=visualstudio, both use SVN for instance, is similar to XUL (from Mozilla) and SVG, goes into Expression Design, then copies the graphic into Expression Blend, in Blend he clicks on "edit in Visual Studio", then in C# he says "Red.MouseLeftButtonUp += New...., so shows how he can make changes in Design, Blend, and Visual Studio, each application can use the same file, nice. Silverlight-Ecosystem [watch this video free online] ( finished) Says you can use Notepad, talks about what is in exprssion studio: Design (like photoshop), Media (manages media), Encoding, Blend (core for silverlight, like Flex Builder), talks aobut xamlpadx and a plugin for eclipse and DeepZoom Composer to do big graphics (fractal like), says this culd be used as a catalog for photographer. Installation und Hilfe
Silverlight-Laufzeitumgebung [watch this video free online] ( finished) To view silverlight, you just need the plugin, talks about each platform, shows hardrock memorabilia site, zooms down, impressive. Microsoft .NET Framework [watch this video free online] ( finished) Says when you install e.g. blend, then .NET 3.5 is automatically installed, says you can go here: C:\Windows\Microsoft.NET\Framework to find out if you have "v3.5", that's it. Expression Studio und Expression Blend [watch this video free online] ( finished) To make silverlight interfaces and graphics you need Expression Blend, you can get it as part of Expression Studio or by iteslve, he is installing the whole studio, he needs to install service packs, says Expression Blend 2 is otherwise only for WPF and Silverlight 1, make sure you get all the service packs, he downloads them, starts Expression Blend, says that programming in Visual Studio is a bit technical, but says you can "install Visual Studio as well", ok. Visual Web Developer und Visual Studio ( finished) Says you can use visual web developer to do silverlight coding, blend is only design, for web developer you should install SP1, then installs visual studio 2008, also SP1, need .NET 3.5 of course, we also need silverlight tools, so that it can work on the same project as blend simultaneously, downloads MicrosoftSilverlight Tools for Visual Studio 2008, you also need these for the Visual Web Developer, in visual studio go Visual C#, then Silverlight, chooses "test", oh, there is a preview, ok, looks a his blank page (F5), then right-click: open in expression blend, shows that he has the same project, when I tried it I got a "package load failure" in visual studio 2008", oh that was the alpha, oops, ok worked for Visual Web Developer. Deep Zoom Composer ( finished) Says blend for animation, visual studio for coding, good combination, but for the production of videos you have encoding, you also have deep zoom composer, allows you do zoom, says you find it at silverlight.net/GetStarted, he downloads it, says itis very easy, looks like blend, does new project, says you can export it, but he doesn't do it, ok, I tried it, and it works, nice. Das erste Projekt
Deep Zoom Foto-Viewer [watch this video free online] (watched) Says the easiest low-hanging fruit in silverlight is the deep zoom composer, double-clcik on dep zoom composer, file, new project, Name: PhotoViewer, path, clicks import, add image, has a very big picture, a picture of a train station (oh, it's the new Berlin main train station, cool), types in a tag (shows where), can export to windows live or as silverlight, does silverlight, na,e export locatin, either composition or collection, he only has one so composition, chooses JPG (not png), if you use transparency then PNG but they will be larger, choose export imagse and silverlight project, clicks export, clicks preview in browser, gets message that he needs to install silverlight, says his silverlight is old (beta), looks in project folder (button), edits the generated html page, changes type="application/x-silverlight-2-..", doesn't do that, instead he installs an update from blogs.msdn.com/expression/archive..., goes deep into folders, , renames to DeepZoomProject.bak, then copies the new DeepZoomProject back in, and now exports again, and looks and he can see it, he can move it and he can zoom in to check out details, nice (hopefully the update thing will correct itself in the future). Expression Encoder Video-Player [watch this video free online] (watched) Says silverlight is great for videos for web, like a "windows media player light in browser", you create this with Encoder, opens encode, file, import, then *.*, he wants to use a .mov file, gets error says that there is no quicktime, installs quicktime, then imports the .mov file, says the standard profile is fine, webserver broadband, changes it to 480x300, clicks on extend, metadata, output, chooses that he wants the silverlight player controls on the video, clicks on Encode and it rusn for a bit then plays in browser, goes back in Encoder, saves as a .xej file, syas ther is also an Output folder, says it is a Silverlight 1 application. Expression Blend Animation (watched) Going to show how to do an application in expression blend "SimpleCandle", does rectangle, changes color, going to animate wick, draws a circle, colored, then with select arrow makes it bigger, clicks on plus, new storyboard (flame), clicks on plus for keyframe, changes middle point and can now tilt the circle, drags the yellow arrow, changes the tilt again, now changes width, keeps changing, clicks play, then clicks on repateBehavior: forever, , but when he looks at it in browser, it doesn't move, says usually this is done in code, but you can do it with a trigger, but is just kind of a trick, goes into XAML to make a trigger, all is XAML nice, has Grid.Triggers, and inside that EventTrigger and Grid.Loaded, etc., copies in his storyboard inside the trigger, , then F5, he sees it move in the browser, but he says a disadvantage: he can't change it in the GUI anymore, so he says this is the last step, says in the future we will do it in the code so he is going to show it, he makes a copy of the project, does undo, now he can change it in the GUI, goes into XAML, storyboard is "Flame", clicks UserControl, clicks on Events, and in Loaded types in "StartAnimation", enter: goes to Visual Studio, in StartAnimation: Flame.Begin(), that's it, closes visual studio, tests, and it works, that's how to do it: in code. TODO: do animation and start with code Visual Studio und Visual Web Developer (watched) Says the with silverlight the Visual Web Developer is good enough, they look the same, you have to have the service packets, checks help to see if silverlight is installed, file/new project/silverlight/Hello World, checks "create directory", chooses test page, the WPF designer is default editor, does textblock, called it TextBlock x:Name="OutputTextBlock", goes to C# file and OutputTextBlock.Text = "testing" and it works. the does right-click on Page.xml and opens in Expression Blend, clicks Yes, so he can move around the text block, etc., then goes back to visual web developer, very nice. TODO: try and switch back to web developer Expression Blend
Arbeitsumgebung ( finished) Starts blend, you can open a website as well as a project, there are examples, you can make a copy of a project, nice, you can make: wpf application, wpf-control element (library), silverlight 1, or silverlight 2, creates a silverlight2 application, you can choose language as well, there is a project folder and a project, talks about all the panels, like any other program, in window you have a developer and designer viewer (F6), nice, then tools/options, you can even zoom in and out of the whole GUI, nice, in project you can add projects, see clean project folder, then object menu: can create styles, templates, etc. Ansichtssache: XAML versus Design (watched) Shows how you can change xaml code, can also split, press TAB or F4 then other windows are closed, color codes have 8 characters, zoom with magnifying glass and alt-click, space-click-drag moves, shows grid, and dock, talks about view|show object frame, can click on eye like in flash/photoshop, everything is in a user control, talks about namespace, says it is only used inside blend, e.g. mc:Ignorable="d". TODO: try all the items he mentioned Formen und Farben
Pixel versus Vektoren (watched) Normally vector-based, but blend and silverlight can also do bitmaps, right-click: convert to segment, for export, called it "bookmarkToClose.xaml", you can choose if your text should be converted to text or paths, blend can't convert the shadow into xaml, so he converts it to bitmap document, he is going to save, saves to .xaml document, if he had left in the shadow, then xaml would have had a link to a pixel file, now he chooses PNG (for alpha channel), right-clicks export, now he looks in the folder and there is a png file, xaml is much smaller, but doesn't have a shadow, in many cases though xaml files are larger, depends how difficult it is to describe, pixels are faster though, now new project, says WPF has more effects, creates silverlight 2 application called "Book", does Project|add existing element, brings in the .png and .xaml files he just made, .png he just drags in, but with xaml he can't just drag it in, but you can copy from the design mode from the document into another document, shows that the xaml file remains super sharp no matter how much you zoom on it. Grundformen und Pfade (watched) Draws a square with rounded corners, very nice tools to change, F9 to blend in and out, changes to xaml and changes there, skews, etc., nice that as you drag a side the x/y coordinates shows, shows how the middle point will travel with a drag but if you hold down ALT it doesn't, clicks on settings, brush, layout, output, then shows line: a line is not an element but a path, withi ALT he can bend the line, like in flash, in the path element thre is a data attribute with lots of points in it, clicks on pen, draws, then groups as in flash, also overlap, etc. Farben und Verläufe (todo) Beschneidungspfade und Deckkraft (todo) Medienintegration
Bilder (watched) In blend, loads in pictures (project, add existing item), changes size, changes stretch then it crops, you can add pictures in the properites window as well, opens in windows explorer, finds in debug the monster.xap file, this is the silverlight file (44K because of the image), changes to .zip and unzips, finds Monster.dll, creates an Assets folder, then inside the Images, drags graphic into images, it is not there naymore, so he clicks on source and it finds it, choose image brush, does tools, crate imageBrush, called it "MonsterBrush", looks in XAML, in UserControl there is an Image Brush, wow then puts the monster graphic in a circle (watch this again, learn how to do it), now will show how to keept he images separate, but has to go into VisualStudio to do this, changes, "Copy to Outputt o Copy Always", it is the same, then changes and graphic is not shown, ends abruptly. Video (todo) Creates silverlight 2 application, CTRL-I, dragsin video, fixes the margins so they fit, plays in full size and resizes it as it plays, nice, (stretch). Sounds (watched) Says much like video, import CTRL-I, mp3 or wma, says you can convert .wav with encoder into .wma, drags the ding.wam onto Page.xml, goes into visual studio, build action=resource, do not copy, in expression plays again, ok, in Debug directory not now silverlight 2 does not handle loops, ok, had as "MediaEnded" event navigate to a url (wikipedia), doesn't show how to e.g. click a button and play a sound. Animation
Transformieren und Animieren (watched) Has a candle with light halo, tilts it under transformation, types in new x and y values, also relative movement, nice, itnresting silverlight 1 had javascript not C#, object and time axeis, new, storyboard, time line, talks about the time-line drawer, when click only affects affects one and he can make an animation, then shows animation in browser, three times of animation: double (changes numbers [doubles]), color (changes colors), point (seldom), lots of options, shows how to speed up an aimation. Storyboard anlegen und starten (watched) You can even animate your root element, needs a target and a storyboard, clicks on plus for storyboard, timeline comes up, chnges the time points, changes to dock frames per second, then takes off so it moves freely, no matter how fast or slow computer is, if you say it should take one second then it will take one second, nice, changes in window, animation area for more space, clicks on layoutroot, changes backgroundnow has a keyframe, looks at it in XAML: storyboad, colorAnimationUsingKeyFrames, so he starts it (project, code behind into visual studio, says silverlight doesn't have much in terms of triggers, so in Page.xaml.cs in Page() BackgroundStoryboard.Begin(), so runs and background goes from white to green in 2 seconds, changes it to "forever" in properties and now it pulsates green/white. Schlüsselbildanimationen mit Blend I (todo) Schlüsselbildanimationen mit Blend II (todo) Lineare Animationen in XAML (todo) Splash Screen
Layout und Steuerelemente (watched) Talks about the root usercontrol, if you switch to auto then it fits to its parent, horizontal and vertial alignment do the same thing, if you want and application that stretches in browser then usercontrol: auto/auto, talks about DesignWidth and DesignHeight (only when designing), they are in the mc:Ignorable="d" namespace, talks about margin, nice, then maxwidth and maxheight. TODO: experiement with auto, horizontalalignment, etc. Silverlight-1-Projekt anlegen (todo) Silverlight 1 kann Silverlight 2 (todo) Eine Animation für einen Preloader (todo) Der Code mit JavaScript (todo) Von Silverlight 1 zum Splash Screen (todo) Start der Animation (todo) Silverlight gestalten
Layout
Größe, Ränder und Ausrichtung (todo) Taschenrechner im Gridlayout (todo) Steuerelemente
Steuerelemente und Objektbibliothek (watched) Talks about controls on the left, grid, password box, etc., then talks about the object library, this seems to be where the styles are, you can also search, assembly is also shown, goes to visual studio and clicks on toolbox and sees, talks about the namespaces, the assem, then shows how you would have put in the reference in blend, if you add a control that adds a namespace in visual studio, you have to do save all. ComboBoxen und ListBoxen (todo) Generierte Steuerelemente (todo) Benutzerdefinierte Steuerelemente (todo) Styleguide
Ressourcen (todo) Basically like css stylesheets, in blend, creates a new project called book, puts on some textblocks, strange though that it makes a style for each element, e.g. a style for font size and style for font-weight, etc., not like css, then makes it available for the user control. Templates (watched) Says styles reach their limits quickly, then you have to work with resource files, wants one button to look liek another one, answer is templates, searches for "Temp" in properties and chooses, clicks "convert into a new template", clicks on object, and "edit control", choose edit copy, calls it Styles/BookButtonStyle, shows a button with the cookie crumb menu above, the most important is the ContentPresenter, in properties searches for content, then template binding, uses Content="{TemplateBinding}, took everything else except the background and contentPresenter, sets the color, copies the style of the other button, then saves, could not copy the effects of the button, goes to the template (on teh cookie bar), then fixes it up. TODO: watch this one and try all, e.g. how to copy style Prototyping
Zustände mit Microsoft Visio (todo) Visual Storyboard mit Expression Design (todo) Page Switcher mit Expression Blend (watched) Makes a silverlight 2 application in blend 2, makes a folder called views, then in views, makes user controls Entrance.xaml, and Hall.xaml, and Chamber.xaml, wants to display these with Page.xaml, in assets, adss three png images, puts images in each, changes layout root to border and it fills the full space, changes all the pictures to 480 x 300, then in Page.xaml, changes width/height to auto, changes layout type to border, switches to VisualStudio, in Page.xaml code behind, makes method ShowEntrance which does LayoutRoot.Child = new Entrance(), same for ShowHall() and for ShowChamber(), ok quite hard-coded, calls ShowEntrance in the constructor and looks at it, ok, in Entrance.xaml changes layoutroot to Canvas, drags in a button, goes to events and in Click types ShowHall_Click (in Blend), then goes in visualstudio and fills it in ((Parent as Border).Parent as Page).ShowHall(), then shows how he clicks from one page to the next. TODO: remake the example on dvd Silverlight programmieren
Crashkurs Visual Studio
Arbeitsumgebung und Projektstart (todo) Debugging und Veröffentlichung (todo) XAML-Design und Codeansicht (todo) Programmcode strukturieren
Konventionen und Kommentare (todo) Ausgabe und Debugging (todo) Ereignisse, Methoden und Variablen
Ereignisse ( finished) Says you can handle them in your code behind, has the delegate += version in the constructor, in blend, clicks on button and shows the events, in Click he types in SevenButton_Click (on calculator example), then ENTER, and it opens visual studio (I think in blend 3 it stays in blend), says that mulitple buttons can call the same handler, uses Debug.WriteLine(), clicks on the 7 button in application and sees an output now, does it for button 4 as well, talks about basic event handling issues, goes in constructor, but also puts in name of button as x:Name="OneButton" and then does OneButton.Click += new RoutedEventHandler(OneButton_Click), that's it. Variablen und Eigenschaften I (todo) Variablen und Eigenschaften II (todo) Kontrollstrukturen (todo) Klassen, Bindungen und Listen
Klassen und Eigenschaften ( finished) Creates silverlight application, chooses ASP.NET website, talks about rest, wcf, etc. but for this test here is he going to use hard-coded data, ok, make Model directory in silverlight project, creates class in Model folder called "IsidorModel.cs", is doing classic MVC, then makes "Candle.cs" and talks about namespaces, says you can vary the namespaces, not like java, good explanation of namespaces, in Candle puts in properties and in the model a collection property, good. Objektmodelle in XAML ( finished) Shows model structure so far, goes into blend, he clicks on CRL-Object and it shows him his application model, types in Title and Message (his fields) into the tag CandleDS, drags a TextBlock onto design view, then does properties, clicks on dot tot he right of Text, data bind, and the then does it with drag and drop from Data on right side, he says he really doesn't like to bind data this way, the reason is: the whole binding string is in the Text attribute, so he deletes the UserControl.Resources block and in Text puts Textbox, ok, then shows how to bind data without the long suffix that he showed, then has to change the start page. Bindungen (watched) In XAML talking about the binding, puts in a new textbox, then via blend changes mode to twoway, then tests it, it is just oneway still, the reason is: needs to go to visual studio, opens Candle class and inherits from INotifyPropertyChanged (has to put in using above), also does implement INotifyPropertyChange interface (puts in event), then has to change Title and Message properties: _title=value, then has to put in NotifyPropertyChanged methodNotifyPropertyChange("Title"), then tests and it works, a bit complicated but nice, but in the end this didn't work because PropertyChangedEventHandler apparently needs tobe implemented more than it is in the film. Listen in Expression Blend (watched) Now talks about the Collection that we made, in blend defines the builds the collection in properties, then in XMAL has a UserControl.DataContext, that's it. Listen in XAML (watched) In visual studio goes into the model, there is only a collection in it, so now makes the CandleCollection of type ObservableCollection, now is making the same thing for the collection as he has for the single class, changes the properties as well, then goes baqck into blend, had to compile once, now for each candle he can type in the properties in the Blend GUI, nice, can put together his data template, says in a project he would build an ADO.NET control in order to get the data but doesn't show how to do it. Data Templates (watched) Talks about DataContext, explains how the data is bound to the Listbox, now is going to change the listbox, does import existing item, two .pngs, right-click on StackPanel and does Group in StackPanel, then impressively designs the Data template with graphics, a book behind, so now does empty template, this empty template has a border, make both transparent, good. |
| My Free Tutorials: How to Install the Android SDK on Windows XP and Create an Application that Runs in the Cell Phone Emulator How to Create a Website with Datapod Install Fedora 6 in VMWare on Windows XP and connect it to your network Install Perl 5 on Windows XP and Get a Perl Hello World Running Install OpenSuse 10.2 in VMWare on Windows XP and connect it to your network Install Ubuntu 7.04 in VMWare on Windows XP and connect it to your network Install Java on Windows XP and Learn the Basics of Java 6 using the NetBeans IDE Setup a PHP Development Environment on Windows XP With Apache, PHP 5, MySQL 5, SQLite, Eclipse, Subversion, PHPMyAdmin, and Datapod Install a PHP Development Environment with Eclipse PDT, Apache 2.2, PHP 5, MySQL 5, and phpMyAdmin Using XAMPP Lite How to Install Ruby on Rails with Instant Rails and Create a Website Using JEdit and the Ruby Plugin |
