Silverlight 自定义Pager

Silverlight中MS有一个DataPager,不过用的是客户端分页和Asp.net中的GridView中分页思想一样,要进行服务端分页比较麻烦,因此我参考自己原来写的Flex分页写了一个自定义分页控件。

1.创建一个Silverlight 类库工程

Silverlight 自定义Pager_第1张图片

2.创建一个Silverlight用户控件HahaPager

3.添加一个PageInfo类,用于保存分页相关信息

    public class PageInfo
    {
        public int RecordCount { get; set; }
        public int PageSize { get; set; }
        public int PageIndex { get; set; }
        public int PageCount { get; set; }
        ///计算
        public void Compute()
        {
            PageCount = RecordCount / PageSize;
            if (RecordCount % PageSize != 1)
                PageCount++;
            if (PageIndex > PageCount - 1) PageIndex = PageCount - 1;
            if (PageIndex < 0) PageIndex = 0;
        }
        public int StartIndex
        {
            get
            {
                return PageIndex * PageSize+1;
            }
        }
        public int EndIndex
        {
            get
            {
                var index = PageIndex * PageSize + PageSize+1;
                return index > RecordCount ? RecordCount : index;
            }
        }
        public bool IsFirst
        {
            get
            {
                return PageIndex == 0;
            }
        }
        public bool IsLast
        {
            get
            {
                return PageIndex == PageCount - 1;
            }
        }
        public bool IsInMiddle
        {
            get
            {
                return !IsFirst && !IsLast;
            }
        }
    }

4.HahaPager页面放置一个Label和四个按钮效果如下:

XMAL内容如下: 

<UserControl x:Class="HahaPagerUI.HahaPager"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="30" d:DesignWidth="505" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk">

    <Grid x:Name="LayoutRoot" Background="#FFEFECEC">
        <sdk:Label HorizontalAlignment="Left" Margin="10,0,0,0" Name="label1" VerticalAlignment="Center" Content="共100条每页10条 共10页第1页" />
        <Rectangle HorizontalAlignment="Stretch" Margin="1" Name="rectangle1" Stroke="Black" StrokeThickness="1" VerticalAlignment="Stretch"  />
        <Button Content="◀◀"  HorizontalAlignment="Right" Margin="5,5,125,5" Name="btnF" VerticalAlignment="Stretch" Width="36" Click="btnF_Click" />
        <Button Content="◀"  HorizontalAlignment="Right" Margin="5,5,85,5" Name="btnP" Width="36" Click="btnP_Click" />
        <Button Content="▶"  HorizontalAlignment="Right" Margin="5,5,45,5" Name="btnN" VerticalAlignment="Stretch" Width="36" Click="btnN_Click" />
        <Button Content="▶▶"  HorizontalAlignment="Right" Margin="5,5,5,5" Name="btnL" VerticalAlignment="Stretch" Width="36" Click="btnL_Click" />
    </Grid>
</UserControl>

cs代码如下:

    public partial class HahaPager : UserControl
    {
        //页码改变事件
        public event EventHandler PageIndexChanged;

        public HahaPager()
        {
            InitializeComponent();
            Pi = new PageInfo();
            NavString = "共{RecordCount}条每页{PageSize}条 共{PageCount}页第{PageIndex}页";
        }
        public PageInfo Pi { get; set; }

        //绘制导航信息
        public void Render()
        {
            string tmp = NavString.Replace("{RecordCount}", "" + Pi.RecordCount)
                .Replace("{PageSize}", "" + Pi.PageSize)
                .Replace("{PageCount}", "" + Pi.PageCount)
                .Replace("{PageIndex}", "" + (Pi.PageIndex + 1))
                .Replace("{StartIndex}", "" + Pi.StartIndex)
                .Replace("{EndIndex}", "" + Pi.EndIndex);
            label1.Content = tmp;
            btnF.IsEnabled = btnP.IsEnabled = !Pi.IsFirst;
            btnN.IsEnabled = btnL.IsEnabled = !Pi.IsLast;
        }
        //导航字符串
        public string NavString { get; set; }

        //首页
        private void btnF_Click(object sender, RoutedEventArgs e)
        {
            Pi.PageIndex = 0;
            Render();
            if (PageIndexChanged != null)
            {
                PageIndexChanged(this, e);
            }
        }

        //上一页
        private void btnP_Click(object sender, RoutedEventArgs e)
        {
            Pi.PageIndex--;
            Pi.Compute();
            Render();
            if (PageIndexChanged != null)
            {
                PageIndexChanged(this, e);
            }
        }
        //下一页
        private void btnN_Click(object sender, RoutedEventArgs e)
        {
            Pi.PageIndex++;
            Pi.Compute();
            Render();
            if (PageIndexChanged != null)
            {
                PageIndexChanged(this, e);
            }
        }

        //末页
        private void btnL_Click(object sender, RoutedEventArgs e)
        {
            Pi.PageIndex = Pi.PageCount - 1;
            Render();
            if (PageIndexChanged != null)
            {
                PageIndexChanged(this, e);
            }
        }
    }


控件基本完成,测试效果界面:

测试相关代码:

        //加载时绑定数据
        private void LayoutRoot_Loaded(object sender, RoutedEventArgs e)
        {
            //第一页数据
            BookDAL.FindAllByPage(0, 10, datas => {                
                booksDataGrid.ItemsSource = datas;                
            });
            //获取页码
            BookDAL.GetBookCount(data => {
                hahaPager1.Pi.RecordCount = data;
                hahaPager1.Pi.PageSize = 10;
                hahaPager1.Pi.Compute();
                hahaPager1.Render();
            });
        }

        //页码改变时重新获取下一页数据
        private void hahaPager1_PageIndexChanged(object sender, EventArgs e)
        {
            var pi=hahaPager1.Pi;
            BookDAL.FindAllByPage(pi.PageIndex, pi.PageSize, datas =>
            {
                booksDataGrid.ItemsSource = datas;
            });
        }


这只是初步实现!

封装了一个DLL,源码和封装后的DLL下载路径:

http://download.csdn.net/detail/lijun7788/4633746 

 

你可能感兴趣的:(Silverlight 自定义Pager)