PullToRefresh

Namespace: Wisej.Web.Ext.PullToRefresh

Assembly: Wisej.Web.Ext.PullToRefresh (4.1.0.0)

• Component
  • Component
    • PullToRefresh

Adds pull-to-refresh functionality to one or more ScrollableControl targets.

C#

public class PullToRefresh : Component, IExtenderProvider

VB.NET

Public Class PullToRefresh
    Inherits Component
    Implements IExtenderProvider

When the user drags a registered control down while it is scrolled to the top, a loader panel (see ImageSource, BackColor and DropDownHeight) slides in above the content and, when the pointer is released, the Refresh event is fired on the server with the refreshed control as the sender. Use SetPullToRefresh to enable the functionality for each control.

Example:

Enabling pull-to-refresh on a panel and reloading its data:

public partial class Page1 : Page
{
    private PullToRefresh pullToRefresh1 = new PullToRefresh();

    public Page1()
    {
        InitializeComponent();

        this.pullToRefresh1.SetPullToRefresh(this.panel1, true);
        this.pullToRefresh1.Refresh += this.pullToRefresh1_Refresh;
    }

    private void pullToRefresh1_Refresh(object sender, EventArgs e)
    {
        var panel = (Panel)sender;
        LoadNews(panel);
    }
}

Constructors

PullToRefresh()

Initializes a new instance of the PullToRefresh class.

PullToRefresh(container)

Initializes a new instance of the PullToRefresh class together with the specified container.

Name	Type	Description
container	IContainer	A IContainer that represents the container for the component.

Throws:

• ArgumentNullException container is null.

Properties

BackColor

Color: Returns or sets the background color of the loader panel displayed while pulling.

The default is Transparent.

DropDownHeight

Int32: Returns or sets the height in pixels of the loader panel displayed while pulling. (Default: 50)

This value is also the maximum distance the content can be dragged down. The loader image is scaled to DropDownHeight - 20 pixels. Changing this value recreates the loaders on the client.

Example:

Using a taller loader panel:

this.pullToRefresh1.DropDownHeight = 80; // loader image is 60px

ImageSource

String: Returns or sets the loader image displayed in the loader panel while pulling. (Default: "resource.wx/loader.svg")

The value can be a URL, an application-relative path, or a theme image name. The image is centered in the loader panel and not animated by the extender; use an animated SVG or GIF for a spinning effect. The default is "resource.wx/loader.svg".

Example:

Using a custom animated image from the application folder:

this.pullToRefresh1.ImageSource = "Images/spinner.gif";

Methods

Clear()

Removes the pull-to-refresh functionality from all the registered controls.

All the controls previously registered with SetPullToRefresh are removed from the extender and the client loaders are removed. To enable the functionality again call SetPullToRefresh.

Example:

Removing pull-to-refresh from all the registered controls:

private void checkBoxEnableRefresh_CheckedChanged(object sender, EventArgs e)
{
    if (this.checkBoxEnableRefresh.Checked)
        this.pullToRefresh1.SetPullToRefresh(this.panel1, true);
    else
        this.pullToRefresh1.Clear();
}

GetPullToRefresh(control)

Returns whether pull-to-refresh is enabled for the given scrollable control.

Parameter	Type	Description
control	ScrollableControl	The ScrollableControl to check.

Returns: Boolean. true if pull-to-refresh is enabled for control ; otherwise false.

Throws:

• ArgumentNullException control is null.

Example:

Toggling pull-to-refresh on a panel:

bool enabled = this.pullToRefresh1.GetPullToRefresh(this.panel1);
this.pullToRefresh1.SetPullToRefresh(this.panel1, !enabled);

OnRefresh(sender, e)

Fires the Click event.

Parameter	Type	Description
sender	Object	A ObjectThe control that triggered the refresh.
e	EventArgs	A EventArgsThe event data.

OnWebEvent(e)

Processes the event from the client.

Parameter	Type	Description
e	WisejEventArgs	Event arguments.

OnWebRender(config)

Renders the client component.

Parameter	Type	Description
config	Object	Dynamic configuration object.

SetPullToRefresh(control, enabled)

Sets whether pull-to-refresh is enabled for the given scrollable control.

Parameter	Type	Description
control	ScrollableControl	The ScrollableControl (i.e. a Panel or FlowLayoutPanel) to extend.
enabled	Boolean	true to enable pull-to-refresh on control ; false to disable it.

The pull gesture is recognized only when control is scrolled to the top. If the control has not been created yet, it is registered on the client as soon as it is created. Handle the Refresh event to reload the content; the event's sender is the refreshed control.

Throws:

• ArgumentNullException control is null.

Example:

Enabling pull-to-refresh on a list panel:

this.pullToRefresh1.SetPullToRefresh(this.flowLayoutPanel1, true);
this.pullToRefresh1.Refresh += (s, e) => ReloadItems((FlowLayoutPanel)s);

Events

Refresh

EventHandler Fired when the user refreshes the component.

Implements

Name	Description
IUserData
IWisejComponent
IWisejSerializable