#眉標=Silverlight
#副標=Silverlight開發技術（7）
#大標=以ASP.NET控制Silverlight的事件
#作者=文／圖	董大偉
#引言= 


==<box>===========
程式1
0000: Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)
0001:  '第一次進入
0002:   If Me.IsPostBack = False Then
0003:   '初始化
0004:     MyInit()
0005:   End If
0006:        
0007:    '如果非同步事件發生
0008:   If Me.Request.Form("__EVENTTARGET") = Me.UpdatePanel1.ClientID Then
0009:     Dim para() As String = Me.Request.Form("HiddenField1").Split(",")
0010:     Me.TextBox1.Text = para(0) & " 在 " & Now.ToString("yyyy/MM/dd HH:mm:ss") & " 被按下 座標(" & para(1) & "," & para(2) & ")"
0011:   End If
0012: End Sub
==<end>==============
　　



==<反灰>===========
  <Ellipse Name="Ellipse1" Width="233" Height="145" Stroke="#FF000000" 
           Canvas.Left="136" Canvas.Top="52" RenderTransformOrigin="0.5,0.5"
           MouseLeftButtonDown="Ellipse1_Click">
==<end>==============




　　
==<box>===========
程式2
0013:    
0014:  '初始化
0015:  Sub MyInit()
0016:    Dim x, y As String
0017:    Dim AsnycPostBackScript As String
0018:    Dim Ellipse1_Click_JavaScript As String = ""
0019:    AsnycPostBackScript = Me.ClientScript.GetPostBackEventReference(Me.UpdatePanel1, "")
0020:    Ellipse1_Click_JavaScript += vbCrLf + "function Ellipse1_Click(sender,e)"
0021:    Ellipse1_Click_JavaScript += vbCrLf + "{"
0022:    Ellipse1_Click_JavaScript += vbCrLf + "var X=e.getPosition(null).x; "
0023:    Ellipse1_Click_JavaScript += vbCrLf + "var Y =e.getPosition(null).y;"
0024:    Ellipse1_Click_JavaScript += vbCrLf + "var ElementID =sender.Name;"
0025:    Ellipse1_Click_JavaScript += vbCrLf + "$get('HiddenField1').value=ElementID+','+X+','+Y;"
0026:    Ellipse1_Click_JavaScript += vbCrLf + AsnycPostBackScript
0027:    Ellipse1_Click_JavaScript += vbCrLf + "}"
0028:        
0029:    Me.ClientScript.RegisterStartupScript(GetType(String), "", Ellipse1_Click_JavaScript, True)
0030:  End Sub
　　
==<end>==============



==<反灰>===========
0019:        AsnycPostBackScript = Me.ClientScript.GetPostBackEventReference(Me.UpdatePanel1, "")
==<end>==============
　　



==<反灰>===========
__doPostBack('UpdatePanel1','')
==<end>==============
　　


　　
==<反灰>===========
0007:        '如果非同步事件發生
0008:        If Me.Request.Form("__EVENTTARGET") = Me.UpdatePanel1.ClientID Then
0009:            Dim para() As String = Me.Request.Form("HiddenField1").Split(",")
0010:            Me.TextBox1.Text = para(0) & " 在 " & Now.ToString("yyyy/MM/dd HH:mm:ss") & " 被按下 座標(" & para(1) & "," & para(2) & ")"
0011:        End If
==<end>==============
　　



　　
==<box>===========
程式3
    '按下按鈕時以非同步方式繪圖
    Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs)
        Dim dv As Data.DataView
        '依照資料庫繪圖
        Dim ads As New AccessDataSource("~/App_data/AccessDB.mdb", "")
        ads.SelectCommand = "select * from Table1 where uid=1"
        dv = ads.Select(New DataSourceSelectArguments)

        '清畫面
        Me.ClearCanvas()
        'Bar1
        Me.DrawBar("Field1", 10, 10, 30, 10 + dv.Item(0).Item("field1"))
        'Bar2
        Me.DrawBar("Field2", 10, 100, 30, 10 + dv.Item(0).Item("field2"))
        'Bar3
        Me.DrawBar("Field3", 10, 200, 30, 10 + dv.Item(0).Item("field3"))
    End Sub
==<end>==============
　　



　　
==<box>===========
程式4
    ' 清空畫布
    Sub ClearCanvas()
        DoJavaScript("ClearXaml();")
    End Sub
    '繪製長條圖
    Sub DrawBar(ByVal name As String, ByVal left As Integer, ByVal top As Integer, ByVal height As Integer, ByVal width As Integer)
        Dim xaml As String
        '讀入Xaml長條圖樣板檔案
        xaml = My.Computer.FileSystem.ReadAllText(System.IO.Path.GetDirectoryName(Me.Request.PhysicalPath) + "\Bar.xml")
        '換掉一些參數
        xaml = Replace(xaml, "$name$", name)
        xaml = Replace(xaml, "$Width$", width)
        xaml = Replace(xaml, "$Height$", height)
        xaml = Replace(xaml, "$Left$", left)
        xaml = Replace(xaml, "$Top$", top)
        '動態繪製
        CreateXAML(xaml)
    End Sub
    '動態建立XMAL
    Sub CreateXAML(ByVal xaml As String)
        xaml = Replace(xaml, vbLf, "")
        xaml = Replace(xaml, vbCr, "")
        DoJavaScript("CreateXaml('" & xaml & "');")
    End Sub
    '以非同步方式執行JavaScript
    Sub DoJavaScript(ByVal js As String)
        Dim key As String
        key = New System.Guid().ToString & Rnd() & Now.Ticks
        ScriptManager.RegisterStartupScript(Me.Page, GetType(String), key, js, True)
    End Sub
==<end>==============
　　
　　


　　
　　
==<box>===========
程式5
<Rectangle xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
           x:Name="$name$"  RenderTransformOrigin="0.5,0.492" 
           MouseMove="onMouseMove" 
           MouseLeftButtonUp="onMouseUp" 
           MouseLeftButtonDown="onMouseDown" 
           MouseLeave="onMouseUp" Stroke="#FF000000" StrokeThickness="1" 
           Width="$Width$" Height="$Height$" 
           Canvas.Left="$Left$" Canvas.Top="$Top$">
  <Rectangle.Fill>
    <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
      <GradientStop Color="#FF196BF2" Offset="0.761"/>
      <GradientStop Color="#FF0F1011" Offset="0.053"/>
      <GradientStop Color="#FF4CCED1" Offset="1"/>
    </LinearGradientBrush>
  </Rectangle.Fill>
</Rectangle>
==<end>==============
　　



==<反灰>===========
<Rectangle xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
           (…略…)
           MouseMove="onMouseMove" 
           MouseLeftButtonUp="onMouseUp" 
           MouseLeftButtonDown="onMouseDown" 
           MouseLeave="onMouseUp"  
           (…略…)
</Rectangle>
==<end>==============
　　


　　
　　
==<box>===========
程式6
//拖曳參數
var moving=0;
//開始拖曳
function onMouseDown(sender,args)
{
   moving=1;
}
//拖曳中
function onMouseMove(sender,args)
{
    if (moving!=0) {
        sender.width=args.getPosition(null).x+100;
        $get('Label1').innerHTML=sender.width;
    }
}
//拖曳結束之後,產生事件
function onMouseUp(sender,args)
{
    if (moving==1) {
        moving=0;
        //以非同步方式呼叫Web Services( 傳入參數 長條圖(Bar)名稱 與 寬度 ) 
        PageMethods.UpdateDataBase(sender.name,sender.width,ReceiveData);
    }
}
//Web Services Call Receiver
function ReceiveData(dat)
{
    alert(dat);
}
==<end>==============
　　


　　
　　
==<box>===========
程式7
    'Page Method(Web Services) '接收到參數 Bar名稱, 數值
    <System.Web.Services.WebMethod()> _
    <System.Web.Script.Services.ScriptMethod()> _
    Public Shared Function UpdateDataBase(ByVal Sender As String, ByVal value As String) As String
        '回傳文字
        Dim retMsg As String

        Try
            '透過 AccessDataSource 更新數據到資料庫中
            Dim ads As New AccessDataSource("~/App_Data/AccessDB.mdb", "")
            ads.UpdateCommand = "update Table1 set " & Sender & "=" & value & " where uid=1"
            ads.Update()
            '回傳文字
            retMsg = Sender & "===>" & value & "已更新!"
        Catch ex As Exception
            retMsg = ex.Message
        End Try
        '回傳
        Return retMsg
    End Function
==<end>==============
　　
　　



==<反灰>===========
//Web Services Call return
function ReceiveData(dat)
{
    alert(dat);
}
==<end>==============