如何使用Silverlight Toolkit中Rating等級控件

本篇內容主要講解“如何使用Silverlight Toolkit中Rating等級控件”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“如何使用Silverlight Toolkit中Rating等級控件”吧!

下面就簡要介紹一下Silverlight Toolkit中Rating等級控件用法。

首先，我們要在項目中添加對System.Windows.Controls.Input.Toolkit.dll的引用(位于源碼包中）。

然后我們就可以到XAML中引用其名空間：

xmlns:inputToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Input.Toolkit"

我們用下面代碼聲名一了Rating實例：

<inputToolkit:Ratingx:NameinputToolkit:Ratingx:Name="rating"Value="0.65"ItemCount="5"HorizontalAlignment="Left"/>

注意：ItemCount屬性標識當前有幾顆星。而Value屬性則對應當前顯示的星值數目（0-1之間）

我們通過下面代碼來標識星值著色是否連續(該枚舉有兩個值Continuous和Individual)：

rating.SelectionMode=RatingSelectionMode.Continuous;

下面我們就看一下演示效果:

當然該Silverlight Toolkit控件的星星排列除了水平方向，還可以是垂直方向。另外如果認為星星不好看，可以使用Blend定義一個新的圖案做為評級的圖標，比如我這里用了示例代碼中的樣式來把星星換成'圓球'，最終的演示效果如下(樣式代碼可以下載本DEMO查看)：

而相應的XAML代碼如下（注意ItemContainerStyle樣式綁定）：

<inputToolkit:RatingValueinputToolkit:RatingValue="0.65"Foreground="{x:Null}"ItemContainerStyle="{StaticResourceRatingItemStyle}" Margin="0,4,0,0"ItemCount="5"> <inputToolkit:Rating.ItemsPanel> <ItemsPanelTemplate> <StackPanelOrientationStackPanelOrientation="Vertical"VerticalAlignment="Stretch"HorizontalAlignment="Stretch"/> </ItemsPanelTemplate> </inputToolkit:Rating.ItemsPanel> </inputToolkit:Rating>

是不是很好玩

當然上面是通過在XAML頁面上定義來實現的，下面介紹一下如果使用CS代碼來創建‘等級項’。

在Rating控件中的每個星星（等級）都是一個RatingItem對象，所以我用下面代碼來動態加載等級項：

///<summary> ///加載自定義項  ///</summary> privatevoidLoadCustomRatingItem()  {   string[]ratingItmeArray=newstring[]{"很差","不好","一般","還行","很棒"};  foreach(stringiteminratingItmeArray)  {  RatingItemratingItem=newRatingItem(){Content=item,Foreground=  newSolidColorBrush(Colors.Blue),Margin=newThickness(12,0,12,0)};  ratingItem.SetValue(ToolTipService.ToolTipProperty,item);  customsRating.Items.Add(ratingItem);  }  rating.SelectionMode=RatingSelectionMode.Continuous;  }

我們來看一下運行效果：

  
完成了這個演示，來實現一個真正的應用場景，做一個照片評級的應用。首先我們用下面XAML代碼創建一個‘帶圖，按鈕，評級控件’的類似于海報的界面。

<BorderWidthBorderWidth="164"Padding="2"BorderBrush="#FFB30000"BorderThickness="1"> <StackPanelOrientationStackPanelOrientation="Vertical"Margin="0"> <HyperlinkButtonMarginHyperlinkButtonMargin="0"Content="汽車"HorizontalAlignment="Center"VerticalAlignment="Center"Foreground="#FF0F***9B"/> <ImageSourceImageSource="Images/car.jpg"Width="160"Margin="9,0"/> <inputToolkit:Ratingx:NameinputToolkit:Ratingx:Name="netflix"Value="0.65"ItemCount="5"HorizontalAlignment="Center"BorderBrush="Black"Padding="3,1,3,3"/> <ButtonClickButtonClick="Button_Click"Content="提交"Height="30"HorizontalAlignment="Center"VerticalAlignment="Center"Padding="3,1,3,3"/> </StackPanel> </Border>

然后我們在‘評論按鈕’上綁定事件代碼，來顯示用戶評價的結果。

privatevoidButton_Click(objectsender,RoutedEventArgse)  {  System.Windows.Browser.HtmlPage.Window.Alert("你將該圖片的評價為："+netflix.Value);  //netflix.Value=0;  }

***我們運行一下，如下圖：
           
點擊提交按鈕后：

          

當然更復雜的應用在官方的示例中有詳細演示，如果大家有興趣可以去下載運行相應示例即可。

到此，相信大家對“如何使用Silverlight Toolkit中Rating等級控件”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！