silverlight 自定义控件基础篇(仿淘宝评论星级控件)


首先说说今天的控件能干什么?

1,仿淘宝的评论星级控件,鼠标滑过星星,会变亮。

2,可以用来,展示某一类对象的状态,或者统计信息,比如说,某一类对象,有1~10不同的状态,10为满状态,那么该控件就能根据该对象的状态显示。

显示方法(状态为1的 亮一颗星,灰色的9颗星,状态为2的 亮2颗,灰色的8颗,以此类推)

该控件的属性

   <my:StarsControl Number="6" Stars="{Binding Num}" IsComment="True"  Margin="5" ClickMe="StarsControl_ClickMe" MoveMe="StarsControl_MoveMe" ></my:StarsControl>
                     

 

1,Number,要显示的总星数量,比如6,总共显示6颗星(如果用作评论星级,代表满级6星)

2,Stars,该对象的状态,也就是将会亮多少颗星,其他的星(灰色)

3,IsComment,表示该控件是否能鼠标滑过,更改星的状态。true表示更改,false表示只用来展示,不更改

事件

ClickMe,相当于每颗星星的点击事件

MoveMe,相当于每颗星星鼠标移动事件

StarsControl的XAML

<UserControl x:Class="TestDemo.StarsControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="800" d:DesignWidth="300">
    <!--将每个StankPanel做为容器,将星星添加进来-->
     <StackPanel Orientation="Horizontal" x:Name="item" Loaded="item_Loaded" >

    </StackPanel>

</UserControl>

后置代码.cs

 public partial class StarsControl : UserControl//评论星级,或显示信誉度
    {
        public StarsControl()
        {
            InitializeComponent();
        }

        //定义要显示的星星个数,默认5
        public static readonly DependencyProperty NumberProperty = DependencyProperty.Register("Number", typeof(int), typeof(StarsControl), new PropertyMetadata(5,new PropertyChangedCallback(NumberPropertyChanged)));


        public int Number
        {
            get { return (int)GetValue(NumberProperty); }
            set { SetValue(NumberProperty, value); }
        }
        public static void NumberPropertyChanged(DependencyObject obj, D
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值