Egret之eui.Scroller
admin
2023-02-17 14:00:05
0

(纯码农制作 ,不喜勿喷)先看看结果 :
Egret之eui.Scroller

一 : Cell(render) Skin 的制作:
Egret之eui.Scroller

看结果是横向的滚动 , 向左 。 如果第一次显示第二个cell , 那么需向左滑动Cell的宽度 + Cell直接的横向的间隔(我这里设为10,往下看↓), 那么一个需要向左偏移110 。(当然 , 内边距左为0↓)

二:Scroller Skin的制作
Egret之eui.Scroller

三 :Cell代码:

module demo{
    /**
     * scroll Cell
     * @author Husz
     */
    export class ScrollCellRender extends eui.ItemRenderer{
        private txt_scroll : eui.Label = null;
        public constructor(){
            super();
            this.skinName="resource/eui_skins/ScrollCellSkin.exml";
        }

        protected dataChanged():void{
            let $data : IScrollCellRenderModel = this.data;
            this.txt_scroll.text = $data._des;
        }
    }

    export interface IScrollCellRenderModel{
        _des : string;
    }
}

四 : Scroll 显示对象测试类:

module demo{
    export class ScrollDemoView extends eui.Component implements eui.UIComponent{
        private scroll : eui.Scroller = null;
        private datagroup : eui.DataGroup = null;

        private _arrayCollection : eui.ArrayCollection = null;

        public constructor(){
            super();
            this.skinName = "resource/eui_skins/ScrollDemoSkin.exml"
        }

        protected childrenCreated():void{
            super.childrenCreated();
            this.showScroll();
        }

        private showScroll() : void{
            this.initData();
            this.datagroup.itemRenderer = ScrollCellRender;
            this.datagroup.dataProvider = this._arrayCollection;

            //对eui.Scroller
            this.scroll.viewport.validateNow();
            this.scroll.viewport.scrollH = 110;

            this.scroll.verticalScrollBar.autoVisibility = false;
            this.scroll.verticalScrollBar.visible = false;

            //不允许滚动
            // this.scroll.touchEnabled = false;
            // this.scroll.touchChildren = false;
            //不允许滚动
            this.scroll.scrollPolicyH = eui.ScrollPolicy.OFF;

            this._arrayCollection.replaceItemAt( { _des :  "bbb"} , 1 );
        }

        private initData() :void{
            let $testDataArr : Array = [
                {_des : "a"},
                {_des : "b"},
                {_des : "c"},
                {_des : "d"},
                {_des : "e"},
                {_des : "f"},
                {_des : "g"},
                {_des : "h"},
                {_des : "i"},
                {_des : "j"}
            ];
            this._arrayCollection =new eui.ArrayCollection($testDataArr);
        }
    }
}

注 :
①:
//不允许滚动
// this.scroll.touchEnabled = false;
// this.scroll.touchChildren = false;
//不允许滚动
this.scroll.scrollPolicyH = eui.ScrollPolicy.OFF;

                注释的代码与其运行的代码的效果一致 , 都为禁止滚动。

② : this.scroll.viewport.scrollH = 110;

                    显示第二个Cell ,最左边应该是b , 但是 this._arrayCollection.replaceItemAt( { _des :  "bbb"} , 1 );
                    所以显示为bbb

③ : 关于隐藏滑块
Egret之eui.Scroller

如下:


  
    
   

上一篇:Android 上架

下一篇:Egret之位图字体

相关内容

热门资讯

今日重大通报“圣盛宜昌花牌有挂... 今日重大通报“圣盛宜昌花牌有挂吗?”(详细开挂教程)您好,圣盛宜昌花牌这个游戏其实有挂的,确实是有挂...
我来教教您“贪玩互娱有挂吗?”... 网上科普关于“贪玩互娱有没有挂”话题很是火热,小编也是针对贪玩互娱作*弊开挂的方法以及开挂对应的知识...
玩家攻略科普“七彩丹霞究竟有挂... 玩家攻略科普“七彩丹霞究竟有挂吗?”(果然有透视挂)您好,七彩丹霞这个游戏其实有挂的,确实是有挂的,...
今日重大消息“科尔沁麻将有没有... 网上科普关于“科尔沁麻将有没有挂”话题很是火热,小编也是针对科尔沁麻将作*弊开挂的方法以及开挂对应的...
今日重大通报“丫丫衡阳字牌怎么... 网上科普关于“丫丫衡阳字牌有没有挂”话题很是火热,小编也是针对丫丫衡阳字牌作*弊开挂的方法以及开挂对...
原创 “... 在如今的信息时代,社交媒体不仅是我们获取信息的核心渠道,更是能够影响舆论走向与社会观念的重要平台。近...
终于明白“神皇牛牛怎么装挂?”... 您好:神皇牛牛这款游戏可以开挂,确实是有挂的,需要了解加客服微信【4282891】很多玩家在这款游戏...
亲测!高性价比山东AI创新公司... 行业痛点分析 当前山东AI公司领域面临着诸多技术挑战。在数据处理方面,大量复杂且无序的数据难以高效整...
玩家最新攻略“中至江西麻将究竟... 您好:中至江西麻将这款游戏可以开挂,确实是有挂的,需要了解加客服微信【9752949】很多玩家在这款...
原创 五... 五年前的2021年,是十四五计划的开局节点。彼时,国家层面明确提出推动汽车产业向电动化、智能化转型,...