fullscreen_documentation.py 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. from nicegui import ui
  2. from . import doc
  3. @doc.demo(ui.fullscreen)
  4. def main_demo() -> None:
  5. fullscreen = ui.fullscreen()
  6. ui.button('Enter Fullscreen', on_click=fullscreen.enter)
  7. ui.button('Exit Fullscreen', on_click=fullscreen.exit)
  8. ui.button('Toggle Fullscreen', on_click=fullscreen.toggle)
  9. @doc.demo('Requiring long-press to exit', '''
  10. You can require users to long-press the escape key to exit fullscreen mode.
  11. This is useful to prevent accidental exits, for example when working on forms or editing data.
  12. Note that this feature only works in some browsers like Google Chrome or Microsoft Edge.
  13. ''')
  14. def long_press_demo():
  15. fullscreen = ui.fullscreen()
  16. ui.switch('Require escape hold').bind_value_to(fullscreen, 'require_escape_hold')
  17. ui.button('Toggle Fullscreen', on_click=fullscreen.toggle)
  18. @doc.demo('Tracking fullscreen state', '''
  19. You can track when the fullscreen state changes.
  20. Note that due to security reasons, fullscreen mode can only be entered from a previous user interaction
  21. such as a button click.
  22. ''')
  23. def state_demo():
  24. fullscreen = ui.fullscreen(
  25. on_value_change=lambda e: ui.notify('Enter' if e.value else 'Exit')
  26. )
  27. ui.button('Toggle Fullscreen', on_click=fullscreen.toggle)
  28. ui.label().bind_text_from(fullscreen, 'state',
  29. lambda state: 'Fullscreen' if state else '')
  30. doc.reference(ui.fullscreen)