duilib进阶教程 -- TreeView控件(6)
代码下载:http://download.csdn.net/detail/qq316293804/6483905
上一个教程中,界面已经和迅雷一模一样啦,大小和位置一个像素都不差哟,亏得Alberl调了好久,不过既然决定要山寨了,那当然得学习下华强北~O(∩_∩)O~
那么现在只剩下播放列表和四个网页啦,那四个网页很简单,用ActiveX控件和Tab控件就搞定了,具体参见《2013 duilib入门简明教程 -- 复杂控件介绍 (13)》,那么接下来就来介绍播放列表的实现。

看到播放列表,小伙伴们可能有各种实现方式:
1、用3个Tab控件,每个Tab控件里放一个List控件,不过这里用Tab控件很不方便,因为点击其中一个Tab时,要对另外两个Tab进行展开、折叠。
2、全部用List实现,可以看到duilib的QQDemo和GameDemo,都是全部用List实现的。不过这种方法要自己写很多很多代码,而且还要非常熟悉List,还要非常熟悉duilib。大神们不是已经写好了么,我们拿来用就行了呗。虽然大神们实现了QQDemo和GameDemo,但是可以看到那两个自己扩展的List都是不通用的,所以如果用那两个扩展List来实现这个播放列表,肯定也要做很多工作。因此也不采用这种方法。
3、全部用TreeView控件实现,这个有一个TestApp1的Demo,初步看起来还不错,和我们要做的播放列表很接近哦,展开折叠神马的都有。因此就采用这种方法啦。
一、TreeView简单用法:
<TreeView bkcolor="#ff00ff00" >
<TreeNode text="A1" />
<TreeNode text="B1" >
<TreeNode text="B2" />
</TreeNode>
</ TreeView>
这样就能显示三个节点啦。
二、TreeView复杂用法:
由于前面有了很详细的入门教程,因此进阶教程不再重复介绍,这里直接给出迅雷播放列表的代码:

<TreeView name="treePlaylist" padding="4,0,2,0" itemtextcolor="#FFC8C6CB" itemhottextcolor="#FFC8C6CB" selitemtextcolor="#FFC8C6CB" itemhotbkcolor="#FF1B1B1B" itemselectedbkcolor="#FF151C2C" vscrollbar="true" >
<TreeNode text="播放列表" height="33" bkimage="skin/treeview_header.png">
<TreeNode height="40">
<Combo name="comboPlaylist" float="true" pos="15,10,0,0" width="50" height="20" dropboxsize="63,63" itemtextcolor="#FFC8C6CB" itemselectedtextcolor="#FFC8C6CB" itemhottextcolor="#FFC8C6CB" itembkcolor="#FF2E2E2E" itemselectedbkcolor="#FF2E2E2E" itemhotbkcolor="#FF191919" normalimage="file='skin/combo_right.png' source='0,0,20,20' dest='22,0,42,20' " hotimage="file='skin/combo_right.png' source='21,0,41,20' dest='22,0,42,20' " pushedimage="file='skin/combo_right.png' source='42,0,82,20' dest='22,0,42,20' " >
<ListLabelElement text="全部"/>
<ListLabelElement text="在线"/>
<ListLabelElement text="本地" selected="true" />
</Combo>
<Button name="btnPlayMode" float="true" pos="153,12,0,0" width="18" height="18" textcolor="#FF000000" disabledtextcolor="#FFA7A6AA" align="center" normalimage="file='skin\btn_play_mode.png' source='0,0,18,18'" hotimage="file='skin\btn_play_mode.png' source='19,0,37,18'" pushedimage="file='skin\btn_play_mode.png' source='38,0,56,18'" />
<Button name="btnAdd" float="true" pos="174,12,0,0" width="18" height="18" textcolor="#FF000000" disabledtextcolor="#FFA7A6AA" align="center" normalimage="file='skin\btn_add.png' source='0,0,18,18'" hotimage="file='skin\btn_add.png' source='19,0,37,18'" pushedimage="file='skin\btn_add.png' source='38,0,56,18'" />
<Button name="btnDelete" float="true" pos="195,12,0,0" width="18" height="18" textcolor="#FF000000" disabledtextcolor="#FFA7A6AA" align="center" normalimage="file='skin\btn_delete.png' source='0,0,18,18'" hotimage="file='skin\btn_delete.png' source='19,0,37,18'" pushedimage="file='skin\btn_delete.png' source='38,0,56,18'" />
</TreeNode>
<TreeNode text="迅雷下载" height="22" textcolor="#FFC8C6CB" folderattr="padding="0,4,0,0" width="14" height="14" normalimage="file='skin/treeview_expand.png' source='0,0,14,14' " selectedimage="file='skin/treeview_expand.png' source='0,24,14,38' "">
<TreeNode text="下载1" />
<TreeNode text="下载2" />
</TreeNode>
</TreeNode>
<TreeNode text="在线媒体" height="33" bkimage="skin/treeview_header.png" >
<TreeNode text="今日热播" height="22" textcolor="#FFC8C6CB" folderattr="padding="0,4,0,0" width="14" height="14" normalimage="file='skin/treeview_expand.png' source='0,0,14,14' " selectedimage="file='skin/treeview_expand.png' source='0,24,14,38' "">
<TreeNode text="八公" />
<TreeNode text="HACHI" />
</TreeNode>
<TreeNode text="热点新闻" height="22" textcolor="#FFC8C6CB" folderattr="padding="0,4,0,0" width="14" height="14" normalimage="file='skin/treeview_expand.png' source='0,0,14,14' " selectedimage="file='skin/treeview_expand.png' source='0,24,14,38' "">
<TreeNode text="八公" />
<TreeNode text="HACHI" />
</TreeNode>
</TreeNode>
<TreeNode text="娱乐中心" height="33" bkimage="skin/treeview_header.png" >
<TreeNode text="短视频广场" height="22" textcolor="#FFC8C6CB" folderattr="padding="0,4,0,0" width="14" height="14" normalimage="file='skin/treeview_expand.png' source='0,0,14,14' " selectedimage="file='skin/treeview_expand.png' source='0,24,14,38' "">
<TreeNode text="热门视频" />
<TreeNode text="美女视频" />
</TreeNode>
<TreeNode text="直播频道" />
</TreeNode>
</TreeView>

需要说明的是,TreeView控件的Bug很多,而且很多属性都无效,比如itemfont、itemalign等等,这个将在下一节介绍,现在主界面和迅雷一模一样,播放列表也看起来差不多啦,离成功不远啦~O(∩_∩)O~
duilib进阶教程 -- TreeView控件(6)的更多相关文章
- duilib进阶教程 -- TreeView控件的不足 (7)
上一个教程中,虽然播放列表的框架和迅雷一样了,但是字体大小.文字居中还没有解决.如果是刚学duilib,搞定这个可不容易,因为在有了入门教程的指导后,很容易就想到去看[属性列表.XML],但是当你试了 ...
- duilib进阶教程 -- TreeView控件的bug (9)
一.不自动调整子控件的宽度(TreeView宽度小于260时) 相信亲们用同样的代码,显示效果肯定和Alberl不一样吧~O(∩_∩)O~ 嘿嘿,仔细对比下,看看你们的列表头背景图片是下面这样的么? ...
- duilib进阶教程 -- Container控件的bug (14)
在<duilib进阶教程 -- TreeView控件的bug (9)>里,Alberl发现了两个bug,并解决了其中一个,现在教程已经接近尾声啦,所以Alberl就解决了另外一个bug. ...
- duilib进阶教程 -- 各种控件的响应 (10)
到上一个教程为止,界面显示的代码就都介绍完啦,现在开始介绍控件的响应,其实在<2013 duilib入门简明教程 -- 事件处理和消息响应 (17)>里已经列出了duilib自己定义的所有 ...
- duilib进阶教程 -- Label控件的bug (8)
上个教程说到了TreeView的文字不能垂直居中的问题,而我们用LabelUI其实是可以垂直居中的,为什么不说是TreeView的bug,而说是Label控件的bug呢?因为影响TreeView垂直居 ...
- duilib进阶教程 -- Container控件 (3)
前面两个教程的目的是教大家与MFC结合,那么从这篇起,将不再使用MFC,而使用纯win32项目,本文的所有知识已经在<duilib入门教程>里面讲过了,因此基础知识不再赘述. 代码下载:h ...
- 【ASP.NET 进阶】TreeView控件学习
这几天上班没事做,也不好打酱油,学点没接触过的新东西吧,基本了解了下TreeView控件. TreeView 控件用于在树结构中显示分层数据,例如目录或文件目录等. 下面看代码吧: 1.效果图 2.静 ...
- 百度地图Api进阶教程-默认控件和自定义控件2.html
<!DOCTYPE html> <html> <head> <meta name="viewport" content="ini ...
- duilib进阶教程 -- 总结 (17)
整个教程的代码下载:http://download.csdn.net/detail/qq316293804/6502207 (由于duilib进阶教程主要介绍界面,所以这个教程只给出界面相关的代码,完 ...
随机推荐
- 分布式队列ZooKeeper的实现
一.背景 有一些时候,多个团队需要共同完成一个任务,比如,A团队将Hadoop集群计算的结果交给B团队继续计算,B完成了自己任务再交给C团队继续做.这就有点像业务系统的工作流一样,一环一环地传下 去, ...
- JDBC(5)—DatabaseMetaData
1.简介: 使用元数据已实现通用的查询方法.元数据介绍:使用jdbc获得连接之后,得到一个Connection对象,可以通过这个对象获得DataBaseMetaData对象,该对象可以获得有关数据库管 ...
- 怎样使用ZOL一键安装器下载中关村在线的源安装包
怎样使用ZOL一键安装器下载中关村在线的源安装包 马根峰 (广东联合电子服务股份有限公司, 广州 510300) 摘要 中关村在线近期開始推出ZOL一键安装器,用户直 ...
- 详解Paint的setColorFilter(ColorFilter filter)
一.简介 setColorFilter(ColorFilter filter) 设置颜色过滤,这个方法需要我们传入一个ColorFilter参数同样也会返回一个ColorFilter实例.我们在set ...
- Js 判断浏览器类型整理
判断原理 JavaScript是前端开发的主要语言,我们可以通过 编写JavaScript程序来判断浏览器的类型及版本.JavaScript判断浏览器类型一般有两种办法,一种是根据各种浏览器独有的属性 ...
- Go语言之高级篇beego框架之model设计构造查询
一.model设计构造查询 QueryBuilder 提供了一个简便,流畅的 SQL 查询构造器.在不影响代码可读性的前提下用来快速的建立 SQL 语句. QueryBuilder 在功能上与 ORM ...
- 如何在 Github 上发现优秀的开源项目?
之前发过一系列有关 GitHub 的文章,有同学问了,GitHub 我大概了解了,Git 也差不多会使用了,但是还是搞不清 GitHub 如何帮助我的工作,怎么提升我的工作效率? 问到点子上了,Git ...
- Seaslog安装和参数配置
详细文档访问:https://github.com/Neeke/SeasLog/blob/master/README_zh.md 源码安装步骤: 1.先下载Seaslog源码,下载地址:http:// ...
- Windows安装Flask Traceback (most recent call last):
Exception: File "c:\users\appdata\local\programs\python\python36-32\lib\site-packages\pip\compa ...
- MySQL-8.0.x 新特性之索引页合并
[背景] 索引的重要是在些不表.在这里我想说的另一个问题:索引和数据一样在innodb中都是以page的形式来组织的,那么问题就来了. 比如果说索引 ix_person_name 的内容只要8个页面就 ...