|
|
@@ -1,3 +1,4 @@
|
|
|
+* [RmlUi 6.0](#rmlui-60)
|
|
|
* [RmlUi 5.1](#rmlui-51)
|
|
|
* [RmlUi 5.0](#rmlui-50)
|
|
|
* [RmlUi 4.4](#rmlui-44)
|
|
|
@@ -12,7 +13,7 @@
|
|
|
* [RmlUi 2.0](#rmlui-20)
|
|
|
|
|
|
|
|
|
-## RmlUi 6.0 (WIP)
|
|
|
+## RmlUi 6.0
|
|
|
|
|
|
### Advanced rendering features
|
|
|
|
|
|
@@ -25,7 +26,7 @@ The original issue is found in #307 and the pull request is #594. Thanks to ever
|
|
|
New properties:
|
|
|
|
|
|
- `filter`: Apply a rendering effect to the current element (including its children).
|
|
|
- - Supported filters: `blur`, `drop-shadow`, `hue-rotate`, `brightness`, `contrast`, `grayscale`, `invert`, `opacity`, `sepia`. In other words, all filters supported in CSS.
|
|
|
+ - Supported filters: `blur`, `drop-shadow`, `hue-rotate`, `brightness`, `contrast`, `grayscale`, `invert`, `opacity`, `sepia`. That is, all filters supported in CSS.
|
|
|
- `backdrop-filter`: Apply a filter to anything that is rendered below the current element.
|
|
|
- `mask-image`: Can be combined with any decorator, including images and gradients, to mask out any part of the current element (and its children) by multiplying their alpha channels.
|
|
|
- `box-shadow`: With full support for offset, blur, spread, and insets.
|
|
|
@@ -39,23 +40,60 @@ New decorators:
|
|
|
|
|
|
The gradients support most of the CSS features and syntax, including angle and `to <direction>` syntax for direction, multiple color stops, locations in length or percentage units, and up to two locations per color. Please see the [decorators documentation](https://mikke89.github.io/RmlUiDoc/pages/rcss/decorators.html#rmlui-decorators) for details.
|
|
|
|
|
|
-- The new rendering interface include support for shaders, which enable the above decorators. Parsing is done in the library, but the backend renderer is the one implementing the actual shader code.
|
|
|
+- The new rendering interface includes support for shaders, which enable the above decorators. Parsing is done in the library, but the backend renderer is the one implementing the actual shader code.
|
|
|
|
|
|
-- All filters and gradient decorators have full support for interpolation, that is, they can be animated. This is not yet implemented for box-shadow.
|
|
|
+- All filters and gradient decorators have full support for interpolation, that is, they can be animated. This is not yet implemented for box shadows.
|
|
|
|
|
|
-- Decorators can now take an extra keyword `<paint-area>` which is one of `border-box | padding-box | content-box`, which indicates which area of the element the decorator should apply to. All built-in decorators are modified to support this property. For example: `decorator: linear-gradient(to top right, yellow, blue) border-box`.
|
|
|
+- Decorators can now take an extra keyword `<paint-area>` which is one of `border-box | padding-box | content-box`. The keyword indicates which area of the element the decorator should apply to. All built-in decorators are modified to support this property. For example: `decorator: linear-gradient(to top right, yellow, blue) border-box`.
|
|
|
|
|
|
- Custom filters can be created by users by deriving from `Filter` and `FilterInstancer`, analogous to how custom decorators are created.
|
|
|
|
|
|
-- Improved element clipping behavior. Handles more complicated cases, including nested transforms with hidden overflow, and clips to the curved edge of elements with border-radius. This requires clip mask support in the renderer.
|
|
|
+- Improved element clipping behavior. Handles more complicated cases, including nested transforms with hidden overflow, and clipping to the curved edge of elements with border-radius. This requires clip mask support in the renderer.
|
|
|
|
|
|
-Feel free to take a look at the `effects` sample showcasing many of the new features.
|
|
|
+The [documentation](https://mikke89.github.io/RmlUiDoc/) has been updated to reflect the new features, including the new decorators and properties, with examples and screenshots. The new features are also demonstrated in the new `effects` sample, so please check that out.
|
|
|
|
|
|
-For now, only the OpenGL 3 renderer implements all new rendering features. All other backends have been updated to work with the updated render interface but with their old feature set.
|
|
|
+For now, only the OpenGL 3 renderer implements all new rendering features. All other backends have been updated to work with the updated render interface but with their old feature set. For users with custom backends, please see the updated [render interface documentation](https://mikke89.github.io/RmlUiDoc/pages/cpp_manual/interfaces/render.html) in particular. Here, you will also find a table detailing exactly which functions must be implemented to support particular RCSS features.
|
|
|
+
|
|
|
+Here are some quick RCSS examples taken from the documentation.
|
|
|
+
|
|
|
+```css
|
|
|
+decorator: linear-gradient(to bottom, #00f3, #0001, #00f3), linear-gradient(to top right, red, blue);
|
|
|
+decorator: radial-gradient(circle farthest-side at center, #ff6b6b, #fec84d, #4ecdc4);
|
|
|
+decorator: repeating-conic-gradient(from 90deg, #ffd700, #f06, #ffd700 180deg);
|
|
|
+decorator: shader("my_shader") border-box;
|
|
|
+
|
|
|
+filter: brightness(1.2) hue-rotate(90deg) drop-shadow(#f33f 30px 20px 5px);
|
|
|
+backdrop-filter: blur(10px);
|
|
|
+
|
|
|
+box-shadow: #f008 40px 30px 0px 0px, #00f8 -40px -30px 0px 0px;
|
|
|
+mask-image: conic-gradient(from 45deg, black, transparent, black), image("star.png" cover);
|
|
|
+```
|
|
|
+
|
|
|
+#### Screenshots
|
|
|
+
|
|
|
+Collage of advanced effects:
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+Masking principles and demonstration:
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+Improved clipping behavior of nested and transformed elements (also showing improved layouting of positioned boxes):
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+Improved clipping with border-radius:
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+Demonstration of the `effects` sample:
|
|
|
+
|
|
|
+[Effects sample video](https://github.com/mikke89/RmlUi/assets/5490330/bdc0422d-867d-4090-9d48-e7159e3adc18)
|
|
|
|
|
|
#### Major overhaul of the render interface
|
|
|
|
|
|
-The render interface has been simplified to ease implementation of basic rendering functionality, while extended to enable the new advanced rendering effects. The new effects are fully opt-in, and can be enabled iteratively to support the features that are most desired for your project.
|
|
|
+The render interface has been simplified to ease implementation of basic rendering functionality, while extended to enable the new advanced rendering effects. The new effects are fully opt-in, and can be enabled iteratively to support the features that are most desired for your project. See the updated [render interface documentation](https://mikke89.github.io/RmlUiDoc/pages/cpp_manual/interfaces/render.html) for how to implement the new functionality. The documentation includes a table detailing which functions must be implemented to support specific RCSS features.
|
|
|
|
|
|
Highlighted changes:
|
|
|
|
|
|
@@ -63,7 +101,7 @@ Highlighted changes:
|
|
|
- A clear separation between required functions for basic functionality, and optional features for advanced rendering effects. The required functions are now pure virtual.
|
|
|
- All colors are now submitted as 8-bit sRGBA (like before), but with premultiplied alpha (new). Existing renderers should modify their blending modes accordingly. This change is central to correct blending of partially transparent layers.
|
|
|
- All geometry is now compiled before it can be rendered, which helps to simplify the interface.
|
|
|
- - Now the pointers to the geometry data (vertices and indices) are guaranteed to be available and immutable until the same geometry is released. Thus, users can simply store the views to this data, and reuse that during rendering, which should help considerably with migrating from the immediate rendering function.
|
|
|
+ - Now the pointers to the geometry data (vertices and indices) are guaranteed to be available and immutable until the same geometry is released. Thus, users can simply store the views to this data, and reuse that during rendering, which should help considerably for users migrating from the immediate rendering function.
|
|
|
- The scissor region should now be applied separately from any active transform. Previously, we would have to manually redirect the scissor to a stencil operation, that is no longer the case. Instead, the clipping with transform is now handled by the library, and directed to the clip mask functionality of the render interface as appropriate.
|
|
|
- Expanded functionality to enable the new rendering effects, including layered rendering, rendering to texture, rendering with filters and shaders.
|
|
|
- Textures are no longer part of the compiled geometry, compiled geometry can be rendered with different textures or shaders.
|
|
|
@@ -87,6 +125,8 @@ That's it, and your old renderer should now still work!
|
|
|
|
|
|
It can also be useful to take a closer look at the adapter before migrating your own renderer to the new interface, to see which changes are necessary. Naturally, this adapter won't support any of the new rendering features.
|
|
|
|
|
|
+For demonstration purposes, there are two built-in backends implementing the adapter: [`BackwardCompatible_GLFW_GL2`](./Backends/RmlUi_BackwardCompatible/RmlUi_Renderer_BackwardCompatible_GL2.cpp) and [`BackwardCompatible_GLFW_GL3`](./Backends/RmlUi_BackwardCompatible/RmlUi_Renderer_BackwardCompatible_GL3.cpp). Each of the backends use a direct copy of their respective render interface from RmlUi 5.1, only with the above instructions applied. Please take a look if you want to see some examples on how to use this adapter.
|
|
|
+
|
|
|
#### Render manager and resources
|
|
|
|
|
|
A new RenderManager is introduced to manage resources and other rendering state. Users don't normally have to interact with this, but for contributors, and for more advanced usages, such as custom decorators, this implies several changes.
|
|
|
@@ -104,12 +144,12 @@ See [this commit message](https://github.com/mikke89/RmlUi/commit/a452f26951f945
|
|
|
|
|
|
#### Limitations
|
|
|
|
|
|
-Filters will only render based on geometry that is visible on-screen. Thus, some filters may be cut-off. As an example, an element that is partly clipped with a drop-shadow may have its drop-shadow also clipped, even if it is fully visible. On the other hand, box shadows should always be rendered properly, as they are rendered off-screen and stored in a texture.
|
|
|
+Filters will only render based on geometry that is visible on-screen. Thus, some filters may be cut off. As an example, an element that is partly clipped with a drop-shadow may have its drop-shadow also clipped, even if it is fully visible. On the other hand, box shadows should always be rendered properly, as they are rendered off-screen and stored in a texture.
|
|
|
|
|
|
### Major layout engine improvements
|
|
|
|
|
|
- Make layout more conformant to CSS specification.
|
|
|
- - Rewritten inline layouting.
|
|
|
+ - Rewritten inline layout engine.
|
|
|
- Fixed more than a hundred CSS tests, including ACID1.
|
|
|
- Improve readability and maintainability:
|
|
|
- Better separation of classes, reduce available state.
|
|
|
@@ -120,161 +160,68 @@ Filters will only render based on geometry that is visible on-screen. Thus, some
|
|
|
- Allow nested flexboxes: Flex items can now be flex containers themselves. #320
|
|
|
- Better handling of block-level boxes in inline formatting contexts. #392
|
|
|
|
|
|
-More details to be posted later. Expect some possible layout shifts in existing documents, primarily due to better CSS conformance.
|
|
|
+#### Detailed layout improvements
|
|
|
|
|
|
-### General layout improvements
|
|
|
-
|
|
|
-- Scale pixels-per-inch (PPI) units based on the context's dp-ratio. #468 (thanks @Dakror)
|
|
|
-- Make flex containers and tables with fixed width work in shrink-to-fit contexts. #520
|
|
|
-- Compute shrink-to-fit width for flex boxes. #559 #577 (thanks @alml)
|
|
|
-- Add `space-evenly` value to flex box properties `justify-content` and `align-content`. #585 (thanks @LucidSigma)
|
|
|
-- Implement `gap` property for flexboxes. #621 (thanks @ChrisFloofyKitsune)
|
|
|
-
|
|
|
-### General decorator improvements
|
|
|
-
|
|
|
-- Add repeat fit mode to image decorator, e.g. `decorator: image(alien.png repeat)`. #259 #493 (thanks @viseztrance)
|
|
|
-
|
|
|
-### RCSS Properties
|
|
|
-
|
|
|
-In addition to the RCSS properties for the new advanced rendering listed above, the following properties or values have been added.
|
|
|
-
|
|
|
-- New `display` property values: `flow-root`, `inline-flex`, `inline-table`.
|
|
|
-- New `vertical-align` property value: `center`.
|
|
|
-
|
|
|
-### Text shaping and font engine
|
|
|
+Here is a more detailed change list resulting from the rewritten inline formatting engine, and some related changes.
|
|
|
|
|
|
-- Add `lang` and `dir` RML attributes, along with text shaping support in the font engine interface. #563 (thanks @LucidSigma)
|
|
|
-- Create a sample for text shaping with Harfbuzz, including right-to-left text formatting. #568 #211 #588 (thanks @LucidSigma)
|
|
|
-- Add support for the `letter-spacing` property. #429 (thanks @igorsegallafa)
|
|
|
-- Add initialize and shutdown procedures for better lifetime management. #583
|
|
|
+- Corrected the baseline of fonts, they should now line up better.
|
|
|
+- Inline layout now properly uses font metrics as appropriate, even without any text contents.
|
|
|
+ - In particular, vertical alignment now considers font ascent and descent.
|
|
|
+ - This might make some lines taller. In particular, inline-level boxes that are placed on the baseline will now make space for the font descent below the baseline.
|
|
|
+- Improved baselines for inline-block boxes.
|
|
|
+- Content height of inline boxes no longer depend on their `line-height` property, only font metrics.
|
|
|
+- Block formatting contexts (BFC) now work like in CSS: Floated boxes share space and interact within the same BFC, and never outside of it.
|
|
|
+ - Certain properties cause the element to establish a new BFC, such as overflow != visible, and the new `display: flow-root` value.
|
|
|
+ - Milestone: We now pass ACID1!
|
|
|
+- Relative positioning now works in other formatting contexts and situations. #471
|
|
|
+ - Including for inline, flex, table, and floated elements, in addition to block boxes like before.
|
|
|
+ - Also, nested relative elements are now correctly positioned.
|
|
|
+- Containing blocks are now determined more like in CSS, particularly for absolute elements.
|
|
|
+ - Only elements which are positioned, or with local transform or perspective, establishes an absolute containing block.
|
|
|
+- An overflowing element's scroll region no longer has its padding added to the region.
|
|
|
+ - Elements are checked for overflowing the padding box instead of the content box, before enabling scrollbars.
|
|
|
+ - The border box of floats will now be considered for overflow, instead of their margin box.
|
|
|
+- Fix some replaced elements (e.g. textarea) not rendering correctly in several situations, such as when set to block display, floated, or absolutely positioned.
|
|
|
+- Improve shrink-to-fit width, now includes floating children when determining width.
|
|
|
+- Margins of absolutely positioned elements now better account for inset (top/right/bottom/left) properties.
|
|
|
+- Support for new [`display`](https://mikke89.github.io/RmlUiDoc/pages/rcss/visual_formatting_model.html#display) values: `flow-root`, `inline-flex`, `inline-table`.
|
|
|
+- Support for the value [`vertical-align: center`](https://www.w3.org/TR/css-inline-3/#valdef-baseline-shift-center).
|
|
|
+- Stacking contexts are now established in a way that more closely aligns with CSS.
|
|
|
+- Improve paint order of elements.
|
|
|
+ - Render all stacking context children after the current element's background and decoration. This change is consistent with the CSS paint order. (In filter branch, this way we require less render state changes which leads to simpler code and possibly better performance).
|
|
|
|
|
|
-### Spatial navigation
|
|
|
+Please see the list of breaking changes and solutions at the end of the changelog.
|
|
|
|
|
|
-Introduce [spatial navigation](https://mikke89.github.io/RmlUiDoc/pages/rcss/user_interface.html#nav) for keyboards and other input devices. This determines how the focus is moved when pressing one of the navigation direction buttons. #142 #519 #524 (thanks @gleblebedev)
|
|
|
+#### Layout comparisons
|
|
|
|
|
|
-- Add the new properties `nav-up`, `nav-right`, `nav-down`, `nav-left`, and shorthand `nav`. E.g.
|
|
|
-- Add [`:focus-visible` pseudo class](https://mikke89.github.io/RmlUiDoc/pages/rcss/selectors.html#pseudo-selectors) as a way to style elements that should be highlighted during navigation, like its equivalent CSS selector.
|
|
|
-- Makes the `invaders` sample fully work with keyboard navigation and `:focus-visible` to highlight the focus.
|
|
|
-- Elements in focus are now clicked when pressing space bar.
|
|
|
+Here are some screenshots demonstrating the layout improvements.
|
|
|
|
|
|
-```css
|
|
|
-input { nav: auto; nav-right: #ok_button; }
|
|
|
-.menu_item { nav: vertical; border: #000 3px; }
|
|
|
-.menu_item:focus-visible { border-color: #ff3; }
|
|
|
-```
|
|
|
+
|
|
|
|
|
|
-### Elements
|
|
|
+The above example demonstrates a variety of inline formatting details, with nested elements and borders ([fiddle](https://jsfiddle.net/kmouse/etpnu6rb/55/)). We now match nicely with web browsers in such situations. The old behavior has several issues, in particular the elements are not aligned correctly and the border is broken off too early. Note that Firefox in these examples use a different font, so expect some differences for that reason.
|
|
|
|
|
|
-- Enable removal of properties using shorthand names. #463 (thanks @aimoonchen)
|
|
|
-- Add `Element::Matches`, the last missing selector-related function. #573 (thanks @Paril)
|
|
|
-- Tab set: Allow `ElementTabSet::RemoveTab` to work on tab sets with no panels. #546 (thanks @exjam)
|
|
|
-- Range input: Fix a bug where the bar position was initially placed wrong when using min and max attributes.
|
|
|
+
|
|
|
|
|
|
-### Text input widget
|
|
|
+The above shows tests for line splits and borders in particular ([fiddle](https://jsfiddle.net/kmouse/nvscbmoy/5/)). The old behavior is almost comically broken. The new behavior has for the most part been written from scratch following the CSS specifications, and turns out to nicely match up with Firefox.
|
|
|
|
|
|
-The following improvements apply to both the textarea and text input elements.
|
|
|
+
|
|
|
|
|
|
-- Add Input Method Editor (IME) support. #541 #630 (thanks @ShawnCZek)
|
|
|
- - The text input widget implements the new `TextInputContext` interface, backends can interact with this by implementing the `TextInputHandler` interface for IME support.
|
|
|
- - Add native IME support to Win32 backends (`Win32_GL2` and `Win32_VK`).
|
|
|
- - Add new sample `rmlui_sample_ime` to demonstrate IME support (only enabled on supported backends).
|
|
|
-- Add support for the `text-align` property in text inputs. #454 #455 (thanks @Dakror)
|
|
|
-- Fix clipboard being pasted when Ctrl + Alt + V key combination is used. #464 #465 (thanks @ShawnCZek)
|
|
|
-- Fix selection index possibly returning an invalid index. #539 (thanks @ShawnCZek)
|
|
|
-- Move the input cursor when the selection range changes. #542 (thanks @ShawnCZek)
|
|
|
-- Ignore selection range update when the element is not focused. #544 (thanks @ShawnCZek)
|
|
|
-- Text area elements now clip to their padding area instead of the content area, text input elements still clip to their content area (see [58581477](https://github.com/mikke89/RmlUi/commit/58581477a7c41cd2d163b306ae8c8fe0a04de9d2) for details).
|
|
|
-- Improve text widget navigation and selection (see [be9a497b](https://github.com/mikke89/RmlUi/commit/be9a497b508bc7598ea22198577e7fb1f0ddf357) for details).
|
|
|
-- The text cursor is no longer drawn when selecting text.
|
|
|
-- Consume key events with modifiers (ctrl, shift) to prevent event propagation and subsequently performing navigation.
|
|
|
-- Fix some cases where the scroll offset would alternate each time the text cursor was moved, causing rendering to flicker.
|
|
|
-- Use rounded line height to make render output more stable when scrolling vertically.
|
|
|
+Finally, this example tests vertical alignment of inline boxes, and particularly the concept of aligned subtrees ([fiddle](https://jsfiddle.net/kmouse/h3c5muyL/7/)). Again, we now nicely align with Firefox. The old behavior looks like it just gave up in the middle. I included Chrome here too, since I find it interesting how different it behaves compared to Firefox. In fact, I found a lot of these differences while testing various nuances of inline formatting. In this case, I am quite convinced that Firefox (and we) are doing the right thing and Chrome is not following the specifications.
|
|
|
|
|
|
-### Utilities
|
|
|
+#### General layout improvements
|
|
|
|
|
|
-- Improved mesh utilities to construct background geometry for any given area of the element, including for elements with border-radius.
|
|
|
-- New Rectangle type to better represent many operations.
|
|
|
-- Visual tests:
|
|
|
- - Several new visual tests for the new features.
|
|
|
- - Highlight differences when comparing to previous capture by holding shift key.
|
|
|
- - Replace CMake options with [environment variables](./Tests/readme.md).
|
|
|
-
|
|
|
-### Data bindings
|
|
|
-
|
|
|
-- Enable arbitrary expressions in data address lookups. #547 #550 (thanks @Dakror and @exjam)
|
|
|
-- Add enum support to variants and data bindings. #445 (thanks @Dakror)
|
|
|
-- Allow nested data models. #484 (thanks @Dakror)
|
|
|
-- Fix XML parse error if single curly brace encountered at the end of a data binding string literal. #459 (thanks @Dakror)
|
|
|
-- Fix usage of data variables in selected `option`s. #509 #510 (thanks @Dakror)
|
|
|
-
|
|
|
-### Debugger plugin
|
|
|
-
|
|
|
-- Display the axis-aligned bounding box of selected elements, including any transforms and box shadows (white box).
|
|
|
-- List box model sizes for the selected element.
|
|
|
-- Log an error message when externally closing documents owned by the debugger plugin.
|
|
|
-
|
|
|
-### Lua plugin
|
|
|
-
|
|
|
-- Add CMake option `RMLUI_LUA_BINDINGS_LIBRARY` to link to the Lua library compiled as C++, or to LuaJIT. #604 (thanks @LiquidFenrir)
|
|
|
-- Add `StopImmediatePropagation` to Rml::Event. #466 (thanks @ShawnCZek)
|
|
|
-- Return inserted element from `AppendChild` and `InsertBefore`. #478 (thanks @ShawnCZek)
|
|
|
-
|
|
|
-### System interface
|
|
|
-
|
|
|
-- The system interface now provides a default implementation of all functions, it is no longer required to override and set this interface.
|
|
|
-- The default log output is now used when there is no system interface installed. All print-like calls, including those in backends, are now submitted to the built-in logger.
|
|
|
-- Fix `JoinPath` system interface method now being passed through when using the debugger. #462 #603 (thanks @Dakror)
|
|
|
-
|
|
|
-### General improvements
|
|
|
-
|
|
|
-- Implement the ability to release specific textures from memory. #543 (thanks @viseztrance)
|
|
|
-- Add support for the `not` prefix in media queries. #564 (thanks @Paril)
|
|
|
-- Use string parser to allow "quotes" in sprite sheet `src` property. #571 #574 (thanks @andreasschultes)
|
|
|
-- Format color types using RCSS hexadecimal notation.
|
|
|
-- `CreateString` and `FormatString` methods no longer take a `max_size` argument, as this is now handled automatically.
|
|
|
-- Allow using `margin` to offset the `scrollbarcorner`.
|
|
|
-- Log a warning when a texture could not be loaded.
|
|
|
-
|
|
|
-### General fixes
|
|
|
-
|
|
|
-- Fix some situations where the scroll offset of an element would reset or change after layout updates. #452
|
|
|
-- Fix wrong logic for assertion of released textures. #589 (thanks @pgruenbacher)
|
|
|
-- Fix some situations where units were not shown in properties, ensure all invoked types define a string converter.
|
|
|
-- In `demo` sample, fix form submit animation not playing smoothly on power saving mode.
|
|
|
-- Fix crash on shutdown in `bitmap_font` sample.
|
|
|
-- Fix being able to drag through the scroll track of a scrollbar.
|
|
|
-- Fix being able to scroll in a direction with hidden overflow.
|
|
|
-
|
|
|
-### Build improvements
|
|
|
-
|
|
|
-- Fix compile issues on newer clang and gcc releases due to mixed use of std namespace on standard integer types. #470 #545 #555
|
|
|
-- Fix `UnitTests` compilation error on MSVC by updating doctest. #491 (thanks @mwl4)
|
|
|
-- Fix `Benchmarks` compilation error when using custom string type. #490 (thanks @mwl4)
|
|
|
-- Change `StringUtilities::DecodeRml` to improve compatibility with other string types, like `EASTL::string`. #472 #475 (thanks @gleblebedev)
|
|
|
-- Various CMake fixes for MacOS. #525 (thanks @NaLiJa)
|
|
|
-- Fix include path. #533 (thanks @gleblebedev)
|
|
|
-- Can now add Tracy in one of the following three ways. #516 #518
|
|
|
- 1. Using target `Tracy::TracyClient` from parent project.
|
|
|
- 2. Using find package in config mode.
|
|
|
- 3. With Tracy source files located in `Dependencies/Tracy`.
|
|
|
-
|
|
|
-### Backends
|
|
|
-
|
|
|
-- GLFW: Use new GLFW 3.4 cursors when available.
|
|
|
-- GLFW: Fix mouse position conversion to pixel coordinates, particularly on MacOS retina displays. #521
|
|
|
-- SDL: Use performance counters for increased time precision.
|
|
|
-- Vulkan: Several fixes for validation errors and flickering behavior. #593 #601 (thanks @wh1t3lord)
|
|
|
-- Vulkan: Update deprecated debug utilities. #579 (thanks @skaarj1989)
|
|
|
-- OpenGL 3: Restore all modified state after rendering a frame. #449 (thanks @reworks-org)
|
|
|
-- OpenGL 3: Set forward compatibility flag to fix running on MacOS. #522 (thanks @NaLiJa)
|
|
|
-- OpenGL 3: Add depth test to OpenGL state backup. #629 (thanks @ben-metzger-z)
|
|
|
-- Win32: Center window on screen when opening it.
|
|
|
+- Scale pixels-per-inch (PPI) units based on the context's dp-ratio. #468 (thanks @Dakror)
|
|
|
+- Make flex containers and tables with fixed width work in shrink-to-fit contexts. #520
|
|
|
+- Compute shrink-to-fit width for flex boxes. #559 #577 (thanks @alml)
|
|
|
+- Add the `space-evenly` value to flex box properties `justify-content` and `align-content`. #585 (thanks @LucidSigma)
|
|
|
+- Implement the [`gap` property](https://mikke89.github.io/RmlUiDoc/pages/rcss/flexboxes.html#gap) for flexboxes. #621 (thanks @ChrisFloofyKitsune)
|
|
|
+- Flexbox: Consider intrinsic sizes when determining flex base size, fixes an assertion error. #640
|
|
|
|
|
|
-### Modernized CMake
|
|
|
+### CMake modernization
|
|
|
|
|
|
The CMake code has been fully rewritten with modern practices. Special thanks to @hobyst who laid the groundwork for this change, with a solid foundation and great guidelines. #198 #446 #551 #606 (thanks @hobyst)
|
|
|
|
|
|
-While modernizing our CMake code, it was clear that we also needed to change our naming conventions. This leads to quite significant breaking changes for building and linking, but the result should make the library a lot easier to work with and link with.
|
|
|
+While modernizing our CMake code, it was clear that we also needed to change our naming conventions. This leads to quite significant breaking changes for building and linking, but the result should make the library a lot easier to work with and link to.
|
|
|
|
|
|
We now try to support all setups including:
|
|
|
|
|
|
@@ -289,6 +236,8 @@ And naturally, we will continue to support package managers however we can, and
|
|
|
|
|
|
Large parts of the CI workflows have also been rewritten to accommodate these changes. Most of the Windows building and packaging procedures have been moved from Appveyor to GitHub Actions, which streamlines our testing and also helps speed up the CI builds.
|
|
|
|
|
|
+The [build documentation](https://mikke89.github.io/RmlUiDoc/pages/cpp_manual/building_with_cmake.html) has been updated to reflect all the new changes.
|
|
|
+
|
|
|
#### New target names
|
|
|
|
|
|
We now export the following targets:
|
|
|
@@ -391,6 +340,144 @@ We now have CMake presets:
|
|
|
|
|
|
The presets can be combined with other options, like `CMAKE_BUILD_TYPE` to select the desired build type when using single-configuration generators.
|
|
|
|
|
|
+### Spatial navigation
|
|
|
+
|
|
|
+Introduce [spatial navigation](https://mikke89.github.io/RmlUiDoc/pages/rcss/user_interface.html#nav) for keyboards and other input devices. This determines how the focus is moved when pressing one of the navigation direction buttons. #142 #519 #524 (thanks @gleblebedev)
|
|
|
+
|
|
|
+- Add the new properties `nav-up`, `nav-right`, `nav-down`, `nav-left`, and shorthand `nav`. E.g.
|
|
|
+- Add [`:focus-visible` pseudo class](https://mikke89.github.io/RmlUiDoc/pages/rcss/selectors.html#pseudo-selectors) as a way to style elements that should be highlighted during navigation, like its equivalent CSS selector.
|
|
|
+- The `invaders` sample implements this feature for full keyboard navigation, and uses `:focus-visible` to highlight the focus.
|
|
|
+- Elements in focus are now clicked when pressing space bar.
|
|
|
+
|
|
|
+RCSS example usage:
|
|
|
+
|
|
|
+```css
|
|
|
+input { nav: auto; nav-right: #ok_button; }
|
|
|
+.menu_item { nav: vertical; border: #000 3px; }
|
|
|
+.menu_item:focus-visible { border-color: #ff3; }
|
|
|
+```
|
|
|
+
|
|
|
+### Text shaping and font engine
|
|
|
+
|
|
|
+- Add `lang` and `dir` RML attributes, along with text shaping support in the font engine interface. #563 (thanks @LucidSigma)
|
|
|
+- Create a sample for text shaping with Harfbuzz, including right-to-left text formatting. #568 #211 #588 (thanks @LucidSigma)
|
|
|
+ - Implement fallback font support for the Harfbuzz sample. #635 (thanks @LucidSigma)
|
|
|
+- Add support for the [`letter-spacing` property](https://mikke89.github.io/RmlUiDoc/pages/rcss/text.html#letter-spacing). #429 (thanks @igorsegallafa)
|
|
|
+- Add initialize and shutdown procedures to font engine interface for improved lifetime management. #583
|
|
|
+
|
|
|
+### Elements
|
|
|
+
|
|
|
+- Enable removal of properties using shorthand names. #463 (thanks @aimoonchen)
|
|
|
+- Add [`Element::Matches`](https://mikke89.github.io/RmlUiDoc/pages/cpp_manual/elements.html#dom-interface), the last missing selector-related function. #573 (thanks @Paril)
|
|
|
+- `Element::GetInnerRML` now includes the local style properties set on the element in the returned RML.
|
|
|
+- Tab set: Allow `ElementTabSet::RemoveTab` to work on tab sets with no panels. #546 (thanks @exjam)
|
|
|
+- Range input: Fix a bug where the bar position was initially placed wrong when using min and max attributes.
|
|
|
+
|
|
|
+### Text input widget
|
|
|
+
|
|
|
+The following improvements apply to both the textarea and text input elements.
|
|
|
+
|
|
|
+- Add [input method editor (IME)](https://mikke89.github.io/RmlUiDoc/pages/cpp_manual/ime.html) support. #541 #630 (thanks @ShawnCZek)
|
|
|
+ - The text input widget implements the new `TextInputContext` interface, backends can interact with this by implementing the [`TextInputHandler` interface](https://mikke89.github.io/RmlUiDoc/pages/cpp_manual/interfaces/text_input_handler.html) for IME support.
|
|
|
+ - Add native IME support to Win32 backends (`Win32_GL2` and `Win32_VK`).
|
|
|
+ - Add new sample `rmlui_sample_ime` to demonstrate IME support (only enabled on supported backends).
|
|
|
+- Add support for the `text-align` property in text inputs. #454 #455 (thanks @Dakror)
|
|
|
+- Fix clipboard being pasted when Ctrl + Alt + V key combination is used. #464 #465 (thanks @ShawnCZek)
|
|
|
+- Fix selection index possibly returning an invalid index. #539 (thanks @ShawnCZek)
|
|
|
+- Move the input cursor when the selection range changes. #542 (thanks @ShawnCZek)
|
|
|
+- Ignore selection range update when the element is not focused. #544 (thanks @ShawnCZek)
|
|
|
+- Text area elements now clip to their padding area instead of the content area, text input elements still clip to their content area (see [58581477](https://github.com/mikke89/RmlUi/commit/58581477a7c41cd2d163b306ae8c8fe0a04de9d2) for details).
|
|
|
+- Improve text widget navigation and selection (see [be9a497b](https://github.com/mikke89/RmlUi/commit/be9a497b508bc7598ea22198577e7fb1f0ddf357) for details).
|
|
|
+- The text cursor is no longer drawn when selecting text.
|
|
|
+- Consume key events with modifiers (ctrl, shift) to prevent event propagation and subsequently performing navigation.
|
|
|
+- Fix some cases where the scroll offset would alternate each time the text cursor was moved, causing rendering to flicker.
|
|
|
+- Use rounded line height to make render output more stable when scrolling vertically.
|
|
|
+
|
|
|
+### Utilities
|
|
|
+
|
|
|
+- Improved mesh utilities to construct background geometry for any given box area of the element, including for elements with border-radius, see [`MeshUtilities.h`](./Include/RmlUi/Core/MeshUtilities.h).
|
|
|
+- New [`Rectangle`](./Include/RmlUi/Core/Rectangle.h) type to better represent many operations.
|
|
|
+- Visual tests:
|
|
|
+ - Several new visual tests for the new features.
|
|
|
+ - Highlight differences when comparing to previous capture by holding shift key.
|
|
|
+ - Replace CMake options with [environment variables](./Tests/readme.md).
|
|
|
+
|
|
|
+### Data bindings
|
|
|
+
|
|
|
+- Enable arbitrary expressions in data address lookups. #547 #550 (thanks @Dakror and @exjam)
|
|
|
+- Add enum support to variants and data bindings. #445 (thanks @Dakror)
|
|
|
+- Allow nested data models. #484 (thanks @Dakror)
|
|
|
+- Fix XML parse error if single curly brace encountered at the end of a data binding string literal. #459 (thanks @Dakror)
|
|
|
+- Fix usage of data variables in selected `option`s. #509 #510 (thanks @Dakror)
|
|
|
+
|
|
|
+### Debugger plugin
|
|
|
+
|
|
|
+- Display the axis-aligned bounding box of selected elements, including any transforms and box shadows (white box).
|
|
|
+- List [box model sizes](https://mikke89.github.io/RmlUiDoc/pages/cpp_manual/debugger.html#element-info) for the selected element.
|
|
|
+- Log an error message when externally closing documents owned by the debugger plugin.
|
|
|
+- Debugger now works with documents that have modal focus. #642
|
|
|
+
|
|
|
+### Lua plugin
|
|
|
+
|
|
|
+- Add CMake option [`RMLUI_LUA_BINDINGS_LIBRARY`](https://mikke89.github.io/RmlUiDoc/pages/cpp_manual/building_with_cmake.html#plugins-and-dependencies) to link to the Lua library compiled as C++, or to LuaJIT. #604 (thanks @LiquidFenrir)
|
|
|
+- Add `StopImmediatePropagation` to Rml::Event. #466 (thanks @ShawnCZek)
|
|
|
+- Return inserted element from `AppendChild` and `InsertBefore`. #478 (thanks @ShawnCZek)
|
|
|
+
|
|
|
+### System interface
|
|
|
+
|
|
|
+- The system interface is now optional. All functions now have a default implementation. Thus, it is no longer necessary to derive from and set this interface unless you want to customize its functionality.
|
|
|
+- The default log output is now used when there is no system interface installed. All print-like calls, including those in backends, are now submitted to the built-in logger.
|
|
|
+- Fix the `JoinPath` method so that it is passed through when using the debugger plugin. #462 #603 (thanks @Dakror)
|
|
|
+
|
|
|
+### General improvements
|
|
|
+
|
|
|
+- Add repeat fit modes to the [image decorator](https://mikke89.github.io/RmlUiDoc/pages/rcss/decorators/image.html), e.g. `decorator: image(alien.png repeat)`. #259 #493 (thanks @viseztrance)
|
|
|
+- Implement the ability to release specific textures from memory using `Rml::ReleaseTexture`. #543 (thanks @viseztrance)
|
|
|
+- Add support for the `not` prefix in media queries. #564 (thanks @Paril)
|
|
|
+- Use string parser to allow "quotes" in sprite sheet `src` property. #571 #574 (thanks @andreasschultes)
|
|
|
+- Format color types using RCSS hexadecimal notation.
|
|
|
+- `CreateString` and `FormatString` methods no longer take a `max_size` argument, as this is now handled automatically.
|
|
|
+- Allow using `margin` to offset the `scrollbarcorner`.
|
|
|
+- Log a warning when a texture could not be loaded.
|
|
|
+- Improve text culling.
|
|
|
+ - Previously, the text could be culled (that is, not rendered) even if it was visible due to transforms bringing it into view. Now, text culling properly considers the transform of the element.
|
|
|
+ - The text is now culled when the element is outside the viewport even if no scissor region is active.
|
|
|
+
|
|
|
+### General fixes
|
|
|
+
|
|
|
+- Fix wrong logic for assertion of released textures. #589 (thanks @pgruenbacher)
|
|
|
+- Fix in-source documentation in Factory. #646 (thanks @ben-metzger-z)
|
|
|
+- Fix some situations where the scroll offset of an element would reset or change after layout updates. #452
|
|
|
+- Fix some situations where units were not shown in properties, now all invoked types are ensured to define a string converter.
|
|
|
+- In `demo` sample, fix form submit animation not playing smoothly on power saving mode.
|
|
|
+- Fix crash on shutdown in `bitmap_font` sample.
|
|
|
+- Fix being able to drag through the scroll track of a scrollbar.
|
|
|
+- Fix being able to scroll in a direction with hidden overflow.
|
|
|
+
|
|
|
+### Build improvements
|
|
|
+
|
|
|
+- Fix compilation issues on newer Clang and GCC releases due to mixed use of std namespace on standard integer types. #470 #545 #555
|
|
|
+- Fix `UnitTests` compilation error on MSVC by updating doctest. #491 (thanks @mwl4)
|
|
|
+- Fix `Benchmarks` compilation error when using custom string type. #490 (thanks @mwl4)
|
|
|
+- Change `StringUtilities::DecodeRml` to improve compatibility with other string types, like `EASTL::string`. #472 #475 (thanks @gleblebedev)
|
|
|
+- Various CMake fixes for MacOS. #525 (thanks @NaLiJa)
|
|
|
+- Fix include paths. #533 #643 (thanks @gleblebedev and @Paril)
|
|
|
+- Improve integration of the Tracy library in CMake. #516 #518
|
|
|
+ - Added CMake options for enabling (1) a separate configuration in multi-config mode with `RMLUI_TRACY_CONFIGURATION`, and (2) the memory profiler by overriding global operators new/delete using `RMLUI_TRACY_MEMORY_PROFILING`.
|
|
|
+- Make test executables work with Emscripten.
|
|
|
+
|
|
|
+### Backends
|
|
|
+
|
|
|
+- OpenGL 3: Restore all modified state after rendering a frame. #449 (thanks @reworks-org)
|
|
|
+- OpenGL 3: Add depth test to OpenGL state backup. #629 (thanks @ben-metzger-z)
|
|
|
+- OpenGL 3: Set forward compatibility flag to fix running on MacOS. #522 (thanks @NaLiJa)
|
|
|
+- Vulkan: Several fixes for validation errors and flickering behavior. #593 #601 (thanks @wh1t3lord)
|
|
|
+- Vulkan: Update deprecated debug utilities. #579 (thanks @skaarj1989)
|
|
|
+- GLFW: Use new GLFW 3.4 cursors when available.
|
|
|
+- GLFW: Fix mouse position conversion to pixel coordinates, particularly on MacOS retina displays. #521
|
|
|
+- SDL: Use performance counters for increased time precision.
|
|
|
+- Win32: Center window in screen when opening it.
|
|
|
+
|
|
|
### Breaking changes
|
|
|
|
|
|
#### CMake and linking
|
|
|
@@ -400,18 +487,31 @@ The presets can be combined with other options, like `CMAKE_BUILD_TYPE` to selec
|
|
|
|
|
|
#### Layout
|
|
|
|
|
|
-- Possible layout changes, usually due to better CSS conformance. Please see notes above.
|
|
|
+Expect some possible layout shifts in existing documents, mainly due to better CSS conformance. Detailed notes are available above. Here are some particular situations where layout output may change, and ways to address them:
|
|
|
+
|
|
|
+- Some lines may become taller, with extra spacing added below its baseline.
|
|
|
+ - Possible solutions: Adjust the `vertical-align` property of any inline block elements on the line. For example, use top/center/bottom or manual vertical alignment. The line height itself can be adjusted with the `line-height` property.
|
|
|
+- Absolutely positioned elements may be placed relative to an element further up in the document tree.
|
|
|
+ - Add `position: relative` on the desired ancestor to establish its containing block.
|
|
|
+- The containing block size may change in some situations, which could affect percentages in (min-/max-) height properties.
|
|
|
+ - To establish a containing block size, make their parent have a definite (non-auto) height.
|
|
|
+- Some floated elements may have moved or now extend below parent boxes.
|
|
|
+ - Set the parent to use overflow != visible to establish a new block formatting context, or use the new `display: flow-root`.
|
|
|
+- Paint order on some elements may have changed.
|
|
|
+ - Change the tree order, or the `z-index` or `clip` properties as appropriate.
|
|
|
+- Size of shrink-to-fit boxes may have changed.
|
|
|
+- Position of documents with margins may have changed.
|
|
|
|
|
|
#### Elements
|
|
|
|
|
|
-- The text area element now clips to its padding area instead of the content area. You may want to adjust RCSS rules to account for this. If you use decorators to display borders, you can set the decorator paint area to `border-box` and add a transparent border: `decorator: image(my-textarea-background) border-box; border: 4dp transparent;`.
|
|
|
+- The text area element now clips to its padding area instead of the content area. You may want to adjust RCSS rules to account for this. If you use decorators to display borders for text areas, you can set the decorator paint area to `border-box` and add a transparent border, e.g. `decorator: image(my-textarea-background) border-box; border: 4px transparent;`.
|
|
|
|
|
|
#### Core types
|
|
|
|
|
|
-- Changed `Box` enums and `Property` units as follows:
|
|
|
- - `Box::Area` -> `BoxArea` (e.g. `Box::BORDER` -> `BoxArea::Border`, values now in titlecase).
|
|
|
- - `Box::Edge` -> `BoxEdge` (e.g. `Box::TOP` -> `BoxEdge::Top`, values now in titlecase).
|
|
|
- - `Box::Direction` -> `BoxDirection` (e.g. `Box::VERTICAL` -> `BoxDirection::Vertical`, values now in titlecase).
|
|
|
+- Changed `Box` enums and `Property` units as follows, now using strong types:
|
|
|
+ - `Box::Area` -> `BoxArea` (e.g. `Box::BORDER` -> `BoxArea::Border`, values now in pascal case).
|
|
|
+ - `Box::Edge` -> `BoxEdge` (e.g. `Box::TOP` -> `BoxEdge::Top`, values now in pascal case).
|
|
|
+ - `Box::Direction` -> `BoxDirection` (e.g. `Box::VERTICAL` -> `BoxDirection::Vertical`, values now in pascal case).
|
|
|
- `Property::Unit` -> `Unit` (e.g. `Property::PX` -> `Unit::PX`).
|
|
|
|
|
|
#### Core functions
|
|
|
@@ -419,7 +519,7 @@ The presets can be combined with other options, like `CMAKE_BUILD_TYPE` to selec
|
|
|
- Changed the signature of `LoadFontFace` (from memory) to take a `Span` instead of a raw pointer.
|
|
|
- Replaced `Element::ResolveNumericProperty` with `Element::ResolveLength` and `Element::ResolveNumericValue`. Can be used together with `Property::GetNumericValue`.
|
|
|
- Renamed and removed several `Math` functions.
|
|
|
-- Removed `max_size` argument from `CreateString` and `FormatString` methods, this is no longer needed.
|
|
|
+- Removed the `max_size` argument from `CreateString` and `FormatString` methods, this is no longer needed.
|
|
|
|
|
|
#### RCSS
|
|
|
|
|
|
@@ -429,19 +529,21 @@ The presets can be combined with other options, like `CMAKE_BUILD_TYPE` to selec
|
|
|
|
|
|
Affects all users with a custom backend renderer.
|
|
|
|
|
|
-- Signature changes to several functions, see notes above.
|
|
|
+- Signature changes to several functions, see notes above and the [updated documentation](https://mikke89.github.io/RmlUiDoc/pages/cpp_manual/interfaces/render.html).
|
|
|
- See `RenderInterfaceCompatibility` notes above for an adapter from the old render interface.
|
|
|
- Texture is no longer part of the CompileGeometry command, instead it is submitted with the Render... command(s).
|
|
|
+- The immediate rendering function has been removed in favor of the compiled geometry version.
|
|
|
+ - However, data pointers to the compile function are now stable, which should ease the transition.
|
|
|
- Implementing the new clip mask API is required for handling clipping of transformed elements.
|
|
|
- RmlUi now provides vertex colors and generated texture data in premultiplied alpha.
|
|
|
- - Set the blend mode to handle them accordingly. Recommended to convert your own textures to use premultiplied alpha. This ensures correct compositing, especially with layers and effects.
|
|
|
+ - Set the blend mode to handle them accordingly. It is recommended to convert your own textures to use premultiplied alpha. This ensures correct compositing, especially with layers and effects.
|
|
|
- Font effect color output now assumes premultiplied alpha. Color channels are initialized to black (previously white).
|
|
|
|
|
|
#### Render manager
|
|
|
|
|
|
Affects users with custom decorators and other more advanced usage with rendering commands.
|
|
|
|
|
|
-- RenderManager should now be used for all rendering instead of manually calling the render interface.
|
|
|
+- RenderManager should now be used for all rendering instead of directly calling into the render interface.
|
|
|
- Redefine Geometry, introduce Mesh.
|
|
|
- Mesh is used to define vertices and indices, before it is submitted to construct a Geometry through the render manager.
|
|
|
- Geometry is now a wrapper around the underlying geometry (to be) submitted to a render interface.
|
|
|
@@ -470,12 +572,6 @@ The font engine interface has been reworked to encompass new features, to simpli
|
|
|
|
|
|
- Removed the `<datagrid>` and `<dataselect>` elements, related utilities, and associated tutorials. Users are encouraged to replace this functionality by [tables](https://mikke89.github.io/RmlUiDoc/pages/rcss/tables.html), [select boxes](https://mikke89.github.io/RmlUiDoc/pages/rml/forms.html#select), and [data bindings](https://mikke89.github.io/RmlUiDoc/pages/data_bindings.html).
|
|
|
|
|
|
-#### Screenshots
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-[Effect sample](https://github.com/mikke89/RmlUi/assets/5490330/bdc0422d-867d-4090-9d48-e7159e3adc18)
|
|
|
-
|
|
|
|
|
|
## RmlUi 5.1
|
|
|
|
Michael Ragazzon