Wikis » SilverLight programming tip tricks » Silverlight Tip of the Day #37 – How to Dynamically Load and Display Silverlight Applications

Wiki

Shortcuts

Wiki Table of Contents

Page Details

Published by:

Nguyễn Thị Như Quỳnh
on 07-24-2009

This page has not yet been rated

Article

Comments (0)

History (1)

Silverlight Tip of the Day #37 – How to Dynamically Load and Display Silverlight Applications

Filed under: Silverlight [Edit Tags]

Kể từ bây giờ chúng ta có thể khai báo tĩnh ứng dụng Silverlight của chúng ta trực tiếp vào trong trang web ASPX như sau:

Mục đích của bài này là hiển thị cho bạn thấy bằng cách nào ta có thể load động và hiển thị những ứng dụng Silverlight. Điều này có ích nếu bạn muốn thay đổi qua lại sự hiển thị của những ứng dụng Silverlight trên một trang web. Về mục đích ứng dụng của chúng ta, ta sẽ tạo một trang web duy nhất với hai Buttons và một Panel . Nhấn vào Button #1 sẽ tải lên ứng dụng Silverlight đầu tiên vào trong panel. Nhấn vào Button #2 sẽ tải lên ứng dụng Silverlight thứ hai vào trong Panel.

Để hoàn thành ứng dụng này, hãy làm theo những bước sau::

Tạo mới một ứng dụng Silverlight Application project trong Visual Studio 2008. Để làm điều này , đơn giản chỉ cần chọn File->New Project, Silverlight Application.
Click chuột phải trên nút project trong cửa sổ Solution Explorer, chọn Add->New Project, Silverlight Application và liên kết nó vào trang web. Bằng cách này bạn sẽ có hai ứng dụng Silverlight cùng tồn tại trong một trang web.
Mở trang default.aspx và thêm một ScriptManager, Panel, và hai Buttons như hình hiển thị bên dưới.

Hãy biến trang default.aspx thành trang web mặc định của bạn bằng cách click chuột phải trên trang web đó và chọn “Set as Start Page”.Khi chạy, ứng dụng sẽ chạy trang này trước.

<body style="height: 100%; margin: 0;">
    <form id="form1" runat="server" style="height: 100%;">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <asp:Panel ID="SilverlightApp" runat="server">
    </asp:Panel>
    <asp:Button ID="Button1" runat="server" Text="Show First App" OnClick="OnShowFirstApp"
        OnCommand="Button1_Command" />
    &nbsp;&nbsp;
    <asp:Button ID="Button2" runat="server" Text="Show Second App" OnClick="OnShowSecondApp"
        OnCommand="Button1_Command" />
    </form>
</body>

Ở phần mã phía sau trong trang web Default.aspx.cs, thêm vào hai sự kiện như sau. Trong mỗi sự kiện chúng ta sẽ tạo một cách tự động Silverlight control và gán Source liên kết đến file XAP .

protected void OnShowFirstApp(object sender, EventArgs e)
{
    System.Web.UI.SilverlightControls.Silverlight sl = new System.Web.UI.SilverlightControls.Silverlight();
 
    sl.Source = "ClientBin/SilverlightApplication1.xap";
    sl.ID = "SilverlightApp1";
    sl.Width = new Unit(800);
    sl.Height = new Unit(600);
    sl.Windowless = true;
    SilverlightApp.Controls.Clear();
    SilverlightApp.Controls.Add(sl);
}
 
protected void OnShowSecondApp(object sender, EventArgs e)
{
    System.Web.UI.SilverlightControls.Silverlight sl = new System.Web.UI.SilverlightControls.Silverlight();
 
    sl.Source = "ClientBin/SilverlightApplication2.xap";
    sl.ID = "SilverlightApp2";
    sl.Width = new Unit(800);
    sl.Height = new Unit(600);
    sl.Windowless = true;
    SilverlightApp.Controls.Clear(); 
    SilverlightApp.Controls.Add(sl);
}

Nhìn vào những dòng mã trên bạn sẽ thấy, đầu tiên chúng ta khai báo một đối tượng Silverlight là đối tượng chúng ta có thể tìm thấy trong namespace System.Web.UI.SilverlightControls. Mỗi khi tạo, chúng ta gán Source là đường dẫn chỉ đến tập tin XAP của ứng dụng Silverlight mà ta sẽ hiển thị. Tùy thôi, chúng ta cũng có thể gán một ID, width, height và Windowless = true.

Tải về mã nguồn tại đây: Source Code

Thank you,
--Mike Snow

Wiki

Shortcuts

Wiki Table of Contents

Tags

Page Details

Silverlight Tip of the Day #37 – How to Dynamically Load and Display Silverlight Applications

Recent Comments