仿酷狗音乐播放器开发日志十五——音乐电台列表控件的实现

本文涉及的产品
日志服务 SLS,月写入数据量 50GB 1个月
简介: 转载请说明原文出处,谢谢~~             前些日子封装了好几天控件,把webkit浏览器控件,vlc视频播放控件,音频播放控件做好了,做这些控件一来是可以单独使用,用到其他项目中,而来可以直接用到这个仿酷狗播放器项目中,后期把他们结合起来就是个完整播放器了。

转载请说明原文出处,谢谢~~

 

          前些日子封装了好几天控件,把webkit浏览器控件,vlc视频播放控件,音频播放控件做好了,做这些控件一来是可以单独使用,用到其他项目中,而来可以直接用到这个仿酷狗播放器项目中,后期把他们结合起来就是个完整播放器了。

          今天就继续前段时间的工作,继续完善仿酷狗的界面。前面的文章里已经把左侧的各个列表的外观做好了,尤其是做好了播放器列表,不过今天发现,音乐电台列表中的电台项目也是个比较复杂的控件,所以今天就把他做出来。

          虽然复杂,但是有前面的做音乐播放列表的基础,做这个就简单多了,有很多代码可以复用。


外观分析

          首先来看看原酷狗的音乐电台的外观。

          

          其中的每一个子项也是分为三种状态,普通状态下

          

          这只是个简单的横向布局,一个logo,两端文字和一个小标志图片。

          Hot和Down状态下

           

           在普通状态下,整体颜色略微加深,右侧出现了两个控制按钮,也就是在原来的基础上增加一个横向布局

          双击状态下

           

          这个状态下的子项目相比之下就复杂多了,大致的布局如下

           

          把他划分为块,从里到外一块一块做就行,我直接拿我做音乐列表项目的子控件的布局来修改一份,在布局里面要写出这三种

下的布局代码,然后我们只要在c++代码中根据控件收到的事件来动态修改控件的布局的高度和隐藏不隐藏就可以了。

         我写duilib的xml布局几乎不用float属性的绝对布局,而是用控制边距达到微调的效果,不过有例外的时候,写这个控件的hot状态的右上角的小关闭按钮我是用了float属性,因为不至于为了他而去额外使用一个布局。


代码实现

       我直接拿来原来的CMusicItemUI控件,做稍微的修改就可以了,音乐电台项目的hot状态和音乐列表的hot状态不一样,自习观察可以看到音乐列表在hot状态下外层有一个边框,而电台没有,如图

         

        另外电台的每个项目之间有一道灰色的横线分割,这个功能List控件自带了,设置分割线颜色就可以了。

        再专门为电台项目写一个RadioListItemInfo结构体来保存他的各种信息(电台名字,收听人数等)

struct RadioListItemInfo
{
	CDuiString logo;
	CDuiString logo_small;
	CDuiString music_name;
	CDuiString radio_name;
	CDuiString audience_num;
};

       然后再CMusicListUI控件   增加一个AddRadio函数,让他根据传入的RadioListItemInfo结构体,动态的根据音乐电台控件的xml文件构建电台控件,增加到电台列表里,这些代码和分析已经在做播放列表的文章里说过了,我就不再赘述了,最后把效果图贴一下,包含三种状态的控件。

          


         2014.8.1  14:30  Redrain


相关实践学习
日志服务之使用Nginx模式采集日志
本文介绍如何通过日志服务控制台创建Nginx模式的Logtail配置快速采集Nginx日志并进行多维度分析。
目录
相关文章
|
3月前
|
存储 监控 数据库
Django 后端架构开发:高效日志规范与实践
Django 后端架构开发:高效日志规范与实践
73 1
|
1月前
|
Rust 前端开发 JavaScript
Tauri 开发实践 — Tauri 日志记录功能开发
本文介绍了如何为 Tauri 应用配置日志记录。Tauri 是一个利用 Web 技术构建桌面应用的框架。文章详细说明了如何在 Rust 和 JavaScript 代码中设置和集成日志记录,并控制日志输出。通过添加 `log` crate 和 Tauri 日志插件,可以轻松实现多平台日志记录,包括控制台输出、Webview 控制台和日志文件。文章还展示了如何调整日志级别以优化输出内容。配置完成后,日志记录功能将显著提升开发体验和程序稳定性。
80 1
Tauri 开发实践 — Tauri 日志记录功能开发
|
3月前
|
SQL 关系型数据库 MySQL
【MySQL】根据binlog日志获取回滚sql的一个开发思路
【MySQL】根据binlog日志获取回滚sql的一个开发思路
|
16天前
|
监控 开发者
鸿蒙5.0版开发:使用HiLog打印日志(ArkTS)
在HarmonyOS 5.0中,HiLog是系统提供的日志系统,支持DEBUG、INFO、WARN、ERROR、FATAL五种日志级别。本文介绍如何在ArkTS中使用HiLog打印日志,并提供示例代码。通过合理使用HiLog,开发者可以更好地调试和监控应用。
62 16
|
1月前
|
开发框架 缓存 安全
开发日志:IIS安全配置
开发日志:IIS安全配置
开发日志:IIS安全配置
|
1月前
|
开发工具 git
git显示开发日志+WinSW——将.exe文件注册为服务的一个工具+图床PicGo+kubeconfig 多个集群配置 如何切换
git显示开发日志+WinSW——将.exe文件注册为服务的一个工具+图床PicGo+kubeconfig 多个集群配置 如何切换
39 1
|
3月前
|
人工智能 Java Spring
Spring框架下,如何让你的日志管理像‘AI’一样智能,提升开发效率的秘密武器!
【8月更文挑战第31天】日志管理在软件开发中至关重要,不仅能帮助开发者追踪问题和调试程序,还是系统监控和运维的重要工具。在Spring框架下,通过合理配置Logback等日志框架,可大幅提升日志管理效率。本文将介绍如何引入日志框架、配置日志级别、在代码中使用Logger,以及利用ELK等工具进行日志聚合和分析,帮助你构建高效、可靠的日志管理系统,为开发和运维提供支持。
71 0
|
19天前
|
XML 安全 Java
【日志框架整合】Slf4j、Log4j、Log4j2、Logback配置模板
本文介绍了Java日志框架的基本概念和使用方法,重点讨论了SLF4J、Log4j、Logback和Log4j2之间的关系及其性能对比。SLF4J作为一个日志抽象层,允许开发者使用统一的日志接口,而Log4j、Logback和Log4j2则是具体的日志实现框架。Log4j2在性能上优于Logback,推荐在新项目中使用。文章还详细说明了如何在Spring Boot项目中配置Log4j2和Logback,以及如何使用Lombok简化日志记录。最后,提供了一些日志配置的最佳实践,包括滚动日志、统一日志格式和提高日志性能的方法。
154 30
【日志框架整合】Slf4j、Log4j、Log4j2、Logback配置模板
|
1月前
|
XML JSON Java
Logback 与 log4j2 性能对比:谁才是日志框架的性能王者?
【10月更文挑战第5天】在Java开发中,日志框架是不可或缺的工具,它们帮助我们记录系统运行时的信息、警告和错误,对于开发人员来说至关重要。在众多日志框架中,Logback和log4j2以其卓越的性能和丰富的功能脱颖而出,成为开发者们的首选。本文将深入探讨Logback与log4j2在性能方面的对比,通过详细的分析和实例,帮助大家理解两者之间的性能差异,以便在实际项目中做出更明智的选择。
244 3
|
1月前
|
存储 缓存 关系型数据库
MySQL事务日志-Redo Log工作原理分析
事务的隔离性和原子性分别通过锁和事务日志实现,而持久性则依赖于事务日志中的`Redo Log`。在MySQL中,`Redo Log`确保已提交事务的数据能持久保存,即使系统崩溃也能通过重做日志恢复数据。其工作原理是记录数据在内存中的更改,待事务提交时写入磁盘。此外,`Redo Log`采用简单的物理日志格式和高效的顺序IO,确保快速提交。通过不同的落盘策略,可在性能和安全性之间做出权衡。
1642 14
下一篇
无影云桌面