update ui.image

nicegui/binding.py

@@ -173,6 +173,7 @@ class BindSourceMixin:
     """
     Mixin providing bind methods for attribute source.
     """
+    source = BindableProperty(on_change=lambda sender, source: sender.on_source_change(source))
 
     def bind_source_to(self, target_object: Any, target_name: str, forward: Callable = lambda x: x):
         bind_to(self, 'source', target_object, target_name, forward)
@@ -186,3 +187,9 @@ class BindSourceMixin:
                     forward: Callable = lambda x: x, backward: Callable = lambda x: x):
         bind(self, 'source', target_object, target_name, forward=forward, backward=backward)
         return self
+
+    def set_source(self, source: str) -> None:
+        self.source = source
+
+    def on_source_change(self, source: str) -> None:
+        pass

nicegui/elements/image.py

@@ -0,0 +1,20 @@
+from ..binding import BindSourceMixin
+from ..element import Element
+
+
+class Image(Element, BindSourceMixin):
+
+    def __init__(self, source: str = '') -> None:
+        """Image
+
+        Displays an image.
+
+        :param source: the source of the image; can be a URL or a base64 string
+        """
+        super().__init__('q-img')
+        self.source = source
+        self._props['src'] = source
+
+    def on_source_change(self, source: str) -> None:
+        self._props['src'] = source
+        self.update()

nicegui/elements/old/image.py

@@ -1,24 +0,0 @@
-import justpy as jp
-
-from ..binding import BindableProperty, BindSourceMixin
-from .group import Group
-
-
-class Image(Group, BindSourceMixin):
-    source = BindableProperty()
-
-    def __init__(self, source: str = ''):
-        """Image
-
-        Displays an image.
-
-        :param source: the source of the image; can be an URL or a base64 string
-        """
-        view = jp.QImg(src=source, temp=False)
-        super().__init__(view)
-
-        self.source = source
-        self.bind_source_to(self.view, 'src')
-
-    def set_source(self, source: str):
-        self.source = source

nicegui/elements/text_element.py

@@ -8,7 +8,8 @@ class TextElement(Element, BindTextMixin):
     def __init__(self, tag: str, text: str) -> None:
         super().__init__(tag)
         self.text = text
-        self.bind_text_to(self, '_text')
+        self._text = text
 
-    def on_text_change(self, _) -> None:
+    def on_text_change(self, text: str) -> None:
+        self._text = text
         self.update()

nicegui/ui.py

@@ -5,6 +5,7 @@ from .elements.card import CardActions as card_actions
 from .elements.card import CardSection as card_section
 from .elements.column import Column as column
 from .elements.icon import Icon as icon
+from .elements.image import Image as image
 from .elements.label import Label as label
 from .elements.row import Row as row
 from .elements.separator import Separator as separator