Let's add a button to our sample app:
from nicegui import ui
with ui.label ('Hello world, from ') :
ui.link ('nicegui', 'https://nicegui.io')
ui.button ('Tell me more', on_click = lambda : ui.notify ('Nice to meet you') )
ui.run ()This adds a button to our app with the text 'Tell me more'. Clicking the button triggers the code in the on_click parameter. In this case, we use a lambda function to call ui.notify, which pops up a notification message on the user's screen. You can learn more about the parameters to ui.button in the Controls section, and about ui.notify in the Layout section. (should notify be moved to Text Elements instead?)
Notice that we don't nest the button under the label element. Normally it doesn't make sense to nest buttons under text elements (though perhaps in rare cases it might). Which elements should be nested comes with practice. If you already know html, just think of how you would nest similar tags on a page.
Note
Even though Nicegui elements are eventually implemented with html tags, the conversions may not always be what you expect. Many tags are generated by quasar, and the tags for a particular nicegui element may change in different releases. Still, the way the equivalent html tags would be nested is a good conceptual guide.
You can learn about other types of controls Controls section. Now let's add some audiovisual elements to our app.