Capacitor-native-pull-to-refresh NPM

capacitor-native-pull-to-refresh

Native pull to refresh plugin for capacitor

Install

npm install capacitor-native-pull-to-refresh
npx cap sync
import { PullToRefresh } from "capacitor-native-pull-to-refresh";

This plugin Is a WIP.

API

enable()

enable() => Promise<PullToRefreshResponse>

Enables the pull-to-refresh functionality.

Returns: Promise<PullToRefreshResponse>

disable()

disable() => Promise<PullToRefreshResponse>

Disables the pull-to-refresh functionality.

Returns: Promise<PullToRefreshResponse>

endRefreshing()

endRefreshing() => Promise<PullToRefreshStateResponse>

Ends the refreshing state initiated by pull-to-refresh.

Returns: Promise<PullToRefreshStateResponse>

setScrollPosition(...)

setScrollPosition(options: SetScrollPositionOptions) => void

Sets the scroll position of the webView.scrollView.

Optional to use, default behavior of UIRefreshControl() only works with the main scrollview, so a workaround is needed for additional scroll containers e.g. modals.

This function is specific to iOS. platform: iOS

Param	Type	Description
`options`	SetScrollPositionOptions	Configuration options for setting the scroll position.

manuallyTriggerRefreshingState(...)

manuallyTriggerRefreshingState(options: ManuallyTriggerRefreshingStateOptions) => void

Manually triggers the refreshing state.

This method can be used in conjunction with @setScrollPosition to manage the refreshing state based on custom logic.

Example:

const threshold = -100;

scrollContainer.addEventListener("scroll", async function () { if (scrollContainer.scrollTop < 0) { PullToRefresh.setScrollPosition({ scroll_position: scrollContainer.scrollTop, threshold: threshold }); } });

scrollContainer.addEventListener("touchend", async function () { if (scrollContainer.scrollTop <= threshold) { PullToRefresh.manuallyTriggerRefreshingState({ offset: -30 }); } });

PullToRefresh.addListener("state", function ({ refreshing }) { if (refreshing) { setTimeout(() => { PullToRefresh.endRefreshing(); }, 3000); } });

This function is specific to iOS. platform: iOS

Param	Type	Description
`options`	ManuallyTriggerRefreshingStateOptions	Configuration options when manually triggering refreshing state.

addListener('state', ...)

addListener(eventName: 'state', listenerFunc: (data: PullToRefreshStateResponse) => void) => Promise<PluginListenerHandle> & PluginListenerHandle

Adds a listener for the "state" event which is triggered when the pull-to-refresh state changes.

Param	Type	Description
`eventName`	'state'	The name of the event to listen for.
`listenerFunc`	(data: PullToRefreshStateResponse) => void	The function to be executed when the event is triggered.