go语言使用go-sciter创建桌面应用(五)加载元素资源

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› Go›Go教程

原作者: [db:作者] 来自: [db:来源] 收藏邀请

有些时候我们需要动态的给某个UI元素加载内容或数据。

demo6.go代码如下：

package main;

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

func load(root *sciter.Element) {
	frame, _ := root.SelectById("frame");
	//load()类似jquery.load()，用于给元素加载指定内容
	//加载html内容
	frame.Load("http://www.qq.com", sciter.RT_DATA_HTML);

	txt, _ := root.SelectById("txt");
	//附加元素事件处理
	txt.AttachEventHandler(&sciter.EventHandler{
		//OnDataArrived 当资源被加载但未使用时调用
		//返回true，取消资源使用
		//返回false，遵循正常过程
		OnDataArrived: func(he *sciter.Element, params *sciter.DataArrivedParams) bool {
			//设置元素html
			he.SetHtml(string(params.Data()), sciter.SIH_REPLACE_CONTENT);
			return false;
		},
	});
	//加载本地原始数据
	txt.Load("file:///D:/gopath/src/gui/1.txt", sciter.RT_DATA_RAW);

	img, _ := root.SelectById("img");
	img.AttachEventHandler(&sciter.EventHandler{
		//OnDataArrived 当资源被加载但未使用时调用
		OnDataArrived: func(he *sciter.Element, params *sciter.DataArrivedParams) bool {
			//设置属性，给img标签设置src
			he.SetAttr("src", params.Uri());
			return false;
		},
	});
	img.Load("http://mat1.gtimg.com/www/images/qq2012/qqLogoFilter.png", sciter.RT_DATA_IMAGE);

	script, _ := root.SelectById("script");
	script.AttachEventHandler(&sciter.EventHandler{
		//OnDataArrived 当资源被加载但未使用时调用
		OnDataArrived: func(he *sciter.Element, params *sciter.DataArrivedParams) bool {
			fmt.Println(string(params.Data()));
			return false;
		},
	});
	//加载脚本资源
	script.Load("http://apps.bdimg.com/libs/jquery/1.8.3/jquery.min.js", sciter.RT_DATA_SCRIPT);
}

func main() {
	w, err := window.New(sciter.DefaultWindowCreateFlag, sciter.DefaultRect);
	if err != nil {
		log.Fatal(err);
	}
	//加载文件
	w.LoadFile("demo6.html");
	//设置标题
	w.SetTitle("元素加载内容");
	//获取根元素
	root, _ := w.GetRootElement();
	//元素加载资源
	load(root);
	w.Show();
	w.Run();
}

demo6.html代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>元素加载内容</title>
    <style>
        #frame {
            width: 100%;
            height: 50%;
        }

        #txt {
            border: 1px solid #ccc;
            height: 50px;
            color: #000;
        }
    </style>
</head>
<body>
<iframe >

</iframe>

<div ></div>

<img >

<script type="text/javascript" ></script>
</body>
</html>