A Beginner's Guide to Silverlight with PHP Article

In recent years, web developers have been moving increasingly towardsthe development of so-called RIAs, or Rich Internet Applications. These canbe built using any of a number of different technologies, but what they havein common is their goal of recreating a desktop application experienceinside a web browser. Microsoft entered the RIA space in late 2007 withSilverlight. For the uninitiated, Silverlight is a client-side technologypowered by the .NET Framework. This means that .NET developers can utilizetheir existing skillset to create Silverlight-based applications with arelatively easy learning curve. Silverlight runs on Windows and Mac in mostmodern browsers.It’s worth noting that Silverlight is a client-side technology, whichmeans it’s not tied to any particular server-side platform. It can be hostedregardless of whether your site is built in plain HTML, ASP.NET, or evenPHP. You might think that it would be more difficult to use Silverlight in aPHP application, but it’s actually quite simple; you can leverage JSON, XML,or any number of communication technologies to pass data from Silverlight tothe PHP backend. However, in this article, we’re choosing to go with a SOAPWeb Service. I’ll first show you how to start developing with Silverlight,then cover how you set up the web service in PHP, and finally demonstratehow to access the service from your Silverlight application.To follow along, you’ll need Visual Studio, Silverlight Tools, and PHP5. I’ll be showing you how to install Visual Studio with the SilverlightTools, but I’m going to assume you already have a web server set up withPHP. Otherwise, it’s very simple to set up using Microsoft’s Web PlatformInstaller, and you can find instructions for doing that in a previousSitePoint article. You should be familiar with object-orientedprogramming concepts, though it’s unnecessary to know any C# or VB.NET, asI’ll be showing you all the required code.To follow along with the samples in this article, you can downloadanarchive of all the source files. Within that download, theSampleApplication directory contains all the source forthe Visual Studio project, and the silverlightdirectory contains the finished PHP site including the compiled Silverlightapplication.When you’re finished with the tutorial, be sure to head over and testyour learnings in our ArticleQuiz, sponsored by Microsoft.

Starting Out with Silverlight

Silverlight applications are built using Visual Studio for the code,and the Expression Studio suite of tools for the user interface. ShaneMorris has a greatarticle here detailing the use of Expression Studio to design aSilverlight UI. In this article, we’ll focus instead on the developmentside.Preparing to build Silverlight applications is quite simple. First,you’ll need Visual Studio. Microsoft has a free Express version of thissoftware available, so head over to the Silverlightwebsite and download the Web Platform Installer. It will guide youto download Visual Web Developer and the Silverlight tools. If you doalready have Visual Studio, you can download the Silverlight toolsdirectly.

warning: Versions

For the purpose of this tutorial, the sample application was builtand tested using Visual Studio 2008 and the Silverlight 3 Tools.However, it should work fine with Visual Studio 2010 and Silverlight 4if you’re using the latest and greatest.

Once you have the Silverlight tools installed, there will be newoptions available in Visual Studio to create Silverlight applications.Start by selecting New Project from the File menu. Browse toSilverlight, and selectSilverlight Application. Enter a name and alocation to save your new project, and clickOK.

note: C# or VB.NET?

The Silverlight option is available both in the Visual C# and inthe VB.NET categories in the New Project screen. Which one you choosewill depend on which language you’re more comfortable programming with.For the examples in this tutorial, I’ll be working with C# code, so ifyou want to follow along that’s what you should select.

Figure 1. Creating a new Silverlight application

The next screen allows you to choose how you want your applicationto be hosted. For the purposes of this tutorial, just leave the defaultsettings and click OK.You will be presented with two projects in the Visual StudioSolution Explorer—one for the Silverlight project and one for an ASP.NETsite. Even though we’re planning to use PHP for the server-side code,we’ll be able to take some generated code from the ASP.NET site to makeour job easier.

Figure 2. The two new projects shown in the Solution Explorer

Creating a Simple Silverlight Application

Before we jump in and integrate Silverlight with PHP, let’s create abasic Silverlight application to become familiar way it works. Start byopening MainPage.xaml in your Silverlightapplication. It’s an XAML file, which stands for eXtensible ApplicationMarkup Language, and is how the Silverlight (and WPF) user interface isbuilt. It’s quite similar to HTML, so you’ll be able to pick it upquickly.Let’s start simple by adding a text box and a button to the screen.With your cursor placed inside the <Grid> element, enter the following XAML:<StackPanel></StackPanel>. A StackPanel is a kind of layout control inSilverlight. It will force the controls you enter inside it to stackeither vertically or horizontally.Next, we’ll add a TextBox and aButton inside the StackPanel, likethis:

Example 1. MainPage.xaml (excerpt)

<Grid x:Name="LayoutRoot">  <StackPanel>    <TextBox Text="Joe Citizen" x:Name="txtName"/>    <Button Content="Click Me!"/>  </StackPanel></Grid>

Pressing F5 will run the application. You shouldsee a button and text box appear on the screen.

Figure 3. Our sample application viewed in a browser

Clicking the button will achieve nothing at this stage. Let’s fixthat.Stop the application by closing the browser. Back in Visual Studio,locate the button in the XAML file and add an attribute called Click. Typing Click="" willcause Visual Studio to prompt you with <New EventHandler>. Select this option by pressingEnter. You can then right-click the text that was addedand select Navigate to Event Handler. This willtake you into the “code behind.” The code behind is the area that’s usedto enter C# (or VB.NET) code—the guts of the application is written incode behind.Let’s make the application show the text from the text box in amessage dialog.First, add using System.Windows.Browser; to thearea at the top of the page where you see a list ofusing statements:

Example 2. MainPage.xaml.cs (excerpt)

using System.Windows.Shapes;using System.Windows.Browser;namespace PHPTutorialFirst{

This code imports a namespace. Namespaces allow the very large .NETframework class library to be split into smaller, manageable parts. Thisparticular namespace includes the alert functionality we’re after.Next, enter the following code inside theButton_Click function to show the popup:

Example 3. MainPage.xaml.cs (excerpt)

private void Button_Click(object sender, RoutedEventArgs e){  HtmlPage.Window.Alert(txtName.Text);}

This will show the contents of the text box on the screen. You mayremember that back in the XAML file you added an attribute to the TextBlock called x:Name. This name is how we reference theelement in our code: txtName.Now that you’ve written a basic application, you’re ready to gofurther and start consuming a web service. But before we do we’ll look athow to insert our Silverlight application into our HTML files or PHPtemplates.

Including the Silverlight Application in a Page

The first step to integrating Silverlight with your PHP applicationis to include the application itself in the pages generated by PHP. Thereare a couple of ways that Silverlight can be instantiated. The firstoption is to dynamically add new Silverlight applications usingJavaScript. I won’t go into detail here, but you can find out moreinformation in the MSDN Silverlight.jsreference document.The second option is to use the <object> HTML tag. The <object> tag is a way to tell a browser to loadan external object like an image or a plugin. Most plugins like Flash andSilverlight now use this tag.To help you out, Visual Studio makes a sample page for you when youcreate a new Silverlight project. You can find it in the web project youcreated earlier called [applicationname]TestPage.html. So, for our sample application, the file inquestion is SampleApplicationTestPage.html.Create a new directory in your server’s web root for your newapplication (in our examples we’ll be calling itsilverlight), and make a newindex.php page inside it. Copy the contents of thetest page that Visual Studio created into that file, and copySilverlight.js from the web project to your newdirectory.Now you have a PHP file that includes an <object> tag pointing to a Silverlightapplication, and an accompanying JavaScript file with some necessaryutilities. But, if you examine the object element, you’ll see that its src attribute is ClientBin/SampleApplication.xap. Looking backat the web project Visual Studio created for you, you’ll see that it doesindeed contain a ClientBin directory with aSampleApplication.xap file.Silverlight applications are compiled into what is known as a XAP(pronounced “zap”) package, which is what’s then included in the page withthe help of the <object> tag. So youjust need to copy the ClientBin directory into yourapplication’s directory, and your index.php page should now correctlydisplay your Silverlight application. You can rename or move the XAP file;you just need to remember to adjust the object’s src accordingly. Remember that if you modifyyour Silverlight application, you’ll need to copy theClientBin directory file again. During development,it’s probably easier to run your Silverlight applications from VisualStudio, and copy them over to the PHP directory when you’re done.Your silverlight directory should now look asshown in Figure 4, “The contents of the silverlightdirectory”, with theindex.php file containing the contents of thegenerated SampleApplicationTestPage.html from yourVisual Studio web project.

Figure 4. The contents of the silverlightdirectory

Frequently Asked Questions about PHP and Silverlight

What is the relationship between PHP and Silverlight?

PHP and Silverlight are both powerful tools used in web development, but they serve different purposes. PHP is a server-side scripting language used for creating dynamic web pages. On the other hand, Silverlight is a web application framework developed by Microsoft, which is used for creating rich internet applications with features like graphics, animations, and video playback. While PHP handles the server-side operations, Silverlight enhances the user interface and user experience on the client-side.

Can I use PHP with Silverlight?

Yes, you can use PHP with Silverlight. Although Silverlight is a Microsoft product and is often used with ASP.NET, it can also work with PHP. You can use PHP to handle server-side operations like database interactions, and then use Silverlight to create a rich, interactive user interface.

How do I get started with PHP and Silverlight?

To get started with PHP and Silverlight, you first need to install the necessary software. For PHP, you need a web server like Apache or Nginx, and for Silverlight, you need the Silverlight plugin and development tools. Once you have the necessary software, you can start learning the basics of PHP and Silverlight. There are many online tutorials and resources available to help you get started.

What are the advantages of using PHP with Silverlight?

Using PHP with Silverlight combines the strengths of both technologies. PHP is a powerful server-side scripting language that can handle complex operations like database interactions, file handling, and more. Silverlight, on the other hand, is a web application framework that can create rich, interactive user interfaces with features like graphics, animations, and video playback. By using them together, you can create dynamic, interactive web applications.

Are there any limitations or challenges in using PHP with Silverlight?

While PHP and Silverlight can work together, there can be some challenges. One of the main challenges is that Silverlight is a Microsoft product and is often used with ASP.NET, so there may be fewer resources and tutorials available for using it with PHP. Additionally, Silverlight requires the user to have the Silverlight plugin installed, which may not be the case for all users.

Is Silverlight still supported and should I use it for my projects?

As of October 2021, Microsoft has officially ended support for Silverlight. This means that there will be no more updates or security patches for Silverlight. While existing Silverlight applications will continue to work, it is recommended to use other technologies for new projects.

What are some alternatives to Silverlight for creating rich, interactive user interfaces?

There are many alternatives to Silverlight for creating rich, interactive user interfaces. Some popular options include HTML5, CSS3, JavaScript, and various JavaScript libraries and frameworks like jQuery, Angular, React, and Vue.js.

How can I transition from Silverlight to other technologies?

Transitioning from Silverlight to other technologies involves learning the new technology and then rewriting your Silverlight applications. There are many resources and tutorials available online to help you learn new technologies. Once you have learned the new technology, you can start rewriting your Silverlight applications.

Can I use PHP with these Silverlight alternatives?

Yes, you can use PHP with these Silverlight alternatives. PHP is a server-side scripting language and can work with any client-side technology, including HTML5, CSS3, JavaScript, and various JavaScript libraries and frameworks.

Where can I learn more about PHP and these Silverlight alternatives?

There are many resources available online to learn about PHP and these Silverlight alternatives. Some popular options include online tutorials, video courses, books, and documentation. You can also join online communities and forums to ask questions and get help from other developers.