Skip to main content
Language

Configure Snapping

PhotoEditor SDK supports several configuration options to customize the snapping behavior for all sprites in the editor.

In this example, the editor's snapping behavior is configured to act as a guide for the user to see where the sprites should be placed. A use case could be that an application displays the photos both in rectangular as well as in circular shapes which requires the editor to indicate in which area the sprites' visibility is best.

Rotation snapping#

By default, the snapping is enabled when rotating a sprite. In this example, this behavior is disabled since only the outer positional snapping guides are needed.

Vertical center line snapping#

If set to true (by default) the center of the sprite snaps to a vertical line indicating the center of the photo. In this example, this behavior is disabled since only the outer positional snapping guides are needed.

Horizontal center line snapping#

If set to true (by default) By default, the center of the sprite snaps to a horizontal line indicating the center of the photo. In this example, this behavior is disabled since only the outer positional snapping guides are needed.

Outer positional snapping#

Sprites snap to the border of the photo along horizontal and vertical lines. By default, these lines are placed at a distance of 5% of the smaller side of the photo from the border (corresponding to 0.05). In this example, we want to increase this distance to 10% to define the visibility of the photo.

class PhotoSnappingConfiguration(private val activity: AppCompatActivity) : Example(activity) {
override fun invoke() {
// 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 = PhotoEditorSettingsList(false)
// Set the source as the Uri of the image to be loaded
.configure<LoadSettings> {
it.source = activity.resourceUri(R.drawable.la)
}
// By default, the snapping is enabled when rotating at multiples of 45° - [0f, 45f, 90f, 135f, 180f, 225f, 270f, 315f, 360f]
// For this example this behavior is disabled (by providing an empty array of angles) since only the outer positional snapping guides are needed
val emptyArray = floatArrayOf()
TextGlLayer.SORTED_ROTATION_SNAP_POINTS = emptyArray
StickerGlLayer.SORTED_ROTATION_SNAP_POINTS = emptyArray
TextDesignGlLayer.SORTED_ROTATION_SNAP_POINTS = emptyArray
// By default the center of the sprite snaps to a vertical line indicating the center of the image
// For this example this behavior is disabled since only the outer positional snapping guides are needed
TextGlLayer.SNAP_TO_VERTICAL_CENTER = false
StickerGlLayer.SNAP_TO_VERTICAL_CENTER = false
TextDesignGlLayer.SNAP_TO_VERTICAL_CENTER = false
// By default the center of the sprite snaps to a horizontal line indicating the center of the image
// For this example this behavior is disabled since only the outer positional snapping guides are needed
TextGlLayer.SNAP_TO_HORIZONTAL_CENTER = false
StickerGlLayer.SNAP_TO_HORIZONTAL_CENTER = false
TextDesignGlLayer.SNAP_TO_HORIZONTAL_CENTER = false
// By default the sprite snaps to the border of the photo along horizontal and vertical lines
// This value is measured in normalized coordinates relative to the smaller side of the edited image and defaults to 5% (0.05)
// For this example the value is set to 10% (0.1) to define the visibility area of the image.
TextGlLayer.apply {
SNAP_PADDING_TOP = 0.1f
SNAP_PADDING_LEFT = 0.1f
SNAP_PADDING_RIGHT = 0.1f
SNAP_PADDING_BOTTOM = 0.1f
}
StickerGlLayer.apply {
SNAP_PADDING_TOP = 0.1f
SNAP_PADDING_LEFT = 0.1f
SNAP_PADDING_RIGHT = 0.1f
SNAP_PADDING_BOTTOM = 0.1f
}
TextDesignGlLayer.apply {
SNAP_PADDING_TOP = 0.1f
SNAP_PADDING_LEFT = 0.1f
SNAP_PADDING_RIGHT = 0.1f
SNAP_PADDING_BOTTOM = 0.1f
}
// Start the photo editor using PhotoEditorBuilder
// The result will be obtained in onActivityResult() corresponding to EDITOR_REQUEST_CODE
PhotoEditorBuilder(activity)
.setSettingsList(settingsList)
.startActivityForResult(activity, EDITOR_REQUEST_CODE)
// Release the SettingsList once done
settingsList.release()
}
override fun onActivityResult(requestCode: Int, resultCode: Int, intent: 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 -> {
}
}
}
resetDefaultValues()
}
// All the snapping related configuration are stored in static variables
// We do not want the values set in this example to affect other examples in this app so we reset the configuration to their defaults
private fun resetDefaultValues() {
TextGlLayer.SORTED_ROTATION_SNAP_POINTS = TextGlLayer.SORTED_ROTATION_SNAP_POINTS_45
StickerGlLayer.SORTED_ROTATION_SNAP_POINTS = StickerGlLayer.SORTED_ROTATION_SNAP_POINTS_45
TextDesignGlLayer.SORTED_ROTATION_SNAP_POINTS = TextDesignGlLayer.SORTED_ROTATION_SNAP_POINTS_45
TextGlLayer.SNAP_TO_VERTICAL_CENTER = true
StickerGlLayer.SNAP_TO_VERTICAL_CENTER = true
TextDesignGlLayer.SNAP_TO_VERTICAL_CENTER = true
TextGlLayer.SNAP_TO_HORIZONTAL_CENTER = true
StickerGlLayer.SNAP_TO_HORIZONTAL_CENTER = true
TextDesignGlLayer.SNAP_TO_HORIZONTAL_CENTER = true
TextGlLayer.apply {
SNAP_PADDING_TOP = 0.05f
SNAP_PADDING_LEFT = 0.05f
SNAP_PADDING_RIGHT = 0.05f
SNAP_PADDING_BOTTOM = 0.05f
}
StickerGlLayer.apply {
SNAP_PADDING_TOP = 0.05f
SNAP_PADDING_LEFT = 0.05f
SNAP_PADDING_RIGHT = 0.05f
SNAP_PADDING_BOTTOM = 0.05f
}
TextDesignGlLayer.apply {
SNAP_PADDING_TOP = 0.05f
SNAP_PADDING_LEFT = 0.05f
SNAP_PADDING_RIGHT = 0.05f
SNAP_PADDING_BOTTOM = 0.05f
}
}
}