update

project/src/Main.ts

@@ -60,10 +60,7 @@ export class Main {
     }
 
     private async onAddToStage() {
-        setTimeout(() => {
-          const m = new ShareMask();
-          layers.shareLayer.addChild(m);
-        }, 1500);
+
         //初始化层级
         layers.init(this.stage);
         console.log("初始化层级完成")
@@ -75,23 +72,23 @@ export class Main {
         console.log("初始化皮肤配置完成")
         //加载通用资源
         await RES.loadGroup("common");
-        await
-            console.log("通用资源加载完成")
+
+        console.log("通用资源加载完成")
         //h5环境时，隐藏加载中
         if (FYGE.getEnv() == "web" && document.getElementById("__loading__")) document.getElementById("__loading__").style.display = "none";
         //显示场景
 
         if (isShare()) {
-            changeScene(ShareScene,{query:getQueryParams()});
+            changeScene(ShareScene, { query: getQueryParams() });
         } else {
             const indexResult = await sendWebNet(WebNetName.index)
             if (indexResult && indexResult.success && indexResult.data) {
                 if (indexResult.data.isNewbie) {
-                    updateShare('inNewbieScene', indexResult.data.shareCode,0,0);
+                    updateShare('inNewbieScene', indexResult.data.shareCode, 0, 0);
                     changeScene(NewbieScene, { shareCode: indexResult.data.shareCode });
                 }
                 else {
-                    updateShare('inIndexScene', indexResult.data.shareCode, indexResult.data.amount1,indexResult.data.amount2)
+                    updateShare('inIndexScene', indexResult.data.shareCode, indexResult.data.amount1, indexResult.data.amount2)
                     changeScene(IndexScene)
                 }
             } else {

project/src/common/Group.ts

+export default class Group extends FYGE.Sprite {
+    gap = 10;
+    constructor() {
+        super();
+    }
+
+    list: any[];
+    add(child: FYGE.Sprite) {
+        this.list = this.list || [];
+        this.list.push(child);
+        this.addChild(child);
+        this.updateLayout();
+    }
+
+    updateLayout() {
+        let y = 0;
+        for (let i = 0; i < this.list.length; i++) {
+            const element = this.list[i];
+            element.y = y;
+            y += element.getRect()[1] + this.gap;
+        }
+    }
+}
\ No newline at end of file

project/src/common/Marquee.ts

+const w = 500;
+const h = 50;
+const gap = 10;
+
+export default class Marquee extends FYGE.Sprite {
+    textwrapper: FYGE.Sprite;
+    datas: string[];
+    buttonTxt1: FYGE.TextField;
+    buttonTxt2: FYGE.TextField;
+    time: number;
+    constructor(datas: string[], time: number = 1500) {
+        super();
+        this.datas = datas;
+        this.time = time;
+        this.initUI();
+        this.start();
+    }
+
+    start() {
+
+        const item1 = this.datas.shift();
+        this.datas.push(item1);
+        const item2 = this.datas.shift();
+        this.datas.push(item2);
+
+        this.buttonTxt1.text = item1;
+        this.buttonTxt2.text = item2;
+
+        this.buttonTxt1.y = 0;
+        this.buttonTxt2.y = this.buttonTxt1.textHeight;
+
+
+        let next;
+        next = () => {
+
+            FYGE.Tween.removeTweens(this.buttonTxt1);
+            FYGE.Tween.removeTweens(this.buttonTxt2);
+
+            if (this.buttonTxt1.y < 0) {
+                const item = this.datas.shift();
+                this.datas.push(item);
+                this.buttonTxt1.text = item;
+                this.buttonTxt1.y = this.buttonTxt1.textHeight;
+                const tmp1 = this.buttonTxt1;
+                const tmp2 = this.buttonTxt2;
+                this.buttonTxt1=tmp2;
+                this.buttonTxt2=tmp1;
+            }
+
+            FYGE.Tween.get(this.buttonTxt1)
+                .to({ y: -this.buttonTxt1.textHeight }, this.time)
+
+            FYGE.Tween.get(this.buttonTxt2)
+                .to({ y: 0 }, this.time)
+                .wait(2000)
+                .call(next);
+        }
+
+        setTimeout(() => {
+            next();
+        }, 1000);
+
+
+    }
+
+
+    initUI() {
+        const bg = new FYGE.Shape();
+        bg.beginFill(0, 1);
+        bg.drawRoundedRect(0, 0, w, h, 5, 5, 5, 5);
+        bg.endFill();
+        this.addChild(bg);
+
+        this.textwrapper = new FYGE.Sprite();
+        this.textwrapper.x = gap;
+        this.addChild(this.textwrapper);
+
+        const mask = new FYGE.Shape();
+        mask.beginFill(0, 1);
+        mask.drawRoundedRect(0, 0, w - gap * 2, h, 5, 5, 5, 5);
+        mask.endFill();
+        this.textwrapper.addChild(mask);
+        this.textwrapper.mask = mask;
+
+        const buttonTxt = new FYGE.TextField;
+        buttonTxt.textHeight = h;
+        buttonTxt.size = 20;
+        buttonTxt.verticalAlign = FYGE.VERTICAL_ALIGN.MIDDLE;
+        buttonTxt.fillColor = '0xffffff';
+        this.textwrapper.addChild(buttonTxt);
+        this.buttonTxt1 = buttonTxt;
+
+
+        const buttonTxt2 = new FYGE.TextField;
+        buttonTxt2.textHeight = h;
+        buttonTxt2.size = 20;
+        buttonTxt2.verticalAlign = FYGE.VERTICAL_ALIGN.MIDDLE;
+        buttonTxt2.fillColor = '0xffffff';
+        this.textwrapper.addChild(buttonTxt2);
+        this.buttonTxt2 = buttonTxt2;
+    }
+
+    dispose() {
+
+    }
+}
\ No newline at end of file

project/src/common/Marquee2.ts

+const w = 500;
+const h = 50;
+const gap = 10;
+
+export default class Marquee2 extends FYGE.Sprite {
+    textwrapper: FYGE.Sprite;
+    datas: string[];
+    buttonTxt1: FYGE.TextField;
+    buttonTxt2: FYGE.TextField;
+    time: number;
+    constructor(datas: string[], time: number = 5000, direction = 'left') {
+        super();
+        this.datas = datas;
+        this.time = time;
+        this.initUI();
+        this.start();
+    }
+
+    start() {
+        let next;
+        next = () => {
+
+            const item1 = this.datas.shift();
+            this.datas.push(item1);
+            const item2 = this.datas.shift();
+            this.datas.push(item2);
+
+            this.buttonTxt1.text = item1;
+            this.buttonTxt2.text = item2;
+            this.buttonTxt1.y=0;
+            this.buttonTxt2.y=this.buttonTxt1.textHeight;
+            
+
+            FYGE.Tween.removeTweens(this.buttonTxt1);
+            FYGE.Tween.removeTweens(this.buttonTxt2);
+
+            FYGE.Tween.get(this.buttonTxt1)
+                .to({ y: -this.buttonTxt1.textHeight }, this.time)
+
+            FYGE.Tween.get(this.buttonTxt2)
+                .to({ y: -this.buttonTxt2.textHeight }, this.time)
+                .wait(1000)
+                .call(next);
+        }
+
+        next();
+
+
+    }
+
+
+    initUI() {
+        const bg = new FYGE.Shape();
+        bg.beginFill(0, 1);
+        bg.drawRoundedRect(0, 0, w, h, 5, 5, 5, 5);
+        bg.endFill();
+        this.addChild(bg);
+
+        this.textwrapper = new FYGE.Sprite();
+        this.textwrapper.x = gap;
+        this.addChild(this.textwrapper);
+
+        const mask = new FYGE.Shape();
+        mask.beginFill(0, 1);
+        mask.drawRoundedRect(0, 0, w - gap * 2, h, 5, 5, 5, 5);
+        mask.endFill();
+        this.textwrapper.addChild(mask);
+        this.textwrapper.mask = mask;
+
+        const buttonTxt = new FYGE.TextField;
+        buttonTxt.textHeight = h;
+        buttonTxt.size = 20;
+        buttonTxt.verticalAlign = FYGE.VERTICAL_ALIGN.MIDDLE;
+        buttonTxt.fillColor = '0xffffff';
+        this.textwrapper.addChild(buttonTxt);
+        this.buttonTxt = buttonTxt;
+
+
+        const buttonTxt2 = new FYGE.TextField;
+        buttonTxt2.textHeight = h;
+        buttonTxt2.size = 20;
+        buttonTxt2.verticalAlign = FYGE.VERTICAL_ALIGN.MIDDLE;
+        buttonTxt2.fillColor = '0xffffff';
+        this.textwrapper.addChild(buttonTxt2);
+        this.buttonTxt2 = buttonTxt2;
+    }
+
+    dispose() {
+
+    }
+}
\ No newline at end of file

project/src/common/TestButton.ts

+const w = 200;
+const h = 80;
 export default class TestButton extends FYGE.Sprite {
 
+    getRect(){
+        return [w,h]
+    }
     constructor(txt,parent?) {
         super();
 
         const bg = new FYGE.Shape();
         bg.beginFill(0, 1);
-        bg.drawRoundedRect(0, 0, 200, 80,10,10,10,10);
+        bg.drawRoundedRect(0, 0, w, h,10,10,10,10);
         bg.endFill();
         this.addChild(bg);
 

project/src/scenes/NewbieScene.ts

 import { unwatchPageVisibility, watchPageVisibility } from "@spark/utils";
 import { changeScene, closeCurrentPanel, showPanel } from "../../module/ctrls";
 import { Scene } from "../../module/views/Scene";
+import Group from "../common/Group";
+import Marquee from "../common/Marquee";
 import TestButton from "../common/TestButton";
 import getQueryParams from "../getQueryParams";
 import { PrizePanel } from "../panels/prize";
 import { IndexScene } from "./IndexScene";
 let prize;
 export class NewbieScene extends Scene {
-
-    prizeBtn:FYGE.Sprite;
+    prizeBtn: FYGE.Sprite;
+    ruleBtn: FYGE.Sprite;
     onPageVisibilityChange = async (visible) => {
-        console.log('页面visible',visible);
+        console.log('页面visible', visible);
         if (!prize) {
             console.log('没有领体验金'); return;
         };
         if (visible) {
             closeCurrentPanel();
-            changeScene(IndexScene,{from:'NewbieScene',action:'showSharePanel'});
+            changeScene(IndexScene, { from: 'NewbieScene', action: 'showSharePanel' });
         }
     }
 
@@ -24,36 +26,49 @@ export class NewbieScene extends Scene {
         super.start();
 
         const query = getQueryParams();
-        if(query.autoprize==1) {
+        if (query.autoprize == 1) {
             this.openPrize(data);
         }
-
-        
     }
 
-    openPrize(data){
+    openPrize(data) {
         prize = 1;
         showPanel(PrizePanel, data);
     }
 
-    onClick_prizeBtn(){
+    onClick_prizeBtn() {
         this.openPrize(this.data);
     }
 
-    initUi(){
+    initUi() {
         super.initUi();
-        this.prizeBtn = new TestButton('立即岔开',this);
+        const group = new Group();
+        this.addChild(group)
+        this.prizeBtn = new TestButton('立即拆开');
+        group.add(this.prizeBtn);
+        this.ruleBtn = new TestButton('规则按钮');
+        group.add(this.ruleBtn);
+
+        const q = this.addChild(new Marquee(
+            [
+                '159****1111邀请了11位好友，获得了yyy体验金',
+                '138****2222邀请了22位好友，获得了xxxx体验金',
+                '189****3333邀请了33位好友，获得了zzzzz体验金',
+            ]
+        ));
+        q.y=300;
+        q.x=50;
     }
 
     initEvents() {
         super.initEvents();
         watchPageVisibility(this.onPageVisibilityChange);
-        this.prizeBtn.addEventListener(FYGE.MouseEvent.CLICK,this.onClick_prizeBtn,this);
+        this.prizeBtn.addEventListener(FYGE.MouseEvent.CLICK, this.onClick_prizeBtn, this);
     }
     removeEvents() {
         super.removeEvents();
         unwatchPageVisibility(this.onPageVisibilityChange)
-        this.prizeBtn.removeEventListener(FYGE.MouseEvent.CLICK,this.onClick_prizeBtn,this);
+        this.prizeBtn.removeEventListener(FYGE.MouseEvent.CLICK, this.onClick_prizeBtn, this);
     }
 
     get groupNames() { return ["newbie"] }