Sonntag, 25. November 2007

Tastaturereignisse in Silverlight Alpha 1.1

Mich interessiert viel mehr ob und wie man LOB-Applikationen mit Silverlight realisieren kann, als toll designte Multimediale Seiten oder Spiele.
Dabei fällt zuallererst auf, dass dafür keine Eingabe-Controls zur Verfügung stehen (die aber mit der Beta-Version von Silverlight 1.1 geliefert werden sollen).

Für einen Softwareentwickler sollte das kein Problem darstellen.
Ich versuche mich also an einer TextBox für Silverlight.

Bereits mehrfach bin ich auf den Hinweis gestossen, dass Spiele die mit Silverlight realisiert wurden, nicht die Cursurtasten für die Steuerung verwenden da diese kein KeyDown-Event liefern. Nachdem auch eine TextBox intensiv von Tastaturereignissen gebrauch macht ;-) habe ich diesen Aspekt zuerst untersucht.

Es stimmt, Silverlight liefert einige Tastaturereignisse nicht.
Aber es gibt Abhilfe - die fehlenden Ereignisse kann man sich einfach vom Browser liefern lassen.

In CreateSilverlight.js werden die Tastaturereignisse registriert und beim Auftreten an das Silverlight-Plugin weitergereicht:

   1 var sl_Sender;
2 var sl_Plugin;
3 var sl_PluginHost;
4 var sl_Context;
5
6 //contains calls to silverlight.js, example below loads Page.xaml
7 function createSilverlight()
8 {
9 Silverlight.createObjectEx({
10 source: "Page.xaml",
11 parentElement: document.getElementById("SilverlightControlHost"),
12 id: "SilverlightControl",
13 properties: {
14 width: "100%",
15 height: "100%",
16 version: "1.1",
17 enableHtmlAccess: "true"
18 },
19 events: {
20 onError:null,
21 onLoad:sl_OnLoad
22 }
23 });
24
25
26 // Give the keyboard focus to the Silverlight control by default
27 document.body.onload = function() {
28 var silverlightControl = document.getElementById('SilverlightControl');
29
30 if (silverlightControl)
31 silverlightControl.focus();
32 }
33
34
35 //onkeypress doesn't work in IE (7?) if Silverlight has focus
36 document.onkeypress = function(evt) {
37 var charCode = 0;
38
39 evt = (evt) ? evt : ((event) ? event : null);
40
41 if (evt)
42 charCode = evt.charCode; // || evt.keyCode;
43
44 return sl_Plugin.Content.smRootCanvas.DoHostKeyPress(charCode);
45 }
46
47 document.onkeydown = function(evt) {
48 var keyCode = 0;
49
50 evt = (evt) ? evt : ((event) ? event : null);
51
52 if (evt)
53 keyCode = evt.keyCode;
54
55 // returning bool from [Scriptable] doesnt work properly so int is used instead
56 return (sl_Plugin.Content.smRootCanvas.DoHostKeyDown(keyCode) != 0);
57 }
58
59 document.onkeyup = function(evt) {
60 var keyCode = 0;
61
62 evt = (evt) ? evt : ((event) ? event : null);
63
64 if (evt)
65 keyCode = evt.keyCode;
66
67 // returning bool from [Scriptable] doesnt work properly so int is used instead
68 return (sl_Plugin.Content.smRootCanvas.DoHostKeyUp(keyCode) != 0);
69 }
70 }
71
72 function sl_OnLoad(plugin, userContext, sender)
73 {
74 //alert(plugin.id + " : " + userContext + " : " + sender.toString());
75 sl_Sender = sender;
76 sl_Plugin = sender.getHost();
77 sl_PluginHost = plugin;
78 sl_Context = userContext;
79
80 if (plugin)
81 plugin.focus();
82 }

Ein Custom Control in Silverlight kann die Tastaturereignisse empfangen und verarbeiten:

   1 namespace SaveMethod.Silverlight.Controls
2 {
3 [Scriptable]
4 public class SmCanvas : System.Windows.Controls.Canvas
5 {
6 [Scriptable]
7 public int DoHostKeyPress(int keyCode)
8 {
9 System.Diagnostics.Debug.WriteLine(String.Format("HostKeyPress - keyCode: {0}", keyCode));
10
11 // process keyboard events here ...
12
13
14 return Convert.ToInt32(!AbsorbKey(e.HostKey));
15 // AbsorbKey is a custom method (not presented here)
16 // to decide if the event should be handled back to the browser for further processing outside Silverlight
17 // returning 0 disables and 1 enables further event processing
18 }
19
20 [Scriptable]
21 public int DoHostKeyDown(int keyCode)
22 {
23 // process keyboard events here ...
24 }
25
26 [Scriptable]
27 public int DoHostKeyUp(int keyCode)
28 {
29 // process keyboard events here ...
30 }
31 }
32 }

Das Scriptable Attribut für die Klasse und die Methode macht die Methode für JavaScript aufrufbar.

Das "Schlucken" des Ereignisses durch einen Returnwert 0 ist besonders für die Tab-Taste interessant, denn wenn auch der Browser das Ereignis verarbeitet, wird der Cursor in die Adressleiste (IE7) gesetzt. Das ist bei Dateneingabeformularen kaum gewünscht.

In diesem custom Control kann man die empfangenen Tastaturereignisse per C# Events weiteren Controls zum Abonnement anbieten.

  • Ist dieser Beitrag hilfreich?

  • Fehlen Informationen?

  • Kann man das besser, einfacher, kürzer, ... lösen?


Schreibe einen Kommentar um diesen Beitrag noch nützlicher zu machen.

Keine Kommentare: