65.9K
CodeProject 正在变化。 阅读更多。
Home

为您的 Silverlight 应用程序添加 Facebook 点赞功能

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.67/5 (5投票s)

2011年3月29日

CPOL

2分钟阅读

viewsIcon

24375

downloadIcon

617

在本文中,您将了解如果您想将 Facebook Like 按钮添加到您的 Silverlight 应用程序,需要执行哪些操作。

SilverlightFacebookLike/FacebookLikePicture.png

引言

在本文中,您将了解如果您想将 Facebook Like 按钮添加到您的 Silverlight 应用程序,需要执行哪些操作。

如果您想查看一个实时示例,请访问我的 XAML 博客

Using the Code

直接的方法是在您的应用程序中添加一个按钮,并使其看起来与 Facebook 上的按钮相同。然后,您需要对点击“Like”按钮的人进行 Facebook 身份验证,并将您的 Facebook 页面添加到他喜欢的页面列表中。这很难实现,并且需要了解 Facebook API。您也可以尝试使用 CodePlex Facebook SDK,但这需要您拥有一个 Facebook 应用程序,如果您只有 Facebook 个人页面或网站,SDK将无法提供帮助。

简单的方法是将 HTML Facebook Like 按钮集成到您的 Silverlight 应用程序中。为此,您需要一个 HtmlHost 控件来显示 HTML Like 按钮。由于标准的 Microsoft WebBrowser 控件仅在以脱机模式运行时才有效,因此我使用了 divelements 免费的 HtmlHost 控件。为了使用此控件,您需要将 Silverlight 插件的 windowless 参数设置为 true

这是一个逐步示例

  1. 在 Visual Studio 2010 中创建一个名为 FacebookLikeApplication 的新项目,使用 SilverlightApplication 模板;在创建项目时,选中“将 Silverlight 应用程序托管在一个新的网站中”选项。
  2. 此处下载 divelements Silverlight 工具;解压缩、取消阻止,并将 Divelements.SilverlightTools.dll 的引用添加到您的 FacebookLikeApplication 项目。

    打开 FacebookLikeApplicationTestPage.aspxFacebookLikeApplicationTestPage.html,找到 <object .. /> 元素并添加 windowless 参数。

    <form id="form1" runat="server" style="height:100%">
        <div id="silverlightControlHost">
            <object data="data:application/x-silverlight-2," 
                   type="application/x-silverlight-2" 
                   width="100%" height="100%">
              <param name="source" value="ClientBin/FacebookLikeApplication.xap"/>
              <param name="onError" value="onSilverlightError" />
              <param name="background" value="white" />
              <param name="minRuntimeVersion" value="4.0.50826.0" />
              <param name="autoUpgrade" value="true" />
              <param name="windowless" value="true" />
              <a href="<a href="http://go.microsoft.com/fwlink/
    			?LinkID=149156&v=4.0.50826.0">
                        	<a href="http://go.microsoft.com/fwlink/">http://go.microsoft.com/fwlink/</a>?
    			LinkID=149156&v=4.0.50826.0</a>"
                        style="text-decoration:none"> 
                        <img src="<a href=
    		    "http://go.microsoft.com/fwlink/?LinkId=161376">
                        http://go.microsoft.com/fwlink/?LinkId=161376</a>" 
                        alt="Get Microsoft Silverlight" style="border-style:none"/>
              </a>
            </object><iframe id="_sl_historyFrame" 
              style="visibility:hidden;height:0px;width:0px;border:0px">
    		</iframe></div>
    </form>
  3. 打开 MainPage.xaml 并添加 HtmlHost 控件
    <UserControl x:Class="FacebookLikeApplication.MainPage"
        xmlns="<a href="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
          http://schemas.microsoft.com/winfx/2006/xaml/presentation</a>"
        xmlns:x="<a href="http://schemas.microsoft.com/winfx/2006/xaml">
          http://schemas.microsoft.com/winfx/2006/xaml</a>"
        xmlns:d="<a href="http://schemas.microsoft.com/expression/blend/2008">
          http://schemas.microsoft.com/expression/blend/2008</a>"
        xmlns:mc="<a href=
    	"http://schemas.openxmlformats.org/markup-compatibility/2006">
          http://schemas.openxmlformats.org/markup-compatibility/2006</a>"
        xmlns:divtools="clr-namespace:Divelements.SilverlightTools;
                        assembly=Divelements.SilverlightTools"
        mc:Ignorable="d"
        d:DesignHeight="300" d:DesignWidth="400">
    
        <Grid x:Name="LayoutRoot" Background="White">
            <divtools:HtmlHost x:Name="htmlHost"/>
        </Grid>
    </UserControl>
  4. 此处打开 Facebook Like 按钮网站,填写字段,并检索 Facebook Like iframe。
  5. 打开 MainPage.xaml.cs 并将 Facebook Like iframe 设置为 htmlHost.SourceHtml 属性;设置值后,将 iframe 文本中的双引号替换为单引号。
    namespace FacebookLikeApplication
    {
        public partial class MainPage : UserControl
        {
            public MainPage()
            {
                InitializeComponent();
    
                htmlHost.SourceHtml = 
                   "<iframe src='https://#/plugins/like.php?" + 
                   "href=http%3A%2F%2Fwww.facebook.com
    		%2Fpages%2FXAMLBlogCOM%2F1759664691" + 
                   "16158&layout=standard&show_faces=true&" + 
                   "width=450&action=like&colorscheme=light&
    		height=80' " + 
                   "scrolling='no' frameborder='0' style='border:none; " + 
                   "overflow:hidden; width:450px; height:80px;'></iframe>";
            }
        }
    }

完成了!现在您可以构建并运行应用程序了。

历史

  • 版本 1
© . All rights reserved.