浏览代码

add infinite scroll example

Falko Schindler 2 年之前
父节点
当前提交
0593ccbee7
共有 2 个文件被更改,包括 19 次插入0 次删除
  1. 2 0
      README.md
  2. 17 0
      examples/infinite_scroll/main.py

+ 2 - 0
README.md

@@ -93,6 +93,8 @@ You may also have a look at the following examples for in-depth demonstrations o
   shows how to write and integrate a custom vue component
 - [Image Mask Overlay](https://github.com/zauberzeug/nicegui/blob/main/examples/image_mask_overlay/main.py):
   shows how to overlay an image with a mask
+- [Infinite Scroll](https://github.com/zauberzeug/nicegui/blob/main/examples/infinite_scroll/main.py):
+  shows an infinitely scrolling image gallery
 
 ## Why?
 

+ 17 - 0
examples/infinite_scroll/main.py

@@ -0,0 +1,17 @@
+#!/usr/bin/env python3
+import time
+
+from nicegui import ui
+
+
+@ui.page('/')
+def page():
+    async def check():
+        response = await ui.run_javascript('window.pageYOffset >= document.body.offsetHeight - 2 * window.innerHeight')
+        if list(response.values())[0]:
+            ui.image(f'https://picsum.photos/640/360?{time.time()}')
+    yield
+    ui.timer(0.1, check)
+
+
+ui.run()