Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Please limit one question/topic per post.
Please provide the following details depending on types of question

▼ For question regarding Editor, please provide:
- Live2D Software Version: (e.g. Cubism Editor 3.1.02, Euclid Editor 1.2.02)
- OS & Version: (e.g. Windows 10, macOS HighSierra)
- PC Model: (e.g. MacBookPro 2017)
- Graphics Specifications: (e.g. GeForce GTX 950M)
- Memory: (e.g. 8GB)
- Illustration Software used: (e.g. Photoshop, ClipStudio, SAI)
- Attach screenshot or capture video to show your problem:
---------------------------
▼ For question regarding SDK, please provide:
- For us to reproduce the issue you wish to inquire about, please provide either a minimum project file which has the issue. or specific instructions on how to reproduce the issue.
- Types and version of Cubism SDK you are using.
---------------------------
▼ For question regarding Cubism Software License,
For issues related to purchasing, your order, license key, and subscription, please contact us via contact form:
https://www.live2d.jp/eng/contact/

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

edited February 2016 in Help
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. >.<
Tagged:

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.