Implement AppLayout widget

ipywidgets/widgets/tests/test_widget_templates.py

@@ -3,6 +3,7 @@
 from unittest import TestCase
 
 import ipywidgets as widgets
+from ipywidgets.widgets.widget_templates import LayoutTemplate
 
 class TestTwoByTwoLayout(TestCase):
     """test layout templates"""
@@ -474,3 +475,20 @@ def test_merge_empty_cells(self):
         assert box.center.layout.grid_area == 'center'
 
         assert len(box.get_state()['children']) == 1
+
+class TestLayoutTemplate(TestCase):
+    """test mixin with layout properties"""
+
+    class DummyTemplate(LayoutTemplate):
+        layout = widgets.Layout()
+
+    def test_layout_updated_on_trait_change(self):
+        "test whether respective layout traits are updated when traits change"
+
+        template = self.DummyTemplate(width="100%")
+        assert template.width == '100%'
+        assert template.layout.width == '100%'
+
+        template.width = 'auto'
+        assert template.width == 'auto'
+        assert template.layout.width == 'auto'

ipywidgets/widgets/widget_templates.py

@@ -1,6 +1,8 @@
 """Implement common widgets layouts as reusable components"""
 
 from traitlets import Instance, Bool, Unicode, CaselessStrEnum
+from traitlets import HasTraits
+from traitlets import All
 from traitlets import observe
 
 from .widget import Widget
@@ -28,8 +30,8 @@
     }
 
 @doc_subst(_doc_snippets)
-class LayoutTemplate(GridBox):
-    """Base class for layout templates
+class LayoutTemplate(HasTraits):
+    """Mixin class for layout templates
 
     This class handles mainly style attributes (height, grid_gap etc.)
 
@@ -38,6 +40,12 @@ class LayoutTemplate(GridBox):
 
     {style_params}
 
+    Note
+    ----
+
+    This class is only meant to be used in inheritance as mixin with other
+    classes. It will not work, unless `self.layout` attribute is defined.
+
     """
 
     # style attributes (passed to Layout)
@@ -70,6 +78,11 @@ def __init__(self, **kwargs):
         super(LayoutTemplate, self).__init__(**kwargs)
         self._copy_layout_props()
 
+    @observe(All)
+    def _delegate_to_layout(self, change):
+        "delegate the trait types to their counterparts in self.layout"
+        setattr(self.layout, change['name'], change['new']) # pylint: disable=no-member
+        pass
 
     def _copy_layout_props(self):
 
@@ -78,11 +91,11 @@ def _copy_layout_props(self):
         for prop in _props:
             value = getattr(self, prop)
             if value:
-                setattr(self.layout, prop, value)
+                setattr(self.layout, prop, value) #pylint: disable=no-member
 
 
 @doc_subst(_doc_snippets)
-class AppLayout(LayoutTemplate):
+class AppLayout(GridBox, LayoutTemplate):
     """ Define an application like layout of widgets.
 
     Parameters
@@ -180,7 +193,7 @@ def _child_changed(self, change): #pylint: disable=unused-argument
         self._update_layout()
 
 @doc_subst(_doc_snippets)
-class TwoByTwoLayout(LayoutTemplate):
+class TwoByTwoLayout(GridBox, LayoutTemplate):
     """ Define a layout with 2x2 regular grid.
 
     Parameters