CapacitorJS 2024: is there a way to add widgets for apps?

[folsze]

is there a way to add widgets for apps, in a cross-platform manner? Or at least for just ios/ just android?

What would be the procedure here? Could I hardcode some native code in the native project version which asks at a specific time to add a widget?

Or do i need to build a plugin to achieve this?

Maybe someone can tell me how hard writing a plugin is, or even just the native code. I am wondering

[folsze]

SOLUTION:
just use native code. It’s not a lot of work!

Will App Clips be available in Ionic

Following up on this, our understanding is that App Clips can run Web Views, so they could run Capacitor apps, in theory. Sounds like the size limit could be an issue, but we are going to be doing more testing to figure out what’s possible here. Any community examples of App Clips running Capacitor apps would be hugely helpful. In contrast, Widgets do not support web views, and will need to be built natively. It seems possible you could build an abstraction over those widgets to power them thro…

[tetsuwanadam]

You’ll need to create the widget itself in native code but you’ll also likely need to use Capacitor to set the data used by the widget as well as to trigger a widget refresh anytime you update it.

I used this plugin for iOS and it worked nicely. For Android I had to use custom code and it was more complicated, but that’s partially because I used an Android ListView in the widget.

GitHub - 0xn33t/capacitor-widgetsbridge-plugin

There is also this Capacitor plugin that supports iOS and Android but I haven’t tried it.

GitHub - alesmraz/capacitor-native-widgets: Example implementation of native Android and iOS...

[iconio]

Hey @tetsuwanadam do you have some tips to share on the implementation of the Android you did?

Thanks bud

[tetsuwanadam]

It’s been several months since I made it so I’m rusty on the exact details but basically…

• Create the widget itself in native Android code, and get the data to display from SharedPreferences.
• In the Ionic app, use the @capacitor/preferences plugin to update the data in SharedPreferences as needed. Then use the capacitor-android-intents plugin’s ‘sendBroadcastIntent’ function when you need to trigger a widget update
• In the Android native app’s MainActivity.java, add a BroadcastReceiver the refreshes the widget when it receives the BroadcastIntent mentioned above.

public class MainActivity extends BridgeActivity {
	private BroadcastReceiver broadcastReceiver;

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		IntentFilter intentFilter = new IntentFilter();
		intentFilter.addAction("com.myDomain.myApp.ACTION_REFRESH_WIDGET");
		broadcastReceiver = new BroadcastReceiver() {
			@Override
			public void onReceive(Context context, Intent intent) {
				// If the BroadcastIntent matches the one for refreshing the app's widgets then refresh
				if ("com.myDomain.myApp.ACTION_REFRESH_WIDGET".equals(intent.getAction())) {
					Log.d("MainActivity", "BroadcastIntent for widget refresh received. Intent is: " + String.valueOf(intent));

					// Code to refresh widget
				}
			}
		};
		registerReceiver(broadcastReceiver, intentFilter);
	}

	@Override
	public void onDestroy() {
		super.onDestroy();
		unregisterReceiver(broadcastReceiver);
	}

	// Other MainActivity code…
}

Honestly I found it all pretty complicated and it took a long time to implement. I would take a good look at the second Capacitor plugin I mentioned in the previous post and see what it can do for you.

[iconio]

Thank you so much for replying so quickly!
I looked into it but I couldn’t find any instructions or explanation on the implementation.

But you my friend, gave some something to work with, thaaaaank you so much.