Friday, February 20, 2009

Capturing mouse scroll / wheel event in Silverlight

Silverlight doesn't support mouse wheel event. There is a way to catch them if we ask to the browser for them. This workaround works well if the page with your Silverlight application fits in the browser. If the page is bigger in height a scroll appears. Then the whole content of the page is scrolled and the SL application doesn't receive the wheel event until one end is reached.
Hook up to the event. Different names are used in the different browsers.
C#
using System.Windows.Browser;...
HtmlPage.Window.AttachEvent( "DOMMouseScroll", OnMouseWheel ); // MozillaHtmlPage.Window.AttachEvent( "onmousewheel", OnMouseWheel );HtmlPage.Document.AttachEvent( "onmousewheel", OnMouseWheel ); // IE
This is how you get the wheel delta.
C#
private void OnMouseWheel( object sender, HtmlEventArgs args ) { double mouseDelta = 0; ScriptObject e = args.EventObject; // Mozilla and Safari if ( e.GetProperty( "detail" ) != null ) { mouseDelta = ( ( double )e.GetProperty( "detail" ) ); } // IE and Opera else if ( e.GetProperty( "wheelDelta" ) != null ) mouseDelta = ( ( double )e.GetProperty( "wheelDelta" ) ); mouseDelta = Math.Sign( mouseDelta );}

That's it!

Things about .XAP file

What is an .xap file?
A .xap file is basically a compiled Silverlight application. The file is actually a .zip file that contains all the files necessary for the application. Just rename the .xap file to have a .zip extension and then you can open it up to see its contents. Just try it yourself.


What files are contained within the .xap file?
The .xap file contains an application manifest (AppManifest.xaml) file and all the necessary DLL's that are required by the application. The first DLL contained is the compiled version of you application and has the same name of your application. In my test I created an application names "SilverlightApplication1", so the DLL is named "SilverlightApplication1.dll". The rest of the DLL's are the dependancies the application requires.

What is the AppManifest.xaml file?
First lets look at an example AppManifest.xaml file:


--Deployment xmlns="http://schemas.microsoft.com/client/2007/deployment" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" EntryPointAssembly="SilverlightApplication1" EntryPointType="SilverlightApplication1.App" RuntimeVersion="2.0.30226.2">
--Deployment.Parts
--AssemblyPart x:Name="SilverlightApplication1" Source="SilverlightApplication1.dll" />
--AssemblyPart x:Name="System.Windows.Controls" Source="System.Windows.Controls.dll" />
--AssemblyPart x:Name="System.Windows.Controls.Extended" Source="System.Windows.Controls.Extended.dll" /> --
--/Deployment>


The first element in the AppManifest.xaml is a Deployment node. This node defines the application and contains child AssemblyPart nodes.

As you can see the AssemblyPart nodes define what assemblies (DLLs) are contained within the .xap file, and give each of them a name.

Now, if you look back up to the top, you'll see the Deployment node has EntryPointAssembly and EntryPointType attributes. The EntryPointAssembly attribute defines which assembly defined below (as a child AssemblyPart node) is the main assembly (DLL) for the application. And, the EntryPointType attribute specifies the Class contained within the assembly (DLL), defined in the EntryPointAssembly attribute, is the main class that will be instantiated to start the application.

The Deployment node also has a RuntimeVersion attribute that defines the version of Silverlight the application is built for.

Conclusion
There you go, now you have a basic understanding of what an .xap file is.


Silverlight Calculator Control & Silverlight Calendar Control Finally Released

Hi dudes,

Finally... I managed to create 2 new cool widget control, calculator & calendar. This application was developed using Microsoft Expression Blend 2 SP1 and Visual Studio 2008 SP1. This is what I do during free time.

Currently this 2 widget have been published at
silverlight.net showcase. To be more specific, in the showcase page, click on the geography menu at the top left corner, then click on the Malaysia flag.


Silverlight Calculator Control

A smooth blend effect when you hover your mouse on the buttons.




click here to see the live demo

now in codeplex

Silverlight Calendar Control

A smooth blend effect to the gradient background color when you pick any color provided at the bottom of the calendar.




click here to see the live demo

now in codeplex

Silverlight Berita Harian

Hi dudes,

Today I managed to upload my first Silverlight application that read RSS feed data about articles and news. This application was developed using Microsoft Expression Blend 2 SP1 and Visual Studio 2008 SP1. Due to Silverlight security limitation to access cross domain server, I have to create a proxy server to read the rss feed and push it back to my silverlight application . You can see the live demo
here. The RSS feed of course taken from Berita Harian website (www.bharian.com.my). This is just a demo to showcase something what Silverlight can do.

Here is the screenshot :-















The animation takes place when you hover your mouse on the left menus.

Here is the code snippet to call the rss feed :-

void GetFeed()

{
WebClient client = new WebClient();

client.OpenReadCompleted += new OpenReadCompletedEventHandlerclient_OpenReadCompleted);
client.OpenReadAsync(new Uri(LINK));
}

It is recommended that you used OpenRead rather than DownloadString. This method is the Microsoft best practice on how to read xml from URI.

Here is the code snippet to process the result :-


void client_OpenReadCompleted(object sender, OpenReadCompletedEventArgs e)
{
if (e.Error != null)
{
return;
}

try
{
using (Stream s = e.Result)
{
XDocument doc = XDocument.Load(s);
if (doc != null)
{
IEnumerable items = from rss in doc.Element("rss").Element("channel").Elements("item")
select rss;


if (items != null && items.Count() > 0)
{
spListBox.Children.Clear();
foreach (XElement item in items)
{
FeedData feeditem = new FeedData();
feeditem.txtFeedTitle.Text = item.Element("title").Value;
feeditem.txtSummary.Text = item.Element("description").Value;
feeditem.URL = item.Element("link").Value;
spListBox.Children.Add(feeditem);
}
}
}
}
}
catch (Exception ex)
{
//do something
}
}


Another technology I used to process the result is Linq to XML. You need to add the System.Xml.Linq assembly in your project in order to use this feature.

Currently this application have been published at
silverlight.net showcase. To be more specific, in the showcase page, click on the geography menu at the top left corner, then click on the Malaysia flag.

If you guys got any comments, please jot it down.