文章目录

1. 1. Live-Preview支持拖拽
2. 2. 使用Slint Python API

Slint是Rust语言开发的应用程序界面GUI开发框架，支持使用Rust/C++/Nodejs语言来开发应用。1.5版本发布，引入了对Python API的支持，还处于alpha阶段，1.6版本里对Python的支持有了改进；Live-Preview工具也开始支持拖拽，将组件拖入预览界面后，自动更新代码到.slint文件。

参考：

• Slint release 1.5发布 https://slint.dev/blog/slint-1.5-released
• Slint release 1.6发布 https://slint.dev/blog/slint-1.6-released

Live-Preview支持拖拽

先来看下Live-Preview的拖拽功能，感觉离可视化的界面设计工具又进了一步。这里以之前的文章Slint框架开发原生桌面应用中代码为例来看下使用效果。需要在vs code编辑器中安装slint插件, 且升级到了最新的版本；已安装插件时会在slint组件代码的位置出现Show Preview链接，点击后弹出live-preview工具，展示出当前组件的显示效果。

从下图gif中可以看到，将Input输入框从左侧面板拖入右侧面板从上往下移动时，当可以放置时会出现一条绿色的线条，放置后界面会展示新加入的Input输入框； 回看代码，发现Input组件已在添加在slint文件里了。

使用Slint Python API

Python API还是处理测试状态，不过已经可以使用Pip来进行安装了，需要使用Python3。

# 安装python slint
pip install slint

Python不像Rust有宏，需要将界面组件写在单独的一个.slint文件，然后从代码中加载。Slint提供的Python API可以直接将.slint文件中组件加载为一个对象，然后通过继承方式来定义函数与回调函数。 下面直接看代码。

先创建一个appwin1.slint文件，内容与Rust代码中slint::slint!宏里定义的相同，导出的组件名为MainWindow， 在python中就可以直接 import MainWindow了。组件中定义了属性name,count和回调函数 inc-count()。

import {Button, VerticalBox, LineEdit } from  "std-widgets.slint";
export component MainWindow inherits Window {
    property <string> name: "world";
    in-out property <int> count: 0;
    callback inc-count() -> int;

    width: 500px;
    height: 400px;
    
    VerticalBox {
        Rectangle {
            width: 200px;
            height: 30px;
            background: red;
            
            Text {
                text: "hello " + name;
                color: green;
            }
        
        }
        Button { 
            text: "Clicked " + count; 
            clicked => { root.inc-count(); }
        }
        
    }
}

下面是python代码，保存为app1.py, 通过执行python app1.py就可以直接执行。

import slint

class App(slint.loader.appwin1.MainWindow):
    def __init__(self):
        super().__init__()
        self.name = "Slint python"

    @slint.callback
    def inc_count(self):
        self.count = self.count + 1

app = App()
app.run()

• 从代码中可以看出，组件使用slint.loader.appwin1.MainWindow来引用的，slint.loader可以直接加载.slint文件， slint.loader.appwin1对应的是appwin1.slint文件，是从sys.path路径下查找下的，将.slint文件与python文件放在同一个目录下即可；
• 在构建函数__init__()中设置了name属性的值，因为是使用property修饰的，只有在这里可以修改，在回调函数中是不能访问的；
• 回调函数使用@slint.callback注解， def inc_count(self)对应于callback inc-count() -> int，名字对应关系与Rust中的相似，将横线换成下划线；
• 最后创建一个对象app = App(), 然后运行运行app.run()

程序运行效果图如下所示，单击按钮时显示文字Clicked 0次数会增大。

参考：

• Slint-python https://github.com/slint-ui/slint/tree/master/api/python#readme