How to `reRender widgets`.
abdul-wajid-afridi opened this issue · comments
as the docs says its regular js file so can we use hooks such as useState
and useEffect
for reRendering and using states if not so whats alternate way of states and reRendering of widgets i am using a count down timer widget
which decrease seconds and minutes every seconds
export async function widgetTaskHandler(props: WidgetTaskHandlerProps) {
const widgetInfo = props.widgetInfo;
const Widget =
nameToWidget[widgetInfo.widgetName as keyof typeof nameToWidget];
switch (props.widgetAction) {
case 'WIDGET_ADDED':
props.renderWidget();
break;
case 'WIDGET_UPDATE':
props.renderWidget(<Widget />);
break;
case 'WIDGET_RESIZED':
props.renderWidget(<Widget />);
break;
case 'WIDGET_DELETED':
// Handle widget deleted (remove widget data if you stored it somewhere)
break;
case 'WIDGET_CLICK':
if (props.clickAction === 'play') {
props.renderWidget(<Widget status="playing" />);
} else {
props.renderWidget(<Widget status="stopped" />);
}
break;
default:
break;
}
}
The docs say that we cannot use hooks. See https://saleksovski.github.io/react-native-android-widget/docs/tutorial/widget-design
In order to keep state between renders you can use AsyncStorage (see the Counter widget in the examples).
In order to update the widget read https://saleksovski.github.io/react-native-android-widget/docs/update-widget
This library cannot handle fast updates of the widget due to Android limitations (update can be requested only on ~30 minute intervals).
More details about updatePeriodMillis on the official documentation.