Visual editor (UI)

You can edit your app's user interface (UI) using the Leanplum Visual Editor in the dashboard. You only need to add com.leanplum:UIEditor as a dependency. It is activated by including the package in your build.gradle (module) file, without the need for calling any method.

You can edit your app's user interface (UI) and even create new Events using the Leanplum Visual Editor. To do so, you'll need to add the following dependency to your podfile (iOS) or build.gradle (Android).

//Add this to your pod file:
pod 'Leanplum-iOS-UIEditor'

//Also, be sure to include the package in your AppDelegate.
import LeanplumUIEditor

//Then, add a single line of code before [Leanplum start].
LeanplumUIEditor.shared().allowInterfaceEditing()

//Add this to your podfile:
pod 'Leanplum-iOS-UIEditor'

//Also, be sure to include the package in your AppDelegate.
#import <LeanplumUIEditor/LeanplumUIEditor.h>

//Then, add a single line of code before [Leanplum start].
[[LeanplumUIEditor sharedEditor] allowInterfaceEditing];

//Add this to your build.gradle's dependencies:
com.leanplum:UIEditor

//The final product should look something like this:
dependencies {

  ...
  compile 'com.leanplum:Leanplum:2.+'
  compile 'com.leanplum:UIEditor:2.+'
  ...

}

🚧

Older versions of our SDK (< 2.0.0) included the UI Editor in the Leanplum package. If you are using one of these versions, you need to call Leanplum.allowInterfaceEditing() before Leanplum.start() to activate the UI Editor.

Then, run your app in development mode, and click the UI tab in the Dashboard.

UI Editor

To create a new interface, click the New button.

1. Navigate and scroll to any screen in your app you would like to change
2. Click any element in the Editor to start editing.
3. Turn your device sideways to see landscape view.

Once you select an element, like a button, you can edit its properties on the right side of the Editor.

To create your interface, click Save & Exit.

This will load the saved interface to the UI Dashboard, where you can target the new interface to select users or A/B test it.

To publish the interface, click the circle next to your interface name and click Active.

Visual events

Create a new event

To create a new event, run your device in development mode. Then, from the Events tab in the Leanplum dashboard, click Create Visual Event.

1. Follow the instructions to select a view or element to attach an event.

2. Give your event a name and click Save & Exit.

View results for an event (visual events)

You can track the occurrences of this event in Analytics.

1. In the Analytics sidebar, click Developer Activity.
2. Under Daily Breakdown section, click the + tile to create a new metric.
3. Under Events, select the visual event you created and choose which metrics you wish to track.

4. To ensure your event tracking is working, run your app in developer mode and perform the event that you chose in step 4. You should see the value on your tile increase to 1.

📘

To track the metric on a release build, wait about 2 hours after creating your event, then create your event-based metric by following steps 2 and 3 in the "User Activity" tab of the Analytics sidebar.