Home Sceren Widgets
- 24 May 2024
- 4 Minutes to read
- Contributors
- Print
- DarkLight
Home Sceren Widgets
- Updated on 24 May 2024
- 4 Minutes to read
- Contributors
- Print
- DarkLight
Article summary
Did you find this summary helpful?
Thank you for your feedback
A Vuzix Blade home screen / launcher widget is a standard android app widget with a simple hook into the BladeOS Launcher.
Since the BladeOS launcher is a customized Home screen it has some capabilities that other Launchers don't.
The Home Screen widgets, when using the BladeOS features and hooks, can automatically be added and started. It can also use the BladeOS Dynamic Theming features and take advantage of other BladeOS features too.
Let's add a Widget to our Sample Project.
Create Home Screen Widget
Click File > New > Widget > App Widget in Android Studio to create a new app widget.
Name the widget. In the example application, the app widget is named WidgetProvider.
You will need to provide:
Class Name = this will be the name of your widget and its resources.
All other fields can be left to the default value as is.
Android Studio will generate the necessary files for the app widget.
The new WidgetProvider app widget will be registered in the AndroidManifest.xml file.
To tell the Vuzix Blade system to display the WidgetProvder app widget in the Home screen when the example application is selected, register the example application’s MainActivity with the launch widget itself.
To add this hook make sure you put the below code inside the widget receiver section on the AndroidManifest.
Make sure you provide the full package path to the class to prevent errors due to simplified values like the .ClassName.
See line 29 in the screen below.
Java
<meta-data android:name="com.vuzix.launcher.widget"
android:value="devkit.blade.vuzix.com.bladesampleapp.MainActivity"
/>
You should be able to run your App, navigate to Home, swipe to update the launcher and see how the Launcher changes to the example layout that the wizard created.
Code Simplifications
Our BladeOS allows for certain simplifications of the Widget provider xml file(res/xml/).
The *_widget_info.xml file gets generated when the app widget is created. This file defines the widget properties to the BladeOS.
The files defines values like Initial Layout to load, how frequently the widget should be updated, previewImage, minimum Height & Width and others. Since the BladeOS is a custom Home Launcher, we will not use some of these values. The system will ignore them if they are provided. But for simplification, you can safely remove all with the exception of the ones below.
One value that we modify is how frequently the widget should be updated. This is controlled with the updatePeriodMillis attribute. Please refer to the app widget documentation for more detailed information. However, a value of 0 as in the example, allows the widget provider to update the widget as frequently as it chooses. The android platform limits automatic updates of app widgets to every 30 minutes or longer.
Java
<appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
android:initialLayout="@layout/sample_widget"
android:updatePeriodMillis="0
/>
simplification of widget info file
Add Dynamic Theming to your Widget
Now we are going to take advantage of the BladeOS Dynamic Theming Signals to update the widget.
First we will create two layouts for Light mode and Dark mode. To create those add them to the layout folder under res. Add widget_light.xml and widget_dark.xml
Provide the File name and Root Element if needed. Usually it is used as a Parent to the RelativeLayout to allow us to provide more detailed information on where an object is drawn in reference to the screen and other objects.
Open each and modify the following items:
On the Main Parent RelativeLayout, set the Style to be HUD define styles.
Change the background for the main parent to be transparent for dark mode and light_gray for bright/light mode
Add TextView with an appropriated message for light or dark.
Center the TextView in the Center of the Layout for us to see.
Change the Text style to "HudTheme.TextView" dark mode and "HudTheme.Light.TextView" for bright/light mode.
For simplicity, we will only add the code and the image for light mode.
Java
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
style="@style/HudTheme.Light"
android:background="@color/hud_light_gray
>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
style="@style/HudTheme.Light.TextView"
android:text="Example of Widget in Bright/Light mode"
/>
</RelativeLayout>
Widget Sample Light layout
Modify the AppWidgetProvider (sample_widget.java) to allow it to properly select and update the theme.
The changes are:
Modify the updateAppWidget method, call a new method called isLightMOde to get the BladeOS DynamicTheme mode.
Based on the return mode, select a new RemoteView and pass that value back to the AppWidgetManager to update.
Override the onReceive Method to ensure we catch the "ACTION_APPWIDGET_UPDATE" we will send later.
Ensure that the onUpdate only sends the first appWidgetID since the BladeOS will only send one id.
For simplicity, remove the onEnabled and onDisabled methods that were automatically generated.
Java
public class sample_widget extends AppWidgetProvider {
static void updateAppWidget(Context context, AppWidgetManager appWidgetManager, int appWidgetId) {
boolean isLightMode = isLightMode(context);
if(appWidgetManager == null) {
appWidgetManager = (AppWidgetManager)context.getSystemService(Context.APPWIDGET_SERVICE);
appWidgetId = appWidgetManager.getAppWidgetIds(new ComponentName(context, sample_widget.class))[0];
}
RemoteViews views = new RemoteViews(context.getPackageName(), isLightMode ? R.layout.widget_light: R.layout.widget_dark);
appWidgetManager.updateAppWidget(appWidgetId,views);
}
@Override public void onReceive(Context context, Intent intent) {
super.onReceive(context, intent);
updateAppWidget(context,null,0);
}
@Override public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) {
// There may be multiple widgets active, so update all of them
updateAppWidget(context, appWidgetManager, appWidgetIds[0]);
}
private static boolean isLightMode(Context context) {
return ((BladeSampleApplication)context.getApplicationContext()).isLightMode();
}
}
Widget Update on BladeOS Dynamic Theme change Broadcast
Using our previously created Dynamic Theme Broadcast Receiver we can tell the widget to update its Theme based on this new information.
In order to do this we simply Open the dynamic_theme_receiver.java file and modify it to send out a Widget update request.
To do that we will add the following code:
Create a new intent.
Set the intent action.
Send that new intent as a broadcast.
Java
Intent updateIntent = new Intent();
updateIntent.setAction(AppWidgetManager.ACTION_APPWIDGET_UPDATE);
context.sendBroadcast(updateIntent);
Now run your application by changing the light environment (increase or decrease ambient light) to see how the widget updates on the Main Launcher area.
For the final part of this Tutorial, we will utilize the BladeOS Application Icon Tint Feature to automatically apply a more visible color schema to your Application Icon on the launcher. Note that this is optional and follow this only if you do want this feature. If you don't want or need Icon Tint or you are doing your own custom one, feel free to skip this.
Was this article helpful?
