`
wangangie18
  • 浏览: 43152 次
  • 性别: Icon_minigender_2
  • 来自: 珠海
最近访客 更多访客>>
社区版块
存档分类
最新评论

List虚拟布局

阅读更多

  flex/spark" xmlns:local="*" width="440" viewSourceURL="srcview/index.html"> width="400" height="116" useVirtualLayout="false" dataProvider="{createItems(20)}">width="400" height="116" useVirtualLayout="true" dataProvider="{createItems(1000)}">
  .components.supportClasses.GroupBase; importspark.core.NavigationUnit; importspark.layouts.supportClasses.LayoutBase; publicclassSimpleHorizontalLayoutextendsLayoutBase{privatevarminEligibleScrollPosition:Number= 0; privatevarmaxEligibleScrollPosition:Number= 0; /** * Called when the user clicks on the left scroll button or the left part of the track of the scrollbar */overrideprotectedfunctiongetElementBoundsLeftOfScrollRect(scrollRect:Rectangle):Rectangle{varoffset:Number=horizontalScrollPosition%typicalLayoutElement.getLayoutBoundsWidth(); varwidth:Number=typicalLayoutElement.getLayoutBoundsWidth(); varheight:Number=typicalLayoutElement.getLayoutBoundsHeight(); returnnewRectangle(scrollRect.x-width+offset,scrollRect.y,width,height); }/** * Called when the user clicks on the right scroll button or the right part of the track of the scrollbar */overrideprotectedfunctiongetElementBoundsRightOfScrollRect(scrollRect:Rectangle/** * TODO: This works with getNavigationDestinationIndex() for keyboard scrolling a List based target. * * Given this layout's assumptions this method easily handles both the virtual and non-virtual case * since an element's position can be calculated solely by its index and the typicalLayoutElement width * */overridepublicfunctiongetElementBounds(index:int):Rectangle{if(!target)returnnull; if((index=target.numElements))returnnull; vareltX:Number=typicalLayoutElement.getLayoutBoundsWidth()*index; vareltY:Number= 0 vareltW:Number=typicalLayoutElement.getLayoutBoundsWidth()vareltH:Number=typicalLayoutElement.getLayoutBoundsHeight(); returnnewRectangle(eltX,eltY,eltW,eltH); }/** * * This method is used by subclasses of ListBase to handle keyboard navigation. Given a current index * (the index that is currently focused) this method returns the index to navigate to given a keyboard * navigation command like LEFT/RIGHT/HOME/END. * */overridepublicfunctiongetNavigationDestinationIndex(currentIndex:int,navigationUnit:uint,arrowKeysWrapFocus:Boolean):int{if(!target||target.numElementswidth and height constraints element.setLayoutBoundsSize(NaN,NaN); // find the size of the element varelementWidth:Number=element.getLayoutBoundsWidth(); varelementHeight:Number=element.getLayoutBoundsHeight(); // update the target's contentWidth and contentHeight target.setContentSize(Math.ceil(typicalLayoutElement.getLayoutBoundsWidth()*target.numElements),Math.ceil(Math.max(elementHeight,target.contentHeight))); // update the x position for where to place the next element x+=elementWidth; }// // Step 7: Keep track of the extent of the renderers that are partially in view // // ie: how much they stick out of view. Keeping track of that allows us to call // invalidateDisplayList() less in scrollPositionChanged(). // minEligibleScrollPosition=target.horizontalScrollPosition; maxEligibleScrollPosition=minEligibleScrollPosition+target.width; // now subtract the left offset minEligibleScrollPosition-=firstIndexInViewOffset; // and add the right offset maxEligibleScrollPosition+=typicalLayoutElement.getLayoutBoundsWidth()-firstIndexInViewOffset; }/** * Gets called by updateDisplayList when useVirtualLayout = false */privatefunctionupdateDisplayListReal(containerWidth:Number,containerHeight:Number):void{// the x value to position the next element at varx:Number= 0; // the y value to position the next element at vary:Number= 0; // loop through every element (even those not in view) for(vark:int= 0; kwidth and height constraints element.setLayoutBoundsSize(NaN,NaN); // find the size of the element varelementWidth:Number=element.getLayoutBoundsWidth(); varelementHeight:Number=element.getLayoutBoundsHeight(); // update the layoutTarget's contentWidth and contentHeight target.setContentSize(Math.ceil(x+elementWidth),Math.ceil(Math.max(elementHeight,target.contentHeight))); // update the x position for where to place the next element x+=elementWidth; }}/** * In a virtual layout you need to invalidate the display list if the user has * scrolled by a large enough distance to expose items that don't currently * have renderers created. We keep track of this range of scroll positions * using minEligibleScrollPosition/maxEligibleScrollPositio n. */overrideprotectedfunctionscrollPositionChanged():void{super.scrollPositionChanged(); if(!target)return; if(useVirtualLayout){// an optimization: only invalidate the display list if the scroll position // has changed enough that new items are coming into view if(horizontalScrollPositionmaxEligibleScrollPosition-target.width){target.invalidateDisplayList(); }}}}}
  flex/spark" width="50" height="100"> 
分享到:
评论

相关推荐

    lite-virtual-list:支持基于vue的瀑布流的虚拟列表组件库

    轻虚拟列表英文||支持基于Vue的瀑布流的虚拟列表组件库支撑固定高度支撑高度可变支持两列瀑布流布局支持DOM多屏配置支持状态选择支持数据动态附加支持动态删除数据使用安装npm install lite-virtual-list使用import ...

    【JavaScript源代码】如何在CocosCreator中做一个List.docx

     自写一个虚拟列表,有垂直布局,水平布局,网格布局和Padding的List Demo地址:https://files-cdn.cnblogs.com/files/gamedaybyday/cocos2.3.4_ListViewDemo_Grid.7z  cocos原来的LayOut做列表,有100个数据就有...

    react-dynamic-virtual-list:支持任何大小元素的React虚拟列表组件

    动态虚拟列表React虚拟列表组件旨在成为最灵活和高性能的组件。特征超级简单的设置。 刚刚压缩了超过2 KB。 服务器端渲染支持。 支持可变的元素高度。 通过flexbox支持网格布局。 自动检测元素高度。 使用...

    一个优雅的React虚拟列表组件-React开发

    支持对Wi进行分组React Virtuoso是一个简单易用的React虚拟化列表组件,可以呈现大量数据集。 开箱即用,Virtuoso:处理动态高度可变的项目; 无需手动测量或对物品高度进行硬编码; 支持使用粘性组头分组...

    onejs-list-view:列表视图控件

    使用生成的布局呈现给定项目集的虚拟化列表控件。 使用静态数据或服务驱动的列表。 模块化构建,因此您可以只捆绑您需要的东西(或包含整个模块。) ListView 由以下概念组成: 布局 - 事物去向的定义 列表 - 表示...

    《深度探索C++对象模型》(Stanley B·Lippman[美] 著,侯捷 译)

    2.4 成员们的初始化队伍(Member Initialization List) 第3章 Data语意学(The Semantics of Data) 3.1 Data Member的绑定(The Binding of a Data Member) 3.2 Data Member的布局(Data Member Layout) 3.3 ...

    虚拟项目:我的虚拟项目的存储库

    欢迎来到GitHub Pages 您可以使用的来维护和预览Markdown文件中网站的内容。 每当您提交到该存储库时,GitHub Pages都会...您的Pages网站将使用您在选择的Jekyll主题的布局和样式。 该主题的名称保存在Jekyll _conf

    CV_Project:它有虚拟简历

    欢迎来到GitHub Pages 您可以使用的来维护和预览Markdown文件中网站的内容。 每当您提交到该存储库时,GitHub Pages都将...您的Pages网站将使用您在选择的Jekyll主题的布局和样式。 该主题的名称保存在Jekyll _conf

    Android应用开发入门教程

    8.6 列表(List)视图组107 8.7 使用Tab组织UI109 第9章 2D图形接口的使用113 9.1 使用2D图形接口的程序结构113 9.2 图像、图形、文本的基本绘制114 9.3 文本的对齐方式116 9.4 使用路径效果(PathEffect)118 9.5 ...

    深度探索模C++对象模型PDF

    2.4 成员们的初始化队伍(Member Initialization List) 第3章 Data语意学(The Semantics of Data) 3.1 Data Member的绑定(The Binding of a Data Member) 3.2 Data Member的布局(Data Member Layout) 3.3 ...

    深度探索C++对象模型 超清版

    2.4 成员们的初始化队伍(Member Initialization List) 第3章 Data语意学(The Semantics of Data) 3.1 Data Member的绑定(The Binding of a Data Member) 3.2 Data Member的布局(Data Member Layout) 3.3 ...

    bbs论坛系统V4.0源码

    本开源论坛支持虚拟主机用户、更换或自定义模板Theme、最新FCKEditor编辑器、个性化论坛图标等等功能。 本次更新功能列表: Readme v4.0 ============ 1.论坛FCKEditor 编辑器升级到最新版FCKEditor v2.6.3。新版...

    深入解析Windows操作系统中文.part2.rar

    7.4 虚拟地址空间的布局结构 413 x86用户地址空间的布局结构 415 x86系统地址空间的布局结构 417 x86会话空间 418 系统页表项(PTE,Page Table Entry) 421 64位地址空间布局结构 422 7.5 地址转译 425 x86虚拟地址...

    演示Android的ListView控件的使用

    环境:Windows XP SP3、JDK 1.6、Android SDK...目的:熟悉ListView控件的用法--使用ListView必须让Activity继承ListActivity类,并且在main.xml布局描述文档中,ListView类的android.id必须是"@+id/android:list”值。

    app:用于社交网络分析和可视化的免费软件应用程序

    在虚拟画布上单击几下即可绘制社交网络,以支持的格式(GraphML,GraphViz,EdgeList,GML,Adjacency,Edgelist,Pajek,UCINET等)从文件中加载字段数据,自动重新创建著名的数据集或搜寻互联网以创建一个由相关...

    小龙鳃(XiaoLs)专题新闻网站

    网站不支持安装在虚拟目录下。 二、功能介绍 1.新闻一级分类 2.新闻添加、修改、删除、显示/隐藏 3.搜索结果高亮显示(按标题、来源或内容搜索) 4.用户留言 5.数据库备份 三、学习要点 1.三层架构 2.数据绑定 3....

    pycharm配置pyqt5-tools开发环境的方法步骤

    本文介绍使用python+pyqt5开发桌面程序的一个可视化UI视图布局 一、环境包的安装 1、如果还不知道虚拟环境的可以参考,或者直接使用pipenv 2、安装pyqt5 pip3 install pyqt5 3、安装pyqt5-tools(注意目前只支持在...

    vue-management-template:基于vue+iview+node.js+express+mongodb进行搭建的一个后台管理框架

    我的个人学习记录 本项目使用 vue + view-design +...使用 vue-virtual-scroll-list 插件进行虚拟渲染,实现百万级数据量的下拉列表无缝渲染 如何启动前端项目? 1. 项目下载到本地后,您可以使用 npm install 安装依赖

    TOWCMS乐酷三合一建站程序 v7.3.zip

    模板采用DIV CSS布局,并兼容 IE6/7/8/9/10、Google Chrome、Firefox、Opera、Webkit、搜狗、360、遨游等浏览器。 4)内置SEO功能 提升网站搜索引擎排名 SEO功能包含页面标题、关键词、描述设置;搜索引擎提交;...

    collection-view:Web的UICollectionView

    这也称为“窗口化”或“虚拟化”。 (删除,添加,移动)和由集合视图正确地设置了动画。 该库的灵感来自和 。 集合视图从获取其数据,并从布局获取其可视信息。 当前,有一个(以行和列形式显示集合),以及一个...

Global site tag (gtag.js) - Google Analytics