Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles
(untagged)

Custom VScrollbar to make DataGrid finger flickable

0.00/5 (No votes)
18 Feb 2010 1  
A custom VScrollbar to make DataGrid finger flickable.

Introduction

The VScrollbar control solves the problem of the DataGrid in the Compact Framework not being able to scroll from finger flicking like in the ListView or the ListBox.

Background

It was surprising to me that the DataGrid control is not capable of doing finger flicking. Maybe most of the time, if we need that functionality, we should use the ListView control. But I need the functionality on my DataGrid for a project that I'm working on now; since I have done a lot of customization on the grid, I can't really go back to the ListView. I thought I could easily add the functionality to the grid myself, and I was right, it wasn't hard. But the problem is that there is no way to set the position of the native scrollbar of the grid. So I have a grid that scrolls on finger flicking but the scrollbar position doesn't change. Since there is no way to set the scrollbar position programmatically, I need to "hide" the scrollbar. And that's the reason for this scrollbar control.

Using the Code

The code to use the control is pretty simple. Currently, the control does not have a parameterless constructor. So, we can not do the drag and drop thing. But, all it needs is really just the instance of the DataGrid to attach to and the datasource for the DataGrid.

private void Form1_Load(object sender, EventArgs e)
{
    DataTable dt = GetData();
    var scrollBar = new GridVScrollBar(this.dataGrid1, dt);
    //This line is not needed if you don't need to show the scrollbar
    this.Controls.Add(scrollBar);
}

Limitations

Currently, the second input parameter needs to be of type DataTable or IList. I think it can be made DataTable and IEnumerable with a little extra code.

private void SetVisibleItems(int startIndex)
{
    object displaySource = new object();
    var endIndex = VisibleRowCount + startIndex;

    if (_controlDataSource is DataTable)
    {
        var sdt = _controlDataSource as DataTable;
        var dt = sdt.Clone();
        for (int i = startIndex; i < endIndex; i++)
        {
            if (i < ItemCount && i >= 0)
            {
                dt.Rows.Add(sdt.Rows[i].ItemArray);
            }
        }
        displaySource = dt;
    }
    else if (_controlDataSource is IList)
    {
        var sdt = _controlDataSource as IList;
        var list = (IList)Activator.CreateInstance(_controlDataSource.GetType());
        for (int i = startIndex; i < endIndex; i++)
        {
            list.Add(sdt[i]);
        }
    }

    _dataGrid.DataSource = displaySource;
    //_dataGrid.Select(0);  
    //Or one could raise an event such as DisplaySourceReady here to 
    //so that any extra can be handled before the grid refreshes
    _dataGrid.Refresh();
}

We should probably set EnableAutoScroll to false for grids that have a small visible window relative to the row height. Because the auto-scroll logic is not working well, this scenario has not come up yet.

private void Form1_Load(object sender, EventArgs e)
{
    DataTable dt = GetData();
    var scrollBar = new GridVScrollBar(this.dataGrid1, dt);
    scrollBar.EnableAutoScroll = false;
    this.Controls.Add(scrollBar);
}

Future Improvements

Please post your code if you make any nice improvements!

  • Make the datasource less restrictive.
  • Make the control work with more than just DataGrid.
  • Improve the auto-scroll logic. This is a bit difficult and time consuming. Arctan (speed) is probably is good enough alone.

History

  • Feb. 18, 2010 -- First draft.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here