feat: Single/multiline support in TextInput and improved scrolling (#12127) 74f49dd1be

A few updates to TextInput:

- Adds a multiline core property so that TextInput can internally handle autoWidth vs autoHeight for text, and also encapsulates that functionality in the case where the core object is used on its own.
- Adds a ScrollDirection system enum and makes DraggableConstraint.directionValue animatable/bindable
- Scrolling and selection improvements. Click now places the caret immediately, drag consistently extends selection, and edge auto-scroll is smoother, with a scroll speed ramp up
- Adds an additional scroll to focus node fix if the focus node is larger than the scroll viewport.

Co-authored-by: Philip Chung <philterdesign@gmail.com>

Author: philter

.rive_head

@@ -1 +1 @@
-1902f9ddf3a529552d7e621652f47ff95642cd90
+74f49dd1be01d3a7918fa9881ce6de863dbb3fda

dev/defs/constraints/draggable_constraint.json

@@ -10,11 +10,13 @@
     "directionValue": {
       "type": "uint",
       "initialValue": "1",
+      "animates": true,
       "key": {
         "int": 722,
         "string": "directionvalue"
       },
-      "description": "Direction to scroll bar horizontal|vertical|all"
+      "description": "Direction to scroll bar horizontal|vertical|all",
+      "bindable": true
     }
   }
 }

dev/defs/text/text_input.json

@@ -36,6 +36,16 @@
       "description": "An edit time property used to track the height of the field in the inspector",
       "runtime": false,
       "coop": false
+    },
+    "multiline": {
+      "type": "bool",
+      "initialValue": "true",
+      "key": {
+        "int": 979,
+        "string": "multiline"
+      },
+      "description": "Whether the text input is single line or multiline",
+      "bindable": true
     }
   }
 }

include/rive/generated/core_registry.hpp

@@ -1887,6 +1887,9 @@ class CoreRegistry
             case TextFollowPathModifierBase::orientPropertyKey:
                 object->as<TextFollowPathModifierBase>()->orient(value);
                 break;
+            case TextInputBase::multilinePropertyKey:
+                object->as<TextInputBase>()->multiline(value);
+                break;
             case TextBase::fitFromBaselinePropertyKey:
                 object->as<TextBase>()->fitFromBaseline(value);
                 break;
@@ -3317,6 +3320,8 @@ class CoreRegistry
                 return object->as<TextFollowPathModifierBase>()->radial();
             case TextFollowPathModifierBase::orientPropertyKey:
                 return object->as<TextFollowPathModifierBase>()->orient();
+            case TextInputBase::multilinePropertyKey:
+                return object->as<TextInputBase>()->multiline();
             case TextBase::fitFromBaselinePropertyKey:
                 return object->as<TextBase>()->fitFromBaseline();
             case ScriptAssetBase::isModulePropertyKey:
@@ -4107,6 +4112,7 @@ class CoreRegistry
             case TextModifierRangeBase::clampPropertyKey:
             case TextFollowPathModifierBase::radialPropertyKey:
             case TextFollowPathModifierBase::orientPropertyKey:
+            case TextInputBase::multilinePropertyKey:
             case TextBase::fitFromBaselinePropertyKey:
             case ScriptAssetBase::isModulePropertyKey:
                 return CoreBoolType::id;
@@ -4984,6 +4990,8 @@ class CoreRegistry
                 return object->is<TextFollowPathModifierBase>();
             case TextFollowPathModifierBase::orientPropertyKey:
                 return object->is<TextFollowPathModifierBase>();
+            case TextInputBase::multilinePropertyKey:
+                return object->is<TextInputBase>();
             case TextBase::fitFromBaselinePropertyKey:
                 return object->is<TextBase>();
             case ScriptAssetBase::isModulePropertyKey:

include/rive/generated/text/text_input_base.hpp

@@ -1,6 +1,7 @@
 #ifndef _RIVE_TEXT_INPUT_BASE_HPP_
 #define _RIVE_TEXT_INPUT_BASE_HPP_
 #include <string>
+#include "rive/core/field_types/core_bool_type.hpp"
 #include "rive/core/field_types/core_double_type.hpp"
 #include "rive/core/field_types/core_string_type.hpp"
 #include "rive/drawable.hpp"
@@ -37,10 +38,12 @@ class TextInputBase : public Drawable
 
     static const uint16_t textPropertyKey = 817;
     static const uint16_t selectionRadiusPropertyKey = 818;
+    static const uint16_t multilinePropertyKey = 979;
 
 protected:
     std::string m_Text = "";
     float m_SelectionRadius = 5.0f;
+    bool m_Multiline = true;
 
 public:
     inline const std::string& text() const { return m_Text; }
@@ -65,11 +68,23 @@ class TextInputBase : public Drawable
         selectionRadiusChanged();
     }
 
+    inline bool multiline() const { return m_Multiline; }
+    void multiline(bool value)
+    {
+        if (m_Multiline == value)
+        {
+            return;
+        }
+        m_Multiline = value;
+        multilineChanged();
+    }
+
     Core* clone() const override;
     void copy(const TextInputBase& object)
     {
         m_Text = object.m_Text;
         m_SelectionRadius = object.m_SelectionRadius;
+        m_Multiline = object.m_Multiline;
         Drawable::copy(object);
     }
 
@@ -83,13 +98,17 @@ class TextInputBase : public Drawable
             case selectionRadiusPropertyKey:
                 m_SelectionRadius = CoreDoubleType::deserialize(reader);
                 return true;
+            case multilinePropertyKey:
+                m_Multiline = CoreBoolType::deserialize(reader);
+                return true;
         }
         return Drawable::deserialize(propertyKey, reader);
     }
 
 protected:
     virtual void textChanged() {}
     virtual void selectionRadiusChanged() {}
+    virtual void multilineChanged() {}
 };
 } // namespace rive
 

include/rive/text/text_input.hpp

@@ -2,15 +2,20 @@
 #define _RIVE_TEXT_INPUT_HPP_
 
 #include "rive/generated/text/text_input_base.hpp"
+#include "rive/advancing_component.hpp"
 #include "rive/text/raw_text_input.hpp"
 #include "rive/text/text_interface.hpp"
 #include "rive/input/focusable.hpp"
+#include <cmath>
 
 namespace rive
 {
 class TextStyle;
 class ScrollConstraint;
-class TextInput : public TextInputBase, public TextInterface, public Focusable
+class TextInput : public TextInputBase,
+                  public TextInterface,
+                  public Focusable,
+                  public AdvancingComponent
 {
 public:
     void draw(Renderer* renderer) override;
@@ -63,28 +68,44 @@ class TextInput : public TextInputBase, public TextInterface, public Focusable
 
     /// Advance edge scrolling during drag. Returns true if still scrolling.
     bool advanceDrag(float elapsedSeconds);
+    bool advanceComponent(float elapsedSeconds,
+                          AdvanceFlags flags = AdvanceFlags::Animate |
+                                               AdvanceFlags::NewFrame) override;
 
     /// Whether currently dragging (for hit test to avoid interference).
     bool isDragging() const { return m_isDragging; }
 
 protected:
     void textChanged() override;
     void selectionRadiusChanged() override;
+    void multilineChanged() override;
 
 private:
     /// Convert a world position to local text input coordinates.
     /// Handles viewport clamping and auto-scroll for scroll constraints.
-    bool worldToLocalWithViewport(Vec2D worldPosition, Vec2D& outLocal);
+    bool worldToLocalWithViewport(Vec2D worldPosition,
+                                  Vec2D& outLocal,
+                                  bool enableAutoScroll);
+
+    float edgeScrollSpeedForDistance(float distanceFromEdge) const;
+    float edgeActivationDistance(float position, float edgeStart) const;
+
+    void updateMultiline();
 
     AABB m_worldBounds;
     TextStyle* m_textStyle = nullptr;
     ScrollConstraint* m_scrollConstraint = nullptr;
 
     /// Whether the user is currently dragging to select text.
     bool m_isDragging = false;
+    Vec2D m_lastDragWorldPosition = Vec2D(NAN, NAN);
+
+    /// Scroll velocity for edge scrolling during drag in X.
+    float m_scrollX = 0.0f;
 
     /// Scroll velocity for edge scrolling during drag.
     float m_scrollY = 0.0f;
+    float m_layoutWidth = NAN;
 
 #ifdef WITH_RIVE_TEXT
     RawTextInput m_rawTextInput;

src/advancing_component.cpp

@@ -10,6 +10,7 @@
 #include "rive/scripted/scripted_drawable.hpp"
 #include "rive/scripted/scripted_layout.hpp"
 #include "rive/scripted/scripted_path_effect.hpp"
+#include "rive/text/text_input.hpp"
 
 using namespace rive;
 
@@ -29,6 +30,8 @@ AdvancingComponent* AdvancingComponent::from(Core* component)
             return component->as<ArtboardComponentList>();
         case ScrollConstraint::typeKey:
             return component->as<ScrollConstraint>();
+        case TextInputBase::typeKey:
+            return component->as<TextInput>();
         case ScriptedDataConverter::typeKey:
             return component->as<ScriptedDataConverter>();
         case ScriptedDrawable::typeKey:

src/focus_data.cpp

@@ -236,7 +236,13 @@ void FocusData::scrollConstraintToShowBounds(ScrollConstraint* constraint,
     // Calculate horizontal scroll adjustment.
     if (constraint->constrainsHorizontal())
     {
-        if (viewportLeft < 0)
+        float elementWidth = viewportRight - viewportLeft;
+        if (elementWidth > viewportWidth)
+        {
+            // Oversized element: keep the left edge visible.
+            deltaX = -viewportLeft;
+        }
+        else if (viewportLeft < 0)
         {
             // Element is to the left of viewport, scroll right (increase
             // offset)
@@ -253,7 +259,13 @@ void FocusData::scrollConstraintToShowBounds(ScrollConstraint* constraint,
     // Calculate vertical scroll adjustment
     if (constraint->constrainsVertical())
     {
-        if (viewportTop < 0)
+        float elementHeight = viewportBottom - viewportTop;
+        if (elementHeight > viewportHeight)
+        {
+            // Oversized element: keep the top edge visible.
+            deltaY = -viewportTop;
+        }
+        else if (viewportTop < 0)
         {
             // Element is above viewport, scroll up (increase offset)
             deltaY = -viewportTop;

src/text/raw_text_input.cpp

@@ -922,7 +922,7 @@ AABB RawTextInput::measure(float maxWidth, float maxHeight)
         m_textRun.unicharCount = (uint32_t)m_text.size();
         m_measuringShape->shape(m_text,
                                 Span<TextRun>(&m_textRun, 1),
-                                TextSizing::autoHeight,
+                                m_sizing,
                                 maxWidth,
                                 maxHeight,
                                 m_align,