Update code docs

Author: jellyrock-bot

docs/components_ui_button_TextButton.bs.html

@@ -16,6 +16,10 @@
   m.top.observeField("minWidth", "onSizeChanged")
   m.top.observeField("minHeight", "onSizeChanged")
 
+  ' Enable render tracking on parent to know when component has rendered
+  m.top.enableRenderTracking = true
+  m.top.observeField("renderTracking", "onRenderComplete")
+
   applyTheme()
 end sub
 
@@ -67,38 +71,41 @@
 
 sub onTextChanged()
   m.buttonText.text = m.top.text
+  ' If already rendered, resize immediately. Otherwise wait for onRenderComplete
+  if m.top.renderTracking = "full"
+    setSizeAndCenterText()
+  end if
+end sub
+
+' Called when the component has rendered and we can measure the label accurately
+sub onRenderComplete()
+  if m.top.renderTracking <> "full" then return
   setSizeAndCenterText()
 end sub
 
 sub setSizeAndCenterText()
   if not isValid(m.buttonText) then return
   if m.buttonText.text.Len() = 0 then return
 
-  ' Store the current text to detect if we've already sized for this text
-  if not isValid(m.lastSizedText) then m.lastSizedText = ""
-  if m.lastSizedText = m.buttonText.text and isValid(m.top.width) and m.top.width > 0
-    ' We've already sized this text, just update the focus border and return
-    setFocusBorderSize()
-    return
-  end if
-  m.lastSizedText = m.buttonText.text
+  ' Reset label size to allow accurate measurement of text content
+  m.buttonText.width = 0
+  m.buttonText.height = 0
 
-  ' Always use font-based calculation to avoid stale localBoundingRect() issues
-  textLength = m.buttonText.text.Len()
-  fontSize = m.buttonText.font.size
-  charWidth = fontSize * 0.64
-  textWidth = textLength * charWidth
+  ' Get accurate text dimensions from rendered label
+  boundingRect = m.buttonText.localBoundingRect()
+  textWidth = boundingRect.width
 
-  ' Use font size for height to avoid stale localBoundingRect() issues
-  textHeight = fontSize
+  ' If not rendered yet, wait for onRenderComplete
+  if textWidth = 0 then return
 
-  ' print "[TextButton] text='"; m.buttonText.text; "', length="; textLength; ", charWidth="; charWidth; ", textWidth="; textWidth; ", textHeight="; textHeight
+  ' Calculate visible text height for equal padding
+  ' localBoundingRect height includes line spacing, adjust to match horizontal padding
+  fontSize = m.buttonText.font.size
+  visibleTextHeight = fontSize * 0.7
 
   ' Calculate button dimensions with padding
   buttonWidth = textWidth + (m.top.padding * 2)
-  buttonHeight = textHeight + (m.top.padding * 2)
-
-  ' print "[TextButton] size with padding: width=", buttonWidth, ", height=", buttonHeight
+  buttonHeight = visibleTextHeight + (m.top.padding * 2)
 
   ' Ensure minimum dimensions (this is the ONLY place minWidth should be enforced)
   if buttonWidth < m.top.minWidth
@@ -108,8 +115,6 @@
     buttonHeight = m.top.minHeight
   end if
 
-  ' print "[TextButton] ACTUAL size (using minWidth): width=", buttonWidth, ", height=", buttonHeight
-
   ' Set background size
   m.buttonBackground.width = buttonWidth
   m.buttonBackground.height = buttonHeight
@@ -120,6 +125,14 @@
   m.buttonText.translation = [0, 0]
 
   setFocusBorderSize()
+
+  ' Show the button now that it's properly sized
+  m.buttonBackground.visible = true
+  m.buttonBorder.visible = true
+  m.buttonText.visible = true
+
+  ' Signal that the button is ready (sized and visible)
+  m.top.ready = true
 end sub
 
 sub onPaddingChanged()

docs/components_ui_buttongroup_JRButtonGroup.bs.html

@@ -26,8 +26,47 @@
 ' center the button group horizontally
 ' NOTE: this centers using the entire screen width, not the parent bounding rect
 sub center()
-  buttonsBoundingRect = m.top.boundingRect()
+  ' Check if any child buttons have a 'ready' field that's not yet true
+  ' (This handles TextButtons that need to finish sizing before we can center)
+  allReady = true
+  for i = 0 to m.top.getChildCount() - 1
+    child = m.top.getChild(i)
+    if child <> invalid and child.hasField("ready") and not child.ready
+      allReady = false
+      ' Observe this child's ready field if not already observing
+      if m.observingReadyFields = invalid
+        m.observingReadyFields = []
+      end if
+      ' Check if we're already observing this child
+      alreadyObserving = false
+      for each observedChild in m.observingReadyFields
+        if observedChild.isSameNode(child)
+          alreadyObserving = true
+          exit for
+        end if
+      end for
+      if not alreadyObserving
+        child.observeField("ready", "onChildReady")
+        m.observingReadyFields.push(child)
+      end if
+    end if
+  end for
+
+  ' If all children are ready (or don't have ready fields), center now
+  if allReady
+    doCentering()
+  end if
+end sub
 
+' Called when a child button becomes ready
+sub onChildReady()
+  ' Try centering again - this will check if ALL children are now ready
+  center()
+end sub
+
+' Actually perform the centering calculation
+sub doCentering()
+  buttonsBoundingRect = m.top.boundingRect()
   m.top.translation = [(1920 - buttonsBoundingRect.width) / 2, m.top.translation[1]]
 end sub