Skip to main content

XYPad

Control the active cursor of a KSP ui_xy.

XYPad Screenshot

import { XYPad } from kontakt_controls

export var main = XYPad(
    control_id: "my_xy",
    label: "XY Pad",
)

Synopsis​

export component XYPad {
    @property control_id: String
    @property label: String
    @property step_count_x: Int? = nil
    @property fine_step_count_x: Int = 2
    @property sensitivity_x: Float = 1
    @property step_count_y: Int? = nil
    @property fine_step_count_y: Int = 2
    @property sensitivity_y: Float = 1
    @property value_to_string: XYValueFormatter = default_xy_value_formatter
    @property style: XYPadStyle = default_xy_pad_style
    @property disabled: Bool = false
}

Constructor​

control_id: String Required​

This is the name that you assigned to the corresponding KSP ui_xy control.

label: String Required​

The label to be displayed.

step_count_x: Int? = nil​

Determines the number of steps it takes from min to max.

Setting it to nil uses the finest resolution possible.

fine_step_count_x: Int = 2​

Further subdivides the steps when "shift" is pressed. Setting it to 1 means disables fine tuning.

If step_count_x is nil, this will reduce the sensitivity.

sensitivity_x: Float = 1​

Controls the sensitivity on the x-axis. When set to 1 one can move over the entire value range by moving from the left edge to the right edge.

step_count_y: Int? = nil​

Determines the number of steps it takes from min to max.

Setting it to nil uses the finest resolution possible.

fine_step_count_y: Int = 2​

Further subdivides the steps when "shift" is pressed. Setting it to 1 means disables fine tuning.

If step_count_y is nil, this will reduce the sensitivity.

sensitivity_y: Float = 1​

Controls the sensitivity on the y-axis. When set to 1 one can move over the entire value range by moving from the left edge to the right edge.

value_to_string: XYValueFormatter = default_xy_value_formatter​

Converts the x and y value to a string displayed in the label when the user interacts with the control.

By default it simply shows the raw KSP values rounded to two digits.

style: XYPadStyle = XYPadStyle()​

Customizes the appearance.

See XYPadStyle

disabled: Bool = false​

Disables the interaction with the control.

XYPadStyle​

Options to customize the appearance of the XYPad.

export class XYPadStyle {
    width: Float? = nil
    height: Float? = nil
    background_image: ImageAsset = default_xy_background_image
    handle_size: Float? = nil
    handle_image: ImageAsset = default_xy_handle_image
    inner_padding: EdgeInsets = EdgeInsets(3)
    label_style: LabelStyle = default_xy_pad_label_style
    disabled_opacity: Float = 0.24

    copy() -> (XYPadStyle)
    deep_copy() -> (XYPadStyle)
    overriding(_ modify: (XYPadStyle) -> ()) -> (XYPadStyle)
}

Properties​

width: Float? = nil​

The width of the control. If set to [nil] the image size will be used.

height: Float? = nil​

The height of the control. If set to [nil] the image size will be used.

background_image: ImageAsset = default_xy_background_image​

An image for the pad/background.

handle_size: Float? = nil​

The size of the handle (expected to have the same width/height). If set to [nil] the handle_image size will be used.

handle_image: ImageAsset = default_xy_handle_image​

An image for the handle.

inner_padding: EdgeInsets = EdgeInsets(3)​

Shrinks the interactive area to account for a border in the background_image.

label_style: LabelStyle = default_xy_pad_label_style​

Customizates the label appearance.

disabled_opacity: Float = 0.24​

The opacity to use when the control is disabled.

Methods​

copy() -> (XYPadStyle)​

Returns a shallow copy (nested reference objects aren't copied).

deep_copy() -> (XYPadStyle)​

Returns a deep copy (includes copies of inner_padding and label_style).

overriding(_ modify: (XYPadStyle) -> ()) -> (XYPadStyle)​

Returns a modified copy of the style. Modify the copy inside the modify funtion.

var modified = (XYPadStyle()).overriding(fun (style) {
    style.background_image = ImageAsset(path: "my_xy.png", width: 100, height: 100)
})