ebSkola

9. tēma / 9.3

9.3 Python pārvēršana tīmekļa saskarnē

Stundas uzdevums: Pārveidot terminālī darbojošos Python skriptu par tīmekļa lietotni ar Streamlit bibliotēku.

SR 2.4.7. Lietotāja saskarne (UI) SR 2.4.11. Standartizētas bibliotēkas

70 min plāns: Teorija un paraugs (~10 min) · 1. uzdevums (~15 min) - palaid pirmo Streamlit lapu · 2. uzdevums (~25 min) - pievieno ievades elementus un pogu · 3. uzdevums (~20 min) - pārcel savu Python spēli uz saskarni. Papildu uzdevumu sāc tikai tad, ja pārējie trīs ir gatavi.

Pirms sāc: aktivizē savu virtuālo vidi un izpildi pip install streamlit. Lapu palaidīsi ar streamlit run, nevis ar python.

Teorija: Streamlit - Python kā web saskarne

Streamlit ir Python ietvars, kas pārvērš parastu Python kodu par interaktīvu web lietotni - bez HTML/CSS/JS rakstīšanas.

import streamlit as st

# Virsraksti
st.title("Mans projekts")
st.header("Apakšsadaļa")
st.write("Vienkāršs teksts")
st.markdown("**Treknrakstā** un *kursīvā*")

# Ievades elementi
vards = st.text_input("Tavs vārds:")
vecums = st.number_input("Vecums", min_value=1, max_value=120, value=18)
ir_skoleens = st.checkbox("Es piedalos")
limenis = st.slider("Grūtība", 1, 10, 5)

if st.button("Sākt"):
    st.success(f"Sveiks, {vards}! ({vecums} g.)")

# Datu attēlošana
import pandas as pd
df = pd.DataFrame({"Vārds": ["Anna", "Jānis"], "Punkti": [120, 95]})
st.dataframe(df)
st.bar_chart(df.set_index("Vārds"))

Palaiž ar streamlit run app.py. Lapa pati pārlādējas, kad maini kodu!

Praktiskie uzdevumi

1. uzdevums -

Palaid pirmo Streamlit lapu

Beigās tavs Python kods būs redzams pārlūkā.

  1. Izveido failu lapa.py un ieraksti import streamlit as st.
  2. Pievieno rindu st.title("Mans projekts").
  3. Pievieno rindu st.write("Sveiks, pasaule!").
  4. Izpildi terminālī streamlit run lapa.py.
  5. Atver pārlūkā adresi, ko izdrukāja terminālis.
  6. Nomaini virsraksta tekstu, saglabā failu un vēro, kas notiek pārlūkā.

Gatavs, kad: pārlūkā redzams tavs virsraksts, un pēc faila saglabāšanas lapa pati piedāvā pārlādēties.

2. uzdevums -

Pievieno ievades elementus un pogu

Beigās lietotājs varēs ievadīt datus bez termināļa.

  1. Pievieno vards = st.text_input("Tavs vārds:").
  2. Pievieno vecums = st.number_input("Vecums", min_value=1, max_value=120).
  3. Pievieno if st.button("Apstiprināt"):.
  4. Izdrukā zem tā st.write(f"Sveiks, {vards}!").
  5. Palaid un ievadi savu vārdu.
  6. Pārbaudi, kas notiek, ja vārda lauks ir tukšs.
  7. Pievieno nosacījumu, kas prasa ievadīt vārdu.

Gatavs, kad: poga parāda sveicienu ar ievadīto vārdu, bet ar tukšu lauku parādās lūgums to aizpildīt.

3. uzdevums -

Pārcel savu Python spēli uz saskarni

Beigās tava vecā termināļa spēle strādās pārlūkā.

  1. Nokopē savu skaitļu minētāju no 4.6 stundas jaunā failā.
  2. Aizstāj katru input() ar st.number_input().
  3. Aizstāj katru print() ar st.write().
  4. Ieliec minējuma pārbaudi zem if st.button("Min!"):.
  5. Palaid un izmēģini vienu minējumu.
  6. Pieraksti, kas notiek ar slepeno skaitli pēc katra klikšķa.
  7. Pieraksti vienu secinājumu: kāpēc while cikls te vairs neder.

Gatavs, kad: spēle reaģē uz pogu, un tu vari izskaidrot, kāpēc skaitlis mainās pie katra klikšķa.

Papildu uzdevums - Pievieno sānjoslu

Ja pamatdarbs ir gatavs, pārcel iestatījumus uz sānjoslu.

  1. Pievieno st.sidebar.header("Iestatījumi").
  2. Pārcel diapazona izvēli uz st.sidebar.slider().
  3. Izmanto slidera vērtību spēles diapazonam.
  4. Palaid un nomaini diapazonu uz 1-1000.
  5. Pārbaudi, ka spēle strādā ar jauno diapazonu.

Gatavs, kad: sānjoslā ir slideris, un spēles diapazons mainās līdzi tā vērtībai.

Biežākās kļūdas

  • Lietotne pārlādējas no nulles: Streamlit pārpalaiž visu skriptu pie katras izmaiņas. Lieto session_state.
  • Streamlit komandas ārpus skripta: st.write u.c. strādā tikai streamlit run kontekstā.
  • Aizmirsts if st.button(): bloks: Bez tā kods izpildās uzreiz.

Koda piemērs

import streamlit as st
import random

st.title("▸ Skaitļu minētājs")

if "skaitlis" not in st.session_state:
    st.session_state.skaitlis = random.randint(1, 100)
    st.session_state.megi = 0

minejums = st.number_input("Min skaitli (1-100):", 1, 100, 50)

if st.button("Min!"):
    st.session_state.megi += 1
    if minejums == st.session_state.skaitlis:
        st.success(f"★ Trāpīts {st.session_state.megi}. mēģinājumā!")
    elif minejums < st.session_state.skaitlis:
        st.info("↑ Patiesais ir lielāks")
    else:
        st.info("↓ Patiesais ir mazāks")

if st.button("Jauna spēle"):
    del st.session_state.skaitlis
    st.rerun()
Web saskarne ar pogu un ievades lauku;
Pēc 'Min' tiek parādīts mājiens;
Pēc trāpījuma - uzvaras paziņojums.