Skyline基本操作模式封裝

我打農村來發表於2018-12-05

skyline基本操作模式

專案中基於skyline的瀏覽器外掛進行二次開發，基本的業務操作模式如下：

工具欄:點選工具欄某個功能，開啟操作模式。
onFrame:滑鼠移動預選物件，在能夠拾取或者選定操作的Fature物件上，改變渲染色彩。
OnLButtonUp:左鍵單擊選定物件，在onFrame渲染物件的基礎上，選定某個物件，並用不同於OnFrame的渲染色彩，再次渲染。同時，執行業務操作，查詢資料並彈出視窗或者其他。
OnRButtonUp:右擊結束當前操作模式，取消事件監聽、取消物件渲染、移除業務視窗等。

其中涉及到很多重複性的程式碼：

事件繫結與取消繫結

/**
 * 事件繫結
 * @returns {} 
 */
mouseModel.Attach = function () {
    mouseModel.sgworld.AttachEvent("OnFrame", mouseModel.onPointSelectOnFrame);
    mouseModel.sgworld.AttachEvent("OnLButtonUp", mouseModel.onPointSelectLButtonUp);
    mouseModel.sgworld.AttachEvent("OnRButtonUp", mouseModel.onPointSelectRButtonUp);
    mouseModel.sgworld.Window.SetInputMode(1);
}

/**
 * 解除繫結
 * @returns {} 
 */
mouseModel.Detach = function() {
    mouseModel.sgworld.DetachEvent("OnLButtonUp", mouseModel.onPointSelectLButtonUp);
    mouseModel.sgworld.DetachEvent("OnRButtonUp", mouseModel.onPointSelectRButtonUp);
    mouseModel.sgworld.DetachEvent("OnFrame", mouseModel.onPointSelectOnFrame);
    mouseModel.sgworld.Window.SetInputMode(0);
}

OnRButtonUp事件處理邏輯基本一致

mouseModel.onPointSelectRButtonUp = function () {
    mouseModel.Detach();
    if (mouseModel.lButtonFeature != null && mouseModel.lButtonFeature.Tint != null) {
        mouseModel.lButtonFeature.Tint.SetAlpha(0);
        mouseModel.lButtonFeature = null;
    }
    if (mouseModel.frameFeature != null && mouseModel.frameFeature.Tint != null) {
        mouseModel.frameFeature.Tint.SetAlpha(0);
        mouseModel.frameFeature = null;
    }
    //可能的業務處理邏輯
    ...
    return true;
}

OnFrame事件處理邏輯基本一致

mouseModel.onPointSelectOnFrame = function () {
    var mouseInfo = mouseModel.sgworld.Window.GetMouseInfo();
    var position = mouseModel.sgworld.Window.PixelToWorld(mouseInfo.X, mouseInfo.Y);
    if (position.Type === 8192 || position.Type === 4 || position.Type === 1) {
        try {
            if (mouseModel.frameFeature != null && (mouseModel.frameFeature.ObjectType === 33 || mouseModel.frameFeature.ObjectType === 38)) {
                mouseModel.frameFeature.Tint.SetAlpha(0);
            }
            //標記元素不再渲染
            if (mouseModel.lButtonFeature == null || position.ObjectID !== mouseModel.lButtonFeature.ID) {
                mouseModel.frameFeature = sgworld.Creator.GetObject(position.ObjectID);
                mouseModel.frameFeature.Tint.abgrColor = 0x8f0000f0;
            }
        } catch (e) {
        }
    }
}

OnLButtonUp事件Feature判斷處理邏輯一致

mouseModel.onPointSelectLButtonUp = function () {
    var mouseInfo = mouseModel.sgworld.Window.GetMouseInfo();
    var position = mouseModel.sgworld.Window.PixelToWorld(mouseInfo.X, mouseInfo.Y);
    if (position.Type === 8192 || position.Type === 4 || position.Type === 1 || position.Type === 1228
        || position.Type === 12288) {
        try {
            if (!mouseModel.frameFeature) return true;
            if (mouseModel.lButtonFeature != null && (mouseModel.lButtonFeature.ObjectType === 33 || mouseModel.lButtonFeature.ObjectType === 38)) {
                mouseModel.lButtonFeature.Tint.SetAlpha(0);
            }
            mouseModel.lButtonFeature = mouseModel.frameFeature;
            mouseModel.frameFeature = null;
            //設定16進位制顏色值
            mouseModel.lButtonFeature.Tint.abgrColor = 0x8f00f0f0;
            //業務處理
            ...
        } catch (e) {
            return false;
        }
    }
    return true;
}

操作模式封裝

因此基於專案中已經存在的大量重複程式碼的共性，對這種操作模式進行封裝，方便部分操作邏輯的統一，以後後續擴充套件的便捷。

function MouseMode(args) {
    var mouseModel = {};
    mouseModel.sgworld = args.sgworld;
    //左鍵處理邏輯回撥
    mouseModel.lButtonUpCallback = args.lButtonUpCallback;
    //右鍵處理邏輯回撥
    mouseModel.rButtonUpCallback = args.rButtonUpCallback;
    //左鍵選定Feature
    mouseModel.lButtonFeature = null;
    //frame預選Feature
    mouseModel.frameFeature = null;

    /**
     * 事件繫結
     * @returns {} 
     */
    mouseModel.Attach = function () {
        mouseModel.sgworld.AttachEvent("OnFrame", mouseModel.onPointSelectOnFrame);
        mouseModel.sgworld.AttachEvent("OnLButtonUp", mouseModel.onPointSelectLButtonUp);
        mouseModel.sgworld.AttachEvent("OnRButtonUp", mouseModel.onPointSelectRButtonUp);
        mouseModel.sgworld.Window.SetInputMode(1);
    }

    /**
     * 解除繫結
     * @returns {} 
     */
    mouseModel.Detach = function() {
        mouseModel.sgworld.DetachEvent("OnLButtonUp", mouseModel.onPointSelectLButtonUp);
        mouseModel.sgworld.DetachEvent("OnRButtonUp", mouseModel.onPointSelectRButtonUp);
        mouseModel.sgworld.DetachEvent("OnFrame", mouseModel.onPointSelectOnFrame);
        mouseModel.sgworld.Window.SetInputMode(0);
    }

    /**
     * 右鍵處理
     * @returns {} 
     */
    mouseModel.onPointSelectRButtonUp = function () {
        mouseModel.Detach();
        if (mouseModel.lButtonFeature != null && mouseModel.lButtonFeature.Tint != null) {
            mouseModel.lButtonFeature.Tint.SetAlpha(0);
            mouseModel.lButtonFeature = null;
        }
        if (mouseModel.frameFeature != null && mouseModel.frameFeature.Tint != null) {
            mouseModel.frameFeature.Tint.SetAlpha(0);
            mouseModel.frameFeature = null;
        }
        //可能的業務回撥
        if (mouseModel.rButtonUpCallback) {
            mouseModel.rButtonUpCallback();
        }
        return true;
    }

    /**
     * 左鍵處理
     * @returns {} 
     */
    mouseModel.onPointSelectLButtonUp = function () {
        var mouseInfo = mouseModel.sgworld.Window.GetMouseInfo();
        var position = mouseModel.sgworld.Window.PixelToWorld(mouseInfo.X, mouseInfo.Y);
        if (position.Type === 8192 || position.Type === 4 || position.Type === 1 || position.Type === 1228
            || position.Type === 12288) {
            try {
                if (!mouseModel.frameFeature) return true;
                if (mouseModel.lButtonFeature != null && (mouseModel.lButtonFeature.ObjectType === 33 || mouseModel.lButtonFeature.ObjectType === 38)) {
                    mouseModel.lButtonFeature.Tint.SetAlpha(0);
                }
                mouseModel.lButtonFeature = mouseModel.frameFeature;
                mouseModel.frameFeature = null;
                //設定16進位制顏色值
                mouseModel.lButtonFeature.Tint.abgrColor = 0x8f00f0f0;
                //業務回撥
                if (mouseModel.lButtonUpCallback) {
                    mouseModel.lButtonUpCallback(mouseModel.sgworld, mouseModel.lButtonFeature, mouseModel.frameFeature);
                }
            } catch (e) {
                return false;
            }
        }
        return true;
    }


    mouseModel.onPointSelectOnFrame = function () {
        var mouseInfo = mouseModel.sgworld.Window.GetMouseInfo();
        var position = mouseModel.sgworld.Window.PixelToWorld(mouseInfo.X, mouseInfo.Y);
        if (position.Type === 8192 || position.Type === 4 || position.Type === 1) {
            try {
                if (mouseModel.frameFeature != null && (mouseModel.frameFeature.ObjectType === 33 || mouseModel.frameFeature.ObjectType === 38)) {
                    mouseModel.frameFeature.Tint.SetAlpha(0);
                }
                //左鍵選定元素不再渲染
                if (mouseModel.lButtonFeature == null || position.ObjectID !== mouseModel.lButtonFeature.ID) {
                    mouseModel.frameFeature = sgworld.Creator.GetObject(position.ObjectID);
                    mouseModel.frameFeature.Tint.abgrColor = 0x8f0000f0;
                }
            } catch (e) {
            }
        }
    }

    mouseModel.Attach();
    return mouseModel;
}

使用方式

var mouseMode = new MouseMode({
    sgworld: sgworld,
    lButtonUpCallback: function (sgworld, feature, lastFeature) {
        //業務處理程式碼
    },
    rButtonUpCallback: function () {
        //業務處理程式碼
    }
});

這樣是不是簡單了許多，這裡統一了onFrame和LButtonUp時Feature渲染色彩，開放了LButtonUp和RButtonUp時業務處理邏輯。

其實，這個封裝之前就寫好了，但是奈何skyline除錯的複雜性，有幾個問題一直沒有解決，今天再次翻出來，一一搞定，真的是時間是解決一切問題的利器呀，還是涼拌好。終於刪除一大堆我討厭的程式碼了!!!

Sqlite封裝1-基本封裝-SqliteTool
2017-08-02
SQLite封裝
PHP封裝的一個單例模式Mysql操作類
2017-05-17
PHP封裝單例模式MySql
單體模式封裝
2016-09-13
模式封裝
封裝操作cookie的方法
2019-02-16
封裝Cookie
Java 封裝 HDFS API 操作
2016-03-26
Java封裝API
c# Lambda操作類封裝
2018-10-01
C#封裝
作業系統封裝操作
2020-09-25
作業系統封裝
javascript操作cookie程式碼封裝
2017-04-12
JavaScriptCookie封裝
如何封裝資料庫操作
2004-09-21
封裝資料庫
MVP模式的經典封裝
2018-01-19
MVP模式封裝
靜態PDO基礎操作封裝
2019-02-16
封裝
OpenResty Redis操作二次封裝
2022-08-29
RESTRedis封裝
作業系統封裝操作薦
2008-01-17
作業系統封裝
模板方法模式--封裝演算法
2014-08-12
模式封裝演算法
PHP 技巧 - 封裝基本的資料型別
2019-12-23
PHP封裝資料型別
Golang 對MongoDB的操作簡單封裝
2019-03-02
GolangMongoDB封裝
nodejs + express + mssql 封裝資料操作
2019-02-16
NodeJSExpressSQL封裝
node.js 封裝操作檔案類
2024-05-10
Node.js封裝
命令模式-將請求封裝成物件
2020-12-31
模式封裝物件
六、nodejs安裝和基本操作
2020-11-11
NodeJS
seleniumAPI常用操作大全和 API再封裝
2021-03-03
API封裝
Android 封裝AsyncTask操作Sqlite資料庫
2018-04-10
Android封裝SQLite資料庫
使用元件封裝資料庫操作(二) (轉)
2007-08-17
元件封裝資料庫
使用元件封裝資料庫操作(一) (轉)
2007-08-14
元件封裝資料庫
.Net Standard HttpClient封裝Htt請求常用操作整理
2020-04-04
HTTPclient封裝
javascript字串操作程式碼封裝程式碼例項
2017-04-17
JavaScript字串封裝
關於資料庫操作的封裝程式碼
2002-11-28
資料庫封裝
【封裝那些事】缺失封裝
2018-05-15
封裝
工廠模式-將物件的建立封裝起來
2020-12-25
模式物件封裝
使用 Repository 設計模式封裝通用的 CURD
2021-11-14
設計模式封裝
封裝一個簡易版的ajax操作物件
2019-01-05
封裝物件
js　封裝的自動建立表格的相關操作
2013-12-15
JS封裝
封裝
2020-12-12
封裝
Skyline V6.6.1安裝檔案下載及使用
2016-01-05
webpack 基本操作
2019-03-29
Web
Git基本操作
2019-03-13
Git
Laravel 基本操作
2019-05-30
Laravel
基本操作題
2019-05-04

Skyline基本操作模式封裝

skyline基本操作模式

操作模式封裝

使用方式

相關文章