idioms/idiom/assets/module_game/ui/UI_Idioms/UI_Idioms.ts

import { _decorator, Component, DynamicAtlasManager, find, instantiate, Label, macro, Node, Prefab, ScrollView, Size, UITransform, Vec2, Vec3 } from 'cc';
import { UI_Idiom } from './UI_Idiom';
import { Layout_Idioms } from './Layout_Idioms';
import { GameUILayers } from '../../../core/ui/ui';
import ui_base from '../../../core/ui/ui_base';
import { ModuleDef } from '../../../Scripts/ModuleDef';
import { Container_Manager } from '../../game/Container_Manager';
import { Cube_Infor } from '../../game/Cube_Infor';

const { ccclass, property } = _decorator;

@ccclass('UI_Idioms')
export class UI_Idioms extends ui_base {
    idioms: UI_Idiom[] = [];
    constructor() {
        super(ModuleDef.GAME, 'ui/UI_Idioms/ScrollView', GameUILayers.HUD, Layout_Idioms);
    }

    protected async onCreated() {
        const layout = this.getLayout<Layout_Idioms>();
        layout.Container = find('Container').getComponent(Container_Manager);
        this.init();
    }

    public init() {
        const layout = this.getLayout<Layout_Idioms>();
        console.log("init");
        for (let i = 0; i < this.idioms.length; i++) {
            this.idioms[i].node.destroy();
        }

        this.idioms = [];

        for (let i = 0; i < layout.Container.idioms.length; i++) {
            let node = instantiate(layout.idiom_prefab);
            node.parent = layout.content;
            console.log("label" + layout.Container.idioms[i].idiom);
            node.getComponent(UI_Idiom).txt.string = layout.Container.idioms[i].idiom;
            node.getComponent(UI_Idiom).piece_1_word = layout.Container.idioms[i].piece_1_word;
            node.getComponent(UI_Idiom).piece_2_word = layout.Container.idioms[i].piece_2_word;
            this.idioms.push(node.getComponent(UI_Idiom));
        }

        layout.scrollView.scrollToTop();
    }

    //高亮显示
    public light_Show(cube_infor: Cube_Infor) {
        const layout = this.getLayout<Layout_Idioms>();
        let txt_length = cube_infor.Text.length;
        let flag = false;
        for (let i = 0; i < this.idioms.length; i++) {
            if (this.idioms[i].piece_1_word === cube_infor.Text) {
                this.idioms[i].hud_sp.node.active = true;
                this.idioms[i].hud_sp.node.getComponent(UITransform).contentSize = new Size(30 * txt_length, 30);
                let target = 0;
                this.idioms[i].hud_sp.node.position = new Vec3(11 + target * 30, -11.5, 0);
                this.scrollToTarget(i);

            }
            else if (this.idioms[i].piece_2_word === cube_infor.Text) {
                this.idioms[i].hud_sp.node.active = true;
                this.idioms[i].hud_sp.node.getComponent(UITransform).contentSize = new Size(30 * txt_length, 30);
                let target = 4 - txt_length;
                this.idioms[i].hud_sp.node.position = new Vec3(11 + target * 30, -11.5, 0);
                this.scrollToTarget(i);
            }
        }
    }
    //取消高亮
    public light_Hide(cube1: Cube_Infor, cube2: Cube_Infor) {
        const layout = this.getLayout<Layout_Idioms>();
        console.log("开始执行light——hide");
        const checkAndRemoveHint = (cube: Cube_Infor, piece_1: string, piece_2: string) => {
            console.log("检测并移除");
            let hasMatch = false;
            // 检查 cube 是否与成语的某个词匹配
            if (cube.Text === piece_1 || cube.Text === piece_2) {
                for (const cubeInfor of layout.Container.idiom_combine.keys()) {
                    if (cubeInfor.txt.string === cube.Text) {
                        hasMatch = true;
                        break;
                    }
                }
                // 如果当前字没有参与成语，则移除提示
                if (!hasMatch) {
                    console.log("移除提示");
                    return false;
                }
            }
            return true;
        };
        // 过滤掉已匹配的成语，并销毁提示
        this.idioms = this.idioms.filter(element => {
            let shouldRemove = false;
    
            // 检查与 cube1 和 cube2 相关的成语
            const cube1Active = checkAndRemoveHint(cube1, element.piece_1_word, element.piece_2_word);
            const cube2Active = checkAndRemoveHint(cube2, element.piece_2_word, element.piece_1_word);
    
            if (!cube1Active || !cube2Active) {
                element.hud_sp.node.active = false; // 销毁提示
            }
    
            // 如果 cube1 和 cube2 组合成一个成语，销毁该成语节点
            if (cube1.Text + cube2.Text === element.txt.string) {
                element.node.destroy();
                shouldRemove = true;
            }
    
            return !shouldRemove;
        });
    
        // 监测每个字是否仍然在某个成语中，如果是，则高亮显示
        const str=[...layout.Container.idiom_combine.keys()];
        for(const element of this.idioms){
            if(str.some(cubeInfor =>
                (cubeInfor.Text == element.piece_1_word) || (cubeInfor.Text == element.piece_2_word)
            )){
                element.hud_sp.node.active = true;
            }else{
                element.hud_sp.node.active = false;
            }
        }
    }
    

    public scrollToTarget(index: number) {
        const layout = this.getLayout<Layout_Idioms>();
        let row = Math.trunc(index / 5);
        if (row == 0) {
            layout.scrollView.scrollTo(new Vec2(0, 1), 0.2, false);
        } else if (row == this.idioms.length / 5) {
            layout.scrollView.scrollTo(new Vec2(0, 0), 0.2, false);
        } else {
            let res = Math.trunc(((row) / (Math.trunc((this.idioms.length / 5)) - 2)) * 10) / 10;
            layout.scrollView.scrollTo(new Vec2(0, 1 - res), 0.2, false);
            console.log("weizhi:" + (1 - res));
        }

    }

    public all_light_Hide() {
        this.idioms.forEach(element => {
            element.hud_sp.node.active = false;
        });
    }
}