Commit 31ab18fe authored by 李维's avatar 李维

完成文字选项多选

parent 370448c0
......@@ -10,13 +10,16 @@ const {ccclass, property} = cc._decorator;
@ccclass
export default class NewClass extends cc.Component {
@property({displayName: "标题内容", })
titleName: string = "请选择答案";
titleName: string = "请选择答案(可能有多个选项)";
@property({type: cc.Float, displayName: "窗口宽度", })
width: number = 1000;
@property({type: cc.Float, displayName: "标题高度", })
headerHeight: number = 150;
headerHeight: number = 120;
@property({type: cc.Float, displayName: "底栏高度", })
footerHeight: number = 120;
@property({type: cc.Float, displayName: "选项高度", })
optionHeight: number = 120;
......@@ -40,9 +43,11 @@ export default class NewClass extends cc.Component {
const center = cc.find("center", this.node);
const header = cc.find("center/header", this.node);
const list = cc.find("center/list", this.node);
const footer = cc.find("center/footer", this.node);
center.width = this.width;
header.width = this.width;
footer.width = this.width;
list.width = this.width;
this.node.x = 0;
......@@ -91,13 +96,15 @@ export default class NewClass extends cc.Component {
const list = cc.find("center/list", this.node);
if(type == "textList") {
this.initTitle("请选择答案");
this.initTitle("请选择答案(可能有多个选项)");
const listLayout = cc.find("center/list/layout_options", this.node);
const itemTemplate = cc.find("center/list/layout_options/item_tempate", this.node);
const buttonOK = cc.find("center/footer/btn_ok", this.node);
listLayout.active = true;
option.forEach((item, index) => {
const optionNode = cc.instantiate(itemTemplate);
const check = cc.find("icon_check", optionNode)
// 第一个选项不显示顶部分隔条
if(index == 0) {
cc.find("line_top", optionNode).active = false;
......@@ -105,17 +112,23 @@ export default class NewClass extends cc.Component {
optionNode.name = `option_${index}`
const text = cc.find("text", optionNode);
text.getComponent(cc.Label).string = item.label;
check.active = item.selected;
optionNode.on("click", ()=>{
this.node.emit("onSelected", item);
this.hide();
item.selected = item.selected ? false : true;
check.active = item.selected;
})
optionNode.active = true;
listLayout.addChild(optionNode);
});
center.height = option.length * this.optionHeight + this.headerHeight;
center.height = option.length * this.optionHeight + this.headerHeight + this.footerHeight;
list.height = option.length * this.optionHeight;
listLayout.height = option.length * this.optionHeight;
buttonOK.off("click")
buttonOK.on("click", ()=>{
this.node.emit("onSelected", option);
this.hide();
})
} else {
const rightWrongLayout = cc.find("center/list/layout_right_wrong", this.node);
const rightIcon = cc.find("right/icon_right", rightWrongLayout);
......
This diff is collapsed.
......@@ -2873,6 +2873,7 @@ export default class SceneComponent extends MyCocosSceneComponent {
return validater
}
// 设置文字选项 多选
setTextOptionListMultiple(contentData, debugMode=false) {
// 存放子校验器
const subValidater = [];
......@@ -2909,6 +2910,8 @@ export default class SceneComponent extends MyCocosSceneComponent {
index: index,
label: option.optionShowText ? option.optionShowText : option.text,
value: option.text,
selected: false,
selectedLabel: "",
strikeOutNode: null
})
});
......@@ -2919,7 +2922,7 @@ export default class SceneComponent extends MyCocosSceneComponent {
const resultRect = this.newRectNode(hotZoneItemData, layer_2, debugMode);
this.newDecorativeFrame(hotZoneItemData, layer_1, "#FFFFFF", "#6dbef6", debugMode);
const rect = this.newRectNode(hotZoneItemData, layer_4, debugMode);
let selectData = JSON.parse(JSON.stringify(optionList))
resultRects.push({
detail: {
contentType: TEXT_SELECT,
......@@ -2950,10 +2953,27 @@ export default class SceneComponent extends MyCocosSceneComponent {
lastText = rect.cleanLast()
}
let selectData = await this.asyncShowMultipleSelectModal(optionList, "textList");
const _selectData = await this.asyncShowMultipleSelectModal(selectData, "textList");
// 如果点击了取消 则还原上次显示
// TODO:selectData.label 为显示的文本,比如用户选择了A、B、D三个选项,那么selectData.label的值就是 A/B/D
const inputLabel = this.newInputTextNode(selectData?selectData.label:lastText, 0);
if(_selectData) {
selectData = _selectData
}
let selectedLabels = [];
selectData.forEach(opItem => {
if(opItem.selected) {
selectedLabels.push(opItem.label)
}
});
let showLabel = ""
if(selectData.length > 0) {
showLabel = selectedLabels.join("/");
} else {
showLabel = lastText;
}
const inputLabel = this.newInputTextNode(showLabel, 0);
inputLabel.x = rect.width / 2;
inputLabel.y = rect.height / 2;
......@@ -2961,7 +2981,7 @@ export default class SceneComponent extends MyCocosSceneComponent {
rect.cleanLast = () => {
inputLabel.destroy();
if(selectData) {
return selectData.label;
return showLabel;
} else {
return lastText
}
......@@ -2977,9 +2997,9 @@ export default class SceneComponent extends MyCocosSceneComponent {
contentType: TEXT_SELECT,
configIndex: contentData.index,
contentIndex: index,
currentSelectIndex: selectData.indexArr,
currentSelectText: selectData.label,
correctSelectIndex: index,
currentSelectIndex: [],
currentSelectText: showLabel,
correctSelectIndex: option.selectOptionListIndexArr,
correctSelectText: option.text,
right: true
},
......@@ -2988,6 +3008,8 @@ export default class SceneComponent extends MyCocosSceneComponent {
allRight: true,
score: 0
}
const currentSelectIndexArr = [];
const correctSelectTextArr = [];
let right = false;
if(contentData.useSelectOptionList) {
......@@ -2996,10 +3018,31 @@ export default class SceneComponent extends MyCocosSceneComponent {
// selectData.indexArr - 当前用户选择的序号数组
// 需要修改线面的这行代码的逻辑,判断两个数组的元素完全相同 right = true
// right = selectData.indexArr == option.selectOptionListIndexArr;
let allRight = true;
option.selectOptionListIndexArr.forEach(opIndex => {
if(selectData[opIndex]) {
if(!selectData[opIndex].selected) {
allRight = false;
}
correctSelectTextArr.push(selectData[opIndex].label)
}
});
selectData.forEach((selItem, index) => {
if(selItem.selected) {
currentSelectIndexArr.push(index)
}
});
right = allRight;
} else {
right = selectData.index == index
}
result.detail.currentSelectIndex = currentSelectIndexArr;
result.detail.correctSelectText = correctSelectTextArr.join("/");
// 选择数据的索引 和 当前索引是否相等 判断是否选择正确
if(right) {
// 正确 返回分数
......
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment