Use Sciter library for GUI graphical interface programming in Gox language-GX23.1

Sciter is a very good cross-platform GUI graphical interface programming library. It only needs to attach a dynamic link library file to realize a graphical interface based on HTML/CSS/TiScript. It has been tested by many companies and commercial products and is stable and reliable. Our common companies or products, including TeamViewer, Symantec, Vmware, Evernote, 360, etc., are said to use Sciter to make the interface, which shows that Sciter is quite trustworthy.

Sciter provides bindings in multiple languages. In Gox language, Sciter is used through Go language (Golang) binding. For specific documents, please refer to Go-Sciter . This is also the Go language binding library officially recommended by Sciter.

After the 0.998a version of the Gox language, a small calculator program with a graphical interface can be implemented with a code similar to the following.

sciter = github_scitersdk_gosciter
window = github_scitersdk_gosciter_window

htmlT := `
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Calculator</title>
</head>
<body>
	<div style="margin-top: 10px; margin-bottom: 10px;">
		<span>Please enter the expression:</span>
	</div>
	<div style="margin-top: 10px; margin-bottom: 10px;">
		<input id="mainInputID" type=text />
	</div>
	<div>
		<button id="btnCal">Calculate!</button>
		<button id="btnClose">Close</button>
	</div>

    <script type="text/tiscript">
        $(#btnCal).on("click", function() {
			var result = eval($(#mainInputID).value);

			view.prints(String.printf("%v", result));

            $(#mainInputID).value = result;
        });
 
        $(#btnClose).on("click", function() {
            view.close();
        });
 
    </script>
</body>
</html>

`

runtime.LockOSThread()

w, err := window.New(sciter.DefaultWindowCreateFlag, sciter.DefaultRect)

checkError(err)

w.SetOption(sciter.SCITER_SET_SCRIPT_RUNTIME_FEATURES, sciter.ALLOW_EVAL | sciter.ALLOW_SYSINFO)

w.LoadHtml(htmlT, "")

w.SetTitle("Calculator")

w.DefineFunction("prints", func(args) {
	tk.Pl("%v", args[0].String())
	return sciter.NewValue("")
})

w.Show()

w.Run()

After the program runs, the interface is similar to the screenshot below:

You can enter any calculation in the text box, then click the "Calculate!" button to calculate, and click the "Close" button to exit the program. The following code will be released line by line to explain the version, you can better understand the general combination of Sciter and Gox.

// 首先按Gox语言的规则,用短名称引用github.com/scitersdk/go-sciter库和它的window子库
// 如果不使用简称,则可以直接使用github_scitersdk_gosciter这样的全称来引用,也是可以的,这样无需在一开始声明
sciter = github_scitersdk_gosciter
window = github_scitersdk_gosciter_window

// 这是默认准备加载的html文件内容,直接放在字符串里了
// 其中布局很简单,就是一个抬头,一个文本框用于输入算式,和两个按钮分别用于计算和退出程序
// 需要注意的是,Sciter并不支持Javascript来做脚本编程,而是使用自己的TiScript,据说某些方面比Javascript功能更强,相当于结合了JQuery的Javascript加强版吧
// 注意其中绑定两个按钮点击函数的方法,以及TiScript中选择器的用法
// 其中用到的view.prints函数则是绑定的后面注入的Go语言中编写的函数,这演示了如何在Sciter中调用Gox语言编写的函数,Gox语言与Sciter结合,才能发挥最大的威力
htmlT := `
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Calculator</title>
</head>
<body>
	<div style="margin-top: 10px; margin-bottom: 10px;">
		<span>Please enter the expression:</span>
	</div>
	<div style="margin-top: 10px; margin-bottom: 10px;">
		<input id="mainInputID" type=text />
	</div>
	<div>
		<button id="btnCal">Calculate!</button>
		<button id="btnClose">Close</button>
	</div>

    <script type="text/tiscript">
        $(#btnCal).on("click", function() {
			var result = eval($(#mainInputID).value);

			view.prints(String.printf("%v", result));

            $(#mainInputID).value = result;
        });
 
        $(#btnClose).on("click", function() {
            view.close();
        });
 
    </script>
</body>
</html>

`

// 由于所有GUI编程最好都保证在一个线程中执行界面操作,因此用这句话锁定线程
runtime.LockOSThread()

// 创建一个Sciter窗口
w, err := window.New(sciter.DefaultWindowCreateFlag, sciter.DefaultRect)

// 检查,有错误则直接退出程序执行
checkError(err)

// 设置一些必要的Sciter参数,例如允许eval函数等
w.SetOption(sciter.SCITER_SET_SCRIPT_RUNTIME_FEATURES, sciter.ALLOW_EVAL | sciter.ALLOW_SYSINFO)

// 在窗口中载入HTML文本,第二个参数可以设置基础的URL
w.LoadHtml(htmlT, "")

// 设置窗口标题栏文本
w.SetTitle("Calculator")

// 给Sciter注入prints函数,在TiScript中使用view.prints来调用
w.DefineFunction("prints", func(args) {
	tk.Pl("%v", args[0].String())
	return sciter.NewValue("")
})

// 显示Sciter窗口并执行
w.Show()
w.Run()

Sciter fully supports HTML/HTML 5, fully supports CSS 2.1 and part of CSS 3, and truly supports cross-platform. Because Gox language is also cross-platform, the above program can be executed directly in Windows, Linux and MacOS (note that each platform You must bring Sciter's dynamic link library. Under Windows, you only need to put sciter.dll in the same directory as the main Gox program. The latest Gox compression package already contains the dll file, which is relatively complicated in Linux and MacOS. Please refer to the documentation of Go-Sciter , just follow the first two steps to set up the dynamic link library file).

The main advantages of using Sciter library for GUI graphical interface programming in Gox language are:

  • Really supports cross-platform, Windows, Linux and MacOS are basically perfectly supported; and the LCL library in Gox is currently not supported on Linux and Mac;
  • Support virtual machine environment, Giu library is not supported on virtual machines and cloud servers because there is generally no OpenGL graphics card; Sciter has no problem at all;
  • Sciter's own TiScript scripting language can already solve many small problems. The calculation function in this example is implemented by the eval function in the TiScript language.
  • Developers who are unfamiliar with the Javascript language, or those who are more familiar with the Go language, can choose to use the Go language to complete related operations without TiScript. Basically all DOM operations and other functions can be achieved through the Gox language. Because of the Gox language It has a special blood relationship with Go language (Golang), so it can also take advantage of Go language's background processing strengths.

In addition, as a very powerful GUI programming library, it is recommended to fully read and refer to Sciter's official documents in order to achieve more complex GUI graphical interface programming. We will also launch corresponding articles for more detailed introductions and examples.

Guess you like

Origin blog.csdn.net/weixin_41462458/article/details/107653173