Doodle 0.7.0 Released

New Date controls

MonthPanel is a customizable control that shows the days of a given month in a year. The panel allows full customization of the rendering for each day as well as selection handling via an ItemVisualizer. This control is a building block that can be used to create calendars and date selectors.

Days in the month are rendered using the ItemVisualizer. This can be set directly when creating the panel, or it can be provided via an installed MonthPanelBehavior. Selection of days within the panel is controlled by the SelectionModel installed when the panel is created.

val today = Clock.System.now().toLocalDateTime(TimeZone.currentSystemDefault()).date

val panel = MonthPanel(today, /*itemVisualizer, selectionModel*/)

This release also contains BasicMonthPanelBehavior, which provides a simple day visualizer. You can also install it into a Theme using basicMonthPanelBehavior(...).

There is also a new DaysOfTheWeekPanel control for displaying days of the week intended for use along with MonthPanel. It allows fully customizable display for each day (via an ItemVisualizer) as well as control over how the days are sorted.

New behaviors in BasicTheme for MonthPanel via basicMonthPanelBehavior(...) and DaysOfTheWeekPanel via basicDaysOfTheWeekPanelBehavior(...)

Range Sliders

New RangeSlider and CircularRangeSlider controls that allow the selection of a range of strongly-typed values. These are analogs to Slider and CiruclarSlider. Both also have new behaviors in Basic Theme.

You can create these sliders in a similar fashion to the value sliders.

val slider         = RangeSlider        (range = 0 .. 100, value = 4 .. 10)
val circularSlider = CircularRangeSlider(range = 0 .. 100, value = 4 .. 10)

Tick Marks For (BasicSliderBehavior and BasicRangeSliderBehavior)

The basic behaviors can now display tick marks when a Slider or RangeSlider has ticks set to a value larger than 1. This is done via their showTicks parameter. Ticks can be shown either on the slider's groove, or on both the groove and range.

More Flexible Lists

List and its variants now have better support for items positioned in an arbitrary way. Previously, the List class itself assumed a vertical layout and only used the y-component of its viewport to determine which items to render. This has been updated so both the top-left and bottom-right points on the List are now used.

There are now two new ItemPositioners to make laying out vertical hand horizontal lists easier. VerticalListPositioner allows you to specify the number of columns for the list, while HorizontalListPositioner lets you give a number of rows. These can be used directly with custom ListBehaviors or, they can be used with BasicListBehavior directly, or via the basicListBehavior and basicHorizontalListBehavior modules when using a Theme.

Vertical + Horizontal List Variants

List contents can be positioned using an ItemPositioner, which the List gets from its ListBehavior. But specifying the layout for a single list means installing a behavior on it directly, since any theme used will provide the same behavior to all lists.

The new variants allow themes to identify lists that should be explicitly vertical or horizontal for cases when it is less convenient to use explicit behaviors.

// ... 
import io.nacular.doodle.theme.basic.list.basicHorizontalListBehavior
import io.nacular.doodle.theme.basic.BasicTheme.Companion.basicHorizontalListBehavior

val manualHorizontalList = List(0..10).apply {
    acceptsThemes = false                                                       // prevent behavior from being swapped if theme present
    behavior      = basicHorizontalListBehavior(itemWidth = 300.0, numRows = 2) // or some other custom behavior
}

// Will be same as above when using BasicTheme.basicHorizontalListBehavior() module
val autoHorizontalList = HorizontalList(0..10, numRows = 2)

New Platform-specific Desktop Artifacts

Previously apps would depend on the desktop-jvm library when targeting desktop. The problem with this approach is skiko is inherently platform-specific and the published library would depend on the build machine. Therefore, apps would only run on the same OS as the library build machine.

This release introduces new platform library artifacts to fix this issue. Apps will now depend on the new desktop-jvm-{platform} library instead.

Doodle is a pure Kotlin UI framework for the Web (and Desktop), that lets you create rich applications without relying on Javascript, HTML or CSS. Check out the documentation and tutorials to learn more.