Live Wallpapers

Let's try doing some tabs.... We'll start with our basic app...

F:\work> mvn archetype:generate -DarchetypeCatalog=http://kallisti.eoti.org:8081/content/repositories/snapshots/archetype-catalog.xml

   
Choose the galatea-archetype plugin
groupId: org.eoti.android
artifactId: LiveWallpaperTest
version: 1.0-SNAPSHOT
package: org.eoti.android

Make sure the emulator is running...

F:\work> cd LiveWallpaperTest
F:\work\LiveWallpaperTest> mvn clean install

Rename your LiveWallpaperTestActivity to LiveWallpaperTestService and replace the contents:

public class LiveWallpaperTestService extends WallpaperService {
    private static String TAG = "LiveWallpaperTest";

    @Override
    public Engine onCreateEngine() {
        return new LiveWallpaperTestEngine();
    }

    class LiveWallpaperTestEngine
    extends WallpaperService.Engine
    {
        @Override
        public void onCreate(SurfaceHolder surfaceHolder) {
            super.onCreate(surfaceHolder);
        }
    }
}

Add yourself to src\main\android\res\values\strings.xml:

 <string name="author">Malachi de AElfweald</string>

Create a src\main\android\res\xml\wallpaper.xml:

<wallpaper xmlns:android="http://schemas.android.com/apk/res/android"
   android:author="@string/author"
   android:description="@string/app_name"
   android:thumbnail="@drawable/icon"
/>

In the AndroidManifest.xml, replace this bit:

<activity android:name=".LiveWallpaperTestActivity">
    <intent-filter>
        <action android:name="android.intent.action.MAIN"/>
        <category android:name="android.intent.category.LAUNCHER"/>
    </intent-filter>
</activity>
with this bit:
<service android:name=".LiveWallpaperTestService" android:permission="android.permission.BIND_WALLPAPER">
    <intent-filter>
    <action android:name="android.service.wallpaper.WallpaperService" />
    </intent-filter>
    <meta-data android:name="android.service.wallpaper" android:resource="@xml/wallpaper"/>
</service>

Redeploy (mvn clean install), click Menu and choose LiveWallpaper. Select your wallpaper and click "Set Wallpaper".

Ok, just a black background doesn't feel very live... let's liven it up just a little...

Replace the contents of your LiveWallpaperTestService:

public class LiveWallpaperTestService extends WallpaperService {
    private static String TAG = "LiveWallpaperTest";

    @Override
    public Engine onCreateEngine() {
        return new LiveWallpaperTestEngine();
    }

    class LiveWallpaperTestPainter
    extends Thread
    {
        private SurfaceHolder holder;
        private Rect frame;
        private boolean die = false;
        private MotionEvent event = null;
        private Paint cornsilk;
        private boolean visible = true;

        public LiveWallpaperTestPainter(SurfaceHolder holder)
        {
            this.holder = holder;
            frame = holder.getSurfaceFrame();
            cornsilk = new Paint(Paint.ANTI_ALIAS_FLAG);
            cornsilk.setColor(Color.rgb(255,248,220));
        }

        public void die()
        {
            this.die = true;
        }

        public void setVisible(boolean visible)
        {
            this.visible = visible;
        }

        public void setTouch(MotionEvent event)
        {
            this.event = event;
        }

        public void run()
        {
            Canvas canvas = null;
            while(!die)
            {
                if(!visible)
                {
                    try{Thread.sleep(500);}catch(Exception e){}
                    continue;
                }

                canvas = holder.lockCanvas();
                if(canvas != null)
                {
                    render(canvas);
                    holder.unlockCanvasAndPost(canvas);
                }
            }
        }

        protected void render(Canvas canvas)
        {
            if(event == null) return;
            canvas.drawColor(0xFF000000);
           
            canvas.drawLine(frame.left, frame.top, event.getX(), event.getY(), cornsilk);
            canvas.drawLine(frame.right, frame.top, event.getX(), event.getY(), cornsilk);
            canvas.drawLine(frame.left, frame.bottom, event.getX(), event.getY(), cornsilk);
            canvas.drawLine(frame.right, frame.bottom, event.getX(), event.getY(), cornsilk);
        }
    }

    class LiveWallpaperTestEngine
    extends WallpaperService.Engine
    {
        private LiveWallpaperTestPainter painter = null;

        @Override
        public void onCreate(SurfaceHolder surfaceHolder) {
            super.onCreate(surfaceHolder);
            this.setTouchEventsEnabled(true);
        }

        @Override
        public void onTouchEvent(MotionEvent event) {
            super.onTouchEvent(event);
            painter.setTouch(event);
        }

        @Override
        public void onSurfaceCreated(SurfaceHolder holder) {
            super.onSurfaceCreated(holder);
            painter = new LiveWallpaperTestPainter(holder);
            painter.start();
        }

        @Override
        public void onSurfaceDestroyed(SurfaceHolder holder) {
            if(painter != null) painter.die();
            super.onSurfaceDestroyed(holder);
        }

        @Override
        public void onVisibilityChanged(boolean visible) {
            super.onVisibilityChanged(visible);
            painter.setVisible(visible);
        }
    }
}

Redeploy (mvn clean install) and set your wallpaper.  Now, a "X" will mark where you last touched/clicked.

Customizing the Views

Let's start by creating a basic class:

F:\work> mvn archetype:generate -DarchetypeCatalog=http://kallisti.eoti.org:8081/content/repositories/snapshots/archetype-catalog.xml

Choose the galatea-archetype plugin
groupId: org.eoti.android
artifactId: CustomViewTest
version: 1.0-SNAPSHOT
package: org.eoti.android

Assuming your emulator is running...

F:\work> cd CustomViewTest
F:\work\CustomViewTest> mvn clean install

Create a new class.  In my case I created src\main\java\org\eoti\android\CustomTextView.java

public class CustomTextView
extends TextView
{
    public CustomTextView(Context context) {
        super(context);
    }

    public CustomTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public CustomTextView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        Paint cornsilk = new Paint(Paint.ANTI_ALIAS_FLAG);
        cornsilk.setColor(Color.rgb(255,248,220));

        canvas.drawLine(0, 0, this.getMeasuredWidth(), this.getMeasuredHeight(), cornsilk);
        canvas.drawLine(this.getMeasuredWidth(), 0, 0, this.getMeasuredHeight(), cornsilk);
       
        super.onDraw(canvas);
    }
}

Update src\main\android\res\layout\main.xml
Replace this line:

    <TextView 

with this line:

    <org.eoti.android.CustomTextView

Redeploy (mvn clean install) and run the app. You should see lines behind the text.