Skip to content
Anleitungen
Streamlit
streamlit-button

Über die Grundlagen hinaus: Vollständiger Leitfaden für Streamlit-Buttons

Streamlit hat die Art und Weise, wie wir Datenanwendungen erstellen, revolutioniert. Mit seinem Low-Code-Ansatz ermöglicht es Datenwissenschaftlern und Entwicklern, interaktive, benutzerfreundliche Anwendungen mit Leichtigkeit zu erstellen. Eines der Schlüsselelemente in Streamlit, das zu dieser Interaktivität beiträgt, ist der bescheidene Button. In diesem Leitfaden tauchen wir tief in die Welt von Streamlit's st.button ein und erkunden seine Verwendungsmöglichkeiten, Style-Optionen und ereignisgesteuerten Fähigkeiten. Wir werden auch praktische Beispiele für Anfänger und erfahrene Entwickler bereitstellen.

Haben Sie von diesem großartigen Werkzeug zur Datenanalyse und Datenvisualisierung gehört, das Ihre Streamlit-App in Tableau verwandelt?

PyGWalker (opens in a new tab) ist eine Python-Bibliothek, die Ihnen dabei hilft, eine Tableau-ähnliche Benutzeroberfläche nahtlos in Ihre eigene Streamlit-App einzubetten. Schauen Sie sich dieses erstaunliche Video von Sven von Coding is Fun (opens in a new tab) an, in dem die detaillierten Schritte zur Stärkung Ihrer Streamlit-App mit dieser leistungsstarken Python-Datenvisualisierungsbibliothek demonstriert werden!


Ein besonderer Dank geht an Sven und seine großartige Unterstützung (opens in a new tab) für die PyGWalker-Community!

Darüber hinaus können Sie auf der PyGWalker-GitHub-Seite (opens in a new tab) weitere Beispiele für PyGWalker finden.

Verständnis von st.button in Streamlit

Was ist st.button in Streamlit?

In Streamlit ist st.button eine Funktion, die ein Button-Widget erstellt. Es ist ein einfaches, aber leistungsstarkes Werkzeug, mit dem Sie Interaktivität zu Ihren Streamlit-Anwendungen hinzufügen können. Wenn ein Benutzer auf einen Button klickt, löst dies ein Ereignis aus, das verwendet werden kann, um eine bestimmte Aktion auszuführen oder den Zustand der Anwendung zu aktualisieren.

if st.button('Sag Hallo'):
   st.write('Hallo, Streamlit!')

In dem obigen Beispiel wird auf dem Bildschirm der Text 'Hallo, Streamlit!' angezeigt, wenn auf den Button 'Sag Hallo' geklickt wird.

Verwendung von st.button in Streamlit

Die Verwendung von st.button in Streamlit ist unkompliziert. Die Funktion erfordert ein Pflichtargument - das Beschriftung des Buttons, das ein String ist. Es akzeptiert auch mehrere optionale Argumente, mit denen Sie das Verhalten und das Aussehen des Buttons anpassen können. Werfen wir einen Blick auf einige dieser Argumente:

  • key: Eindeutiger Bezeichner für den Button. Dies ist nützlich, wenn Sie mehrere Buttons haben und zwischen ihnen unterscheiden möchten.
  • help: Ein String, der als Tooltip angezeigt wird, wenn der Benutzer über den Button schwebt.
if st.button('Klick mich', key='mein_button', help='Klicken Sie auf diesen Button, um eine Aktion auszuführen'):
   st.write('Sie haben den Button geklickt!')

Erkunden von Argumenten und Style-Optionen für Streamlit-Button

Die st.button-Funktion von Streamlit bietet eine Reihe von Argumenten, mit denen Sie das Erscheinungsbild und das Verhalten Ihrer Buttons anpassen können. Zum Zeitpunkt des Schreibens unterstützt Streamlit jedoch nicht die direkte Änderung der Farbe und Größe eines Buttons über die st.button-Funktion.

Styling von Streamlit-Buttons mit CSS

Obwohl Streamlit keine integrierten Optionen zur Button-Stilisierung bietet, können Sie CSS verwenden, um Ihre Buttons anzupassen. Sie können benutzerdefiniertes CSS in Ihre Streamlit-App einfügen, indem Sie die Funktion st.markdown mit dem Argument unsafe_allow_html=True verwenden. Hier ist ein Beispiel:

st.markdown("""
<style>
.custom-button {
   background-color: #4CAF50;
   color: white;
   padding: 14px 20px;
   margin: 8px 0;
   border: none;
   cursor: pointer;
   width: 100%;
}
.custom-button:hover {
   opacity: 0.8;
}
</style>
<button class="custom-button">Benutzerdefinierter Button</button>
""", unsafe_allow_html=True)

In diesem Beispiel haben wir einen benutzerdefinierten Button mit einem grünen Hintergrund, weißem Text und etwas Abstand erstellt. Wir haben auch einen Hover-Effekt hinzugefügt, der die Transparenz des Buttons verringert, wenn die Maus darüber bewegt wird.

Das on_clickButton-Ereignis in Streamlit

In Streamlit wird das on_click-Ereignis ausgelöst, wenn ein Button geklickt wird. Dieses Ereignis kann verwendet werden, um eine bestimmte Aktion auszuführen oder den Zustand der Anwendung zu aktualisieren. Sie könnten zum Beispiel das on_click-Ereignis verwenden, um Daten zu aktualisieren, Inhalte anzuzeigen oder auszublenden oder eine Berechnung durchzuführen.

Hier ist ein Beispiel, wie Sie das on_click-Ereignis in Streamlit verwenden könnten:

def sag_hallo():
   st.write('Hallo, Streamlit!')
 
button = st.button('Sag Hallo')
button.on_click(sag_hallo)

In diesem Beispiel wird, wenn der Button 'Sag Hallo' geklickt wird, die Funktion sag_hallo aufgerufen, die 'Hallo, Streamlit!' auf den Bildschirm schreibt.

Praktische Beispiele für Streamlit-Button

Streamlit's st.button ist nicht nur ein theoretisches Konzept, sondern auch ein praktisches Werkzeug, das Sie verwenden können, um Interaktivität zu Ihren Anwendungen hinzuzufügen. Schauen wir uns einige Beispiele an, die veranschaulichen, wie Sie es effektiv nutzen können.

Beispiele für Streamlit-Buttons für Anfänger

Wenn Sie neu in Streamlit sind, hier ein einfaches Beispiel, um zu starten. Dieser Code erstellt einen Button, der bei einem Klick eine Nachricht anzeigt:

if st.button('Klick mich'):
    st.write('Sie haben den Button geklickt!')

In diesem Beispiel erstellt st.button('Klick mich') einen Button mit der Beschriftung 'Klick mich'. Wenn dieser Button geklickt wird, wird st.write('Sie haben den Button geklickt!') ausgeführt und die Nachricht 'Sie haben den Button geklickt!' wird auf dem Bildschirm angezeigt.

Fortgeschrittene Nutzung von Streamlit-Button

Für fortgeschrittene Benutzer können Sie Buttons verwenden, um den Ablauf Ihrer Anwendung zu steuern. Sie können zum Beispiel einen Button erstellen, der Daten lädt, wenn er angeklickt wird:

if st.button('Daten laden'):
    data = load_data()
    st.write(data)

In diesem Beispiel ruft das Anklicken des Buttons "Daten laden" die Funktion load_data auf und zeigt die zurückgegebenen Daten auf dem Bildschirm an.

Fazit

Streamlits st.button ist ein leistungsstolles Werkzeug für die Erstellung interaktiver, benutzerfreundlicher Anwendungen. Egal, ob Sie ein Anfänger sind, der gerade erst mit Streamlit beginnt, oder ein erfahrener Entwickler, der Interaktivität zu Ihren Anwendungen hinzufügen möchte, das Verständnis für die Verwendung und das Stylen von Buttons ist unerlässlich. Mit der Möglichkeit, das Verhalten und das Erscheinungsbild von Buttons anzupassen sowie Klickereignisse zu behandeln, können Sie eine Vielzahl von interaktiven Funktionen in Ihren Streamlit-Anwendungen erstellen. Also los geht's, fangen Sie an, mit st.button zu experimentieren und sehen Sie, was Sie erstellen können!

Hast du von diesem großartigen Werkzeug zur Datenanalyse und Datenvisualisierung gehört, das deine Streamlit-App in Tableau verwandelt?

PyGWalker (opens in a new tab) ist eine Python-Bibliothek, die Ihnen dabei hilft, eine Tableau-ähnliche Benutzeroberfläche problemlos in Ihre eigene Streamlit-App einzubetten.

PyGWalker zur Datenvisualisierung in Streamlit (opens in a new tab)

Häufig gestellte Fragen

Wie erstelle ich einen Button in Streamlit?

In Streamlit können Sie einen Button mit der Funktion st.button erstellen. Die Funktion erfordert ein Argument, das das Label des Buttons ist.

Wie positioniere ich einen Button in Streamlit?

Zum Zeitpunkt des Schreibens bietet Streamlit keine integrierte Unterstützung zum Positionieren von Elementen, einschließlich Buttons. Das Layout einer Streamlit-App wird hauptsächlich durch die Reihenfolge bestimmt, in der die Elemente im Skript hinzugefügt werden. Sie können jedoch Markdown und HTML in Kombination mit CSS verwenden, um benutzerdefinierte Layouts zu erstellen.

Wie erstelle ich einen Radio-Button in Streamlit?

In Streamlit können Sie eine Gruppe von Radio-Buttons mit der Funktion st.radio erstellen. Die Funktion erfordert zwei Argumente: ein Label für die Gruppe von Radio-Buttons und eine Liste von Optionen.

Was sind die Nachteile von Streamlit?

Obwohl Streamlit ein leistungsstarkes Tool zur Erstellung von Datenanwendungen ist, hat es einige Einschränkungen. Zum Beispiel bietet Streamlit zum Zeitpunkt des Schreibens keine integrierte Unterstützung zum Erstellen komplexer Layouts und zum Stylen von Elementen. Darüber hinaus kann das Verwalten des Zustands (wie Benutzereingaben oder Variablenwerte) herausfordernd sein, da Streamlit-Apps zustandslos konzipiert sind. Streamlit wird jedoch aktiv weiterentwickelt und gepflegt, und es werden regelmäßig neue Funktionen und Verbesserungen hinzugefügt.