Silverlight/XAML – Learning by Coding
1: <?xml version="1.0" encoding="UTF-8"?>
2: <!-- coded by Thomas Meinike 04/08 -->
3: <Canvas xmlns="http://schemas.microsoft.com/client/2007"
4: xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
5: x:Name="fotos" Loaded="LoadZIP">
6:
7: <TextBlock Canvas.Left="330" Canvas.Top="15" Foreground="#999"
8: FontFamily="Lucida" FontSize="18" Text="Bilder dynamisch aus einem ZIP-Archiv laden"/>
9:
10: <!-- Fortschrittsbalken -->
11: <Rectangle Canvas.Left="20" Canvas.Top="560" Width="0" Height="25"
12: Stroke="#EEE" StrokeThickness="0.5" RadiusX="12.5" RadiusY="12.5" x:Name="pr_rect">
13: <Rectangle.Fill>
14: <LinearGradientBrush>
15: <GradientStop Color="#DFF" Offset="0.0"/>
16: <GradientStop Color="#7AC" Offset="0.8"/>
17: <GradientStop Color="#589" Offset="1.0"/>
18: </LinearGradientBrush>
19: </Rectangle.Fill>
20: </Rectangle>
21:
22: <!-- Fortschrittswert in Prozent -->
23: <TextBlock Canvas.Left="220" Canvas.Top="564" Width="430" Height="25" Foreground="#00C"
24: FontFamily="Lucida" FontSize="12" Text="%" x:Name="pr_proz"/>
25:
26:
27: <!-- // zusätzlich verwendeter JavaScript-Code:
28:
29: function LoadZIP(sender,eventArgs)
30: {
31: var sl_ctrl,rectcode,pr_rect_obj,pr_proz_obj,dl;
32:
33: sl_ctrl=sender.getHost();
34: fotos_obj=sender.findName("fotos");
35: pr_rect_obj=sender.findName("pr_rect");
36: pr_proz_obj=sender.findName("pr_proz");
37: rectcode='<Rectangle Canvas.Left="" Canvas.Top="" Width="250" Height="187" RadiusX="15" RadiusY="15">';
38: rectcode+='<Rectangle.Fill><ImageBrush ImageSource=""/></Rectangle.Fill></Rectangle>';
39:
40: dl=sl_ctrl.createObject("downloader");
41:
42: dl.addEventListener("DownloadFailed",function(sender,eventArgs)
43: {
44: pr_proz_obj.foreground="#F00";
45: pr_proz_obj.text="Fehler beim Laden!";
46: });
47:
48: dl.addEventListener("DownloadProgressChanged",function(sender,eventArgs)
49: {
50: // sender.DownloadProgress [0-1] Event wird nach jeweils 5% ausgelöst
51: var pr=Math.floor(sender.DownloadProgress*100);
52: pr_rect_obj.width=pr*4.3; // maximale Rechteck-Breite: 430
53: pr_proz_obj.text=pr+"%";
54: });
55:
56: dl.addEventListener("Completed",function(sender,eventArgs)
57: {
58: if(sender.status==200)
59: {
60: // in der ZIP-Datei ist ein XML-Dokument files.xml mit den Dateinamen der Fotos abgelegt
61: var files=XMLDocument(sender.getResponseText("files.xml")).getElementsByTagName("file");
62:
63: if(files)
64: {
65: var anzahl=files.length;
66: // oder anzahl fest vorgeben (im Beispiel 4) und nächste auskommentierte Zeile verwenden
67:
68: for(var i=0;i<anzahl;i++)
69: {
70: var rect_obj=sl_ctrl.content.createFromXaml(rectcode);
71: rect_obj["Canvas.Left"]=20+i*150;
72: rect_obj["Canvas.Top"]=20+i*125;
73: rect_obj.fill.setSource(sender,files.item(i).firstChild.nodeValue);
74: // rect_obj.fill.setSource(sender,"foto_0"+(i+1)+".png");
75: fotos_obj.children.add(rect_obj);
76: }
77: }
78: }
79: else
80: {
81: pr_proz_obj.foreground="#F00";
82: pr_proz_obj.text="Fehler beim Laden!";
83: }
84: });
85:
86: dl.open("GET","media/fotos.zip");
87: dl.send();
88: }
89:
90:
91: function XMLDocument(xmldata)
92: {
93: var xmldoc=null;
94:
95: if(window.ActiveXObject)
96: {
97: xmldoc=new ActiveXObject("Microsoft.XMLDOM");
98: xmldoc.async=false;
99: xmldoc.loadXML(xmldata);
100: }
101: else if(window.DOMParser)
102: {
103: xmldoc=(new DOMParser()).parseFromString(xmldata,"text/xml");
104: }
105:
106: return xmldoc;
107: }
108:
109: -->
110:
111:
112: <!-- // zusätzlich verwendeter XML-Code in files.xml als Teil von fotos.zip:
113:
114: <?xml version="1.0" encoding="UTF-8"?>
115: <files info="Bilddateien in fotos.zip">
116: <file>foto_01.png</file>
117: <file>foto_02.png</file>
118: <file>foto_03.png</file>
119: <file>foto_04.png</file>
120: </files>
121:
122: -->
123:
124: </Canvas>
[zum Anfang]
