# OctoBTT **Repository Path**: countryboy521/OctoBTT ## Basic Information - **Project Name**: OctoBTT - **Description**: A UI that matches OctoPrint printer OctoBTT V2.0 - **Primary Language**: QML - **License**: Not specified - **Default Branch**: main - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 5 - **Created**: 2021-12-17 - **Last Updated**: 2022-11-30 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # OctoBTT V2 Sigma Version ## 介绍 * 新的UI框架系统,预览源代码 * 我们不断地添加背景功能。 ####   主界面结构 1. 主界面 1. 主页 1. 按钮面板区域 1. 工作区域 1. 默认状态 2. 透明状态 3. 不透明状态 2. 玻璃杯模糊 3. 单元格区域 1. 网格视图 2. 列表视图 3. 网格代理 4. 2. logo区域 3. 侧标按钮 4. 终端按钮 2. 控制台界面 3. 键盘界面 4. 提示框 5. 登录界面    ## 软件体系结构 * 客户端和服务器架构解决方案 * OctoPi -> OctoPrint服务->打印机 ## 安装教程 > (更新和升级操作不是冗余的 ) > > ### 1. Install OctoPrint * 你可以在引导目录**boot/wpa_supplicant.txt**创建一个WPA配置文件来添加WiFi连接 * 如果你是BX机器模型用户,你需要添加以下片段行到RaspberryPi **boot/config.txt**文件中,以在屏幕上正确显示它们: > * max_usb_current=1 > * hdmi_group=2 > * hdmi_mode=87 > * hdmi_cvt 1024 600 60 > * hdmi_drive=1 * SSH your PI on your computer for further action 在你电脑上登录你的树莓派 ### 2. Install OctoBTT : > Run Command (Installation): * rm -f startup.sh ; wget --no-check-certificate https://raw.githubusercontent.com/bigtreetech/OctoBTT_V2_GUI_Sigma/master/shell/startup.sh && sudo /bin/sh startup.sh > 联系Email: developer01@biqu3d.com ### 3. OctoBTT是在你等待自动设置完成后自动输入,然后重新启动 ## Contribute > 1. Fork the repository > 2. New Feat_ XXX branch > 3. Submit code > 4. New Pull Request ## 代码分析 ### pro文件 ``` QT += quick gui network concurrent core websockets ``` QtConcurrent : qt并发名称空间提供了高级api,可以编写多线程程序,而不使用低级线程基元素。 ![](https://raw.githubusercontent.com/LinuxZhaoLi/MyImage/main/csdn/20211217102556.png) ## 问题 1 QFont::setPointSizeF: Point size <= 0 (0.000000), must be greater than 0 2 无法联系代理服务器,因为与该服务器的连接被拒绝. 3 抑制不必要的消息 //disable-check M16 4 js== 或则 != 可能执行类型转换 // @disable-check M126 ## 环境 1 websocket 服务器: ## 进度 2021-12-20: 服务器为搭建。 2022-11-30 : 编译没有图标问题。 pro文件没有添加 svg 测试数据:/sockjs/websocket ws://127.0.0.1:8888/ws?id=207440720 ## 逻辑分析 1. qml 文件加载完成后建立ws服务连接。 2. 终端进程池技术 ## 代码分析 #### 1 边缘按钮:鼠标进入动画 宽度增大再减小 ``` SequentialAnimation { id: enterAnim running: false loops: 1 ParallelAnimation { NumberAnimation { target: edge_btn properties: "width" to: (edge_btn_area.width - edge_btn_area.height * 0.2) * 0.8 duration: 150 easing.type: Easing.OutBack } } ParallelAnimation { NumberAnimation { target: edge_btn properties: "width" to: edge_btn_area.width - edge_btn_area.height * 0.2 duration: 150 easing.type: Easing.OutBounce } } } ``` #### 2 当点击按钮后的序列动画 第一步: 按钮宽度变宽 第二步:改变工作区大小 第三步: 提示Z轴属性 第四步: