|
| 1 | +import streamlit as st |
| 2 | + |
| 3 | + |
| 4 | +def show_page(): |
| 5 | + # 创建页面标题 |
| 6 | + st.title("计算器") |
| 7 | + # 创建页面副标题 |
| 8 | + st.subheader("这是一个简单的计算器") |
| 9 | + # 创建页面描述 |
| 10 | + st.markdown(""" |
| 11 | + 这是第一版本的计算器,他的用处非常不大,勉强可以计算加法,但是还是可以计算很大的数字的加法。用起来不是很方便。 |
| 12 | + 但是,这是一个可以正常运行的计算器,这是一个很好的开始。BoyJiang同学在老师的指导下已经可以独立完成这个版本的计算器了。 |
| 13 | + 对于 streamlit 的玩法已经有了初步了解, 在这个过程中对很多基本的语法,数据类型有了一次难得的实战。 |
| 14 | + """) |
| 15 | + |
| 16 | + # 创建代码块显示当前代码 |
| 17 | + with st.expander("查看代码"): |
| 18 | + st.code(open(__file__, "r", encoding="utf-8").read(), language="python") |
| 19 | + |
| 20 | + # 创建一个分割线 |
| 21 | + st.divider() |
| 22 | + |
| 23 | + # 定义当前页面持久变量 left_val 表示加号左边的数字 |
| 24 | + if "left_val" not in st.session_state: |
| 25 | + st.session_state["left_val"] = "" |
| 26 | + |
| 27 | + # 定义当前页面持久变量 right_val 表示加号右边的数字 |
| 28 | + if "right_val" not in st.session_state: |
| 29 | + st.session_state["right_val"] = "" |
| 30 | + |
| 31 | + # 定义当前页面持久变量 pos 表示当前输入的位置是左边还是右边 |
| 32 | + if "pos" not in st.session_state: |
| 33 | + st.session_state["pos"] = "left" |
| 34 | + |
| 35 | + # 创建三个并排的列, 用于显示输入框 |
| 36 | + colin1, colin2, colin3 = st.columns(3) |
| 37 | + # 创建左边输入框 |
| 38 | + left_box = colin1.text_input("left", st.session_state["left_val"]) |
| 39 | + # 创建右边输入框 |
| 40 | + right_box = colin2.text_input("right", st.session_state["right_val"]) |
| 41 | + # 创建结果输入框,暂时使用一个空的容器 |
| 42 | + resultbox = colin3.container() |
| 43 | + |
| 44 | + def update_val(value): |
| 45 | + # 定义一个函数,用于更新输入框的值 |
| 46 | + pos = st.session_state["pos"] |
| 47 | + if pos == "left" and st.session_state["left_val"] not in ["0"]: |
| 48 | + st.session_state["left_val"] += value |
| 49 | + elif pos == "right" and st.session_state["right_val"] not in ["0"]: |
| 50 | + st.session_state["right_val"] += value |
| 51 | + st.rerun() |
| 52 | + |
| 53 | + # 创建一个九宫格的矩阵, 来模拟计算器的界面 |
| 54 | + col1, col2, col3 = st.columns(3) |
| 55 | + col4, col5, col6 = st.columns(3) |
| 56 | + col7, col8, col9 = st.columns(3) |
| 57 | + col10, col0, col12 = st.columns(3) |
| 58 | + |
| 59 | + # 创建一个函数,用于创建数字按钮 |
| 60 | + def create_number_button(column, number): |
| 61 | + if column.button(str(number)): |
| 62 | + update_val(str(number)) |
| 63 | + |
| 64 | + # 创建数字按钮序列,用语创建数字按钮 |
| 65 | + cols = [col0, col1, col2, col3, col4, col5, col6, col7, col8, col9] |
| 66 | + |
| 67 | + # 遍历数字按钮序列,创建数字按钮 |
| 68 | + for col in cols: |
| 69 | + create_number_button(col, cols.index(col)) |
| 70 | + |
| 71 | + # 创建加号按钮 |
| 72 | + if col10.button("加"): |
| 73 | + st.session_state["pos"] = "right" |
| 74 | + |
| 75 | + # 创建等号按钮, 点击等号按钮时,计算结果 |
| 76 | + if col12.button("="): |
| 77 | + try: |
| 78 | + lval = int(st.session_state["left_val"]) |
| 79 | + except: |
| 80 | + lval = 0 |
| 81 | + |
| 82 | + try: |
| 83 | + rval = int(st.session_state["right_val"]) |
| 84 | + except: |
| 85 | + rval = 0 |
| 86 | + |
| 87 | + result = str(lval + rval) |
| 88 | + resultbox.text_input("结果", result) |
| 89 | + |
| 90 | + # 创建清除按钮,点击清除按钮时,清除输入框的值 |
| 91 | + if st.button("清除"): |
| 92 | + st.session_state["left_val"] = "" |
| 93 | + st.session_state["right_val"] = "" |
| 94 | + st.session_state["pos"] = "left" |
| 95 | + st.rerun() |
0 commit comments