Draft: Add text wrap support for Label widget on Winform and GTK

changes/2428.bugfix.rst

@@ -0,0 +1 @@
+Issue with `visibility` on GTK and `display` on all platform.

core/src/toga/style/pack.py

@@ -86,7 +86,7 @@ def _debug(self, *args): # pragma: no cover
  @property
  def _hidden(self):
  "Does this style declaration define a object that should be hidden"
- return self.visibility == HIDDEN
+ return self.visibility == HIDDEN or self.display == NONE
 
  def apply(self, prop, value):
  if self._applicator:
@@ -104,8 +104,8 @@ def apply(self, prop, value):
  self._applicator.set_color(value)
  elif prop == "background_color":
  self._applicator.set_background_color(value)
- elif prop == "visibility":
- self._applicator.set_hidden(value == HIDDEN)
+ elif prop == "visibility" or prop == "display":
+ self._applicator.set_hidden(self._hidden)
  elif prop in (
  "font_family",
  "font_size",
@@ -236,6 +236,11 @@ def _layout_node(
  else:
  width = available_width
  height = available_height
+ if hasattr(node._impl, 'compute_size'):
+ # To support text wraping, when fixing the width, we need to recompute the height.
+ width, height = node._impl.compute_size(width, height)
+ min_height = height
+
  # self._debug(f"NO CHILDREN {min_width=} {width=} {min_height=} {height=}")
 
  # If an explicit width/height was given, that specification
@@ -275,6 +280,9 @@ def _layout_row_children(
  min_width = 0
  remaining_width = available_width
  for child in node.children:
+ # Skip calculation if widget is not displayed
+ if child.style.display == NONE:
+ continue
  # self._debug(f"PASS 1 {child}")
  if child.style.width != NONE:
  # self._debug(f"- fixed width {child.style.width}")
@@ -404,6 +412,9 @@ def _layout_row_children(
  # Pass 2: Lay out children with an intrinsic flexible width,
  # or no width specification at all.
  for child in node.children:
+ # Skip calculation if widget is not displayed
+ if child.style.display == NONE:
+ continue
  # self._debug(f"PASS 2 {child}")
  if child.style.width != NONE:
  # self._debug("- already laid out (explicit width)")
@@ -489,6 +500,9 @@ def _layout_row_children(
  height = 0
  min_height = 0
  for child in node.children:
+ # Skip calculation if widget is not displayed
+ if child.style.display == NONE:
+ continue
  # self._debug(f"PASS 3: {child} AT HORIZONTAL {offset=}")
  if node.style.text_direction is RTL:
  # self._debug("- RTL")
@@ -522,6 +536,9 @@ def _layout_row_children(
 
  # Pass 4: set vertical position of each child.
  for child in node.children:
+ # Skip calculation if widget is not displayed
+ if child.style.display == NONE:
+ continue
  # self._debug(f"PASS 4: {child}")
  extra = height - (
  child.layout.content_height
@@ -559,6 +576,9 @@ def _layout_column_children(
  min_height = 0
  remaining_height = available_height
  for child in node.children:
+ # Skip calculation if widget is not displayed
+ if child.style.display == NONE:
+ continue
  # self._debug(f"PASS 1 {child}")
  if child.style.height != NONE:
  # self._debug(f"- fixed height {child.style.height}")
@@ -689,6 +709,9 @@ def _layout_column_children(
  # Pass 2: Lay out children with an intrinsic flexible height,
  # or no height specification at all.
  for child in node.children:
+ # Skip calculation if widget is not displayed
+ if child.style.display == NONE:
+ continue
  # self._debug(f"PASS 2 {child}")
  if child.style.height != NONE:
  # self._debug("- already laid out (explicit height)")
@@ -775,6 +798,9 @@ def _layout_column_children(
  width = 0
  min_width = 0
  for child in node.children:
+ # Skip calculation if widget is not displayed
+ if child.style.display == NONE:
+ continue
  # self._debug(f"PASS 3: {child} AT VERTICAL OFFSET {offset}")
  offset += child.style.padding_top
  child.layout.content_top = offset
@@ -800,6 +826,9 @@ def _layout_column_children(
 
  # Pass 4: set horizontal position of each child.
  for child in node.children:
+ # Skip calculation if widget is not displayed
+ if child.style.display == NONE:
+ continue
  # self._debug(f"PASS 4: {child}")
  extra = width - (
  child.layout.content_width

core/src/toga/widgets/label.py

@@ -9,6 +9,7 @@ def __init__(
  text: str,
  id=None,
  style=None,
+ wrap=False,
  ):
  """Create a new text label.
 
@@ -23,6 +24,7 @@ def __init__(
  self._impl = self.factory.Label(interface=self)
 
  self.text = text
+ self.wrap = wrap
 
  def focus(self):
  "No-op; Label cannot accept input focus"
@@ -47,3 +49,12 @@ def text(self, value):
 
  self._impl.set_text(text)
  self.refresh()
+
+ @property
+ def wrap(self) -> str:
+ return self._impl.get_wrap()
+
+ @text.setter
+ def wrap(self, value):
+ self._impl.set_wrap(bool(value))
+ self.refresh()

gtk/src/toga_gtk/widgets/activityindicator.py

@@ -16,9 +16,6 @@ def stop(self):
  self.native.stop()
 
  def rehint(self):
- # print("REHINT", self, self.native.get_preferred_width(), self.native.get_preferred_height())
- width = self.native.get_preferred_width()
- height = self.native.get_preferred_height()
-
+ width, height = self._get_preferred_size(self.native)
  self.interface.intrinsic.width = width[0]
  self.interface.intrinsic.height = height[0]

gtk/src/toga_gtk/widgets/base.py

@@ -57,7 +57,6 @@ def container(self, container):
  # setting container, adding self to container.native
  self._container = container
  self._container.add(self.native)
- self.native.show_all()
 
  for child in self.interface.children:
  child._impl.container = container
@@ -84,6 +83,17 @@ def get_tab_index(self):
  def set_tab_index(self, tab_index):
  self.interface.factory.not_implemented("Widget.set_tab_index()")
 
+ def _get_preferred_size(self, native):
+ # Utility function to get the preferred size of widget regardless of it's visibility.
+ visible = native.get_visible()
+ if not visible:
+ native.set_visible(True)
+ # print("REHINT", self, native.get_preferred_width(), native.get_preferred_height())
+ min_size, nat_size = native.get_preferred_size()
+ if not visible:
+ native.set_visible(visible)
+ return (min_size.width, nat_size.width),(min_size.height, nat_size.height)
+
  ######################################################################
  # CSS tools
  ######################################################################
@@ -185,9 +195,6 @@ def refresh(self):
 
  def rehint(self):
  # Perform the actual GTK rehint.
- # print("REHINT", self, self.native.get_preferred_width(), self.native.get_preferred_height())
- width = self.native.get_preferred_width()
- height = self.native.get_preferred_height()
-
+ width, height = self._get_preferred_size(self.native)
  self.interface.intrinsic.width = at_least(width[0])
  self.interface.intrinsic.height = at_least(height[0])

gtk/src/toga_gtk/widgets/button.py

@@ -41,10 +41,7 @@ def set_background_color(self, color):
  super().set_background_color(color)
 
  def rehint(self):
- # print("REHINT", self, self.native.get_preferred_width(), self.native.get_preferred_height())
- width = self.native.get_preferred_width()
- height = self.native.get_preferred_height()
-
+ width, height = self._get_preferred_size(self.native)
  self.interface.intrinsic.width = at_least(width[0])
  self.interface.intrinsic.height = height[1]
 

gtk/src/toga_gtk/widgets/canvas.py

@@ -299,7 +299,6 @@ def get_image_data(self):
 
  # Rehint
  def rehint(self):
- # print("REHINT", self, self.native.get_preferred_width(), self.native.get_preferred_height())
  # width = self.native.get_allocation().width
  # height = self.native.get_allocation().height
  width = self.interface._MIN_WIDTH

gtk/src/toga_gtk/widgets/divider.py

@@ -9,9 +9,7 @@ def create(self):
  self.native = Gtk.Separator()
 
  def rehint(self):
- width = self.native.get_preferred_width()
- height = self.native.get_preferred_height()
-
+ width, height = self._get_preferred_size(self.native)
  if self.get_direction() == self.interface.VERTICAL:
  self.interface.intrinsic.width = width[0]
  self.interface.intrinsic.height = at_least(height[1])

gtk/src/toga_gtk/widgets/label.py

@@ -22,14 +22,26 @@ def get_text(self):
 
  def set_text(self, value):
  self.native.set_text(value)
+
+ def get_wrap(self):
+ self.native.get_line_wrap()
+
+ def set_wrap(self, wrap):
+ self.native.set_line_wrap(wrap)
 
  def rehint(self):
- # print("REHINT", self,
- # self.native.get_preferred_width(), self.native.get_preferred_height(),
- # getattr(self, '_fixed_height', False), getattr(self, '_fixed_width', False)
- # )
- width = self.native.get_preferred_width()
- height = self.native.get_preferred_height()
-
+ width, height = self._get_preferred_size(self.native)
  self.interface.intrinsic.width = at_least(width[0])
  self.interface.intrinsic.height = height[1]
+
+ def compute_size(self, width, height):
+
+ if width and self.native.get_line_wrap():
+ # If wrapping is enabled, calculate prefered height with fixed width
+ req_width, req_height = self.native.get_size_request()
+ self.native.set_size_request(width, -1)
+ _unused, height = self._get_preferred_size(self.native)
+ self.native.set_size_request(req_width, req_height)
+ return width, height[0]
+
+ return width, height

gtk/src/toga_gtk/widgets/numberinput.py

@@ -64,9 +64,7 @@ def set_alignment(self, value):
  self.native.set_alignment(xalign)
 
  def rehint(self):
- width = self.native.get_preferred_width()
- height = self.native.get_preferred_height()
-
+ width, height = self._get_preferred_size(self.native)
  self.interface.intrinsic.width = at_least(
  max(self.interface._MIN_WIDTH, width[1])
  )

gtk/src/toga_gtk/widgets/progressbar.py

@@ -91,9 +91,6 @@ def stop(self):
  self._stop_indeterminate()
 
  def rehint(self):
- # print("REHINT", self, self.native.get_preferred_width(), self.native.get_preferred_height())
- width = self.native.get_preferred_width()
- height = self.native.get_preferred_height()
-
+ width, height = self._get_preferred_size(self.native)
  self.interface.intrinsic.width = at_least(width[0])
  self.interface.intrinsic.height = height[0]

gtk/src/toga_gtk/widgets/selection.py

@@ -89,8 +89,7 @@ def get_selected_index(self):
  return index
 
  def rehint(self):
- width = self.native.get_preferred_width()
- height = self.native.get_preferred_height()
+ width, height = self._get_preferred_size(self.native)
 
  # FIXME: 2023-05-31 This will always provide a size that is big enough,
  # but sometimes it will be *too* big. For example, if you set the font size

gtk/src/toga_gtk/widgets/slider.py

@@ -82,8 +82,7 @@ def get_tick_count(self):
  return self.tick_count
 
  def rehint(self):
- # print("REHINT", self, self.native.get_preferred_width(), self.native.get_preferred_height())
- height = self.native.get_preferred_height()
+ width, height = self._get_preferred_size(self.native)
 
  # Set intrinsic width to at least the minimum width
  self.interface.intrinsic.width = at_least(self.interface._MIN_WIDTH)

gtk/src/toga_gtk/widgets/switch.py

@@ -52,12 +52,8 @@ def set_font(self, font):
  self.apply_css("font", get_font_css(font), native=self.native_label)
 
  def rehint(self):
- # print("REHINT", self, self.native.get_preferred_width(), self.native.get_preferred_height())
- label_width = self.native_label.get_preferred_width()
- label_height = self.native_label.get_preferred_height()
-
- switch_width = self.native_switch.get_preferred_width()
- switch_height = self.native_switch.get_preferred_height()
+ label_width, label_height = self._get_preferred_size(native=self.native_label)
+ switch_width, switch_height = self._get_preferred_size(native=self.native_label)
 
  # Set intrinsic width to at least the minimum width
  self.interface.intrinsic.width = at_least(

gtk/src/toga_gtk/widgets/textinput.py

@@ -55,13 +55,7 @@ def set_value(self, value):
  self.native.set_text(value)
 
  def rehint(self):
- # print("REHINT", self,
- # self._impl.get_preferred_width(), self._impl.get_preferred_height(),
- # getattr(self, '_fixed_height', False), getattr(self, '_fixed_width', False)
- # )
- width = self.native.get_preferred_width()
- height = self.native.get_preferred_height()
-
+ width, height = self._get_preferred_size(self.native)
  self.interface.intrinsic.width = at_least(
  max(self.interface._MIN_WIDTH, width[1])
  )

gtk/src/toga_gtk/window.py

@@ -144,7 +144,10 @@ def set_app(self, app):
  app.native.add_window(self.native)
 
  def show(self):
- self.native.show_all()
+ # Avoid calling show_all() as it change the visibility of all children.
+ self.native.show()
+ self.layout.show()
+ self.container.show()
 
  ######################################################################
  # Window content and resources

temp.py

@@ -0,0 +1,44 @@
+import toga
+from toga.constants import ROW
+from toga.style.pack import Pack
+import toga.colors
+import sys
+
+IS_LINUX = sys.platform in ["linux", "linux2"]
+
+class TestApp(toga.App):
+ def startup(self):
+ # Re-enable pydev debugging in this thread.
+ try:
+ import pydevd;
+ pydevd.settrace()
+ except ImportError:
+ pass
+ self.main_window = toga.MainWindow(size=(300, 150))
+
+ style = Pack(padding_top=24)
+ substyle = Pack(padding_right=12, padding_left=12, flex=1)
+
+ # Add the content on the main window
+ self.main_window.content = toga.Box(
+ children=[
+ toga.Button(text="Toggle"),
+ toga.Label(text="This is a very long line of text to test the wrapping feature in GTK.", style=Pack(flex=1,background_color=toga.colors.BLUE), wrap=1),
+ toga.TextInput(placeholder="Footer"),
+ ],
+ style=Pack(direction=ROW, padding=24),
+ )
+
+ # Show the main window
+ self.main_window.show()
+
+def main():
+ # Application class
+ # App name and namespace
+ app = TestApp("Test", "org.beeware.toga.examples.test")
+ return app
+
+
+if __name__ == "__main__":
+ app = main()
+ app.main_loop()