Dear Users,

Now, we are seeking users who can give us a hand with expertise to evolve our software more dynamically.
If you are willing to help us, we’d like you to make a registration for “Live2D Creators Circle” via the link below.
Designers, programmers, translators are especially welcomed so far.
(More detailed explanation will be given to you before we ask you to do tasks)

https://docs.google.com/forms/d/1G5KK_GL3ozwPXtTHrpi_ktbsI8UZf8jlYRSlDworyBo/viewform?usp=send_form

How to set an image as the background in the Live Wallpaper on Android?

The Live Wallpaper example working great but it's always has a very sad black background. I've tried to set the background the same way as sampleApp1 (using setupBackground(context)) but in GLWallpaperService it won't load the background resource. >.<

Comments

  • Maybe, I think that it is the position of the background image is not be specified correctly .
    Please try the following .

    1) Copy from [sample/sampleApp1/src/jp/live2d/utils/android] to [liveWallpaper]
    2) Copy from [sample/sampleApp1/src/jp/live2d/sample/LAppDefine.java] to [liveWallpaper]
    3) Copy from [sample/sampleApp1/assets/image/back_class_normal.png] to [liveWallpaper]



    4) Fixed LiveWallpaperService.java(Fixed Points Add the Comment "Add Code")
    class MyEngine extends GLEngine {
    	Live2DRenderer renderer;
    
    	public MyEngine() {
    		super();
    		// handle prefs, other initialization
    		renderer = new Live2DRenderer(getApplicationContext());
    		setRenderer(renderer);
    		setRenderMode(RENDERMODE_CONTINUOUSLY);
    		// Add Code Start
    		FileManager.init(getApplicationContext());
    		// Add Code End
    	}
    
    5) Fixed Live2DRenderer.java(Fixed Points Add the Comment "Add Code")
    package jp.live2d.sample;
    
    import java.io.IOException;
    import java.io.InputStream;
    
    import jp.live2d.android.Live2DModelAndroid;
    import jp.live2d.android.UtOpenGL;
    import jp.live2d.framework.L2DPhysics;
    import jp.live2d.framework.L2DStandardID;
    import jp.live2d.framework.L2DTargetPoint;
    import jp.live2d.motion.Live2DMotion;
    import jp.live2d.motion.MotionQueueManager;
    import jp.live2d.utils.android.FileManager;
    import jp.live2d.utils.android.SimpleImage;
    import android.content.Context;
    import android.content.res.AssetManager;
    
    import javax.microedition.khronos.egl.EGLConfig;
    import javax.microedition.khronos.opengles.GL10;
    
    import net.rbgrn.android.glwallpaperservice.*;
    
    public class Live2DRenderer implements GLWallpaperService.Renderer
    {
    	Context con;
    
    	Live2DModelAndroid	live2DModel ;
    	Live2DMotion motion;
    	MotionQueueManager motionMgr;
    	L2DTargetPoint dragMgr;
    	L2DPhysics physics;
    
    	final String MODEL_PATH = "epsilon/Epsilon.moc" ;
    	final String TEXTURE_PATHS[] =
    		{
    			"epsilon/Epsilon.1024/texture_00.png" ,
    			"epsilon/Epsilon.1024/texture_01.png" ,
    			"epsilon/Epsilon.1024/texture_02.png"
    		} ;
    	final String MOTION_PATH="epsilon/motions/Epsilon_idle_01.mtn";
    	final String PHYSICS_PATH="epsilon/Epsilon.physics.json";
    
    	float glWidth=0;
    	float glHeight=0;
    
    	// Add Code Start
    	private SimpleImage bg;// BackGround Image
    	private float modelWidth = 0;
    	private float aspect = 0;
    	// Add Code End
    
    	public Live2DRenderer(Context context)
    	{
    		con = context;
    		dragMgr=new L2DTargetPoint();
    		motionMgr=new MotionQueueManager();
    	}
    
    	
    	public void onDrawFrame(GL10 gl) {
            // Your rendering code goes here
    		gl.glMatrixMode(GL10.GL_MODELVIEW ) ;
    		gl.glLoadIdentity() ;
    		gl.glClear( GL10.GL_COLOR_BUFFER_BIT ) ;
    		// Add Code Start
    		bg.draw(gl);	// background image draw
    		// Live2D model adjust
    		gl.glScalef(2.4f, 2.4f, 2.4f); // scale(x, y, z)
    		gl.glTranslatef(0.0f, -0.3f, 0.0f);	// position(x, y, z)
    		gl.glOrthof(0 ,	modelWidth , modelWidth / aspect , 0 , 0.5f , -0.5f ) ;
    		// Add Code End
    
    		live2DModel.loadParam();
    
    		if(motionMgr.isFinished())
    		{
    			motionMgr.startMotion(motion, false);
    		}
    		else
    		{
    			motionMgr.updateParam(live2DModel);
    		}
    
    		live2DModel.saveParam();
    
    		dragMgr.update();
    
    		float dragX=dragMgr.getX();
    		float dragY=dragMgr.getY();
    		live2DModel.addToParamFloat(L2DStandardID.PARAM_ANGLE_X, dragX*30);
    		live2DModel.addToParamFloat(L2DStandardID.PARAM_ANGLE_Y, dragY*30);
    		live2DModel.addToParamFloat(L2DStandardID.PARAM_BODY_ANGLE_X, dragX*10);
    
    		physics.updateParam(live2DModel);
    
    		live2DModel.setGL( gl ) ;
    
    		live2DModel.update() ;
    		live2DModel.draw() ;
    
        }
    
        public void onSurfaceChanged(GL10 gl, int width, int height) {
    		gl.glViewport( 0 , 0 , width , height ) ;
    
    		gl.glMatrixMode( GL10.GL_PROJECTION ) ;
    		gl.glLoadIdentity() ;
    
    		// Add Code Start
    		modelWidth = live2DModel.getCanvasWidth();
    		aspect = (float)width/height;
    //		gl.glOrthof(
    //				0 ,
    //				modelWidth ,
    //				modelWidth * height / width,
    //				0 ,
    //				0.5f ,	-0.5f
    //				) ;
    //		gl.glOrthof(0, modelWidth, modelWidth * height / width, 0, 0.5f, -0.5f);
    		// background image adjust
    		gl.glOrthof(-2.0f ,	2.0f , -2.0f ,2.0f , 0.5f , -0.5f ) ;
    		// Add Code End
    
    		glWidth=width;
    		glHeight=height;
        }
    
        public void onSurfaceCreated(GL10 gl, EGLConfig config)
        {
        	AssetManager mngr = con.getAssets();
    		try
    		{
    			InputStream in = mngr.open( MODEL_PATH ) ;
    			live2DModel = Live2DModelAndroid.loadModel( in ) ;
    			in.close() ;
    		}
    		catch (IOException e)
    		{
    			e.printStackTrace();
    		}
    
    		try
    		{
    			// Add Code Start
    			setupBackground(gl);
    			// Add Code End
    
    			//texture
    			for (int i = 0 ; i < TEXTURE_PATHS.length ; i++ )
    			{
    				InputStream in = mngr.open( TEXTURE_PATHS[i] ) ;
    				int texNo = UtOpenGL.loadTexture(gl , in , true ) ;
    				live2DModel.setTexture( i , texNo ) ;
    				in.close();
    			}
    		}
    		catch (IOException e)
    		{
    			e.printStackTrace();
    		}
    
    		try
    		{
    			InputStream in = mngr.open( MOTION_PATH ) ;
    			motion = Live2DMotion.loadMotion( in ) ;
    			in.close() ;
    
    			in=mngr.open(PHYSICS_PATH);
    			physics=L2DPhysics.load(in);
    			in.close();
    		}
    		catch (Exception e)
    		{
    			e.printStackTrace();
    		}
        }
    
        /**
         * Called when the engine is destroyed. Do any necessary clean up because
         * at this point your renderer instance is now done for.
         */
        public void release() {
        }
    
        public void resetDrag()
        {
        	dragMgr.set(0, 0);
        }
    
    
        public void drag(float x,float y)
        {
        	float screenX=x/glWidth*2-1;
        	float screenY=-y/glHeight*2+1;
    
    //    	Log.i("", "x:"+screenX+" y:"+screenY);
    
        	dragMgr.set(screenX,screenY);
        }
    
    	/*
    	 * BackGround Image Setting
    	 * @param context
    	 */
    	private void setupBackground(GL10 context) {
    		try {
    			InputStream in = FileManager.open(LAppDefine.BACK_IMAGE_NAME);
    			bg=new SimpleImage(context,in);
    			bg.setDrawRect(
    					LAppDefine.VIEW_LOGICAL_MAX_LEFT,
    					LAppDefine.VIEW_LOGICAL_MAX_RIGHT,
    					LAppDefine.VIEW_LOGICAL_MAX_BOTTOM,
    					LAppDefine.VIEW_LOGICAL_MAX_TOP);
    
    			// uv area
    			bg.setUVRect(0.0f,1.0f,0.0f,1.0f);
    		} catch (IOException e) {
    			e.printStackTrace();
    		}
    	}
    }
    


    You can change the background image if change of BACK_IMAGE_NAME of LAppDefine.java .
  • Hi naotaro. Thank you for your help ! It is now working just fine. It is truly fun when something you make can come to live :D
  • Hi all, especially perhaps Naotaro :D I wonder if there is a way to make the background also moves a bit? (I followed this code and the background stays), also.. just curious if "hit area" can also be implemented here as a live wallpaper?

    I am sorry if I post the question here, I just thought it is related very closely. :)
  • edited May 2016
    @Ronggowisnu

    Drawing point of the background is the following code .

    Live2DRenderer.java - onDrawFrame()
    gl.glScalef(2.4f, 2.4f, 2.4f); // scale(x, y, z)
    gl.glTranslatef(0.0f, -0.3f, 0.0f);	// position(x, y, z)
    gl.glOrthof(0 ,	modelWidth , modelWidth / aspect , 0 , 0.5f , -0.5f ) ;
    
    In other words , change the value of glTranslatef.

    I don't know about the hit area .
    I have never tried together with wallpaper .
  • @naotaro Hi! thx.. I think I already have this code, but have not tried to change the value in LAppDefine :D , I will try it as soon as possible :)

    Also... is there a way to reduce memory usage? seems that it's taking a lot of memory(ram?) quite huge :( . Is it because of *.mtn animation too long? or texture too much?
  • Hi @naotaro , fyi I changed the
    gl.glScalef(2.4f, 2.4f, 2.4f); // scale(x, y, z)
    gl.glTranslatef(0.0f, -0.3f, 0.0f); // position(x, y, z)
    gl.glOrthof(0 , modelWidth , modelWidth / aspect , 0 , 0.5f , -0.5f ) ;

    to :
    gl.glScalef(2.0f, 2.0f, 2.0f); // scale(x, y, z)
    gl.glTranslatef(0.0f, -0.1f, 0.0f); // position(x, y, z)
    gl.glOrthof(0 , modelWidth , modelWidth / aspect , 0 , 0.5f , -0.5f ) ;

    Because it is the size and position of my model :( i tried returning it to your original code but still doesn't work (background doesn't move)

    I am still tinkering though lol :smiley:
  • Hi, just wanted to share about memory usage, after looking around on some tutorial sites.

    on LiveWallpaperService.java
    I added :
    @Override public void onVisibilityChanged(boolean visible) { if (!visible) { renderer.motionMgr.stopAllMotions(); } else { renderer.motionMgr.startMotion(renderer.motion, false); } }
    Seems to reduce the memory usage significantly on my device. (though this might not be entirely correct . . but it works)
Sign In or Register to comment.