Preview Template

Update time : 2020-08-31 10:23:33

Preview Template

1. First of all, make sure you have a SXPlayerSurfaceView in your layout for preview.
2. Create an instance of SXTemplate by calling its contructor, pass template package file path and TemplateUsage.kForPreview as arguments.
3. Pass user asset files to SXTemplate instance by calling its setReplaceableFilePaths method.
4. (Optional) If you want to make some percise modification to your SXTemaplate instance, you need call its commit method first. Then you can accesss assets and layers by their UI Keys.
5. Get your SXPlayerSurfaceView instance from your layout, call its setTemplate method and pass your SXTemplate instance as argument, the method will return a SXTemplatePlayer object.
6. Once you have a SXTemplatePlayer instance, you can call its replaceAudio method to set background audio.
   By default, if you don\'t set any background audio file, realtime preview will use template\'s default audio file as background audio(if the template has a default music file exported).
7. Set a playback listener for SXTemplatePlayer instance by calling its setPlayCallback method.
8. Control the preview playback by calling start, seek, pause, stop methods of your SXTemplatePlayer instance.

Example code

String folder = \"path/to/your/template/folder\";//unzipped template folder path
String[] paths = {\"user/asset/file/1.png\", \"user/asset/file/2.png\", \"user/asset/file/3.png\"}; //user asset files, used to replace template\'s editable asset files
SXTemplate template = new SXTemplate(folder, SXTemplate.TemplateUsage.kForPreview);
template.setReplaceableFilePaths(paths);
template.commit();

SXPlayerSurfaceView playerView = findViewById(R.id.player_surface_view);
playerView.setPlayCallback(new SXTemplatePlayer.PlayStateListener() {
     @Override
     public void onProgressChanged(int frame) {
         // render updated, frame is current rendered frame index
     }

     @Override
     public void onFinish() {
         // realtime preview finished
     }
});

playerView.setTemplate(template);
SXTemplatePlayer player = playerView.getPlayer();
player.start();

Important Remarks

• To pause preview, you only need to call pause method.
• Be sure to call stop method in your activity\'s onDestory method to make sure preview is stopped when related activity in no longer in use.
• Is a good practice to resize user images to a smaller size, larger images can cause rendering slow down
• Every time you call setTemplate, a new player object will be returned. If you call setTemplate after calling setPlayCallback of SXPlayerSurfaceView, all the playCallback will automatically add to the new player object. playCallback only works for current player object.