go語言使用go-sciter建立桌面應用(三) 事件處理，函數與方法定義，go與tiscript之間相互調用

時間 2019-11-30

標籤語言使用 sciter 建立桌面應用事件處理函數方法定義 tiscript 之間相互調用简体版

原文原文鏈接

sciter處理腳本tiscript，用於處理UI交互中的一些邏輯，跟js很像，但又有點區別，對前端熟悉的人應該能很快上手。html

tiscrip腳本文檔前端

https://sciter.com/developers/sciter-docs/script/

dom類文檔jquery

https://sciter.com/developers/sciter-docs/dom-classes/

demo4.go代碼以下：git

package main;

import (
	"github.com/sciter-sdk/go-sciter"
	"github.com/sciter-sdk/go-sciter/window"
	"log"
	"fmt"
)

//設置元素的處理程序
func setElementHandlers(root *sciter.Element) {
	btn1, _ := root.SelectById("btn1");
	//處理元素簡單點擊事件
	btn1.OnClick(func() {
		fmt.Println("btn1被點擊了");
	});

	//這裏給元素定義的方法是在tiscript中進行調用的
	//而且做爲元素的屬性進行訪問
	btn1.DefineMethod("test", func(args ...*sciter.Value) *sciter.Value {
		//咱們把從傳入的參數打印出來
		for _, arg := range args {
			//String()把參數轉換成字符串
			fmt.Print(arg.String() + " ");
		}

		//返回一個空值
		return sciter.NullValue();
	});
	btn2, _ := root.SelectById("btn2");
	//調用在tiscript中定義的方法
	data, _ := btn2.CallMethod("test2", sciter.NewValue("1"), sciter.NewValue("2"), sciter.NewValue("3"));
	//輸出調用方法的返回值
	fmt.Println(data.String());
}

//設置回調
func setCallbackHandlers(w *window.Window) {
	//CallbackHandler是一個結構，裏面定義了一些方法
	//你能夠經過實現這些方法，自定義自已的回調
	cb := &sciter.CallbackHandler{
		//加載數據開始
		OnLoadData: func(p *sciter.ScnLoadData) int {
			//顯示加載資源的uri
			fmt.Println("加載:", p.Uri());
			return sciter.LOAD_OK;
		},
		//加載數據過程當中
		OnDataLoaded: func(p *sciter.ScnDataLoaded) int {
			fmt.Println("加載中:", p.Uri());
			return sciter.LOAD_OK;
		},
	};
	w.SetCallback(cb);
}

//定義函數
func setWinHandler(w *window.Window) {
	//定義函數，在tis腳本中須要經過view對象調用

	//定義inc函數，返回參數加1
	w.DefineFunction("inc", func(args ...*sciter.Value) *sciter.Value {
		return sciter.NewValue(args[0].Int() + 1);
	});
	//定義dec函數，返回參數減1
	w.DefineFunction("dec", func(args ...*sciter.Value) *sciter.Value {
		return sciter.NewValue(args[0].Int() - 1);
	});
}

//測試調用函數
func testCallFunc(w *window.Window) {
	//調用tis腳本中定義的函數
	data, _ := w.Call("sum", sciter.NewValue(10), sciter.NewValue(20));
	fmt.Println(data.String());
	root, _ := w.GetRootElement();
	//咱們也能夠指定元素調用函數
	data, _ = root.CallFunction("sum", sciter.NewValue(50), sciter.NewValue(100));
	fmt.Println(data.String());
}

func main() {
	//建立一個新窗口
	w, err := window.New(sciter.DefaultWindowCreateFlag, sciter.DefaultRect);
	if err != nil {
		log.Fatal(err);
	}

	w.LoadFile("demo4.html");
	//設置標題
	w.SetTitle("事件處理");

	//設置回調處理程序
	setCallbackHandlers(w);
	//獲取根元素
	root, _ := w.GetRootElement();
	//設置元素處理程序
	setElementHandlers(root);
	//設置窗口處理程序
	setWinHandler(w);
	//測試調用函數
	testCallFunc(w);

	//顯示窗口
	w.Show();
	//運行窗口，進入消息循環
	w.Run();
}

demo4.html代碼以下：github

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>事件處理</title>
</head>
<body>
    <button id="btn1">點我</button>
    <button id="btn2">點我2</button>
    <button id="btn3">點我3</button>
    <button id="btn4">點我4</button>
    <script type="text/tiscript">
        //view是一個全局的視圖對象，root是加載的根元素
        var root = view.root;

        //經過self.$()方法選擇元素，相似jquery的$
        //self.$()這裏面參數不要加雙引號
        //咱們調用在go中爲btn1定義的方法
        $(#btn1).on("click", function() {
            //this指向的當前元素
            this.test("參數1", "參數2", "參數3");
        });

        //在go中也能夠調用咱們在tis中爲btn2定義的方法
        $(#btn2).test2 = function(a, b, c) {
            return String.printf("我是tis中爲btn2定義的方法test2 %v %v %v", a, b, c);
        };

        //咱們定義一個函數(注意函數與方法的區別)
        //這裏的函數並無指定屬於哪一個對象
        function sum(num1, num2) {
            return num1 + num2;
        }

        //調用go中定義的函數
        $(#btn3).on("click", function() {
            view.msgbox(#alert, view.dec(5));
        });
        $(#btn4).on("click", function() {
            view.msgbox(#alert, view.inc(5));
        });
    </script>
</body>
</html>