Skip to main content
VESDK/Android/Guides/User Interface
Language:

Customize Menu Items

VideoEditor SDK supports full control over the menu items used in the editor UI.

Create tools list#

By default, VideoEditor SDK automatically displays all the tools that are included in your license and are available on the runtime classpath.

Here, we first create a custom list of ToolItems that we want to be displayed in the video editor menu. Make sure to only include the tools that are included in your license.

Set tools list#

Here, we configure UiConfigMainMenu to set the custom tools list that we created above.

File:
class VideoCustomizeMenuItems(private val activity: AppCompatActivity) : Example(activity) {
override fun invoke() {
val tools = listOf(
ToolItem(
VideoCompositionToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.video_composition.R.string.vesdk_video_composition_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_video_composition)
),
ToolItem(
AudioOverlayOptionsToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.audio_composition.R.string.vesdk_audio_composition_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_audio)
),
ToolItem(
TransformToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.transform.R.string.pesdk_transform_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_transform)
),
ToolItem(
FilterToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.filter.R.string.pesdk_filter_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_filters)
),
ToolItem(
AdjustmentToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.adjustment.R.string.pesdk_adjustments_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_adjust)
),
ToolItem(
FocusToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.focus.R.string.pesdk_focus_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_focus)
),
ToolItem(
StickerToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.sticker.R.string.pesdk_sticker_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_sticker)
),
ToolItem(
TextToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.text.R.string.pesdk_text_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_text)
),
ToolItem(
TextDesignToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.text_design.R.string.pesdk_textDesign_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_text_design)
),
ToolItem(
OverlayToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.overlay.R.string.pesdk_overlay_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_overlay)
),
ToolItem(
FrameOptionToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.frame.R.string.pesdk_frame_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_frame)
),
ToolItem(
BrushToolPanel.TOOL_ID,
ly.img.android.pesdk.ui.brush.R.string.pesdk_brush_title_name,
ImageSource.create(ly.img.android.pesdk.ui.R.drawable.imgly_icon_tool_brush)
)
).sortedBy { it.name }
// In this example, we do not need access to the Uri(s) after the editor is closed
// so we pass false in the constructor
val settingsList = VideoEditorSettingsList(false)
// Set the source as the Uri of the video to be loaded
.configure<LoadSettings> {
it.source = activity.resourceUri(R.raw.skater)
}
.configure<UiConfigMainMenu> {
it.setToolList(ArrayList(tools))
}
// Start the video editor using VideoEditorBuilder
// The result will be obtained in onActivityResult() corresponding to EDITOR_REQUEST_CODE
VideoEditorBuilder(activity)
.setSettingsList(settingsList)
.startActivityForResult(activity, EDITOR_REQUEST_CODE)
// Release the SettingsList once done
settingsList.release()
}
override fun onActivityResult(requestCode: Int, resultCode: Int, intent: Intent?) {
super.onActivityResult(requestCode, resultCode, intent)
intent ?: return
if (requestCode == EDITOR_REQUEST_CODE) {
// Wrap the intent into an EditorSDKResult
val result = EditorSDKResult(intent)
when (result.resultStatus) {
EditorSDKResult.Status.CANCELED -> showMessage("Editor cancelled")
EditorSDKResult.Status.EXPORT_DONE -> showMessage("Result saved at ${result.resultUri}")
else -> {
}
}
}
}
}