Creating an Android Jelly Bean Daydream from a WebView

-

One of the new nifty features on Android Jelly Bean 4.2 is the concept of daydreams (basically a screensaver but also displays when docked etc).  I wanted to create one that displayed an HTML page, which makes for prety easy development and this is how

First of all, this assumes you have API 17 (Android 4.2) installed, otherwise you won't have access to the relevant Android class

Android Daydream option


You need to create a new class that extends android.service.dreams.DreamService and override the onAttachedToWindow() method which is what is called when the service starts up.  In here all you really need to do is create a new WebView as normal and attach it.  Example code below

import android.annotation.TargetApi;
import android.service.dreams.DreamService;
import android.webkit.WebView;

@TargetApi(17)
public class MyDreamService extends DreamService {
  @Override
  public void onAttachedToWindow() {
    super.onAttachedToWindow();
    // Allow user touch
    setInteractive(true);
    // Hide system UI
    setFullscreen(true);
    // Set the dream layout
    WebView webView = new WebView(this);
    setContentView(webView);
    webView.loadUrl("file:///android_asset/www/test.html");
  }
}
The last line is loading my local HTML file but you could load any page here (remember to set the INTERNET permission for external pages though)

The service needs to be declared in the manifest, for example

<service
  android:name=".MyDreamService"
  android:exported="true"
  android:label="@string/short_app_name" >
  <intent-filter>
    <action android:name="android.service.dreams.DreamService" />
    <category android:name="android.intent.category.DEFAULT" />
  </intent-filter>
</service>
That is pretty much all you need to do! Install your app and try it! The dream setting are under Settings > Display > Daydream

There are various options you can set (eg I set the fullscreen option above) that are documented in the API here: http://developer.android.com/reference/android/service/dreams/DreamService.html

Not a very exciting screenshot but this is my html page displayed as a daydream in the 4.2 emulator
And there you have it, easy! Hope this helps someone

Comments

  1. Unknown22 November 2012 at 08:37

    Hi Antony, I am simply an artist, but am very interested in the possibility of creating my own custom Daydream animations, and possibly release them on the market.

    Is this still a simple feature that can't bee changed? Or can developers create for this feature?

    ReplyDelete
  2. Antony22 November 2012 at 09:24

    Hi
    I'm not quite sure what you're asking, but I'll attempt to answer and leave you to reply if I'm not answering what you asked

    The Daydream feature is something that would require you to develop and release an android app (albeit one containing only a Daydream if that's what you wanted). The same applies for live wallpapers, for example.

    A developer could certainly create custom daydreams, that's the idea. Ordinarily one would need to write the animation code and call the relevant view. What I'm attempting to do above is not code it in the Android API but code it in Javascript and display an HTML page which will run it (so far with limited success, but I'm working on it)

    Does that help at all?

    Antony

    ReplyDelete
  3. Unknown5 July 2013 at 09:59

    Have you tried loading a real web page through the web. I tried to open www.google.com and the day dream app throws an exception that startActivity() can't be called from outside an activity unless FLAG_ACTIVITY_NEW_TASK is used.

    I have no idea why a loadUrl on WebView would trigger a startActivity from a DaydreamService.

    ReplyDelete
  4. Antony7 July 2013 at 07:22

    I haven't tried it, but that sounds familiar. I think Android tried to load URLs in a new view if they don't seem to be related to the current view. Have you tried using WebViewClient?

    ReplyDelete

Post a Comment

Popular posts from this blog

Launch a website as a mobile app using PhoneGap/Apache Cordova

-
How to launch a website as a mobile app using PhoneGap/Apache Cordova I spent some time recently trying to find out how to launch my website as a mobile app.  The information was available around the internet but since it took me a while, I thought I'd collate it here in one simple post for anyone who wants to do the same I decided to use Apache Cordova since it gave me the framework for developing an HTML5 site as a mobile app already, meaning all I really needed to do was plug my website into it.  Their getting started guide has good information on how to create a Cordova project - I used Android but you can use whatever means you wish A basic Cordova app gives you a way to launch the app with an HTML page that you use to display your app contents.  The trick then is make the page load your website which you can do in one of 3 ways: 1. Package your site inside the app. This means it loads fast and without an internet connection.  The downside i...
Read more

How to manually add Cordova plugins to your app

-
I have recently been trying to add a plugin to an existing Cordova app (using Cordova 3.7.0).  Since I didn't create my app using the CLI I had 2 options: Create a new app using the CLI and copy my source files over Add the plugin files to my existing app For some reason I don't really like the idea of the CLI and wanted to do do this manually into an existing Android app, using Cordova, rather than use the CLI.  Don't ask me why, I just like doing things manually so I know what's going on under-the-hood I guess If you are like me and want to add a plugin manually, this is how to do it.  These instructions, though written for Android, will work for any any supported platform.  I will call out any differences between platforms that I know of Get the plugin source files You need the source code files for your platform (so .java for Android, .m .h for iPhone etc) as well as the plugin javascript files.  You might be able to get the source files from ...
Read more

Android Live Wallpaper using Processing in Android Studio

-
We've recently wanted to create an Android Live Wallpaper using Processing, which is an ideal language for writing these as it makes it easy to create exciting animations using a Java-like language As it turns out, creating a live wallpaper from some existing Processing code is surprisingly simple You can, of course, do this using the Processing environment as shown in the tutorial over on processing.org . This covers the basics but we wanted to incorporate this into our Android Studio app which took a few extra steps Step 1 - Create a Processing sketch in your Android app If you don't already have a Processing sketch, now's the time to write one! If you've written this using the Processing environment, you'll need to create a new class that extends processing.core.PApplet and import the processing-android library, similarly to the processing.org tutorial on creating a processing app in Android Studio import processing.core.PApplet; public class YourSke...
Read more