0.11.5

Features

Improved Sliders

Animations

AbstractSliderBehavior and AbstractRangeSliderBehavior now support handle movement animations through new animateHandleMove parameters. The provided animation controls the way handles travel to their new value. These animations do not affect the underlying value of the slider though; it is set instantly still.

These base classes also provide new APIs to indicate when the pointer has pressed or released in a way that causes the handles to adjust.

New marks system

Sliders can now have an arbitrary set of marks that denote specific values. This is an expansion of the previous ticks property, which only supported a uniformly spaced set of values. Marks are added to a Slider (or other variants) using a Marker. Markers define the set of marks and determine which mark is closest to a given value. These APIs are used to provide a set of mark values and in handling snapping behavior.

Snapping has been overhauled as well to make it more flexible. Sliders now take a SnappingPolicy that controls when to snap to the closest mark. This provides a lot of control over snap sensitivity or even selectiveness about which marks can snap.

There are also methods for specifying marks and snapping behavior using a list of values.

New handle bounding-box APIs

Slider and RangeSlider now expose the bounds of their handles. This is useful when trying to place popups to show the current value. These popups are even easier to do now b/c PopupManager's show method now lets you provide a Rectangle relative to the View you are anchoring to--instead of assuming it should be that View's bounds.

Animations using cubic-beziers

Animation easings are simply functions that map a "time" value in the range [0,1] to an output in the same range. This means you could already create any arbitrary easing and even use cubic-beziers to do this. But the latter is non-trivial, so there is now a built-in way to directly use cubic-beziers.

The new cubicBezier function returns an EasingFunction, so it works with all the existing animation APIs. The following lets you play with various curves to see how the affect the animation.

New Accordion control

The Accordion lets you show content in a set of sections that can each be collapsed or expanded individually. Each section rendered using an ItemVisualizer that generates the header View and a separate visualizer that renders the content for the section.

This control is strongly typed, which means it can hold a uniformed type of data. This data can be provided during construction of the accordion, but it is also dynamic and changeable afterward.

This control is intended to be very flexible like TabbedPanel, so it provides a less restrictive API and delegates a lot of decision-making to AccordionBehavior. The basicAccordionBehavior provides a simple implementation with some customization to get started.

Squircles and smooth corners

New smooth and squircle for creating smoothed corners on Rectangles that make it easy to achieve the "squircle" shape.

More flexible popup placement

• New API in PopupManager that allows positioning a popup relative to a Rectangle within the coordinates of a View

APIs

• ValueSlider now uses a new Marker API to define where marks (previously ticks) are placed on it.
• ValueSlider now uses a new SnappingPolicy API to define how it snaps to marks.
• ValueSlider now has markerChanged and snappingPolicyChanged events for subclasses to notify of these changes.
• New utilities for creating various Marker and SnappingPolicy values.
• New extension to mark a ValueSlider using an Iterable.
• New BasicAccordionBehavior
• New AnimatableTreeRowIcon to expand capability for basic tree and accordion behaviors
• New ItemVisualizer<String, C>.invoke method to visualize a value as a String.
• New Color.grayScale extension property to replace Color.grayScale() extension method.
• New ColorPaint.inverted property to create a new paint based on the inverted color.
• New ColorPaint.grayScale extension property to replace ColorPaint.grayScale() extension method.
• New Photo.aspectRatio property
• New Renderer.horizontalLine and Renderer.verticalLine methods.
• New extensions to create a Stroke from a Color and Paint.
• BasicSwitchBehavior now takes a lambda that allows control of transition animation.
• BasicSelectBoxBehavior and BasicMutableSelectBoxBehavior now has color mappers for list and button hovers
• Object versions of several ItemVisualizers to make them easier to use. The constructor forms of some are now deprecated.
• New Rectangle.smooth extension that creates a superellipse path from a rectangle.
• New Slider.handleRectangle property that gives the current bounds of the handle/knob.
• BasicCircularSliderBehavior new showTicks and startAngle constructor params
• BasicCircularRangeSliderBehavior new showTicks and startAngle constructor params
• nativeSliderBehavior (Web) now supports ticks, enabled via showTicks parameter
• New APIs in AbstractSliderBehavior and AbstractRangeSliderBehavior to indicate when a slider's handles are "pressed" and "released".
• New RangeSlider.handleRectangle property that gives the current bounds of the handle/knob.
• SliderBehavior now has handleBounds method
• RangeSliderBehavior now has startHandleBounds and endHandleBounds methods
• AbstractSliderBehavior now supports animation of value changes through animateHandleMove constructor parameter
• AbstractRangeSliderBehavior now supports animation of value changes through animateHandleMove constructor parameter
• AbstractCircularSliderBehavior.startAngle for subclasses
• AbstractCircularRangeSliderBehavior.startAngle for subclasses
• Photo now allows a radius to be specified to round its corners.
• LabelBehavior now has a measureText method that takes an assumed width that should be used instead of the label's current width
• New native behaviors for Label that use the system default font
• Color.darker, Color.lighter, HslColor.darker and HslColor.lighter are now infix.
• New HslColor.opacity extension to get a new color with the specified opacity
• New HsvColor.lightness extension

Fixes | Improvements

• General

  • Issue where BasicSliderBehavior still showing ticks when showTicks == null
  • Slider and RangeSlider now delegate calls to contains to their behavior instead of checking super first.
  • Issue where Label did not return an updated preferredSize with wrapsWords enabled
  • Updated SliderTests to validate new marker functionality
  • New RangeSliderTests to validate new marker functionality

• Docs

  • Added basic docs for GenericTextEditOperation
  • Fixed docs for KeyValueTable

Versions

• Measured -> 0.4.2

0.11.4

Fixes | Improvements

• [Fix] Edge case in ScrollPanel where layout might be skipped

0.11.3

APIs

• Size.aspectRatio
• Rectangle.aspectRatio

Fixes | Improvements

• General

  • Resizer now handles aspect-preserving sizeAuditor better

• Browser

  • Wrapped text height caching not factoring in line height

0.11.2

Features

APIs

• ColorPaint now exposes convenience APIs that match those for manipulating Color: opacity, lighter(...), darker(...) and grayScale().

Fixes | Improvements

• General

  • Label size does not incorporate letterSpacing or wordSpacing
  • Reducing chance of invalid constraints remaining active after a solver error.
  • ScrollPanel preferredSize not updating when content changes.
  • Edge case where current size provided to Layout.preferredSize was not clipped to a View's min/max allowed values.

• Browser

  • Caching bug in TextMetrics. Fixes #63
  • Newline support for svg based text. Fixes #64
  • Incorrect width calculation for text with newlines

Build

• Using nmcp for maven publishing

Versions

• Gradle -> 8.14.2

0.11.1

APIs

• General
  • Renamed View.displayChange and View.parentChange to match existing convention

Fixes | Improvements

• General

  • Some Carousel presenters not properly resolving a View's idealSize during layout
  • LinearPresenter incorrectly resolving item bounds in some cases
  • Issue where layout could be skipped for a View that regained visibility

• Desktop

  • Removed skiko.vsync.enabled flag
  • Bugs in View render ordering

0.11.0

Features

New Layout Paradigm

A View's bounds is no longer editable directly as it was in previous versions of Doodle. This is a major change to the way Doodle layout functions; but it is important to avoid some major pitfalls of the previous approach. Namely, it was very easy to write code that would not produce the expected layout. This is a good example of something that would cause issues before:

Doodle 0.10.x

view {
    + Label("Hello") // Label fits its text by default
  
    layout = constrain(children.first(), fill) // ❌ Label would ignore layout
}

Doodle 0.11.0

view {
    + Label("Hello") // Label fits its text by default
  
    layout = constrain(children.first(), fill) // ✅ works as expected
}

Now it just works as expected since View's cannot override the Layout they are managed by.

More specifically, a View is given a min and max size it can take by its parent's Layout. It then picks a size it would like to take in that range and reports back to the Layout, which uses that information to position/size it and the other Views it manages.

This means you cannot directly change a View's bounds like before. However, you can still suggest changes that the View may use to determine its final size.

This means code like this no longer works, and cannot be directly converted to the new suggestion system. That's because bounds suggestions are not guaranteed in the way a normal setter would be.

Doodle 0.10.x

val view1 = view {}.apply { size = Size(10, 50) }
val view2 = view {}.apply { size = view1.size   } // view2.size == Size(10, 50)

Doodle 0.11.0

val view1 = view {}.apply { suggestSize(10, 50) }
val view2 = view {}.apply { size = view1.size   } // view2.size == Size.Empty since suggestion usually async

Frosted Glass Paint

New Paint that lets you create glass like material that blurs the underlying content. This, like all paints, can be used to fill any shape, stroke, or text.

rect(
    rectangle = bounds.atOrigin.inset(borderThickness / 2),
    radius    = cardRadius,
    fill      = FrostedGlassPaint(Color(0x09008bu) opacity 0.2f, blurRadius = 10.0)
)

Text Outlining

You can now outline text using Strokes like other shapes. This includes StyledText, which now supports strokes for styled segments.

render = {
    text(
        text   = "Hello Doodle!",
        at     = Origin,
        fill   = Transparent.paint,
        stroke = Stroke()
    )
}

val stroke = Stroke()

render = {
    text(
        text = "Hello " .. stroke { "Doodle!" },
        at   = Origin,
    )
}

Inline Constraints for Forms

Forms have <api.Layout/>s that you can specify explicitly. But now you can also define constraint-based layouts declaratively when defining a Form.

Form { this (
    "Bob" to labeled("Name" ) { textField (                                  ) },
    21    to labeled("Age"  ) { spinButton(1..120                            ) },
    Green to labeled("Color") { colorStrip(Red, Green, Blue, BlueColor, Black) },

    layout = { name, age, color ->
        name.top      eq parent.insets.top
        name.left     eq parent.insets.left
        name.right    eq age.left - 12 strength Strong
        name.height   eq name.idealHeight

        age.top       eq name.top
        age.width     eq 80
        age.right     eq parent.right - parent.insets.right
        age.height    eq age.idealHeight

        color.left    eq name.top
        color.top     eq name.bottom + 12
        color.right   eq age.right strength Strong
        color.height  eq color.preferredSize(
            min = Empty,
            max = Size(parent.width.readOnly, POSITIVE_INFINITY)
        ).height

        parent.bottom eq color.bottom + parent.insets.bottom
    },

    onInvalid = {}

) { name: String, color: Int, age: Color ->
    // ...
} }

APIs

• General
  • ScrollPanelVisualizer now takes a config that lets you modify the resulting panel
  • ScrollPanel's contentWidthConstraints and contentHeightConstraints now provide IdealSizedProperty values, which have an idealValue field. This lets you constrain the property using its ideal value.
  • Layout now has preferredSize method, which returns the preferred size for the set of Views given the current context.
  • lerp for HsvColor
  • parent insets now available within constraint blocks
  • underline and lineThrough helpers for creating TextDecorations
  • New Encoder utility types for Strings
  • New methods for scrolling a View horizontally and vertically
  • New infix strength method for constraint DSL (removed rangeTo operator option)
  • Removed Label.fitText
  • Paths can now be created by "extending" an existing one. This produces a builder based on the given path
  • PathBuilder has a new method to append a Path
  • CarouselItem now has a displayIndex property which indicates the item's display order relative to nearestItem.
  • New MonthPanel.showMaxRows property that controls whether all 6 potential rows are shown for the panel.
  • TreeBehavior.RowPositioner now gets tree bounds info as an input for rowBounds and contentBounds
  • New Theme.selected and Theme.deselected events to indicate when a Theme has been selected/deselected.
  • MenuBehavior.SubMenuConfig now allows configuration of the menu's anchor point, insets from the Display's edges, and horizontal/vertical offsets from the parent menu.
  • TileLayout now takes an Orientation
  • New anchor property for SlicerPresenter that controls which part of the stack moves first.
  • ScrollPanelVisualizer now takes a config that lets you modify the resulting panel
  • ScrollPanel's contentWidthConstraints and contentHeightConstraints now provide IdealSizedProperty values, which have an idealValue field. This lets you constrain the property using its ideal value.
  • ValueSlider.snapSize is no longer public
  • New Image.aspectRatio property

Fixes | Improvements

• General
  • bug in interiorAngle function for 2 vectors
  • spinButton form field now adopts initial value set for it.
  • IntSpinButtonModel now clamps initial value
  • Issue in Resizer where pointer release was consumed (to avoid issues on touch devices) which caused strange behavior w/ other handlers. Changed to preventOsHandling instead.
  • Bugs in ConstrainedSizePolicy
  • Form switch layout
  • Label only re-measures text if text is actually changed
  • Some areas where wordSpacing and letterSpacing couldn't be 0
  • GridLayout issue due to new layout model
  • Issue where ConstraintLayoutImpl would unregister context for Views that were unconstrained even if they were still constrained in other blocks.
  • Issue where ScrollPanel scroll didn't take scroll bar sizes into account
  • Selection bug in Lists, Tables, Tress, TreeTables related to selecting the previous item after a select all
  • Bug where MultiSelectionModel wouldn't have correct last when selecting all while last item
  • Fixed sizing for many form controls that were incorrect under new layout scheme
  • Issue where List could reset size incorrectly if it's parent has no layout
  • Label default lineSpacing
  • Label preferredSize now tracks bounds changes when wrapsWords set to true
  • The way offset/size-inset constraints work
  • BasicSelectBoxBehavior rendering
  • BasicSpinButtonBehavior rendering
  • Issue where Label.text wouldn't update if changing from a StyledText with same text value
  • Edge case where Carousel wouldn't transition if it only contained 1 item with wrapping
  • Menu selection issue caused by bad Kotlin compilation: https://youtrack.jetbrains.com/issue/KT-73130.
  • Edge case where items could be selected in a Menu if they were all disabled.
  • Issue where Carousel would incorrectly handle manual move cancellation if no movement had occurred
  • Bug in they way Views are selected, which caused disabled Views to get pointer events.
  • Render issues in CubePresenter
  • Issue where Carousel would incorrectly handle manual move cancellation if no movement had occurred
  • Issue where Carousel wouldn't cancel skips properly and this resulted in janky rendering.
  • SlicerPresenter now caches bounds data to improve frame rate.
  • Issue with CubePresenter positioning of cube cap supplemental view.
  • BasicSelectBoxBehavior popup list size
  • Updated Dynamic Behaviors so they work w/ List<BehaviorResolver> instead of Set to ensure proper ordering
  • bug in ProportionalSizePolicy that led to incorrect column sizing
  • Popup ordering in some edge cases
  • Stroke rendering with some paints
  • But where PatternPaint transform not updated in some edge cases
  • Render issue with some brushes when the content they render is clipped
  • Issue in native ScrollPanel behavior that prevented proper install/uninstall cycles
  • No longer returning 0 for empty string height
  • Issue with paint caching
  • Using browser's default line-height instead of assuming a value of 1.
  • Incorrectly treating "simple" brushes as complex in some edge cases, which means they'd render using SVG when they didn't need to
  • Ensure single line text has proper line height set
  • Various fixes for foreign object paints
  • Issue where some paints could fail to draw both strokes and fill when used at the same time
  • Issue where some paints would prevent fill from working when used as a Stroke
  • Issue in stroke rendering with SweepGradientPaint
  • Incorrect text indent for wrapped styled text in some cases.
  • Vertical alignment of SVG text so it matches HTML text.
  • SVG text backgrounds
  • Bug ...

0.10.4

Fixes | Improvements

• Browser
  • [Fix][Web] Bug where touch events resulted in pointer enter being called after exit. This meant Views that were touched would always remain in the "pointer entered" state, which breaks many app interactions.

0.10.3

APIs

• New MonthPanel.showMaxRows property that controls whether all 6 potential rows are shown for the panel.

Fixes | Improvements

• Fixed bug in they way Views are selected, which caused disabled Views to get pointer events.
• Fixed issue where Carousel would incorrectly handle manual move cancellation if no movement had occurred.
• Fixed Menu selection issue caused by bug in Kotlin JS compilation.
• Menu items now get selected on pointer move and not just pointer enter
• Fixed edge case where items could be selected in a Menu if they were all disabled.
• Fixed render issues in CubePresenter

Versions

• Kotlin -> 1.9.25

0.10.2

Features

Animation Chaining

Animations can now be chained within an animation block using the new then method. This makes it easier to have sequential animations and avoids the need to explicitly track secondary animations for cancellation, since these are tied to their "parent" animation.

val animation = animate {
    0f to 1f using (tweenFloat(easing, duration)) {                   // (1)
        // ...
    } then {
        0f to 1f using (after(delay, tweenFloat(easing, duration))) { // (2)

        } then {                                                      // (3)
            // ...
        }
    } then {                                                          // (4)
        // ...
    }
}

animation.completed += { /* ... */ }  // applies to entire chain
animation.pause ()                    // applies to entire chain
animation.cancel()                    // applies to entire chain

Improved Accessibility

Desktop Support

Doodle's web apps have had accessibility support for some time. Now those capabilities are available for desktop apps as well. You simply include the AccessibilityModule in your app and follow the guidelines of how to add roles, labels, etc. to your Views.

SpinButton Accessibility

SpinButtons now use the new SpinButtonRole that allows assistive tools to better read them. This role exposes the currently selected value based on a new valueAccessibilityLabeler function that converts the value to a String.

Improved Sliders

Arbitrary Types

Sliders can now represent values of any Comparable type T between two start and end values. This is possible for Ts that have some interpolation between a start and end based on some value between 0 and 1. This is done via a new TypeConverter<T> that defines the interpolation (and its inverse).

This means you can now create sliders for numeric types like Measure<T> directly and their value will by of the right type.

val charSlider     = Slider('A' .. 'Z')
val velocitySlider = Slider(10 * meters / seconds .. 100 * miles / hours)

You can also create Sliders for any type T, as long as it is Comparable and you can create an Interpolator for it.

fun <T: Comparable<T>> customSlider(model: ConfinedValueModel<T>, interpolator: Interpolator<T>) {
    val slider: Slider<T> = Slider(model, interpolator = interpolator)
}

These, more flexible Sliders can also be used in forms as expected.

 Form {this(
    + slider('A' .. 'Z'),
    + slider(10 * meters/seconds .. 10 * miles/hours),
    + slider(model, interpolator = interpolator),
    onInvalid = {}
) { _: Char, _: Measure<Velocity>, _: T ->

}}

Non-linearity

Sliders are linear by default, which means a change in their position translates to a linear change in their value. There are cases however, when it makes sense to have a slider's value change in a non-linear way. You can do this by providing a function that maps values between the slider's input and output spaces. These values are all within the [0-1] domain, and work very similarly to easing functions used for animations. The big difference is they have two forms: f(x) and f^-1(x).

import io.nacular.doodle.controls.range.InvertibleFunction
import io.nacular.doodle.controls.range.Slider
import kotlin.math.log
import kotlin.math.pow

/**
 * Logarithmic function and inverse https://www.desmos.com/calculator/qq59ey0bub
 */
private object LogFunction: InvertibleFunction {
    override fun invoke (value: Float) = log((10f - 1) * value + 1, 10f)
    override fun inverse(value: Float) = (10f.pow(value) - 1)/(10 - 1)
}

val logarithmicSlider = Slider(0.0 .. 1.0, function = LogFunction)

APIs

• General

  • New after animation function that allows a delay before executing an AnimationPlan.
  • Made Scene a public type since it is part of the public API for Theme
  • New builders for creating Sliders for Char and Measure<T>
  • New increment and decrement methods for sliders
  • New methods for incrementing/decrementing start/end for RangeValueSlider
  • Renamed Spinner to SpinButton (and related classes) and deprecated all old uses.
  • New SpinButtonRole for accessibility.
  • ThemePicker now allows customization of accessible value labels via new valueAccessibilityLabeler property.
  • ListItemRole now has a selected state. ListItem (BasicTheme) now keeps this value up-to-date.
  • New circumference extension for Circle
  • New helper for calculating the interior angle between two Vector3D instances.
  • New form methods for creating SpinButton form controls from a List of values or IntProgression.
  • New functions for creating ease[In/Out]Bounce EasingFunctions with an initialBounceFraction: easeIn(0.15f).
  • New convenience methods for working with PathBuilders using x,y instead of Point.

• Deprecations

  • All animation functions that take a delay, since there is a new after function.
  • Types and functions related to Spinner, which was renamed to SpinButton.
  • Types and functions related to Dropdown, which was renamed to SelectBox.

Fixes | Improvements

• General

  • Issue where item could be stuck in render loop if it requires a layout, but cannot render b/c it is not recursively visible (it and all ancestors visible).

• Browser

  • Fixed issue with Display pointer exit not being properly handled.
  • Work-around for Safari giving incorrect clientX/Y values when the browser window is zoomed, which broke pointer location.
  • Fixed edge case where old rendered vectors aren't cleaned up if a sub-frame happens where one wasn't before.
  • Fixed bug in reading items from DataTransferItemList that broke file drag-drop

Versions

• Kotlin -> 1.9.23
• Kover -> 0.8.1
• Dokka -> 1.9.20

0.10.1

Features

New SweepGradientPaint

The new sweep gradient paint lets you fill regions with gradients that follow a line that sweeps around a center point. This new paint is a GradientPaint, which means it allows you to specify a series of colors and stops to create very flexible fills.

canvas.rect(rect, fill = SweepGradientPaint(Red opacity 0.5f, Blue, centerPoint))

canvas.rect(
    rectangle = rect,
    fill      = SweepGradientPaint(
      colors = listOf(
        Stop(Red,    0.0f),
        Stop(Orange, 0.5f),
        Stop(Blue,   1.0f),
      ),
      center   = somePoint,
      rotation = rotation
    )
)

APIs

• General
  • New ScrollPanel.scrollChanged event
  • New pointer filter events for Table header, body and footer available to TableBehaviors.
  • New helpers to make creating MetaRowPositioner, HeaderCellGenerator, and FooterCellGenerator for tables.
  • StyledText helpers for Color and Paint can now target text Foreground.
  • New WhenManuallySet RequiredIndicatorStyle that lets you set its visibility manually.
  • Resizer now lets you control which phase of the event process it uses to trigger. This will make it possible for it to word even for Views with children that consume pointer events.
  • New lerp helper for Measures.
  • New constructor for BasicCircularProgressIndicatorBehavior that takes lambdas for paint/stroke.
  • StarRater now allows rounding of its points
  • New star method variant that takes an innerCircle radius ratio

Fixes | Improvements

• General

  • Built-in Form controls will now scroll into view when focused
  • View.styleChanged will now fire when a View is added to a parent that causes its font to change.
  • Focus traversal for popups and some other cases.
  • Added API docs to CommonButtonBehavior and CommonTextButtonBehavior
  • Removed duplicate model listener in Table family of classes.
  • Slight improvement in change event processing within FilteredList.
  • Modals no longer throw an error if their completion is invoked multiple times.
  • Issue where ModalManagerImpl could close the wrong modal on completion.
  • Fixed issue where DynamicList did not always remove all the right items when its model changes.
  • Size no longer throws IllegalArgumentException when given negative values for width or height. It just maps these to 0 instead.
  • Fixed issue with layer ordering when DisplayImpl has a complex fill
  • Fixed bug in StyledText.isBlank
  • Bug where ringSection startCap and endCap were flipped
  • StarRater no longer clips stars when they are rotated
  • Minor bug in Resizer related to cursor updating on pointer up
  • Edge cases where View's not repainted or laid out when becoming visible after having bounds change while invisible.

• Browser

  • Focus was not properly being returned to the last focused View when focus left/returned to the window.
  • Native TextField behavior now avoids prematurely clearing focus, so it can be regained when the window is selected again.
  • Native HyperLink behavior now clicks the underlying link in response to the fired event.
  • Fixed View clipping within DocumentImpl
  • Issue with SVG shadows in some cases.
  • Fixed issue where shadow filter not cleared correctly on reused element
  • Fixed text baseline alignment issue when using svg
  • Addressed some inconsistencies in how text is rendered via SVG vs plain HTML.
  • Issue where outer shadow could have incorrect offsets
  • Outer shadows could be clipped when used withing PatternPaint.

• Desktop

  • Fixed issue with text shadows. Inner shadows are now supported.
  • Fixed issue where native views in popups were not assigned to any Display and therefore Swing peers were not added to the scene. This broke events for these Views.

Versions

• Mockk -> 1.13.9
• Dokka -> 1.9.20