go語言使用go-sciter創建桌面應用(一) 簡單的通過html,css寫ui


我們使用go-sciter,就不得不提Sciter,Sciter 是一個嵌入式的 HTML/CSS/腳本引擎,旨在為桌面應用創建一個 UI 框架層。

說簡單點就是我們通過它可以像寫html,css那樣寫桌面UI。

 

一、環境准備

第一步:從https://sciter.com/download/地址下載sciter-sdk

解壓,找到sciter-sdk\bin\64\sciter.dll復制到c:\windows\system32

注意上面的請根據你自已的系統選擇相應文件


第二步:由於使用到cgo,所以window下需要安裝mingw或tdm-gcc(建議安裝tdm-gcc)
下載地址:

https://sourceforge.net/projects/mingw/files/

下載地址:

http://tdm-gcc.tdragon.net/download

下載:mingw-get-setup.exe或tdm64-gcc-5.1.0-2.exe
安裝,然后把mingw\bin或tdm-gcc\bin加入到環境變量中


第三步:cmd進入gopath目錄並運行

go get -x github.com/sciter-sdk/go-sciter

  

二、通過html,css編寫簡單UI

demo1.go代碼如下:

package main

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

func main() {
	//創建window窗口
	//參數一表示創建窗口的樣式
	//SW_TITLEBAR 頂層窗口,有標題欄
	//SW_RESIZEABLE 可調整大小
	//SW_CONTROLS 有最小/最大按鈕
	//SW_MAIN 應用程序主窗口,關閉后其他所有窗口也會關閉
	//SW_ENABLE_DEBUG 可以調試
	//參數二表示創建窗口的矩形
	w, err := window.New(sciter.SW_TITLEBAR|
		sciter.SW_RESIZEABLE|
		sciter.SW_CONTROLS|
		sciter.SW_MAIN|
		sciter.SW_ENABLE_DEBUG,
		nil);
	if err != nil {
		log.Fatal(err);
	}
	//加載文件
	w.LoadFile("demo1.html");
	//設置標題
	w.SetTitle("你好,世界");
	//顯示窗口
	w.Show();
	//運行窗口,進入消息循環
	w.Run();
}

demo1.html代碼如下:

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
</head>
<body>
    你好,世界
</body>
</html>

如果出現亂碼請把demo1.html文件轉成gb2312並加上<meta charset="gb2312">或者轉成UTF-8+BOM(注意是加BOM,加BOM,加BOM)。

 

三、寫個表單的UI

demo2.go代碼如下:

package main

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

func main() {
	//創建window窗口
	//參數一表示創建窗口的樣式
	//SW_TITLEBAR 頂層窗口,有標題欄
	//SW_RESIZEABLE 可調整大小
	//SW_CONTROLS 有最小/最大按鈕
	//SW_MAIN 應用程序主窗口,關閉后其他所有窗口也會關閉
	//SW_ENABLE_DEBUG 可以調試
	//參數二表示創建窗口的矩形
	w, err := window.New(sciter.SW_TITLEBAR|
		sciter.SW_RESIZEABLE|
		sciter.SW_CONTROLS|
		sciter.SW_MAIN|
		sciter.SW_ENABLE_DEBUG,
		//給窗口設置個大小
		&sciter.Rect{Left: 0, Top: 0, Right: 500, Bottom: 500});
	if err != nil {
		log.Fatal(err);
	}
	//加載文件
	w.LoadFile("demo2.html");
	//設置標題
	w.SetTitle("表單");
	//顯示窗口
	w.Show();
	//運行窗口,進入消息循環
	w.Run();
}

demo2.html代碼如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表單</title>
    <style>
        table {
            width: 100%;
            border-collapse: collapse;
        }

        table td {
            padding: 10px;
            border: 1px solid #ccc;
        }

        table td:first-child {
            white-space:nowrap;
        }
    </style>
</head>
<body>
<form action="">
    <table>
        <tr>
            <td>用戶:</td>
            <td><input type="text"></td>
        </tr>
        <tr>
            <td>密碼:</td>
            <td><input type="password"></td>
        </tr>
        <tr>
            <td>性別:</td>
            <td>
                <input type="radio" value="0">男
                <input type="radio" value="1">女
            </td>
        </tr>
        <tr>
            <td>愛好:</td>
            <td>
                <input type="checkbox" value="">看書
                <input type="checkbox" value="">打球
                <input type="checkbox" value="">旅游
            </td>
        </tr>
        <tr>
            <td>簡介:</td>
            <td>
                <textarea name="" id="" cols="30" rows="10"></textarea>
            </td>
        </tr>
        <tr>
            <td></td>
            <td><input type="submit" value="提交"></td>
        </tr>
    </table>
</form>
</body>
</html>

是不是感覺很方便,我個人覺得未來這種方式寫UI會成為主流,傳統的過於繁瑣和麻煩了。

 

關於一些問題的說明

1、w.LoadFile() 無法加載相對路徑的文件,請確保你運行程序的目錄是否正確。

比如新版本的GoLand,在你右鍵Run時,程序所指向的目錄是你New Project時設置Location的目錄,而不是此時go腳本所在的目錄。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM