微波EDA网,见证研发工程师的成长!
首页 > 通信和网络 > 通信网络技术文库 > PHP开发者究竟需不需要Silverlight ?

PHP开发者究竟需不需要Silverlight ?

时间:08-23 来源:51CTO 点击:

  接下来,在createSilverlight.js中添加一个函数:

function createDisplayCanvas(){Silverlight.createObjectEx({source: "drawDots.php",parentElement: document.getElementById("dotDisplayCanvas"),id: "slDisplayCanvas",properties: {width: "100%",height: "100%",inplaceInstallPrompt:true,version: "1.0"}});}

  最后,替换PHPDemo.htm中的内容:

<div></div>   为
<div><script type="text/javascript">createDisplayCanvas();</script></div>

  重新刷新一下页面,这下你会发现现在页面上显示了两排小圆圈,如图3所示。

  第4步:用PHP创建动态XAML

  至此,所有小块都完成了,你可以加入最后的代码了,在第2步中,你创建了一些鼠标事件,在第3步中,你创建了一些PHP代码,你可能已经猜到下面将要做什么了。
对于这个demo,你的控制面板有且只有一个功能就是:增加带颜色的小圆圈,其实,你还可以做得更多,但限于篇幅,我这里只介绍一下使用URL字符串传递一连串的JavaScript变量,概括如下:

  ●每次点击小圆圈时,JavaScript将添加一个新值到字符串中。
  ●然后将这个字符串传递给你的PHP脚本。
  ●PHP脚本将这个字符串转变为数组。
  ●基于数组的长度和值,返回一套小圆圈。

  createSilverlight.js要做一点改动,由于颜色是作为一个通用的名字进行传递的,但我更喜欢使用十六进制值表示,正如你在前面看到的,Fill.Color返回的值很长,为了将其转换为十六进制,需要添加下面这个函数:

function getFillColor(color){var fill = color;if (fill < 0) {fill = (16777216 + parseInt(fill));}fill = fill.toString(16);if (fill.length > 6) {fill = fill.substr(fill.length - 6);}while (fill.length < 6) {fill = "0" + fill;}fill = "ff" + fill;return fill;}

  注意最后添加到字符串的"ff",Silverlight使用8位数表示十六进制颜色值,因此需要在6位值的前面加上两个字符"ff"。

  使用下面的代码完全替换掉dropDots()函数:

var dotColors="";function dropDots(sender, mouseEventArgs){if (dotColors != ""){dotColors += ",";}dotColors += getFillColor(sender.Fill.Color);createDisplayCanvas();}

  注意这里使用了新的全局变量"dotColors"。

  在createDisplayCanvas()函数中,用:

  source: "drawDots.php?colors=" + dotColors,

  替换掉:
  source: "drawDots.php",

  至此,createSilverlight.js的内容如下:

  清单5:修改好的createSilverlight.js

function createControlPanel(){Silverlight.createObjectEx({source: "controlPanel.xaml",parentElement: document.getElementById("dotControlPanel"),id: "slControlPanel",properties: {width: "100%",height: "100%",inplaceInstallPrompt:true,version: "1.0"}});}if (!window.Silverlight) window.Silverlight = {};Silverlight.createDelegate = function(instance, method) {return function() {return method.apply(instance, arguments);}}var dotColors="";function dropDots(sender, mouseEventArgs){if (dotColors != ""){dotColors += ",";}dotColors += getFillColor(sender.Fill.Color);createDisplayCanvas();}function createDisplayCanvas(){ Silverlight.createObjectEx({source: "drawDots.php?colors=" + dotColors,parentElement: document.getElementById("dotDisplayCanvas"),id: "slDisplayCanvas",properties: {width: "100%",height: "100%",inplaceInstallPrompt:true,version: "1.0"}});}function getFillColor(color){var fill = color;if (fill < 0) {fill = (16777216 + parseInt(fill));}fill = fill.toString(16);if (fill.length > 6) {fill = fill.substr(fill.length - 6);}while (fill.length < 6) {fill = "0" + fill;}fill = "ff" + fill;return fill;}

  用清单6中的代码完全替换掉drawDots.php。

  清单6:修改后的drawDots.php

<?header('Content-type: text/xml');?><?$arrColors = explode(",",$_GET["colors"]);srand(time());?><Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="resultCanvas"><Canvas x:Name="Layer_1" Width="640" Height="80" Canvas.Left="0" Canvas.Top="0"><?$n = 0;foreach ($arrColors as $c) {$n++;$lft = (rand()%530);$top = (rand()%370);echo('<Ellipse x:Name="Ellipse_' . $n . '" Width="100" Height="100" Canvas.Left="' . $lft . '" Canvas.Top="' . $top . '" Stretch="Fill" Fill="#' . $c . '"/>');}?></Canvas></Canvas>
  正如你所看到的,XAML中的鼠标事件触发了一个包括一个全局变量的JavaScript程序,它填充选中的小圆圈的颜色,然后调用createDisplayCanvas()重新绘制画布,通过GET将这个字符串传递给PHP。

  新的PHP脚本将GET字符串转换成数组,然后通过每一个形成一个环,另外,我还在Ellipse XAML echo内为Canvas.Left和Canvas.Top设置了随机数以增加公式的随机性,这对于其他的东西没有任何实用的价值,只不过是想刺激一下想象力,产生更多的创造力和激发人们对这个技术的热情。

  最终结果可以下载zip压缩包。

Copyright © 2017-2020 微波EDA网 版权所有

网站地图

Top