音乐播放页面显示方法、装置及设备与流程

xiaoxiao2026-08-25  5


本公开实施例涉及互联网,更具体地,涉及一种音乐播放页面显示方法、一种音乐播放页面显示装置、及一种电子设备。


背景技术:

1、随着智能终端的发展,用户通常会使用智能终端中的音乐播放应用进行歌曲播放,然而,在基于多数音乐播放应用进行歌曲播放时,其音乐播放页面的背景颜色是固定不变的,这样导致视觉效果单一。


技术实现思路

1、本公开实施例的一个目的是提供一种音乐播放页面显示的新的技术方案。

2、根据本公开实施例的第一方面,提供一种音乐播放页面显示方法,该方法包括:

3、接收用户对目标歌曲的播放请求;

4、响应于所述播放请求,显示所述目标歌曲的音乐播放页面;

5、其中,所述音乐播放页面包括第一页面区域和第二页面区域,所述第一页面区域显示所述目标歌曲的第一歌曲信息,所述第二页面区域显示所述目标歌曲的第二歌曲信息,所述音乐播放页面的背景颜色与所述目标歌曲的专辑封面图的图片颜色相关联,且所述第一页面区域的背景颜色和所述第二页面区域的背景颜色不同。

6、可选地,所述第一歌曲信息包括所述专辑封面图或者歌词信息。

7、可选地,所述方法还包括确定所述第一页面区域的背景颜色的步骤,

8、所述确定所述第一页面区域的背景颜色,包括:

9、在所述第一页面区域对所述专辑封面图进行设定处理,获得第一背景图;其中,所述第一背景图的尺寸与所述第一页面区域的尺寸相同;

10、在所述第一背景图上叠加第一蒙层,获得所述第一页面区域的背景颜色;

11、且/或,所述第一蒙层的设定参数的参数值包括以下至少一项:色值参数的参数值为黑色、透明度参数的参数值为第一透明度、背景模糊参数的参数值为第一背景模糊值。

12、可选地,所述在所述第一页面区域对所述专辑封面图进行设定处理,获得第一背景图,包括:

13、在所述第一页面区域对所述专辑封面图进行平铺拉伸处理或者裁剪处理,获得第一背景图。

14、可选地,所述第一蒙层的设定参数的参数值包括:色值参数的参数值为黑色、透明度参数的参数值为第一透明度,

15、所述在所述第一背景图上叠加第一蒙层,获得所述第一页面区域的背景颜色,包括:

16、在所述第一背景图上叠加第一蒙层;

17、对叠加有所述第一蒙层的所述第一背景图进行高斯模糊处理,获得所述第一页面区域的背景颜色。

18、可选地,所述方法还包括确定所述第二页面区域的背景颜色的步骤,

19、所述确定所述第二页面区域的背景颜色,包括:

20、获取所述目标歌曲的专辑封面图的色值信息;

21、基于所述色值信息,获得所述第二页面区域的初始背景颜色;

22、在所述第二页面区域的初始背景颜色上叠加第二蒙层,获得所述第二页面区域的背景颜色;

23、且/或,所述第二蒙层的设定参数的参数值包括以下至少一项:色值参数的参数值为黑色、透明度参数的参数值为第二透明度。

24、可选地,所述色值信息包括平均色值、最多色值、最少色值、设定色值中其中一个;

25、其中,所述设定色值为位于设定色值范围内的其中一个色值,所述设定色值范围基于所述平均色值确定。

26、可选地,所述第一透明度为20%-80%。

27、可选地,所述第二透明度为20%-80%。

28、可选地,所述第一页面区域和所述第二页面区域的显示高度占比根据显示区域的尺寸确定。

29、可选地,所述第一页面区域和所述第二页面区域的显示高度占比的范围为1:5-5:1。

30、可选地,所述第一页面区域和所述第二页面区域的显示高度占比为以下其中一项:1:5、1:4、1:3、1:2、2:1、3:1、4:1、5:1。

31、可选地,所述第一页面区域的背景颜色和所述第二页面区域的背景颜色满足:所述第一页面区域的背景颜色和所述第二页面区域的背景颜色的明暗度不同,所述第一页面区域的背景颜色明度大于所述第二页面区域的背景颜色明度。

32、可选地,所述第二页面区域还显示音乐播放操控控件,

33、所述音乐播放操控控件包括如下控件中的至少一种:音质切换控件、添加收藏控件、歌曲时长控件、播放进度控件、播放模式切换控件、播放暂停控件、上一首控件、下一首控件、音乐播放列表展开控件。

34、可选地,所述第二歌曲信息和/或所述音乐播放操控控件的透明度为50%-100%。

35、可选地,所述方法还包括:

36、接收对所述音质切换控件的第一输入;

37、响应于所述第一输入,在所述音乐播放页面之上显示音质选择页面;其中,所述音质选择页面的高度不大于所述音乐播放页面的高度。

38、可选地,所述方法还包括:

39、接收对所述音乐播放列表展开控件的第二输入;

40、响应于所述第二输入,在所述音乐播放页面之上显示音乐播放列表页面;其中,所述音乐播放列表页面的高度不大于所述音乐播放页面的高度。

41、根据本公开实施例的第二方面,提供了一种音乐播放页面显示装置,该装置包括:

42、接收模块,用于接收用户对目标歌曲的播放请求;

43、显示模块,用于响应于所述播放请求,显示所述目标歌曲的音乐播放页面;

44、其中,所述音乐播放页面包括第一页面区域和第二页面区域,所述第一页面区域显示所述目标歌曲的第一歌曲信息,所述第二页面区域显示所述目标歌曲的第二歌曲信息,所述音乐播放页面的背景颜色与所述目标歌曲的专辑封面图的图片颜色相关联,且所述第一页面区域的背景颜色和所述第二页面区域的背景颜色不同。

45、根据本公开实施例的第三方面,提供了一种电子设备,其包括存储器,用于存储可执行的计算机指令;处理器,用于根据所述可执行的计算机指令的控制,执行根据以上第一方面所述的音乐播放页面显示方法。

46、本公开实施例的一个有益效果在于,电子设备在接收到用户对目标歌曲的播放请求的情况下,便可响应于该播放请求,显示目标歌曲的音乐播放页面,其中,音乐播放页面包括第一页面区域和第二页面区域,第一页面区域显示目标歌曲的第一歌曲信息,第二页面区域显示目标歌曲的第二歌曲信息,音乐播放页面的背景颜色与专辑封面图的图片颜色相关联,且第一页面区域的背景颜色和第二页面区域的背景颜色不同。也就是说,目标歌曲的音乐播放页面的背景颜色会随着目标歌曲的专辑封面图的颜色自适应改变,其遵循目标歌曲的专辑封面图的色彩倾向,且音乐播放页面中第一歌曲信息的背景颜色和第二歌曲信息的背景颜色也不相同,这样可兼顾音乐播放页面的视觉和谐性和美观性。

47、通过以下参照附图对本说明书的示例性实施例的详细描述,本说明书的其它特征及其优点将会变得清楚。



技术特征:

1.一种音乐播放页面显示方法,其特征在于,包括:

2.根据权利要求1所述的方法,其特征在于,所述第一歌曲信息包括所述专辑封面图或者歌词信息。

3.根据权利要求1所述的方法,其特征在于,所述方法还包括确定所述第一页面区域的背景颜色的步骤,

4.根据权利要求3所述的方法,其特征在于,所述在所述第一页面区域对所述专辑封面图进行设定处理,获得第一背景图,包括:

5.根据权利要求3所述的方法,其特征在于,所述第一蒙层的设定参数的参数值包括:色值参数的参数值为黑色、透明度参数的参数值为第一透明度,

6.根据权利要求1所述的方法,其特征在于,所述方法还包括确定所述第二页面区域的背景颜色的步骤,

7.根据权利要求6所述的方法,其特征在于,所述色值信息包括平均色值、最多色值、最少色值、设定色值中其中一个;

8.根据权利要求3所述的方法,其特征在于,所述第一透明度为20%-80%。

9.根据权利要求6所述的方法,其特征在于,所述第二透明度为20%-80%。

10.根据权利要求1至9中任意一项所述的方法,其特征在于,所述第一页面区域和所述第二页面区域的显示高度占比根据显示区域的尺寸确定。

11.根据权利要求10所述的方法,其特征在于,所述第一页面区域和所述第二页面区域的显示高度占比的范围为1:5-5:1。

12.根据权利要求11所述的方法,其特征在于,所述第一页面区域和所述第二页面区域的显示高度占比为以下其中一项:1:5、1:4、1:3、1:2、2:1、3:1、4:1、5:1。

13.根据权利要求1至9中任意一项所述的方法,其特征在于,所述第一页面区域的背景颜色和所述第二页面区域的背景颜色满足:所述第一页面区域的背景颜色和所述第二页面区域的背景颜色的明暗度不同,所述第一页面区域的背景颜色明度大于所述第二页面区域的背景颜色明度。

14.根据权利要求1至9中任意一项所述的方法,其特征在于,所述第二页面区域还显示音乐播放操控控件,

15.根据权利要求14所述的方法,其特征在于,所述第二歌曲信息和/或所述音乐播放操控控件的透明度为50%-100%。

16.根据权利要求14所述的方法,其特征在于,所述方法还包括:

17.根据权利要求14所述的方法,其特征在于,所述方法还包括:

18.一种音乐播放页面显示装置,其特征在于,包括:

19.一种电子设备,其特征在于,包括:存储器,用于存储可执行的计算机指令;处理器,用于根据所述可执行的计算机指令的控制,执行根据权利要求1-17中任意一项所述的音乐播放页面显示方法。


技术总结
本公开提供了一种音乐播放页面显示方法、装置及设备,该方法包括:接收用户对目标歌曲的播放请求;响应于所述播放请求,显示所述目标歌曲的音乐播放页面;其中,所述音乐播放页面包括第一页面区域和第二页面区域,所述第一页面区域显示所述目标歌曲的第一歌曲信息,所述第二页面区域显示所述目标歌曲的第二歌曲信息,所述音乐播放页面的背景颜色与所述目标歌曲的专辑封面图的图片颜色相关联,且所述第一页面区域的背景颜色和所述第二页面区域的背景颜色不同。

技术研发人员:孙郅涵,李文博
受保护的技术使用者:歌尔丹拿科技有限公司
技术研发日:
技术公布日:2024/9/23
转载请注明原文地址:https://www.famiwei.com/read-9026573.html

最新回复(0)