滚轮翻页与传动的翻页更为方便,经过本人一番探讨与琢磨终于在XtraGrid的GridView中实现了鼠标滚轮翻页。

我新建了一个组件继承原本的GridControl,在组件中添加了一个ImageList,专门存放一些资源图片。用于实现动态图的效果。

添加一个自定义委托的参数与枚举,委托参数用于传递分页的信息。

    public class PagingEventArgs : EventArgs
{
public int PageSize { get; set; }
public int PageIndex { get; set; }
} public enum LoadState
{
/// <summary>
/// 就绪
/// </summary>
Ready, /// <summary>
/// 正在读取
/// </summary>
Loading, /// <summary>
/// 读取完成
/// </summary>
Finish
}

在组件的类里面添加以下字段

        /// <summary>
/// 页面大小
/// </summary>
private int _int_page_size=20; /// <summary>
/// 当前页索引
/// </summary>
private int _int_page_index=1; /// <summary>
/// 总记录数
/// </summary>
private int _int_record_count; /// <summary>
/// 读取状态
/// </summary>
private LoadState _LodaState_state;

添加以下属性

        /// <summary>
/// 总记录数
/// </summary>
public int RecordCount
{
get
{
if (!IsPaging) return 0;
return _int_record_count;
}
set
{
if (!IsPaging) return ;
_int_record_count = value;
//当设置了新的记录总数,自动读取第一页的内容
if(value>0)
gridView_TopRowChanged(this, new EventArgs());

          else
          {
              while (this.MainView.DataRowCount > 0)
                GridView_main_view.DeleteRow(0);
              this.RefreshDataSource();
          }

            }
} /// <summary>
/// 每次读取的行数
/// </summary>
public int PageSize
{
get
{
if (!IsPaging) return 0;
return _int_page_size;
}
set
{
if (!IsPaging) return ;
_int_page_size = value;
}
} /// <summary>
/// 总页数
/// </summary>
private int PageCount
{
get
{
if (RecordCount % PageSize == 0)
return RecordCount / PageSize;
return RecordCount / PageSize + 1;
}
} /// <summary>
/// Grid
/// </summary>
private GridView _GridView_main_view
{
get { return (GridView)this.MainView; }
} /// <summary>
/// 是否启用分页
/// </summary>
public bool IsPaging { get; set; }

添加以下委托与事件

        /// <summary>
/// 内部使用的委托
/// </summary>
private delegate void myDelegate(); /// <summary>
/// 滚动翻页的委托
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
public delegate void ScrollingToPageEventHandler(object sender, PagingEventArgs e); /// <summary>
/// 滚动翻页的事件
/// </summary>
public event ScrollingToPageEventHandler OnScrollingToPage;

以下则是一些对控件的设置,按照各人喜好可以有所更改。

        /// <summary>
/// 设置分页栏
/// </summary>
private void InitEmbeddedNavigator()
{this.EmbeddedNavigator.CustomButtons.AddRange(new DevExpress.XtraEditors.NavigatorCustomButton[] {
new DevExpress.XtraEditors.NavigatorCustomButton(-1, -1, true, false, "", null)});
this.EmbeddedNavigator.TextStringFormat = " 当前 {1} 行数据 ";
this.UseEmbeddedNavigator = true; } /// <summary>
/// 设置gridView
/// </summary>
private void InitGridView()
{
_GridView_main_view.TopRowChanged += new EventHandler(gridView_TopRowChanged);
}

为控件的事件注册以下方法

        private void gridControl_Load(object sender, EventArgs e)
{
if (IsPaging)
{
_LodaState_state = LoadState.Ready; InitEmbeddedNavigator();
InitGridView();
}
} private void gridView_TopRowChanged(object sender, EventArgs e)
{ lock (this)
{
if ( _int_page_index > PageCount || _LodaState_state != LoadState.Ready) return;
} //检查是否到达底部
if (_GridView_main_view.IsRowVisible(_GridView_main_view.RowCount - 1) == RowVisibleState.Visible||
_int_page_index==1)
{ lock (this)//设置成开始读取状态
{
_LodaState_state = LoadState.Loading;
}
Thread thread_load_data = new Thread(new ThreadStart(LoadData));
Thread thread_change_text = new Thread(new ThreadStart(ChangeLoadingImage));
thread_change_text.Start();
thread_load_data.Start();
}
}

TopRowChanged事件在grid的首行改变了就会触发,类似于滚动条的Scroll事件。这里开了两个线程,第一个线程用于读取数据,第二个线程用于实现动态图。两个线程调用的方法都在下面

        /// <summary>
/// 读取数据
/// </summary>
private void LoadData()
{
int top_row_index = 0;
int focus_index = 0;
lock (this)
{
top_row_index = _GridView_main_view.TopRowIndex;
focus_index = _GridView_main_view.FocusedRowHandle; //执行事件
if (OnScrollingToPage == null)
throw new Exception("OnScrollingToPage can not be null"); PagingEventArgs e = new PagingEventArgs();
e.PageIndex = this._int_page_index;
e.PageSize = this._int_page_size;
OnScrollingToPage(this,e); } //刷新grid的数据
if (this.Parent.InvokeRequired)
{
this.Parent.Invoke(new myDelegate(delegate
{
_GridView_main_view.TopRowIndex = top_row_index;
_GridView_main_view.FocusedRowHandle = focus_index;
           _GridView_main_view.RefreshData();
})); }
lock (this)
{
_LodaState_state = LoadState.Finish;//设置成读取完成状态
}
} /// <summary>
/// 更替图片
/// </summary>
private void ChangeLoadingImage()
{ int image_index = 0; if (this.Parent.InvokeRequired)//显示loading的gif
{
this.Parent.Invoke(new myDelegate(delegate
{
this.EmbeddedNavigator.Buttons.CustomButtons[0].Visible = true;
}));
}
while (true)//循环更替图片实现动态图效果
{
lock (this)
{
if (_LodaState_state != LoadState.Loading)//判定数据是否完成
break;
} Thread.Sleep(120); if (image_index == 3)
image_index = 0;
else
image_index++;
if (this.Parent.InvokeRequired)
{
//轮流更换图片实现gif动态图
this.Parent.Invoke(new myDelegate(delegate
{
this.EmbeddedNavigator.Buttons.CustomButtons[0].ImageIndex = image_index;
}));
}
} if (this.Parent.InvokeRequired)//隐藏loading的gif
{
this.Parent.Invoke(new myDelegate(delegate
{
this.EmbeddedNavigator.Buttons.CustomButtons[0].Visible = false;
}));
} lock (this)
{
_LodaState_state = 0;
_int_page_index++;
} }

不过这个代码有点问题,当GridControl绑定的数据源有相同实例的子项时,随着RefreshData方法的调用会不停触发TopRowChanged事件,确切的原因还没搞清楚,解决这个问题就是要不去除数据源上相同的实例子项,要不就不调用RefreshData方法。还有更好的办法还请高手们的指点。

XtraGrid滚轮翻页的更多相关文章

  1. vue案例 - vue-awesome-swiper实现h5滑动翻页效果

    说到h5的翻页,很定第一时间想到的是swiper.但是我当时想到的却是,vue里边怎么用swiper?! 中国有句古话叫:天塌下来有个高的顶着. 在前端圈里,总有前仆后继的仁人志士相继挥洒着热汗(这里 ...

  2. 转载 vue-awesome-swiper - 基于vue实现h5滑动翻页效果

    说到h5的翻页,很定第一时间想到的是swiper.但是我当时想到的却是,vue里边怎么用swiper?! 中国有句古话叫:天塌下来有个高的顶着. 在前端圈里,总有前仆后继的仁人志士相继挥洒着热汗(这里 ...

  3. 页面PC端 / 移动端整屏纵向翻页,点击/触摸滑动效果功能代码非插件

    页面翻页,滑动功能示范代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  4. webapp应用--模拟电子书翻页效果

    前言: 现在移动互联网发展火热,手机上网的用户越来越多,甚至大有超过pc访问的趋势.所以,用web程序做出仿原生效果的移动应用,也变得越来越流行了.这种程序也就是我们常说的单页应用程序,它也有一个英文 ...

  5. jquery css3问卷答题卡翻页动画效果

    这个选项调查的特效以选项卡的形式,每答完一道题目自动切换到下一条,颇具特色.使用jQuery和CSS3,适合HTML5浏览器. 效果展示 http://hovertree.com/texiao/jqu ...

  6. 采用cocos2d-x lua 的listview 实现pageview的翻页效果之上下翻页效果

    --翻页滚动效果local function fnScrollViewScrolling( sender,eventType)    -- body    if eventType == 10 the ...

  7. HTML5翻页电子书

    体验效果:http://hovertree.com/texiao/jquery/60/ 图片请用正方形的 参考:http://hovertree.com/h/bjaf/d339euw9.htmhttp ...

  8. [原创]纯CSS3打造的3D翻页翻转特效

    刚接触CSS3动画,心血来潮实现了一个心目中自己设计的翻页效果的3D动画,页面纯CSS3,目前只能在Chrome中玩,理论上可以支持Safari. 1. 新建HTML,代码如下(数据和翻页后的数据都是 ...

  9. Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页、搜索、格式化、自定义按钮

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

随机推荐

  1. php Yii2使用registerJs或registerCss报错syntax error, unexpected end of file

    解决方法: 注册时$js=<<<JS .....JS;//结尾处JS;应单独成行并且没有空格  JS;//这样就会报错,多了空格JS;//这样就不会

  2. jQuery遍历-祖先

    祖先是父.祖父或曾祖父等等. 通过 jQuery,您能够向上遍历 DOM 树,以查找元素的祖先. 向上遍历 DOM 树 这些 jQuery 方法很有用,它们用于向上遍历 DOM 树: parent() ...

  3. javascript学习笔记-2:jQuery中$("xx")返回值探究

    最近在写一个jQuery插件的时候,需要用到一个条件: 一组img标签,每一个元素都需要被它前面的元素值src替换,如果是第一个(序列为0)则其值为最后一个元素值,如果是最后一个,那么其值为第一个元素 ...

  4. Spring AOP 通过order来指定顺序

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt398 Spring中的事务是通过aop来实现的,当我们自己写aop拦截的时候 ...

  5. 汇编指令-str存储指令(4)

    str -(Store Register)存储指令 格式:str{条件}  源寄存器,<存储器地址>将源寄存器中数据存到存储器地址中. 实例1: str   r1,[r2]        ...

  6. [C#] .Net Core 全局配置读取管理方法 ConfigurationManager

    最近在学习.Net Core的过程中,发现.Net Framework中常用的ConfigurationManager在Core中竟然被干掉了. 也能理解.Core中使用的配置文件全是Json,不想F ...

  7. 操作系统:ucore的部分Bug&挑战练习

    ucore是清华大学提供的一个学习操作系统的平台.ucore有完整的mooc视频与说明文档. https://objectkuan.gitbooks.io/ucore-docs/content/# 本 ...

  8. Seesion工作原理

    session的工作原理一.术语session 在我的经验里,session这个词被滥用的程度大概仅次于transaction,更加有趣的是transaction与session在某些语境下的含义是相 ...

  9. 配置VNC SERVER 远程访问

    1.安装软件包 # yum install tigervnc-server -y 2. 配置VNC用户 # vim /etc/sysconfig/vncservers VNCSERVERS=" ...

  10. 【2017集美大学1412软工实践_助教博客】团队作业8——第二次项目冲刺(Beta阶段)

    题目 团队作业8: http://www.cnblogs.com/happyzm/p/6856179.html 团队作业8-1 beta冲刺计划 团队 新加入的成员,担当的角色,技术特点 下一阶段需要 ...