- /** @language chinese
- * <p>lufylegend.js专用UI,定义包含一个或多个菜单的顶级水平菜单栏</p>
- * <p>使用时需要引进lufylegend.ui-x.x.x.js文件。</p>
- * @class UI:LMenubar
- * @constructor
- * @extends LSprite
- * @param {Array} list 菜单列表,列表的具体格式请看下面的使用举例。
- * @param {Object} style [可选]菜单属性,包含textSize(文字大小),horizontalIndent(水平间隔),verticalIndent(垂直间隔),textColor(文字颜色),lineColor(分割线颜色),backgroundColor(菜单背景颜色),itemBackgroundColor(子菜单背景颜色),selectColor(菜单选中颜色)。
- * @since 0.1.0
- * @examplelink <p><a href="../../../api/ui/LMenubar.html" target="_blank">测试链接</a></p>
- * @public
- */
- var LMenubar = (function () {
- function LMenubar (list, style) {
- var s = this;
- LExtends(s, LSprite, []);
- s.type = "LMenubar";
- if (!style) {
- style = {};
- }
- if (!style.textSize) {
- style.textSize = 20;
- }
- if (!style.horizontalIndent) {
- style.horizontalIndent = 10;
- }
- if (!style.verticalIndent) {
- style.verticalIndent = 5;
- }
- if (!style.textColor) {
- style.textColor = "#000000";
- }
- if (!style.lineColor) {
- style.lineColor = "#CCCCCC";
- }
- if (!style.backgroundColor) {
- style.backgroundColor = "#FFFFFF";
- }
- if (!style.itemBackgroundColor) {
- style.itemBackgroundColor = style.backgroundColor;
- }
- if (!style.selectColor) {
- style.selectColor = "#1E90FF";
- }
- s.style = style;
- var back = new LSprite();
- back.graphics.drawRect(0, "#ffffff", [-LGlobal.width, -LGlobal.height, LGlobal.width * 2, LGlobal.height * 2]);
- s.addChild(back);
- s.back = back;
- s.back.root = s;
- s.back.mainMenu = true;
- s.back.background = true;
- s.back.addEventListener(LMouseEvent.MOUSE_UP, function (e) {});
- s.back.addEventListener(LMouseEvent.MOUSE_MOVE, function (e) {});
- s.back.addEventListener(LMouseEvent.MOUSE_DOWN, function (e) {
- var root = e.clickTarget.root;
- for (var j = 0; j < root.childList.length; j++) {
- if (root.childList[j].mainMenu) {
- if (root.childList[j].background) {
- continue;
- }
- var rW = root.childList[j].getWidth();
- var rH = root.childList[j].getHeight();
- root.childList[j].graphics.clear();
- root.childList[j].graphics.drawRect(0, root.style.lineColor, [0, 0, rW, rH], true, root.style.backgroundColor);
- continue;
- }
- root.childList[j].visible = false;
- }
- root.open = false;
- setTimeout(function () {
- root.back.visible = false;
- root.dispatchEvent(LMenubar.MENU_CLOSE);
- }, 100);
- });
- s.back.visible = false;
- s.setList(s, list, 0, 0, 0);
- }
- /** @language chinese
- * 菜单栏关闭时调用此事件。
- * @event LMenubar.MENU_CLOSE
- * @since 0.1.0
- */
- LMenubar.MENU_CLOSE = "menu_close";
- LMenubar.prototype.openMainMenu = function (index) {
- var self = this;
- self.mousedown({clickTarget : self.getChildAt(index + 1)});
- };
- LMenubar.prototype.mousedown = function (e) {
- var target = e.clickTarget;
- var root = target.root;
- if (target.mainMenu) {
- if (root.open) {
- return;
- }
- root.open = true;
- root.back.visible = true;
- root.select = target;
- var sW = target.getWidth();
- var sH = target.getHeight();
- target.graphics.clear();
- target.graphics.drawRect(0, root.style.selectColor, [0, 0, sW, sH], true, root.style.selectColor);
- if (target.menuList && target.menuList.length) {
- for (var j = 0; j < target.menuList.length; j++) {
- target.menuList[j].visible = true;
- target.menuList[j].graphics.clear();
- target.menuList[j].graphics.drawRect(1, root.style.lineColor, [0, 0, target.childWidth, target.childHeight], true, root.style.itemBackgroundColor);
- if (target.menuList[j].arrow) {
- target.menuList[j].arrow.x = target.childWidth - root.style.horizontalIndent * 2;
- }
- }
- }
- return;
- }
- if (!target.menuList) {
- if (target.click) {
- target.click({target : root});
- root.open = false;
- setTimeout(function () {
- root.back.visible = false;
- }, 100);
- }
- for (var j = 0; j < root.childList.length; j++) {
- if (root.childList[j].mainMenu) {
- continue;
- }
- root.childList[j].visible = false;
- }
- }
- };
- LMenubar.prototype.mousemove = function (e) {
- var target = e.clickTarget;
- var root = target.root;
- if (!root.open) {
- return;
- }
- if (root.select && root.select.objectIndex == target.objectIndex) {
- return;
- }
- if (root.select) {
- var rW = root.select.getWidth();
- var rH = root.select.getHeight();
- root.select.graphics.clear();
- root.select.graphics.drawRect(root.select.mainMenu ? 0 : 1, root.style.lineColor, [0, 0, rW, rH], true, root.select.mainMenu ? root.style.backgroundColor : root.style.itemBackgroundColor);
- }
- var sW = target.getWidth();
- var sH = target.getHeight();
- target.graphics.clear();
- target.graphics.drawRect(0, root.style.selectColor, [0, 0, sW, sH], true, root.style.selectColor);
- if (target.mainMenu) {
- for (var j = 0; j < root.childList.length; j++) {
- if (root.childList[j].mainMenu) {
- continue;
- }
- root.childList[j].visible = false;
- }
- } else if (root.select.depth == target.depth) {
- if (root.select.menuList && root.select.menuList.length) {
- for (var j = 0; j < root.select.menuList.length; j++) {
- root.select.menuList[j].visible = false;
- }
- }
- } else if (root.select.depth > target.depth) {
- if (root.select.upper.menuList && root.select.upper.menuList.length) {
- for (var j = 0; j < root.select.upper.menuList.length; j++){
- root.select.upper.menuList[j].visible = false;
- }
- }
- }
- if (target.menuList && target.menuList.length) {
- for (var j = 0; j < target.menuList.length; j++) {
- target.menuList[j].visible = true;
- target.menuList[j].graphics.clear();
- target.menuList[j].graphics.drawRect(1, root.style.lineColor, [0, 0, target.childWidth, target.childHeight], true, target.menuList[j].mainMenu ? root.style.backgroundColor : root.style.itemBackgroundColor);
- if (!target.mainMenu) {
- target.menuList[j].x = target.x + target.getWidth();
- }
- if (target.menuList[j].arrow) {
- target.menuList[j].arrow.x = target.childWidth - root.style.horizontalIndent * 2;
- }
- }
- }
- root.select = target;
- };
- LMenubar.prototype.mainMenuHide = function (value) {
- var self = this;
- for (var j = 0; j < self.childList.length; j++) {
- if (self.childList[j].mainMenu) {
- self.childList[j].visible = false;
- }
- }
- };
- LMenubar.prototype.setList = function (layer, list, depth, sx, sy) {
- var s = this, w = 0, h = 0, menuList = [];
- layer.childWidth = 0;
- layer.childHeight = 0;
- for (var i = 0; i < list.length; i++) {
- var child = list[i];
- var menu = new LSprite();
- menu.depth = depth;
- menuList.push(menu);
- var label = new LTextField();
- menu.root = s;
- menu.upper = layer;
- menu.click = child.click;
- label.size = s.style.textSize;
- label.color = s.style.textColor;
- label.text = child.label;
- label.x = s.style.horizontalIndent;
- label.y = s.style.verticalIndent;
- menu.addChild(label);
- menu.graphics.drawRect(0, s.style.backgroundColor, [0, 0, label.getWidth() + s.style.horizontalIndent * 2, label.getHeight() + s.style.verticalIndent * 2], true, s.style.backgroundColor);
- menu.addEventListener(LMouseEvent.MOUSE_DOWN, s.mousedown);
- menu.addEventListener(LMouseEvent.MOUSE_MOVE, s.mousemove);
- if (s.objectIndex == layer.objectIndex) {
- menu.x = w + sx;
- menu.y = 0 + sy;
- menu.mainMenu = true;
- w += label.getWidth() + s.style.horizontalIndent * 2;
- h = label.getHeight() + s.style.verticalIndent * 2;
- if (layer.childWidth < label.getWidth() + s.style.horizontalIndent * 2) {
- layer.childWidth = label.getWidth() + s.style.horizontalIndent * 2;
- }
- if (layer.childHeight < label.getHeight() + s.style.verticalIndent * 2) {
- layer.childHeight = label.getHeight() + s.style.verticalIndent * 2;
- }
- } else {
- menu.x = 0 + sx;
- menu.y = h + sy;
- w = w > label.getWidth() + s.style.horizontalIndent * 4 ? w : label.getWidth() + s.style.horizontalIndent * 4;
- h += label.getHeight() + s.style.verticalIndent * 2;
- if (layer.childWidth < label.getWidth() + s.style.horizontalIndent * 4) {
- layer.childWidth = label.getWidth() + s.style.horizontalIndent * 4;
- }
- if (layer.childHeight < label.getHeight() + s.style.verticalIndent * 2) {
- layer.childHeight = label.getHeight() + s.style.verticalIndent * 2;
- }
- }
- s.addChild(menu);
- if (child.list && child.list.length > 0) {
- if (s.objectIndex == layer.objectIndex) {
- s.setList(menu, child.list, depth + 1, menu.x, menu.y + menu.getHeight());
- } else {
- var arrow = new LSprite();
- menu.arrow = arrow;
- menu.addChild(arrow);
- arrow.x = label.getWidth() + s.style.horizontalIndent * 2;
- arrow.y = label.y;
- arrow.graphics.drawVertices(0, s.style.textColor, [[0, 0], [0, label.getHeight()], [s.style.horizontalIndent, label.getHeight() * 0.5]], true, s.style.textColor);
- s.setList(menu, child.list, depth + 1, menu.x + menu.getWidth() + s.style.horizontalIndent * 2, menu.y);
- }
- }
- if (s.objectIndex != layer.objectIndex) {
- menu.visible = false;
- }
- }
- layer.menuList = menuList;
- };
- return LMenubar;
- })();
-