Flexx一个强大的跨平台的纯Python开发的Web的GU

　　1说明：
　　1。1Flexx是一个纯python工具包，用于创建图形界面应用程序（GUI）。
　　1。2FlexX是跨平台的，因为它使用纯Python开发。
　　1。3它使用Web技术呈现接口；可以使用flexx创建桌面应用程序，也可以导出应用程序以分离HTML文档。
　　1。4如果在桌面模式下运行，建议使用Firefox浏览器。
　　2准备：
　　2。1官网：https：flexx。readthedocs。ioenstablehttps：github。comflexxuiflexx
　　2。2安装：pipinstallflexx本机安装pip3。8installflexx
　　2。3报错一：未建立软连接，我暂时跳过也能使用WARNING：Thescriptwebruntimeisinstalledinusrlocalpython3。8binwhichisnotonPATH。ConsideraddingthisdirectorytoPATHor，ifyouprefertosuppressthiswarning，usenowarnscriptlocation。WARNING：Thescriptflexxisinstalledinusrlocalpython3。8binwhichisnotonPATH。ConsideraddingthisdirectorytoPATHor，ifyouprefertosuppressthiswarning，usenowarnscriptlocation。
　　2。4报错二：可能是版本兼容问题frombz2importBZ2Compressor，BZ2DecompressorModuleNotFoundError：Nomodulenamedbz2
　　2。5环境：
　　华为笔记本电脑、深度deepinlinux操作系统、谷歌浏览器、python3。8和微软vscode编辑器。
　　2。6解决报错二的方法，我没有重新编译python3。8，而是换一种方法，如下。
　　2。7如果在机器上没有bz2。cpython37mx8664linuxgnu。so的话，可以到这里下载：
　　链接：https：pan。baidu。coms1GzUY4E0G2yVUfqxHOIzn1A
　　提取码：oiwh
　　2。8本机是python3。8，故将下载bz2。cpython37mx8664linuxgnu。so文件，修改一下：bz2。cpython38mx8664linuxgnu。so，并拷贝到python3的安装目录，如本机usrlocalpython3。8libpython3。8sitepackagesusrlocalpython3。8libpython3。8libdynload
　　2。9终端法：在cpbz2。cpython38mx8664linuxgnu。so文件的目录下，打开终端，输入cpbz2。cpython38mx8664linuxgnu。sousrlocalpython3。8libpython3。8sitepackagescpbz2。cpython38mx8664linuxgnu。sousrlocalpython3。8libpython3。8libdynload
　　3简述：
　　Flexx使用模块化设计，包含一些子系统：
　　uiUI部件
　　app事件循环和服务器
　　reactreactive编程
　　pyscriptPythontoJavaScripttranspiler
　　webruntimetolauncharuntime
　　注意：
　　1、下面的代码，运行的浏览器是谷歌浏览器，非推荐的火狐浏览器，所以适当修改代码。
　　2、带大家入门，有注释和基本用法。
　　4Helloworld：
　　4。1代码：fromflexximportflxclassExample（flx。Widget）：内置CSS定义样式，还是要学一点html的相关知识的CSS。flxLabel｛background：9d9；width：200px；height：3px｝definit（self）：flx。Label（texthelloworld你好世界）网页的标题名和样式定义，注意这个样式是指html或body的背景颜色定义appflx。App（Example，titleTemperature19512014，stylebackground：pink；）导出或者保存为一张单html文件app。export（example。html，link0）Exporttosinglefileapp。launch（browser）showitnowinabrowserflx。run（）enterthemainloopflx。start（）与run小区别就是退出循环，还可再启动
　　4。2操作和效果图：
　　4。3flx。run与flx。start的区别，图：
　　5带CSS的转动的点组成的圆：
　　5。1代码：fromtimeimporttimefromflexximportflxclassCircle（flx。Label）：CSSbody｛body的背景颜色这种方法backgroundcolor：rgb（49，107，233）；backgroundcolor：black；｝。flxCircle｛圆点为red，注意可以直接如下，也可以使用：f00为红色background：blue；backgroundcolor：black；borderradius：10px；width：10px；height：10px；｝classCircles（flx。Widget）：definit（self）：withflx。PinboardLayout（）：self。circles〔Circle（）foriinrange（32）〕self。tick（）deftick（self）：globalMath，windowttime（）fori，circleinenumerate（self。circles）：xMath。sin（i0。2t）3050yMath。cos（i0。2t）3050circle。applystyle（dict（leftx，topy））window。setTimeout（self。tick，30）ifnamemain：mflx。App（Circles）。launch（app）指定火狐浏览器，容易报错mflx。App（Circles）。launch（）打开默认浏览器，谷歌浏览器flx。run（）
　　5。2操作和效果图：
　　6带滑动条的sin绘图：
　　6。1代码：fromflexximportflxclassSineExample（flx。Widget）：definit（self）：time〔i100foriinrange（100）〕withflx。VBox（）：withflx。HBox（）：文本标签flx。Label（textFrequency：）滑动条设置self。slider1flx。Slider（min1，max10，value5，flex1）flx。Label（textPhase：）self。slider2flx。Slider（min0，max6，value0，flex1）绘图控件self。plotflx。PlotWidget（flex1，xdatatime，xlabeltime，ylabelamplitude，titleasinusoid）flx。reactiondefupdateamplitude（self，events）：globalMathfreq，phaseself。slider1。value，self。slider2。valueydata〔〕forxinself。plot。xdata：ydata。append（Math。sin（freqx2Math。PIphase））self。plot。setdata（self。plot。xdata，ydata）ifnamemain：mflx。launch（SineExample）flx。run（）
　　6。2图：
　　7主题表单：
　　7。1代码：fromflexximportflxclassThemedForm（flx。Widget）：CSS。flxButton｛background：9d9；｝。flxLineEdit｛border：2pxsolid9d9；｝definit（self）：withflx。HFix（）：withflx。FormLayout（）asself。form：self。b1flx。LineEdit（titleName：，textHola）self。b2flx。LineEdit（titleAge：，textHelloworld）self。b3flx。LineEdit（titleFavoritecolor：，textFoobar）flx。Button（textSubmit1）flx。Widget（flex1）有间隙空行withflx。FormLayout（）asself。form：self。b4flx。LineEdit（titleName：，textHola）self。b5flx。LineEdit（titleAge：，textHelloworld）self。b6flx。LineEdit（titleFavoritecolor：，textFoobar）flx。Button（textSubmit2）flx。Widget（flex1）没有间隙空行的ifnamemain：mflx。launch（ThemedForm，app）报错，这是默认火狐浏览器的mflx。launch（ThemedForm）启动本机默认的谷歌浏览器flx。run（）
　　7。2图：
　　8附注几个demo图：
　　8。1chatroom：聊天室
　　8。2pointpaint：
　　8。3Bootstrap：
　　8。4scrollandbutton：
　　8。5PlotlyGeoDemo：
　　官网的demo显示超级强大的例子
　　自己整理并分享出来
　　喜欢的人，请点赞、关注、评论、转发和收藏。