zoukankan      html  css  js  c++  java
  • egret之好友列表(滑动列表)

    本文采用List+Scroller实现列表滑动功能

    首先新建两个皮肤,一个用做好友界面的显示,一个用作单个好友的显示,新建皮肤如下:

    皮肤一取名为:wxMainSkin,添加如下控件

     

    皮肤一取名为:wxMainSkin,添加如下控件

    新建ts脚本,添加如下代码:

    // TypeScript file
    class WxMainPanel extends eui.Component {
    
        private listFriends: eui.List;
        private scrListFriends: eui.Scroller;
    
        public constructor() {
            super();
            this.skinName = "wxMainSkin";
            this.init();
        }
        
        private init() {
            var dp: eui.ICollection = this.listFriends.dataProvider;
            /// 填充数据
            var dsListFriends: Array<Object> = [
                { icon: "Scene_BaiQin_jpg", friendName: "伊文捷琳", comment: "评价:樱桃小丸子", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "亚特伍德", comment: "评价:离了我你不行的", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "伊妮德", comment: "评价:猴子请来的逗比", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "鲁宾", comment: "评价:我勒个去", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "威弗列德", comment: "评价:这货碉堡了", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "史帝文", comment: "评价:咖啡不加糖", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "哈瑞斯", comment: "评价:猪一样的队友", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "亚特伍德", comment: "评价:离了我你不行的", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "伊妮德", comment: "评价:猴子请来的逗比", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "鲁宾", comment: "评价:我勒个去", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "威弗列德", comment: "评价:这货碉堡了", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "史帝文", comment: "评价:咖啡不加糖", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "哈瑞斯", comment: "评价:猪一样的队友", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "亚特伍德", comment: "评价:离了我你不行的", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "伊妮德", comment: "评价:猴子请来的逗比", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "鲁宾", comment: "评价:我勒个去", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "威弗列德", comment: "评价:这货碉堡了", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "史帝文", comment: "评价:咖啡不加糖", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "哈瑞斯", comment: "评价:猪一样的队友", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "亚特伍德", comment: "评价:离了我你不行的", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "伊妮德", comment: "评价:猴子请来的逗比", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "鲁宾", comment: "评价:我勒个去", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "威弗列德", comment: "评价:这货碉堡了", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "史帝文", comment: "评价:咖啡不加糖", heart:"Scene_BaiQin_jpg" }
                , { icon: "Scene_BaiQin_jpg", friendName: "哈瑞斯", comment: "评价:猪一样的队友", heart:"Scene_BaiQin_jpg" }
            ];
            this.listFriends.dataProvider = new eui.ArrayCollection(dsListFriends);
    
            this.listFriends.itemRenderer = friendsList;
        }
        protected createChildren() {
        }
    }
    
    class friendsList extends eui.ItemRenderer {
    
        public selectBtn: eui.Button;
    
        constructor() {
            super();
            this.skinName = "friendsListIRSkin"; 
        }
    
        protected createChildren(): void {
            super.createChildren();
        }
        protected dataChanged(): void {
            this.selectBtn.addEventListener(egret.TouchEvent.TOUCH_TAP, () => {
                console.log("名字·····"+this.data.friendName);
                console.log("信息·····"+this.data.info);
            }, this);
        }
    }

    运行效果如下:

     需要demo的请点击右侧加群下载

  • 相关阅读:
    Redundant Paths 分离的路径(边双连通分量)
    bzoj2208 [Jsoi2010] 连通数(tarjan点双连通分量 // dfs)
    [bzoj3331] [BeiJing2013] 压力(tarjan 点双连通分量)
    [ BZOJ1123 ] BLO(tarjan点双连通分量)
    bitset小总结
    牛客328B Rabbit的工作(1)
    # Codeforces Round #529(Div.3)个人题解
    HDU5957 Query on a graph(拓扑找环,BFS序,线段树更新,分类讨论)
    istringstream()函数的用法
    codeforces 1077F1
  • 原文地址:https://www.cnblogs.com/shirln/p/9790478.html
Copyright © 2011-2022 走看看