[learning]steem区块链机器人开发学习活动(8)-为钱包写一个简单前端

in hive-180932 •  5 months ago  (edited)

目录:

上节课简单的了解了一下怎么转账,这节课来写一个简单的前端,让我们写的程序能够轻松的用起来。

python有个库叫streamlit,可以轻松的写个简陋的前端。当然前端这事情,用js更轻松好看。

首先安装一下streamlit

pip install streamlit

简单试用一下,我们首先输入两行:

import streamlit as st

st.title("一个钱包")

第一行是加载库,第二行就是显示一个标题的意思。

我们来尝试运行看看,我们打开一个命令行窗口,然后进去文件夹所在目录后输入:

streamlit run hello1.py

image.png

一般会自动打开一个网页,或者我们去浏览器手动输入:http://localhost:8501/

image.png

一个只有一个标题的web app就做好了,是不是很简单呢:)

接下来我们构想是写一个钱包的基础转账功能,
需要的栏目大概有这些:
1.账户
2.密码
3.转账给谁?
4.转账币种
5.金额
6.memo(备忘)

好,我们开始写

player=st.text_input("请输入账号")
password=st.text_input("请输入密码",type="password")

toplayer = st.text_input('转到to')

Token=st.text_input('转账币种Token')
Token=Token.upper()

number=st.text_input('数量Number')
memo = st.text_input('备忘memo')

button_trans=st.button('提交')

写好保存刷新一下就有了。

image.png

写了一堆代码,解释一下:
st.text_input("请输入账号"),这个是显示一个文本输入框的意思
st.text_input("请输入密码",type="password"),加上type="password",意思就是星号输入,输入密码的模式

Token=st.text_input('转账币种Token')
Token=Token.upper(),这里.upper()的意思就是输入的字母全部转为大写,统一格式以免出错。

st.button('提交'),这意思是新建一个按钮。

更多的用法,可以参考说明文档:http://blog.hubwiz.com/2019/11/07/streamlit-manual/

image.png

我们测试一下,发现无论输入啥都没反应,那当然,我们啥都没写嘛,用上节课学的知识,简单写一个转账的函数。

def trans(nodes,password,player,toplayer,money_number,token,memo):
    #加载密码和节点
    s = Steem(keys=[password],node=nodes)
    #加载账户
    account = Account(player,steem_instance=s)
    # 转账
    tx=account.transfer(toplayer,money_number, token,memo)
    return tx

这样一个函数就写好了,我们来试试调用看看。

if button_trans:
    tx = trans(nodes,password,player,toplayer,number,Token,memo)
    st.write(tx)

这代码很简单,if button_trans就是当按下去按钮的时候发生了啥事。
然后把上面几个文本输入框输入的内容传参到刚才写的函数里面,
最后把返回信息显示出来。streamlit 的显示方式就是st.write(tx)

我们来测试一下。

成功显示出信息的,有没成功我们查看区块浏览器看看。

https://steemd.com/tx/2af579023c318d22f6c41d3761f4d05c517f8d8b

很好的转出去了,完美。

至此,一个只有转账功能的简单区块链钱包就写好了,撒花。

下节课,我们来把这个简单的钱包部署在网上,方便提供给用户使用。

本节全部源代码可以从我的github获得:https://github.com/maiyude2018/how-to-build-a-wallet/blob/master/%E7%AC%AC2%E8%8A%82/hello1.py

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

長知識!

拍拍

Hello @maiyude, i noticed you mistakenly sent steem to @houbi-pro instead of @huobi-pro account some months ago. Please where you able to recover it?

Can't get it back.Lost forever.

Alright. Thank you.

This post has been featured in the latest edition of Witness Weekly...