WO2023071596A1 - Sound effect display method and terminal device - Google Patents
Sound effect display method and terminal device Download PDFInfo
- Publication number
- WO2023071596A1 WO2023071596A1 PCT/CN2022/119321 CN2022119321W WO2023071596A1 WO 2023071596 A1 WO2023071596 A1 WO 2023071596A1 CN 2022119321 W CN2022119321 W CN 2022119321W WO 2023071596 A1 WO2023071596 A1 WO 2023071596A1
- Authority
- WO
- WIPO (PCT)
- Prior art keywords
- color
- saturation
- plane
- effect display
- sound wave
- Prior art date
Links
- 230000000694 effects Effects 0.000 title claims abstract description 115
- 238000000034 method Methods 0.000 title claims abstract description 43
- 230000004044 response Effects 0.000 claims abstract description 9
- 230000000875 corresponding effect Effects 0.000 claims description 49
- 238000004590 computer program Methods 0.000 claims description 18
- 239000011159 matrix material Substances 0.000 claims description 12
- 230000002596 correlated effect Effects 0.000 claims description 3
- 230000000007 visual effect Effects 0.000 description 11
- 238000010586 diagram Methods 0.000 description 10
- 239000003086 colorant Substances 0.000 description 5
- 238000005516 engineering process Methods 0.000 description 5
- 238000006243 chemical reaction Methods 0.000 description 4
- 238000012545 processing Methods 0.000 description 4
- 238000013461 design Methods 0.000 description 2
- 230000002708 enhancing effect Effects 0.000 description 2
- 230000003068 static effect Effects 0.000 description 2
- 230000005540 biological transmission Effects 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 230000001788 irregular Effects 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 239000002245 particle Substances 0.000 description 1
- 238000009877 rendering Methods 0.000 description 1
- 238000011160 research Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/16—Sound input; Sound output
- G06F3/167—Audio in a user interface, e.g. using voice commands for navigating, audio feedback
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/16—Sound input; Sound output
- G06F3/165—Management of the audio stream, e.g. setting of volume, audio stream path
Definitions
- the present application relates to the technical field of terminals, in particular to a method for displaying sound effects and a terminal device.
- the embodiments of the present application provide a sound effect display method and a terminal device, which are used to improve the visual experience of the sound effect display interface.
- the embodiments of the present application provide a method for displaying sound effects, including:
- the sound effect display interface includes: a grid, a sound wave line, and a cover image corresponding to the target audio file;
- the grid is located on the first plane in the interface scene of the sound effect display interface, and the first plane is the horizontal plane in the interface scene;
- the sound wave line is a closed curve in the first plane, used to display the sound wave waveform corresponding to the preset sound attribute of the target audio file;
- the cover image is located on the interface On the second plane in the scene, and the lower edge of the cover image is located in the area enclosed by the sound wave line on the first plane, the second plane is perpendicular to the depth direction of the interface scene plane.
- the embodiment of the present application provides a terminal device, including:
- a receiving unit configured to receive the first operation input to the target audio file
- a display unit configured to display an audio effect presentation interface corresponding to the target audio file in response to the first operation
- the sound effect display interface includes: a grid, a sound wave line, and a cover image corresponding to the target audio file;
- the grid is located on the first plane in the interface scene of the sound effect display interface, and the first plane is the horizontal plane in the interface scene;
- the sound wave line is a closed curve in the first plane, used to display the sound wave waveform corresponding to the preset sound attribute of the target audio file;
- the cover image is located on the interface On the second plane in the scene, and the lower edge of the cover image is located in the area enclosed by the sound wave line on the first plane, the second plane is perpendicular to the depth direction of the interface scene plane.
- an embodiment of the present application provides an electronic device, including: a memory and a processor, the memory is used to store a computer program; the processor is used to enable the electronic device to implement any of the above-mentioned The sound effect display method described in the embodiment.
- an embodiment of the present application provides a computer-readable storage medium, where a computer program is stored on the computer-readable storage medium, and when the computer program is executed by a computing device, the computing device realizes any of the above-mentioned The sound effect display method described in the embodiment.
- an embodiment of the present application provides a computer program product, which, when running on a computer, enables the computer to implement the sound effect display method described in any of the foregoing embodiments.
- the audio effect display interface when receiving the first operation input to the target audio file, in response to the first operation, display the audio effect display interface corresponding to the target audio file; since the audio effect display interface includes : a grid, a sound wave line, and a cover image corresponding to the target audio file, the grid is located on a horizontal plane in the interface scene of the sound effect display interface, the sound wave line is a closed curve in the horizontal plane, and the cover The image is located in a plane perpendicular to the depth direction of the interface scene of the sound effect display interface, and the lower edge of the cover image is located in the area enclosed by the sound wave lines in the horizontal plane, so this embodiment of the present application can A three-dimensional sound effect display interface is created through grids, sound wave lines, and cover images, so that the sound effect display interface has a sense of space and three-dimensionality, thereby enhancing the visual experience of the sound effect display interface.
- FIG. 1 is a flow chart of the steps of the sound effect display method provided by the embodiment of the present application.
- FIG. 2 is one of the schematic diagrams of the audio display interface provided by the embodiment of the present application.
- Fig. 3 is the second schematic diagram of the sound effect display interface provided by the embodiment of the present application.
- FIG. 4 is a schematic diagram of a dot matrix provided by an embodiment of the present application.
- Fig. 5 is the third schematic diagram of the audio display interface provided by the embodiment of the present application.
- FIG. 6 is a schematic diagram of the layer structure of the sound effect display interface provided by the embodiment of the present application.
- Fig. 7 is a schematic diagram of the sound wave line provided by the embodiment of the present application.
- FIG. 8 is a schematic structural diagram of a terminal device provided in an embodiment of the present application.
- FIG. 9 is a schematic diagram of a hardware structure of an electronic device provided by an embodiment of the present application.
- words such as “exemplary” or “for example” are used as examples, illustrations or illustrations. Any embodiment or design scheme described as “exemplary” or “for example” in the embodiments of the present application shall not be interpreted as being more preferred or more advantageous than other embodiments or design schemes. Rather, the use of words such as “exemplary” or “such as” is intended to present related concepts in a concrete manner.
- the meaning of "plurality” refers to two or more.
- the embodiment of the present application provides a sound effect display method, as shown in Figure 1, the sound effect display method includes the following steps:
- the first operation in this embodiment of the present application may be an operation for triggering the playback of the target audio file, or an operation for sharing the target audio file, or generating and previewing the sound effect of the target audio file Display the operation of the interface.
- the first operation may be a click operation on the target audio file, or a voice command, or a specific gesture.
- the specific gesture may be any one of a click gesture, a slide gesture, a pressure recognition gesture, a long press gesture, an area change gesture, a double press gesture, and a double click gesture.
- the target audio file in this embodiment of the present application may be any type of audio file. Examples: songs, audio novels, musical accompaniments, etc.
- the sound effect display interface includes: a grid, a sound wave line, and a cover image corresponding to the target audio file;
- the grid is located on the first plane in the interface scene of the sound effect display interface, and the first plane is the horizontal plane in the interface scene;
- the sound wave line is a closed curve in the first plane, used to display the sound wave waveform corresponding to the preset audio attribute of the target audio file;
- the cover image is located on the interface On the second plane in the scene, and the lower edge of the cover image is located in the area enclosed by the sound wave line on the first plane, the second plane is perpendicular to the depth direction of the interface scene plane.
- the preset sound attribute of the target audio file in the embodiment of the present application may be the loudness of the sound corresponding to the target audio file, the pitch of the sound corresponding to the target audio file, etc., which is not limited in the embodiment of the present application .
- the sound effect display interface in the embodiment of the present application is a two-dimensional image interface
- the interface scene of the sound effect display interface is a three-dimensional scene with depth
- the sound effect display interface is that the interface scene of the sound effect display interface is in a two-dimensional space projection.
- the sound effect display interface is a different display interface of the target audio file.
- the sound effect presentation interface may be a playback interface of the target audio file.
- the audio effect display interface may be a sharing preview interface of the target audio file.
- the sound effect display interface includes: a grid 21 , a sound wave line 22 and a cover image 23 .
- the grid 21 is located in the horizontal plane of the interface scene of the audio display interface.
- the sound wave line 22 is a closed curve in the horizontal plane, which is used to display the sound wave waveform corresponding to the preset sound attribute of the target audio file.
- the cover image 23 is located on a plane perpendicular to the depth direction of the interface scene, and the lower edge of the cover image 23 is located in the area enclosed by the sound wave lines 22 on the horizontal plane.
- the sound wave line is a circle in the first plane as an example.
- the embodiment of the present application is not limited thereto.
- the sound wave line in the embodiment of the present application may also be a closed curve of other shapes, such as a quadrangle, a hexagon, an ellipse, and an irregular shape.
- the audio effect display interface when receiving the first operation input to the target audio file, in response to the first operation, display the audio effect display interface corresponding to the target audio file; since the audio effect display interface includes : a grid, a sound wave line, and a cover image corresponding to the target audio file, the grid is located on a horizontal plane in the interface scene of the sound effect display interface, the sound wave line is a closed curve in the horizontal plane, and the cover The image is located in a plane perpendicular to the depth direction of the interface scene of the sound effect display interface, and the lower edge of the cover image is located in the area enclosed by the sound wave lines in the horizontal plane, so this embodiment of the present application can A three-dimensional sound effect display interface is created through grids, sound wave lines, and cover images, so that the sound effect display interface has a sense of space and three-dimensionality, thereby enhancing the visual experience of the sound effect display interface.
- the sound effect display interface further includes: a plurality of first light beams 31 and a plurality of second light beams 32 .
- the multiple first beams 31 are all located on the first plane, and the multiple first beams 31 are parallel to each other.
- the plurality of second light beams 32 are all perpendicular to the first plane.
- the sound effect display interface provided by the embodiment of the present application also includes a plurality of first light beams located on the first plane and parallel to each other and a plurality of second light beams perpendicular to the first plane, the above embodiment can be achieved through multiple A first light beam and multiple second light beams create a more realistic three-dimensional effect, thereby further improving the visual experience of the sound effect display interface.
- the sound effect display interface further includes: a dot matrix 40 ;
- the dot matrix is located on the first plane, and each dot of the dot matrix 40 is arranged around two sides of the sound wave line 22 .
- a light dot matrix 40 composed of a plurality of light dots is arranged.
- the sound effect display interface provided by the embodiment of the present application also includes a dot matrix composed of multiple light points, the above embodiment can make the sound effect display interface display more details, thereby further improving the visual experience of the sound effect display interface.
- the distance from the sound wave line to the edge of the sound effect display interface is greater than or equal to a threshold distance.
- the threshold distance may be a distance of 20 pixels (20px).
- the threshold distance is 20px as an example.
- the above embodiment can prevent the sound effect display interface from fully displaying the sound wave line, thereby avoiding affecting the visual experience of the sound effect display interface.
- step S12 (displaying the audio display interface corresponding to the target audio file) includes the following steps a to b:
- Step a generating sequence frames corresponding to the grid, the multiple first light beams, and the multiple second light beams.
- the positions of the plurality of first light beams and the plurality of second light beams in the image frames of the sequence frames change sequentially.
- the sequence frame in the embodiment of the present application refers to sorting multiple image frames and displaying the sorted multiple images according to a preset switching rate to obtain a file with an effect similar to that of a video.
- Step b Play the sequence frame in a loop to display the audio effect display interface corresponding to the target audio file.
- the above-mentioned embodiment displays the grid, the first light beam, and the second light beam in the sound effect display interface by means of sequential frames. It is possible to avoid using the particle effect animation engine while realizing the dynamic effect, thereby reducing the amount of data processing for rendering the sound effect display interface and preventing terminal devices with poor performance from being unable to normally display the sound effect display interface in the embodiment of the present application.
- step S12 (displaying the audio effect presentation interface corresponding to the target audio file) includes:
- the sequence frame, the sound wave line and the cover image are respectively displayed in different layers of the sound effect display interface.
- the sound effect display interface in the implementation of the present application includes five layers, and the five layers are sequentially from the bottom layer to the top layer: the bottom layer 61, the background layer 62, the basic frame layer 63, the sound wave Line layer 64 and cover image layer 65 .
- the base layer 61 is used to display the base image, the shape and size of the base image are the same as the shape and size of the sound effect display interface, and the color of all pixels is the preset color with a shading rate of 100%.
- the color of each pixel of the bottom plate image is black or dark blue black.
- the background layer 62 is used to display the background image, the shape and size of the background image are the same as the shape and size of the sound effect display interface, the colors of each pixel are the same, and they are all colors determined according to the cover image, and the shading rate is 30%. .
- the basic frame layer 63 is used for displaying sequence frames generated according to a plurality of images including the grid, the plurality of first light beams and the plurality of second light beams, and the shading rate is 100%.
- the sound wave line layer 64 is used to display the sound wave line, and the shading rate is 100%.
- the cover image layer 65 is used to display the cover image, and the shading rate is 100%.
- the color of the first position of the sound wave line is a first color
- the color of the second position of the sound wave line is a second color
- the color of the sound wave line gradually changes from the first color to the second color.
- the first position and the second position are two intersection positions of the target straight line and the sound wave line respectively;
- the included angle is a straight line with a preset angle.
- the preset angle may be 30°.
- two intersection points of target straight line 70 and sound wave line 22 are respectively point 221 and point 222, so point 221 and point 222 are the first position and the second position of sound wave line respectively, the color of point 221 and point 222 They are the first color and the second color respectively, and the colors of the points 221 to 222 on the sound wave line 22 gradually change from the first color to the second color.
- the sound effect display method provided in the embodiment of the present application further includes: determining the first color according to the color of the cover image , the second color and the background color of the sound effect display interface.
- the implementation of determining the first color, the second color, and the background color of the sound effect display interface according to the color of the cover image may include the following steps 1 to 3:
- Step 1 Obtain the average color value of each pixel of the cover image.
- the color values of each pixel of the cover image are obtained, and the color values of each pixel are added and then divided by the number of pixels in the cover image to obtain the average color value of each pixel of the cover image.
- Step 2 Convert the average color value into a color in the HSV color space to obtain a basic color.
- the HSV color space is a color space that expresses colors through hue (Hue), saturation (Saturation) and lightness (Value), and any color in the HSV color space includes a parameter H used to represent hue, for A parameter S for saturation and a parameter V for lightness.
- the conversion formula can be determined according to the color space to which the cover image belongs, and then the average color value can be converted according to the determined conversion formula to obtain the basic color. For example, if the cover image belongs to the RGB color space, the average color value is converted according to the conversion formula between the RGB color space and the color of the HSV color space to obtain the basic color.
- Step 3 Determine the first color, the second color, and the background color of the sound effect display interface according to the basic color.
- the determining the first color according to the basic color includes:
- the saturation of the base color is greater than or equal to a threshold saturation, then determining that the saturation of the first color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, Then determine the saturation of the first color as the sum of the saturation of the basic color and the preset saturation;
- the lightness, saturation, and lightness of the basic color are H 0 , S 0 , and V 0 respectively
- the lightness, saturation, and lightness of the first color are H 1 , S 1 , and V 1 , respectively
- the threshold saturation is the S threshold
- the default saturation is a, then:
- the determining the second color according to the basic color includes:
- the hue of the second color is the sum of the hue of the base color and a preset hue
- the saturation of the base color is greater than or equal to a threshold saturation, then determining that the saturation of the second color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, Then determine the saturation of the second color as the sum of the saturation of the basic color and the preset saturation;
- the lightness, saturation, and lightness of the basic color are H 0 , S 0 , and V 0
- the lightness, saturation, and lightness of the second color are H 2 , S 2 , and V 2 , respectively
- the threshold saturation is the S threshold
- the default saturation is a
- the default hue is b
- the determining the background color according to the basic color includes:
- the saturation of the base color is greater than or equal to the threshold saturation, then determine that the saturation of the background color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, then determining the saturation of the background color as the sum of the saturation of the base color and a preset saturation;
- the target lightness is the lightness corresponding to the lightness interval to which the lightness of the basic color belongs, and the lightness corresponding to the lightness interval is the same as the The central lightness value of the lightness interval is positively correlated.
- the lightness, saturation, and lightness of the basic color are H 0 , S 0 , and V 0 respectively;
- the lightness, saturation, and lightness of the background color are H 3 , S 3 , and V 3 ;
- the saturation be a, and the corresponding relationship between the lightness interval and the lightness is shown in Table 1 above, then:
- V 3 V 0 ⁇ c
- the embodiment of the present application can better match the color of the sound effect display interface with the cover image, thereby improving the user's Visual experience experience.
- the embodiment of the present application also provides a terminal device.
- This device embodiment corresponds to the aforementioned method embodiment.
- the details in the above will be described one by one, but it should be clear that the terminal device in this embodiment can correspondingly implement all the content in the foregoing method embodiments.
- FIG. 8 is a schematic structural diagram of the terminal device. As shown in FIG. 8, the terminal device 800 includes:
- a receiving unit 81 configured to receive the first operation input to the target audio file
- a display unit 82 configured to display an audio display interface corresponding to the target audio file in response to the first operation
- the sound effect display interface includes: a grid, a sound wave line, and a cover image corresponding to the target audio file;
- the grid is located on the first plane in the interface scene of the sound effect display interface, and the first plane is the horizontal plane in the interface scene;
- the sound wave line is a closed curve in the first plane, used to display the sound wave waveform corresponding to the preset sound attribute of the target audio file;
- the cover image is located on the interface On the second plane in the scene, and the lower edge of the cover image is located in the area enclosed by the sound wave line on the first plane, the second plane is perpendicular to the depth direction of the interface scene plane.
- the sound effect display interface further includes: a plurality of first light beams and a plurality of second light beams;
- the plurality of first light beams are all located on the first plane, and the plurality of first light beams are parallel to each other;
- the plurality of second light beams are all perpendicular to the first plane.
- the sound effect display interface further includes: a dot matrix
- the light point matrix is located on the first plane, and each light point of the light point matrix is arranged around two sides of the sound wave line.
- the distance from the sound wave line to the edge of the sound effect display interface is greater than or equal to a threshold distance.
- the display unit 82 is specifically configured to generate sequence frames corresponding to the grid, the multiple first light beams, and the multiple second light beams; The positions of the plurality of first light beams and the plurality of second light beams are changed sequentially; the sequence frames are played cyclically to display the audio effect display interface corresponding to the target audio file.
- the display unit 82 is specifically configured to respectively display the sequence frame, the sound wave line and the cover image in different layers of the sound effect display interface.
- the color of the first position of the sound wave line is a first color
- the color of the second position of the sound wave line is a second color
- the color of the sound wave line gradually changes from the first color to the second color.
- the display unit 82 is further configured to obtain the average color value of each pixel of the cover image before displaying the sound effect display interface corresponding to the target audio file; convert the average color value A basic color is obtained for a color in the HSV color space; and the first color, the second color, and the background color of the sound effect display interface are determined according to the basic color.
- the display unit 82 is specifically configured to determine that the hue of the first color is the same as that of the basic color; if the saturation of the basic color is greater than or equal to a threshold saturation, then determine that the The saturation of the first color is the same as the saturation of the basic color; if the saturation of the basic color is less than the threshold saturation, then determine that the saturation of the first color is the saturation of the basic color and the preset saturation; determine the lightness of the first color as the maximum lightness value.
- the display unit 82 is specifically configured to determine that the hue of the second color is the sum of the hue of the base color and a preset hue; if the saturation of the base color is greater than or equal to the threshold saturation degree, then determine that the saturation of the second color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, then determine that the saturation of the second color is the The sum of the saturation of the basic color and the preset saturation; determine the lightness of the second color as the maximum lightness value.
- the display unit is specifically configured to determine that the hue of the background color is the same as that of the base color; if the saturation of the base color is greater than or equal to a threshold saturation, then determine that the background color is The saturation of the color is the same as the saturation of the basic color; if the saturation of the basic color is less than the threshold saturation, it is determined that the saturation of the background color is the saturation of the basic color and the preset saturation the sum of degrees; determine that the lightness of the background color is the difference between the lightness of the basic color and the target lightness, the target lightness is the lightness corresponding to the lightness interval to which the lightness of the basic color belongs, and the lightness interval corresponds to Lightness is positively correlated with the central lightness value of the lightness interval.
- the first position and the second position are respectively two intersection positions of the target straight line and the sound wave line; the target straight line passes through the geometric center of the sound wave line in the first plane and A straight line whose included angle with the horizontal direction is a preset angle.
- the terminal device provided in this embodiment can execute the sound effect display method provided in the above method embodiment, and its implementation principle is similar to the technical effect, and will not be repeated here.
- FIG. 9 is a schematic structural diagram of an electronic device provided by an embodiment of the present application.
- the electronic device provided by this embodiment includes: a memory 91 and a processor 92, the memory 91 is used to store computer programs; the processing The device 92 is configured to enable the electronic device to implement the method for displaying sound effects provided by the above-mentioned embodiments when the computer program is invoked for execution.
- the embodiment of the present application also provides a computer-readable storage medium, the computer-readable storage medium stores a computer program, and when the computer program is executed by a computing device, the computing device realizes the sound effects provided by the above-mentioned embodiments Show method.
- An embodiment of the present application further provides a computer program product, which, when the computer program product is run on a computer, enables the computer to implement the sound effect display method provided in the foregoing embodiments.
- the embodiments of the present application may be provided as methods, systems, or computer program products. Accordingly, the present application may take the form of an entirely hardware embodiment, an entirely software embodiment, or an embodiment combining software and hardware aspects. Furthermore, the present application may take the form of a computer program product embodied on one or more computer-usable storage media having computer-usable program code embodied therein.
- the processor can be a central processing unit (Central Processing Unit, CPU), or other general-purpose processors, digital signal processors (Digital Signal Processor, DSP), application specific integrated circuits (Application Specific Integrated Circuit, ASIC), off-the-shelf programmable Field-Programmable Gate Array (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc.
- a general-purpose processor may be a microprocessor, or the processor may be any conventional processor, or the like.
- Memory may include non-permanent storage in computer readable media, in the form of random access memory (RAM) and/or nonvolatile memory such as read only memory (ROM) or flash RAM.
- RAM random access memory
- ROM read only memory
- flash RAM flash random access memory
- Computer-readable media includes both volatile and non-volatile, removable and non-removable storage media.
- the storage medium may store information by any method or technology, and the information may be computer-readable instructions, data structures, program modules, or other data.
- Examples of computer storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read only memory (ROM), Electrically Erasable Programmable Read-Only Memory (EEPROM), Flash memory or other memory technology, Compact Disc Read-Only Memory (CD-ROM), Digital Versatile Disc (DVD) or other optical storage, A magnetic tape cartridge, disk storage or other magnetic storage device or any other non-transmission medium that can be used to store information that can be accessed by a computing device.
- computer readable media excludes transitory computer readable media, such as modulated data signals and carrier waves.
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Multimedia (AREA)
- Health & Medical Sciences (AREA)
- Audiology, Speech & Language Pathology (AREA)
- General Health & Medical Sciences (AREA)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
- Controls And Circuits For Display Device (AREA)
Abstract
Provided are a sound effect display method and a terminal device. The method comprises: receiving a first operation, which is input to a target audio file (S11); and in response to the first operation, displaying a sound effect display interface corresponding to the target audio file (S12), wherein the sound effect display interface comprises: a grid, a sound wave line, and a cover image corresponding to the target audio file; the grid is located on a first plane in an interface scenario of the sound effect display interface, and the first plane is a horizontal plane in the interface scenario; the sound wave line is a closed curve in the first plane, and is used for displaying a sound wave waveform corresponding to a preset sound attribute of the target audio file; and the cover image is located on a second plane in the interface scenario, a lower edge of the cover image is located in an area, which is formed by enclosing the sound wave line on the first plane, and the second plane is a plane perpendicular to the depth direction of the interface scenario.
Description
本申请要求于2021年10月25日提交的,申请名称为“一种音效展示方法及终端设备”的、中国专利申请号为“202111243092.2”的优先权,该中国专利申请的全部内容通过引用结合在本申请中。This application claims the priority of the Chinese patent application number "202111243092.2" filed on October 25, 2021, with the title of "A Sound Effect Display Method and Terminal Equipment", the entire content of which is incorporated by reference in this application.
本申请涉及终端技术领域,尤其涉及一种音效展示方法及终端设备。The present application relates to the technical field of terminals, in particular to a method for displaying sound effects and a terminal device.
随着多媒体技术的不断发展,用户已不再仅仅满足于播放设备能够提供高精度的还原音频或视频文件,而是对播放内容的整体感受提出了新的要求。With the continuous development of multimedia technology, users are no longer satisfied with playback devices that can provide high-precision restored audio or video files, but have put forward new requirements for the overall experience of playback content.
目前,大多数音频播放应用程序(Application)均将焦点放在了音频播放时用户的听觉体验上,而忽略了音效展示界面的视觉体验对音频播放的整体感受的影响。由于未考虑到音效展示界面的视觉体验对音频播放的整体感受的影响,因此很多音频播放应用程序会在播放音频文件等场景下,在终端设备的显示屏中显示一个极为单调的图像。例如:一些音乐播放应用程序在播放歌曲时会始终在音乐播放界面显示一个与所播放音乐相关的静态图片。然而,音效展示界面的视觉体验对音频播放的整体体验有着非常重要的影响,因此如何提升音效展示界面的视觉体验也是一个非常重要的研究课题。At present, most audio playback applications (Application) focus on the user's auditory experience during audio playback, while ignoring the impact of the visual experience of the audio display interface on the overall experience of audio playback. Since the impact of the visual experience of the audio display interface on the overall experience of audio playback is not considered, many audio playback applications will display a very monotonous image on the display screen of the terminal device in scenarios such as playing audio files. For example: some music playing applications will always display a static picture related to the music being played on the music playing interface when playing songs. However, the visual experience of the audio display interface has a very important impact on the overall experience of audio playback, so how to improve the visual experience of the audio display interface is also a very important research topic.
发明内容Contents of the invention
有鉴于此,本申请实施例提供了一种音效展示方法及终端设备,用于提升音效展示界面的视觉体验。In view of this, the embodiments of the present application provide a sound effect display method and a terminal device, which are used to improve the visual experience of the sound effect display interface.
为了实现上述目的,本申请实施例提供技术方案如下:In order to achieve the above purpose, the embodiment of the present application provides the following technical solutions:
第一方面,本申请的实施例提供了一种音效展示方法,包括:In the first aspect, the embodiments of the present application provide a method for displaying sound effects, including:
接收对目标音频文件输入的第一操作;receiving a first operation on a target audio file input;
响应于所述第一操作,显示所述目标音频文件对应的音效展示界面;In response to the first operation, display an audio display interface corresponding to the target audio file;
其中,所述音效展示界面包括:网格、音波线以及所述目标音频文件对应的封面图像;所述网格位于所述音效展示界面的界面场景中的第一平面上,所述第一平面为所述界面场景中的水平面;所述音波线为所述第一平面内的闭合曲线,用于展示所述目标音频文件的预设声音属性对应的音波波形;所述封面图像位于所述界面场景中的第二平面上,且所述封面图像的下边缘位于所述音波线在所述第一平面上围合形成的区域内,所述第二平面为垂直于所述界面场景的深度方向的平面。Wherein, the sound effect display interface includes: a grid, a sound wave line, and a cover image corresponding to the target audio file; the grid is located on the first plane in the interface scene of the sound effect display interface, and the first plane is the horizontal plane in the interface scene; the sound wave line is a closed curve in the first plane, used to display the sound wave waveform corresponding to the preset sound attribute of the target audio file; the cover image is located on the interface On the second plane in the scene, and the lower edge of the cover image is located in the area enclosed by the sound wave line on the first plane, the second plane is perpendicular to the depth direction of the interface scene plane.
第二方面,本申请实施例提供一种终端设备,包括:In a second aspect, the embodiment of the present application provides a terminal device, including:
接收单元,用于接收对目标音频文件输入的第一操作;a receiving unit, configured to receive the first operation input to the target audio file;
显示单元,用于响应于所述第一操作,显示所述目标音频文件对应的音效展示界面;A display unit, configured to display an audio effect presentation interface corresponding to the target audio file in response to the first operation;
其中,所述音效展示界面包括:网格、音波线以及所述目标音频文件对应的封面图像;所述网格位于所述音效展示界面的界面场景中的第一平面上,所述第一平面为所述界面场景中的水平面;所述音波线为所述第一平面内的闭合曲线,用于展示所述目标音频文件的预设声音属性对应的音波波形;所述封面图像位于所述界面场景中的第二平面上,且所述封面图像的下边缘位于所述音波线在所述第一平面上围合形成的区域内,所述第二平面为垂直于所述界面场景的深度方向的平面。Wherein, the sound effect display interface includes: a grid, a sound wave line, and a cover image corresponding to the target audio file; the grid is located on the first plane in the interface scene of the sound effect display interface, and the first plane is the horizontal plane in the interface scene; the sound wave line is a closed curve in the first plane, used to display the sound wave waveform corresponding to the preset sound attribute of the target audio file; the cover image is located on the interface On the second plane in the scene, and the lower edge of the cover image is located in the area enclosed by the sound wave line on the first plane, the second plane is perpendicular to the depth direction of the interface scene plane.
第三方面,本申请实施例提供一种电子设备,包括:存储器和处理器,所述存储器用于存储计算机程序;所述处理器用于在调用计算机程序时,使得所述电子设备实现上述任一实施例所述的音效展示方法。In a third aspect, an embodiment of the present application provides an electronic device, including: a memory and a processor, the memory is used to store a computer program; the processor is used to enable the electronic device to implement any of the above-mentioned The sound effect display method described in the embodiment.
第四方面,本申请实施例提供一种计算机可读存储介质,所述计算机可读存储介质上存储有计算机程序,当所述计算机程序被计算设备执行时,使得所述计算设备实现上述任一实施例所述的音效展示方法。In a fourth aspect, an embodiment of the present application provides a computer-readable storage medium, where a computer program is stored on the computer-readable storage medium, and when the computer program is executed by a computing device, the computing device realizes any of the above-mentioned The sound effect display method described in the embodiment.
第五方面,本申请实施例提供一种计算机程序产品,当所述计算机程序产品在计算机上运行时,使得所述计算机实现上述任一实施例所述的音效展示方法。In a fifth aspect, an embodiment of the present application provides a computer program product, which, when running on a computer, enables the computer to implement the sound effect display method described in any of the foregoing embodiments.
本申请实施例提供的音效展示方法在接收到对目标音频文件输入的第一操作时,响应于所述第一操作,显示所述目标音频文件对应的音效展示界面;由于所述音效展示界面包括:网格、音波线以及所述目标音频文件对应的封面图像,所述网格位于所述音效展示界面的界面场景中的水平面上,所述音波线为该水平面内的闭合曲线,所述封面图像位于与所述音效展示界面的界面场景的深度方向垂直的平面内,且所述封面图像的下边缘位于所述音波线在所述水平面内围合形成的区域内,因此本申请实施例可以通过网格、音波线以及封面图像营造出三维立体的音效展示界面,使音效展示界面具有空间感和立体感,从而提升音效展示界面的视觉体验。In the audio effect display method provided in the embodiment of the present application, when receiving the first operation input to the target audio file, in response to the first operation, display the audio effect display interface corresponding to the target audio file; since the audio effect display interface includes : a grid, a sound wave line, and a cover image corresponding to the target audio file, the grid is located on a horizontal plane in the interface scene of the sound effect display interface, the sound wave line is a closed curve in the horizontal plane, and the cover The image is located in a plane perpendicular to the depth direction of the interface scene of the sound effect display interface, and the lower edge of the cover image is located in the area enclosed by the sound wave lines in the horizontal plane, so this embodiment of the present application can A three-dimensional sound effect display interface is created through grids, sound wave lines, and cover images, so that the sound effect display interface has a sense of space and three-dimensionality, thereby enhancing the visual experience of the sound effect display interface.
此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本申请的实施例,并与说明书一起用于解释本申请的原理。The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the application and together with the description serve to explain the principles of the application.
为了更清楚地说明本申请实施例或相关技术中的技术方案,下面将对实施例或相关技术描述中所需要使用的附图作简单地介绍,显而易见地,对于本领域普通技术人员而言,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。In order to more clearly illustrate the technical solutions in the embodiments of the present application or related technologies, the following will briefly introduce the drawings that need to be used in the descriptions of the embodiments or related technologies. Obviously, for those of ordinary skill in the art, Other drawings can also be obtained from these drawings without any creative effort.
图1为本申请实施例提供的音效展示方法的步骤流程图;FIG. 1 is a flow chart of the steps of the sound effect display method provided by the embodiment of the present application;
图2为本申请实施例提供的音效展示界面的示意图之一;FIG. 2 is one of the schematic diagrams of the audio display interface provided by the embodiment of the present application;
图3为本申请实施例提供的音效展示界面的示意图之二;Fig. 3 is the second schematic diagram of the sound effect display interface provided by the embodiment of the present application;
图4为本申请实施例提供的光点点阵的示意图;FIG. 4 is a schematic diagram of a dot matrix provided by an embodiment of the present application;
图5为本申请实施例提供的音效展示界面的示意图之三;Fig. 5 is the third schematic diagram of the audio display interface provided by the embodiment of the present application;
图6为本申请实施例提供的音效展示界面的图层结构示意图;FIG. 6 is a schematic diagram of the layer structure of the sound effect display interface provided by the embodiment of the present application;
图7为本申请实施例提供的音波线的示意图;Fig. 7 is a schematic diagram of the sound wave line provided by the embodiment of the present application;
图8为本申请实施例提供的终端设备的结构示意图;FIG. 8 is a schematic structural diagram of a terminal device provided in an embodiment of the present application;
图9为本申请实施例提供的电子设备的硬件结构示意图。FIG. 9 is a schematic diagram of a hardware structure of an electronic device provided by an embodiment of the present application.
为了能够更清楚地理解本申请的上述目的、特征和优点,下面将对本申请的方案进行进一步描述。需要说明的是,在不冲突的情况下,本申请的实施例及实施例中的特征可以相互组合。In order to better understand the above purpose, features and advantages of the present application, the solution of the present application will be further described below. It should be noted that, in the case of no conflict, the embodiments of the present application and the features in the embodiments can be combined with each other.
在下面的描述中阐述了很多具体细节以便于充分理解本申请,但本申请还可以采用其他不同于在此描述的方式来实施;显然,说明书中的实施例只是本申请的一部分实施例,而不是全部的实施例。In the following description, a lot of specific details have been set forth in order to fully understand the present application, but the present application can also be implemented in other ways different from those described here; obviously, the embodiments in the description are only a part of the present application, and Not all examples.
在本申请实施例中,“示例性的”或者“例如”等词用于表示作例子、例证或说明。本申请实施例中被描述为“示例性的”或者“例如”的任何实施例或设计方案不应被解释为比其它实施例或设计方案更优选或更具优势。确切而言,使用“示例性的”或者“例如”等词旨在以具体方式呈现相关概念。此外,在本申请实施例的描述中,除非另有说明,“多个”的含义是指两个或两个以上。In the embodiments of the present application, words such as "exemplary" or "for example" are used as examples, illustrations or illustrations. Any embodiment or design scheme described as "exemplary" or "for example" in the embodiments of the present application shall not be interpreted as being more preferred or more advantageous than other embodiments or design schemes. Rather, the use of words such as "exemplary" or "such as" is intended to present related concepts in a concrete manner. In addition, in the description of the embodiments of the present application, unless otherwise specified, the meaning of "plurality" refers to two or more.
基于上述内容,本申请实施例提供了一种音效展示方法,参照图1所示,该音效展示方法包括如下步骤:Based on the above, the embodiment of the present application provides a sound effect display method, as shown in Figure 1, the sound effect display method includes the following steps:
S11、接收对目标音频文件输入的第一操作。S11. Receive a first operation of inputting a target audio file.
本申请实施例中的第一操作可以为用于触发播放所述目标音频文件的操作,也可以为用于分享所述目标音频文件的操作,还可以为生成并预览所述目标音频文件的音效展示界面的操作。第一操作具体可以为对目标音频文件的点击操作,或者是语音指令,或者是特定手势。在本申请的一些实施例中,所述特定手势可以为单击手势、滑动手势、压力识别手势、长按手势、面积变化手势、双按手势、双击手势中的任意一种。The first operation in this embodiment of the present application may be an operation for triggering the playback of the target audio file, or an operation for sharing the target audio file, or generating and previewing the sound effect of the target audio file Display the operation of the interface. Specifically, the first operation may be a click operation on the target audio file, or a voice command, or a specific gesture. In some embodiments of the present application, the specific gesture may be any one of a click gesture, a slide gesture, a pressure recognition gesture, a long press gesture, an area change gesture, a double press gesture, and a double click gesture.
本申请实施例中的目标音频文件可以为任意类型的音频文件。例如:歌曲、有声小说、音乐伴奏等等。The target audio file in this embodiment of the present application may be any type of audio file. Examples: songs, audio novels, musical accompaniments, etc.
S12、响应于所述第一操作,显示所述目标音频文件对应的音效展示界面。S12. In response to the first operation, display an audio effect presentation interface corresponding to the target audio file.
其中,所述音效展示界面包括:网格、音波线以及所述目标音频文件对应的封面图像;所述网格位于所述音效展示界面的界面场景中的第一平面上,所述第一平面为所述界面场景中的水平面;所述音波线为所述第一平面内的闭合曲线,用于展示所述目标音频文件的预设音频属性对应的音波波形;所述封面图像位于所述界面场景中的第二平面上,且所述封面图 像的下边缘位于所述音波线在所述第一平面上围合形成的区域内,所述第二平面为垂直于所述界面场景的深度方向的平面。Wherein, the sound effect display interface includes: a grid, a sound wave line, and a cover image corresponding to the target audio file; the grid is located on the first plane in the interface scene of the sound effect display interface, and the first plane is the horizontal plane in the interface scene; the sound wave line is a closed curve in the first plane, used to display the sound wave waveform corresponding to the preset audio attribute of the target audio file; the cover image is located on the interface On the second plane in the scene, and the lower edge of the cover image is located in the area enclosed by the sound wave line on the first plane, the second plane is perpendicular to the depth direction of the interface scene plane.
在一些实施方式中,本申请实施例中的目标音频文件的预设声音属可以为目标音频文件对应的声音的响度、目标音频文件对应的声音的音调等,本申请实施例对此不做限定。In some implementations, the preset sound attribute of the target audio file in the embodiment of the present application may be the loudness of the sound corresponding to the target audio file, the pitch of the sound corresponding to the target audio file, etc., which is not limited in the embodiment of the present application .
需要说明的是,本申请实施例中的音效展示界面为二维图像界面,而音效展示界面的界面场景为具有深度的三维场景,因此音效展示界面为音效展示界面的界面场景在二维空间中的投影。It should be noted that the sound effect display interface in the embodiment of the present application is a two-dimensional image interface, and the interface scene of the sound effect display interface is a three-dimensional scene with depth, so the sound effect display interface is that the interface scene of the sound effect display interface is in a two-dimensional space projection.
需要说明的是,当第一操作为对目标音频文件的不同操作时,音效展示界面为目标音频文件的不同显示界面。例如:当时第一操作为对目标音频文件输入的播放操作时,所述音效展示界面可以为目标音频文件的播放界面。再例如:当时第一操作为对目标音频文件输入的分享操作时,所述音效展示界面可以为目标音频文件的分享预览界面。It should be noted that when the first operation is a different operation on the target audio file, the sound effect display interface is a different display interface of the target audio file. For example: when the first operation is an input playback operation on the target audio file, the sound effect presentation interface may be a playback interface of the target audio file. For another example: when the first operation is an input sharing operation of the target audio file, the audio effect display interface may be a sharing preview interface of the target audio file.
示例性的,参照图2所示,音效展示界面包括:网格21、音波线22以及封面图像23。所述网格21位于所述音效展示界面的界面场景的水平面内。所述音波线22为该水平面内的闭合曲线,用于展示所述目标音频文件的预设声音属性对应的音波波形。所述封面图像23位于垂直于所述界面场景的深度方向的平面上,且所述封面图像23的下边缘位于所述音波线22在水平面上围合形成的区域内。Exemplarily, as shown in FIG. 2 , the sound effect display interface includes: a grid 21 , a sound wave line 22 and a cover image 23 . The grid 21 is located in the horizontal plane of the interface scene of the audio display interface. The sound wave line 22 is a closed curve in the horizontal plane, which is used to display the sound wave waveform corresponding to the preset sound attribute of the target audio file. The cover image 23 is located on a plane perpendicular to the depth direction of the interface scene, and the lower edge of the cover image 23 is located in the area enclosed by the sound wave lines 22 on the horizontal plane.
还需要说明的是,图2中以初始状态下(未展示所述目标音频文件的预设声音属性对应的音波波形的状态),音波线为所述第一平面内的圆形为例示出,但本申请实施例并不限定于此,在初始状态下,本申请实施例中的音波线可以还可为其它形状的闭合曲线,例如:四边形、六边形、椭圆形、不规则形状等。It should also be noted that, in the initial state (the state of the sound wave waveform corresponding to the preset sound attribute of the target audio file is not shown) in FIG. 2 , the sound wave line is a circle in the first plane as an example. However, the embodiment of the present application is not limited thereto. In the initial state, the sound wave line in the embodiment of the present application may also be a closed curve of other shapes, such as a quadrangle, a hexagon, an ellipse, and an irregular shape.
本申请实施例提供的音效展示方法在接收到对目标音频文件输入的第一操作时,响应于所述第一操作,显示所述目标音频文件对应的音效展示界面;由于所述音效展示界面包括:网格、音波线以及所述目标音频文件对应的封面图像,所述网格位于所述音效展示界面的界面场景中的水平面上,所述音波线为该水平面内的闭合曲线,所述封面图像位于与所述音效展示界面的界面场景的深度方向垂直的平面内,且所述封面图像的下边缘位于所述音波线在所述水平面内围合形成的区域内,因此本申请实施例可以通过网格、音波线以及封面图像营造出三维立体的音效展示界面,使音效展示界面具有空间感和立体感,从而提升音效展示界面的视觉体验。In the audio effect display method provided in the embodiment of the present application, when receiving the first operation input to the target audio file, in response to the first operation, display the audio effect display interface corresponding to the target audio file; since the audio effect display interface includes : a grid, a sound wave line, and a cover image corresponding to the target audio file, the grid is located on a horizontal plane in the interface scene of the sound effect display interface, the sound wave line is a closed curve in the horizontal plane, and the cover The image is located in a plane perpendicular to the depth direction of the interface scene of the sound effect display interface, and the lower edge of the cover image is located in the area enclosed by the sound wave lines in the horizontal plane, so this embodiment of the present application can A three-dimensional sound effect display interface is created through grids, sound wave lines, and cover images, so that the sound effect display interface has a sense of space and three-dimensionality, thereby enhancing the visual experience of the sound effect display interface.
在一些实施方式中,参照图3所示,所述音效展示界面还包括:多个第一光束31和多个第二光束32。In some implementations, as shown in FIG. 3 , the sound effect display interface further includes: a plurality of first light beams 31 and a plurality of second light beams 32 .
所述多个第一光束31均位于所述第一平面上,且所述多个第一光束31相互平行。The multiple first beams 31 are all located on the first plane, and the multiple first beams 31 are parallel to each other.
所述多个第二光束32均与所述第一平面垂直。The plurality of second light beams 32 are all perpendicular to the first plane.
由于本申请实施例提供的音效展示界面还包括多个位于所述第一平面上且相互平行的第一光束以及多个与所述第一平面垂直的第二光束,因此上述实施例可以通过多个第一光束和多个第二光束营造出更加真实的立体感,从而进一步提升音效展示界面的视觉体验。Since the sound effect display interface provided by the embodiment of the present application also includes a plurality of first light beams located on the first plane and parallel to each other and a plurality of second light beams perpendicular to the first plane, the above embodiment can be achieved through multiple A first light beam and multiple second light beams create a more realistic three-dimensional effect, thereby further improving the visual experience of the sound effect display interface.
在一些实施方式中,参照图4所示,所述音效展示界面还包括:光点点阵40;In some implementations, as shown in FIG. 4 , the sound effect display interface further includes: a dot matrix 40 ;
所述光点点阵位于所述第一平面上,且所述光点点阵40的各个光点围绕所述音波线22的两侧设置。The dot matrix is located on the first plane, and each dot of the dot matrix 40 is arranged around two sides of the sound wave line 22 .
即,沿音波线22的内侧和外侧设置有由多个光点组成的光点点阵40。That is, along the inner side and the outer side of the sound wave line 22, a light dot matrix 40 composed of a plurality of light dots is arranged.
由于本申请实施例提供的音效展示界面还包括由于多个光点组成的光点点阵,因此上述实施例可以使音效展示界面展示出更多的细节,从而进一步提升音效展示界面的视觉体验。Since the sound effect display interface provided by the embodiment of the present application also includes a dot matrix composed of multiple light points, the above embodiment can make the sound effect display interface display more details, thereby further improving the visual experience of the sound effect display interface.
在一些实施方式中,所述音波线到所述音效展示界面的边缘的距离大于或等于阈值距离。In some implementations, the distance from the sound wave line to the edge of the sound effect display interface is greater than or equal to a threshold distance.
示例性的,阈值距离可以为20像素点的距离(20px)。Exemplarily, the threshold distance may be a distance of 20 pixels (20px).
示例性的,参照图5所示,图5中以阈值距离为20px为例示出。音波线22在展示所述目标音频文件的预设声音属性对应的音波波形的过程中,音波波形不会在出现在音效展示界面的边缘的第一区域51和第二区域52内。Exemplarily, refer to FIG. 5 , where the threshold distance is 20px as an example. When the sound wave line 22 displays the sound wave corresponding to the preset sound attribute of the target audio file, the sound wave will not appear in the first area 51 and the second area 52 at the edge of the sound effect display interface.
由于上述实施例中设置音波线到所述音效展示界面的边缘的距离大于或等于阈值距离,因此上述实施例可以避免音效展示界面无法完整展示音波线,进而避免影响音效展示界面的视觉体验。Since the distance from the sound wave line to the edge of the sound effect display interface is set to be greater than or equal to the threshold distance in the above embodiment, the above embodiment can prevent the sound effect display interface from fully displaying the sound wave line, thereby avoiding affecting the visual experience of the sound effect display interface.
在一些实施方式中,上述步骤S12(显示所述目标音频文件对应的音效展示界面)包括如下步骤a至步骤b:In some implementation manners, the above step S12 (displaying the audio display interface corresponding to the target audio file) includes the following steps a to b:
步骤a、生成所述网格、所述多个第一光束以及所述多个第二光束对应的序列帧。Step a, generating sequence frames corresponding to the grid, the multiple first light beams, and the multiple second light beams.
其中,所述序列帧的图像帧中所述多个第一光束和所述多个第二光束的位置依次变化。Wherein, the positions of the plurality of first light beams and the plurality of second light beams in the image frames of the sequence frames change sequentially.
本申请实施例中的序列帧是指通过对多个图像帧排序,并按照预设定的切换速率显示排序后的多个图像以得到与视频效果相近的文件。The sequence frame in the embodiment of the present application refers to sorting multiple image frames and displaying the sorted multiple images according to a preset switching rate to obtain a file with an effect similar to that of a video.
步骤b、循环播放所述序列帧,以显示所述目标音频文件对应的音效展示界面。Step b. Play the sequence frame in a loop to display the audio effect display interface corresponding to the target audio file.
上述实施例通过序列帧的方式显示音效展示界面中的网格、第一光束以及第二光束,因此相比于实时渲染网格、第一光束以及第二光束得到音效展示界面,本申请实施例可以在实现动态效果的同时,避免使用粒子效果动画引擎,进而减少渲染音效展示界面的数据处理量以及避免性能较差的终端设备无法正常显示本申请实施例中的音效展示界面。The above-mentioned embodiment displays the grid, the first light beam, and the second light beam in the sound effect display interface by means of sequential frames. It is possible to avoid using the particle effect animation engine while realizing the dynamic effect, thereby reducing the amount of data processing for rendering the sound effect display interface and preventing terminal devices with poor performance from being unable to normally display the sound effect display interface in the embodiment of the present application.
在一些实施方式中,上述步骤S12(显示所述目标音频文件对应的音效展示界面)包括:In some implementation manners, the above step S12 (displaying the audio effect presentation interface corresponding to the target audio file) includes:
分别将所述序列帧、所述音波线以及所述封面图像显示于所述音效展示界面的不同图层中。The sequence frame, the sound wave line and the cover image are respectively displayed in different layers of the sound effect display interface.
示例性的,参照图6所示,本申请实施中的音效展示界面包括五个图层,该五个图层由 底层至顶层依次为:底板层61、背景层62、基础框架层63、音波线层64以及封面图像层65。Exemplarily, as shown in FIG. 6, the sound effect display interface in the implementation of the present application includes five layers, and the five layers are sequentially from the bottom layer to the top layer: the bottom layer 61, the background layer 62, the basic frame layer 63, the sound wave Line layer 64 and cover image layer 65 .
底板层61用于显示底板图像,所述底板图像的形状、大小与音效展示界面的形状、大小相同,且所有像素点的颜色均为预设颜色遮光率为100%。示例性的,底板图像各个像素点的颜色均为黑色或深蓝黑色。The base layer 61 is used to display the base image, the shape and size of the base image are the same as the shape and size of the sound effect display interface, and the color of all pixels is the preset color with a shading rate of 100%. Exemplarily, the color of each pixel of the bottom plate image is black or dark blue black.
背景层62用于显示背景图像,所述背景图像的形状、大小与音效展示界面的形状、大小相同,各个像素点的颜色均相同,且均为根据封面图像确定的颜色,遮光率为30%。The background layer 62 is used to display the background image, the shape and size of the background image are the same as the shape and size of the sound effect display interface, the colors of each pixel are the same, and they are all colors determined according to the cover image, and the shading rate is 30%. .
基础框架层63用于显示根据多个包括所述网格、所述多个第一光束以及所述多个第二光束的图像生成的序列帧,遮光率为100%。The basic frame layer 63 is used for displaying sequence frames generated according to a plurality of images including the grid, the plurality of first light beams and the plurality of second light beams, and the shading rate is 100%.
音波线层64用于显示所述音波线,遮光率为100%。The sound wave line layer 64 is used to display the sound wave line, and the shading rate is 100%.
封面图像层65用于显示所述封面图像,遮光率为100%。The cover image layer 65 is used to display the cover image, and the shading rate is 100%.
在一些实施方式中,所述音波线的第一位置的颜色为第一颜色,所述音波线的第二位置的颜色为第二颜色;In some embodiments, the color of the first position of the sound wave line is a first color, and the color of the second position of the sound wave line is a second color;
在所述音波线的所述第一位置到所述第二位置之间,所述音波线的颜色由所述第一颜色渐变为所述第二颜色。Between the first position and the second position of the sound wave line, the color of the sound wave line gradually changes from the first color to the second color.
在一些实施方式中,第一位置和第二位置分别为目标直线与所述音波线的两个交点位置;所述目标直线是第一平面内经过所述音波线的几何中心且与水平方向的夹角为预设角度的直线。示例性的,预设角度可以为30°。In some embodiments, the first position and the second position are two intersection positions of the target straight line and the sound wave line respectively; The included angle is a straight line with a preset angle. Exemplarily, the preset angle may be 30°.
参照图7所示,目标直线70与音波线22的两交点分别为点221和点222,因此点221和点222分别为音波线的第一位置和第二位置,点221和点222的颜色分别为第一颜色和第二颜色,音波线22上点221至点222的颜色由第一颜色渐变为第二颜色。With reference to shown in Figure 7, two intersection points of target straight line 70 and sound wave line 22 are respectively point 221 and point 222, so point 221 and point 222 are the first position and the second position of sound wave line respectively, the color of point 221 and point 222 They are the first color and the second color respectively, and the colors of the points 221 to 222 on the sound wave line 22 gradually change from the first color to the second color.
在一些实施方式中,在上步骤S12(显示所述目标音频文件对应的音效展示界面)之前,本申请实施例提供的音效展示方法还包括:根据所述封面图像的颜色确定所述第一颜色、所述第二颜色以及所述音效展示界面的背景颜色。In some implementations, before step S12 (displaying the sound effect display interface corresponding to the target audio file), the sound effect display method provided in the embodiment of the present application further includes: determining the first color according to the color of the cover image , the second color and the background color of the sound effect display interface.
在一些实施方式中,根据所述封面图像的颜色确定所述第一颜色、所述第二颜色以及所述音效展示界面的背景颜色的实现方式可以包括如下步骤1至步骤3:In some implementations, the implementation of determining the first color, the second color, and the background color of the sound effect display interface according to the color of the cover image may include the following steps 1 to 3:
步骤1、获取所述封面图像的各个像素点的平均颜色值。Step 1. Obtain the average color value of each pixel of the cover image.
即,获取封面图像的各个像素点的颜色值,并将各个像素点的颜色值相加后除以封面图像中的像素点的数量,以得到封面图像的各个像素点的平均颜色值。That is, the color values of each pixel of the cover image are obtained, and the color values of each pixel are added and then divided by the number of pixels in the cover image to obtain the average color value of each pixel of the cover image.
步骤2、将所述平均颜色值转换为HSV颜色空间中的颜色,获取基础颜色。Step 2. Convert the average color value into a color in the HSV color space to obtain a basic color.
具体的,HSV颜色空间是一种通过色相(Hue)、饱和度(Saturation)和明度(Value)表示颜色的颜色空间,HSV颜色空间中的任意颜色均包括用于表示色相的参数H,用于表 示饱和度的参数S以及用于表示明度的参数V。Specifically, the HSV color space is a color space that expresses colors through hue (Hue), saturation (Saturation) and lightness (Value), and any color in the HSV color space includes a parameter H used to represent hue, for A parameter S for saturation and a parameter V for lightness.
不同颜色空间的颜色之间具有特定的转换公式,因此可以根据封面图像所属的颜色空间确定转换公式,然后根据确定的转换公式对平均颜色值进行转换,以得到基础颜色。例如:封面图像属于RGB颜色空间,则根据RGB颜色空间与HSV颜色空间的颜色之间的转换公式对平均颜色值进行转换,以得到基础颜色。There are specific conversion formulas between colors in different color spaces, so the conversion formula can be determined according to the color space to which the cover image belongs, and then the average color value can be converted according to the determined conversion formula to obtain the basic color. For example, if the cover image belongs to the RGB color space, the average color value is converted according to the conversion formula between the RGB color space and the color of the HSV color space to obtain the basic color.
步骤3、根据所述基础颜色确定所述第一颜色、所述第二颜色以及所述音效展示界面的背景颜色。Step 3. Determine the first color, the second color, and the background color of the sound effect display interface according to the basic color.
在一些实施方式中,所述根据所述基础颜色确定所述第一颜色,包括:In some embodiments, the determining the first color according to the basic color includes:
确定所述第一颜色的色相与所述基础颜色的色相相同;determining that the hue of the first color is the same as the hue of the base color;
若所述基础颜色的饱和度大于或等于阈值饱和度,则确定所述第一颜色的饱和度与所述基础颜色的饱和度相同;若所述基础颜色的饱和度小于所述阈值饱和度,则确定所述第一颜色的饱和度为所述基础颜色的饱和度与预设饱和度的和;If the saturation of the base color is greater than or equal to a threshold saturation, then determining that the saturation of the first color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, Then determine the saturation of the first color as the sum of the saturation of the basic color and the preset saturation;
确定所述第一颜色的明度为最大明度值。Determine the lightness of the first color as the maximum lightness value.
设:基础颜色的明度、饱和度、明度分别为H
0、S
0、V
0,第一颜色的明度、饱和度、明度分别为H
1、S
1、V
1,阈值饱和度为S
阈值,预设饱和度为a,则有:
Assume: the lightness, saturation, and lightness of the basic color are H 0 , S 0 , and V 0 respectively, the lightness, saturation, and lightness of the first color are H 1 , S 1 , and V 1 , respectively, and the threshold saturation is the S threshold , The default saturation is a, then:
H
1=H
0
H 1 =H 0
V
1=100
V 1 =100
在一些实施方式中,所述根据所述基础颜色确定所述第二颜色,包括:In some implementations, the determining the second color according to the basic color includes:
确定所述第二颜色的色相为所述基础颜色的色相与预设色相的和;determining that the hue of the second color is the sum of the hue of the base color and a preset hue;
若所述基础颜色的饱和度大于或等于阈值饱和度,则确定所述第二颜色的饱和度与所述基础颜色的饱和度相同;若所述基础颜色的饱和度小于所述阈值饱和度,则确定所述第二颜色的饱和度为所述基础颜色的饱和度与预设饱和度的和;If the saturation of the base color is greater than or equal to a threshold saturation, then determining that the saturation of the second color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, Then determine the saturation of the second color as the sum of the saturation of the basic color and the preset saturation;
确定所述第二颜色的明度为最大明度值。Determine the lightness of the second color as the maximum lightness value.
设:基础颜色的明度、饱和度、明度分别为H
0、S
0、V
0,第二颜色的明度、饱和度、明度分别为H
2、S
2、V
2,阈值饱和度为S
阈值,预设饱和度为a,预设色相为b,则有:
Suppose: the lightness, saturation, and lightness of the basic color are H 0 , S 0 , and V 0 , the lightness, saturation, and lightness of the second color are H 2 , S 2 , and V 2 , respectively, and the threshold saturation is the S threshold , The default saturation is a, and the default hue is b, then:
H
2=H
0+b
H 2 =H 0 +b
V
2=100
V 2 =100
在一些实施方式中,所述根据所述基础颜色确定所述背景颜色,包括:In some implementations, the determining the background color according to the basic color includes:
确定所述背景颜色的色相与所述基础颜色的色相相同;determining that the hue of the background color is the same as the hue of the base color;
若所述基础颜色的饱和度大于或等于阈值饱和度,则确定所述背景颜色的饱和度与所述基础颜色的饱和度相同;若所述基础颜色的饱和度小于所述阈值饱和度,则确定所述背景颜色的饱和度为所述基础颜色的饱和度与预设饱和度的和;If the saturation of the base color is greater than or equal to the threshold saturation, then determine that the saturation of the background color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, then determining the saturation of the background color as the sum of the saturation of the base color and a preset saturation;
确定所述背景颜色的明度为所述基础颜色的明度与目标明度的差值,所述目标明度为所述基础颜色的明度所属的明度区间对应的明度,所述明度区间对应的明度与所述明度区间的中心明度值正相关。Determine the lightness of the background color as the difference between the lightness of the basic color and the target lightness, the target lightness is the lightness corresponding to the lightness interval to which the lightness of the basic color belongs, and the lightness corresponding to the lightness interval is the same as the The central lightness value of the lightness interval is positively correlated.
示例性的,明度区间与明度的对应关系可以如下表1所示:Exemplarily, the corresponding relationship between the lightness interval and the lightness can be shown in Table 1 below:
表1Table 1
明度区间Brightness range | 对应的明度corresponding lightness |
[100,90][100,90] | 5555 |
(90,80](90,80] | 5050 |
(80,70](80,70] | 4545 |
(70,60](70,60] | 4040 |
(60,50](60,50] | 3535 |
(50,40](50,40] | 3030 |
(40,30](40,30] | 2525 |
(30,25](30,25] | 2020 |
(25,20](25,20] | 1515 |
(20,15](20,15] | 1010 |
(15,10](15,10] | 77 |
(10,5](10,5] | 33 |
(5,0](5,0] | 22 |
设:基础颜色的明度、饱和度、明度分别为H
0、S
0、V
0,背景颜色的明度、饱和度、明度分别为H
3、S
3、V
3,阈值饱和度为S
阈值,预设饱和度为a,明度区间与明度的对应关系如上表1所示,则有:
Assume: the lightness, saturation, and lightness of the basic color are H 0 , S 0 , and V 0 respectively; the lightness, saturation, and lightness of the background color are H 3 , S 3 , and V 3 ; Let the saturation be a, and the corresponding relationship between the lightness interval and the lightness is shown in Table 1 above, then:
H
3=H
0
H 3 =H 0
V
3=V
0-c
V 3 =V 0 −c
其中,当100≥V
0≥90时,c=55;当90>V
0≥80时,c=50;当80>V
0≥70时,c=45;当70>V
0≥60时,c=40;当60>V
0≥50时,c=35;当50>V
0≥40时,c=30;当40>V
0≥30时,c=25;当30>V
0≥25时,c=20;当25>V
0≥20时,c=15;当20>V
0≥15时,c=15;当15>V
0≥10时,c=7;当10>V
0≥5时,c=3;当5>V
0≥0时,c=2。
Wherein, when 100≥V 0 ≥90, c=55; when 90>V 0 ≥80, c=50; when 80>V 0 ≥70, c=45; when 70>V 0 ≥60, c=40; when 60>V 0 ≥50, c=35; when 50>V 0 ≥40, c=30; when 40>V 0 ≥30, c=25; when 30>V 0 ≥25 when 25>V 0 ≥20, c=15; when 20>V 0 ≥15, c=15; when 15>V 0 ≥10, c=7; when 10>V 0 When ≥5, c=3; when 5>V 0 ≥0, c=2.
由于上述实施例可以根据音频文件的封面图像确定音效展示界面中的第一颜色、第二颜色以及背景颜色,因此本申请实施例可以音效展示界面的颜色与封面图像更加匹配相关,进而提升用户的视觉体验体验。Since the above-mentioned embodiment can determine the first color, the second color, and the background color in the sound effect display interface according to the cover image of the audio file, the embodiment of the present application can better match the color of the sound effect display interface with the cover image, thereby improving the user's Visual experience experience.
基于同一发明构思,作为对上述方法的实现,本申请实施例还提供了一种终端设备,该装置实施例与前述方法实施例对应,为便于阅读,本装置实施例不再对前述方法实施例中的细节内容进行逐一赘述,但应当明确,本实施例中的终端设备能够对应实现前述方法实施例中的全部内容。Based on the same inventive concept, as an implementation of the above method, the embodiment of the present application also provides a terminal device. This device embodiment corresponds to the aforementioned method embodiment. The details in the above will be described one by one, but it should be clear that the terminal device in this embodiment can correspondingly implement all the content in the foregoing method embodiments.
本申请实施例提供了一种终端设备。图8为该终端设备的结构示意图,如图8所示,该终端设备800包括:An embodiment of the present application provides a terminal device. FIG. 8 is a schematic structural diagram of the terminal device. As shown in FIG. 8, the terminal device 800 includes:
接收单元81,用于接收对目标音频文件输入的第一操作;A receiving unit 81, configured to receive the first operation input to the target audio file;
显示单元82,用于响应于所述第一操作,显示所述目标音频文件对应的音效展示界面;A display unit 82, configured to display an audio display interface corresponding to the target audio file in response to the first operation;
其中,所述音效展示界面包括:网格、音波线以及所述目标音频文件对应的封面图像;所述网格位于所述音效展示界面的界面场景中的第一平面上,所述第一平面为所述界面场景中的水平面;所述音波线为所述第一平面内的闭合曲线,用于展示所述目标音频文件的预设声音属性对应的音波波形;所述封面图像位于所述界面场景中的第二平面上,且所述封面图像的下边缘位于所述音波线在所述第一平面上围合形成的区域内,所述第二平面为垂直于所述界面场景的深度方向的平面。Wherein, the sound effect display interface includes: a grid, a sound wave line, and a cover image corresponding to the target audio file; the grid is located on the first plane in the interface scene of the sound effect display interface, and the first plane is the horizontal plane in the interface scene; the sound wave line is a closed curve in the first plane, used to display the sound wave waveform corresponding to the preset sound attribute of the target audio file; the cover image is located on the interface On the second plane in the scene, and the lower edge of the cover image is located in the area enclosed by the sound wave line on the first plane, the second plane is perpendicular to the depth direction of the interface scene plane.
在一些实施方式中,所述音效展示界面还包括:多个第一光束和多个第二光束;In some embodiments, the sound effect display interface further includes: a plurality of first light beams and a plurality of second light beams;
所述多个第一光束均位于所述第一平面上,且所述多个第一光束相互平行;The plurality of first light beams are all located on the first plane, and the plurality of first light beams are parallel to each other;
所述多个第二光束均与所述第一平面垂直。The plurality of second light beams are all perpendicular to the first plane.
在一些实施方式中,所述音效展示界面还包括:光点点阵;In some embodiments, the sound effect display interface further includes: a dot matrix;
所述光点点阵位于所述第一平面上,且所述光点点阵的各个光点围绕所述音波线的两侧设置。The light point matrix is located on the first plane, and each light point of the light point matrix is arranged around two sides of the sound wave line.
在一些实施方式中,所述音波线到所述音效展示界面的边缘的距离大于或等于阈值距离。In some implementations, the distance from the sound wave line to the edge of the sound effect display interface is greater than or equal to a threshold distance.
在一些实施方式中,所述显示单元82,具体用于生成所述网格、所述多个第一光束以及所述多个第二光束对应的序列帧;所述序列帧的图像帧中所述多个第一光束和所述多个第 二光束的位置依次变化;循环播放所述序列帧以显示所述目标音频文件对应的音效展示界面。In some implementations, the display unit 82 is specifically configured to generate sequence frames corresponding to the grid, the multiple first light beams, and the multiple second light beams; The positions of the plurality of first light beams and the plurality of second light beams are changed sequentially; the sequence frames are played cyclically to display the audio effect display interface corresponding to the target audio file.
在一些实施方式中,所述显示单元82,具体用于分别将所述序列帧、所述音波线以及所述封面图像显示于所述音效展示界面的不同图层中。In some implementation manners, the display unit 82 is specifically configured to respectively display the sequence frame, the sound wave line and the cover image in different layers of the sound effect display interface.
在一些实施方式中,所述音波线的第一位置的颜色为第一颜色,所述音波线的第二位置的颜色为第二颜色;In some embodiments, the color of the first position of the sound wave line is a first color, and the color of the second position of the sound wave line is a second color;
在所述音波线的所述第一位置到所述第二位置之间,所述音波线的颜色由所述第一颜色渐变为所述第二颜色。Between the first position and the second position of the sound wave line, the color of the sound wave line gradually changes from the first color to the second color.
在一些实施方式中,所述显示单元82,还用于在显示所述目标音频文件对应的音效展示界面之前,获取所述封面图像的各个像素点的平均颜色值;将所述平均颜色值转换为HSV颜色空间中的颜色,获取基础颜色;根据所述基础颜色确定所述第一颜色、所述第二颜色以及所述音效展示界面的背景颜色。In some implementations, the display unit 82 is further configured to obtain the average color value of each pixel of the cover image before displaying the sound effect display interface corresponding to the target audio file; convert the average color value A basic color is obtained for a color in the HSV color space; and the first color, the second color, and the background color of the sound effect display interface are determined according to the basic color.
在一些实施方式中,所述显示单元82,具体用于确定所述第一颜色的色相与所述基础颜色的色相相同;若所述基础颜色的饱和度大于或等于阈值饱和度,则确定所述第一颜色的饱和度与所述基础颜色的饱和度相同;若所述基础颜色的饱和度小于所述阈值饱和度,则确定所述第一颜色的饱和度为所述基础颜色的饱和度与预设饱和度的和;确定所述第一颜色的明度为最大明度值。In some implementations, the display unit 82 is specifically configured to determine that the hue of the first color is the same as that of the basic color; if the saturation of the basic color is greater than or equal to a threshold saturation, then determine that the The saturation of the first color is the same as the saturation of the basic color; if the saturation of the basic color is less than the threshold saturation, then determine that the saturation of the first color is the saturation of the basic color and the preset saturation; determine the lightness of the first color as the maximum lightness value.
在一些实施方式中,所述显示单元82,具体用于确定所述第二颜色的色相为所述基础颜色的色相与预设色相的和;若所述基础颜色的饱和度大于或等于阈值饱和度,则确定所述第二颜色的饱和度与所述基础颜色的饱和度相同;若所述基础颜色的饱和度小于所述阈值饱和度,则确定所述第二颜色的饱和度为所述基础颜色的饱和度与预设饱和度的和;确定所述第二颜色的明度为最大明度值。In some implementations, the display unit 82 is specifically configured to determine that the hue of the second color is the sum of the hue of the base color and a preset hue; if the saturation of the base color is greater than or equal to the threshold saturation degree, then determine that the saturation of the second color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, then determine that the saturation of the second color is the The sum of the saturation of the basic color and the preset saturation; determine the lightness of the second color as the maximum lightness value.
在一些实施方式中,所述显示单元,具体用于确定所述背景颜色的色相与所述基础颜色的色相相同;若所述基础颜色的饱和度大于或等于阈值饱和度,则确定所述背景颜色的饱和度与所述基础颜色的饱和度相同;若所述基础颜色的饱和度小于所述阈值饱和度,则确定所述背景颜色的饱和度为所述基础颜色的饱和度与预设饱和度的和;确定所述背景颜色的明度为所述基础颜色的明度与目标明度的差值,所述目标明度为所述基础颜色的明度所属的明度区间对应的明度,所述明度区间对应的明度与所述明度区间的中心明度值正相关。In some implementations, the display unit is specifically configured to determine that the hue of the background color is the same as that of the base color; if the saturation of the base color is greater than or equal to a threshold saturation, then determine that the background color is The saturation of the color is the same as the saturation of the basic color; if the saturation of the basic color is less than the threshold saturation, it is determined that the saturation of the background color is the saturation of the basic color and the preset saturation the sum of degrees; determine that the lightness of the background color is the difference between the lightness of the basic color and the target lightness, the target lightness is the lightness corresponding to the lightness interval to which the lightness of the basic color belongs, and the lightness interval corresponds to Lightness is positively correlated with the central lightness value of the lightness interval.
在一些实施方式中,所述第一位置和所述第二位置分别为目标直线与所述音波线的两个交点位置;所述目标直线是第一平面内经过所述音波线的几何中心且与水平方向的夹角为预设角度的直线。In some implementations, the first position and the second position are respectively two intersection positions of the target straight line and the sound wave line; the target straight line passes through the geometric center of the sound wave line in the first plane and A straight line whose included angle with the horizontal direction is a preset angle.
本实施例提供的终端设备可以执行上述方法实施例提供的音效展示方法,其实现原理与技术效果类似,此处不再赘述。The terminal device provided in this embodiment can execute the sound effect display method provided in the above method embodiment, and its implementation principle is similar to the technical effect, and will not be repeated here.
基于同一发明构思,本申请实施例还提供了一种电子设备。图9为本申请实施例提供的电子设备的结构示意图,如图9所示,本实施例提供的电子设备包括:存储器91和处理器92,所述存储器91用于存储计算机程序;所述处理器92用于在调用执行计算机程序时,使得所述电子设备实现上述实施例提供的音效展示方法。Based on the same inventive concept, the embodiment of the present application also provides an electronic device. FIG. 9 is a schematic structural diagram of an electronic device provided by an embodiment of the present application. As shown in FIG. 9 , the electronic device provided by this embodiment includes: a memory 91 and a processor 92, the memory 91 is used to store computer programs; the processing The device 92 is configured to enable the electronic device to implement the method for displaying sound effects provided by the above-mentioned embodiments when the computer program is invoked for execution.
本申请实施例还提供一种计算机可读存储介质,所述计算机可读存储介质上存储有计算机程序,当所述计算机程序被计算设备执行时,使得所述计算设备实现上述实施例提供的音效展示方法。The embodiment of the present application also provides a computer-readable storage medium, the computer-readable storage medium stores a computer program, and when the computer program is executed by a computing device, the computing device realizes the sound effects provided by the above-mentioned embodiments Show method.
本申请实施例还提供一种计算机程序产品,当所述计算机程序产品在计算机上运行时,使得所述计算机实现上述实施例提供的音效展示方法。An embodiment of the present application further provides a computer program product, which, when the computer program product is run on a computer, enables the computer to implement the sound effect display method provided in the foregoing embodiments.
本领域技术人员应明白,本申请的实施例可提供为方法、***、或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质上实施的计算机程序产品的形式。Those skilled in the art should understand that the embodiments of the present application may be provided as methods, systems, or computer program products. Accordingly, the present application may take the form of an entirely hardware embodiment, an entirely software embodiment, or an embodiment combining software and hardware aspects. Furthermore, the present application may take the form of a computer program product embodied on one or more computer-usable storage media having computer-usable program code embodied therein.
处理器可以是中央处理单元(Central Processing Unit,CPU),还可以是其他通用处理器、数字信号处理器(Digital Signal Processor,DSP)、专用集成电路(Application Specific Integrated Circuit,ASIC)、现成可编程门阵列(Field-Programmable Gate Array,FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。The processor can be a central processing unit (Central Processing Unit, CPU), or other general-purpose processors, digital signal processors (Digital Signal Processor, DSP), application specific integrated circuits (Application Specific Integrated Circuit, ASIC), off-the-shelf programmable Field-Programmable Gate Array (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. A general-purpose processor may be a microprocessor, or the processor may be any conventional processor, or the like.
存储器可能包括计算机可读介质中的非永久性存储器,随机存取存储器(RAM)和/或非易失性内存等形式,如只读存储器(ROM)或闪存(flash RAM)。存储器是计算机可读介质的示例。Memory may include non-permanent storage in computer readable media, in the form of random access memory (RAM) and/or nonvolatile memory such as read only memory (ROM) or flash RAM. The memory is an example of a computer readable medium.
计算机可读介质包括永久性和非永久性、可移动和非可移动存储介质。存储介质可以由任何方法或技术来实现信息存储,信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括,但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带,磁盘存储或其他磁性存储设备或任何其他非传输介质,可用于存储可以被计算设备访问的信息。根据本文中的界定,计算机可读介质不包括暂存电脑可读媒体(transitory media),如调制的数据信号和载波。Computer-readable media includes both volatile and non-volatile, removable and non-removable storage media. The storage medium may store information by any method or technology, and the information may be computer-readable instructions, data structures, program modules, or other data. Examples of computer storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read only memory (ROM), Electrically Erasable Programmable Read-Only Memory (EEPROM), Flash memory or other memory technology, Compact Disc Read-Only Memory (CD-ROM), Digital Versatile Disc (DVD) or other optical storage, A magnetic tape cartridge, disk storage or other magnetic storage device or any other non-transmission medium that can be used to store information that can be accessed by a computing device. As defined herein, computer readable media excludes transitory computer readable media, such as modulated data signals and carrier waves.
最后应说明的是:以上各实施例仅用以说明本申请的技术方案,而非对其限制;尽管参照前述各实施例对本申请进行了详细的说明,本领域的普通技术人员应当理解:其依然可 以对前述各实施例所记载的技术方案进行修改,或者对其中部分或者全部技术特征进行等同替换;而这些修改或者替换,并不使相应技术方案的本质脱离本申请各实施例技术方案的范围。Finally, it should be noted that: the above embodiments are only used to illustrate the technical solutions of the present application, and are not intended to limit it; although the application has been described in detail with reference to the foregoing embodiments, those of ordinary skill in the art should understand that: It is still possible to modify the technical solutions described in the foregoing embodiments, or perform equivalent replacements for some or all of the technical features; and these modifications or replacements do not make the essence of the corresponding technical solutions deviate from the technical solutions of the various embodiments of the present application. scope.
Claims (16)
- 一种音效展示方法,其包括:A method for displaying sound effects, comprising:接收对目标音频文件输入的第一操作;receiving a first operation on a target audio file input;响应于所述第一操作,显示所述目标音频文件对应的音效展示界面;In response to the first operation, display an audio display interface corresponding to the target audio file;其中,所述音效展示界面包括:网格、音波线以及所述目标音频文件对应的封面图像;所述网格位于所述音效展示界面的界面场景中的第一平面上,所述第一平面为所述界面场景中的水平面;所述音波线为所述第一平面内的闭合曲线,用于展示所述目标音频文件的预设声音属性对应的音波波形;所述封面图像位于所述界面场景中的第二平面上,且所述封面图像的下边缘位于所述音波线在所述第一平面上围合形成的区域内,所述第二平面为垂直于所述界面场景的深度方向的平面。Wherein, the sound effect display interface includes: a grid, a sound wave line, and a cover image corresponding to the target audio file; the grid is located on the first plane in the interface scene of the sound effect display interface, and the first plane is the horizontal plane in the interface scene; the sound wave line is a closed curve in the first plane, used to display the sound wave waveform corresponding to the preset sound attribute of the target audio file; the cover image is located on the interface On the second plane in the scene, and the lower edge of the cover image is located in the area enclosed by the sound wave line on the first plane, the second plane is perpendicular to the depth direction of the interface scene plane.
- 根据权利要求1所述的方法,其中,所述音效展示界面还包括:多个第一光束和多个第二光束;The method according to claim 1, wherein the sound effect display interface further comprises: a plurality of first light beams and a plurality of second light beams;所述多个第一光束均位于所述第一平面上,且所述多个第一光束相互平行;The plurality of first light beams are all located on the first plane, and the plurality of first light beams are parallel to each other;所述多个第二光束均与所述第一平面垂直。The plurality of second light beams are all perpendicular to the first plane.
- 根据权利要求1所述的方法,其中,所述音效展示界面还包括:光点点阵;The method according to claim 1, wherein the sound effect display interface further comprises: a dot matrix;所述光点点阵位于所述第一平面上,且所述光点点阵的各个光点围绕所述音波线的两侧设置。The light point matrix is located on the first plane, and each light point of the light point matrix is arranged around two sides of the sound wave line.
- 根据权利要求1所述的方法,其中,所述音波线到所述音效展示界面的边缘的距离大于或等于阈值距离。The method according to claim 1, wherein the distance from the sound wave line to the edge of the sound effect display interface is greater than or equal to a threshold distance.
- 根据权利要求2所述的方法,其中,所述显示所述目标音频文件对应的音效展示界面,包括:The method according to claim 2, wherein the displaying the audio effect display interface corresponding to the target audio file comprises:生成所述网格、所述多个第一光束以及所述多个第二光束对应的序列帧;所述序列帧的图像帧中所述多个第一光束和所述多个第二光束的位置依次变化;generating sequence frames corresponding to the grid, the plurality of first light beams, and the plurality of second light beams; The position changes sequentially;循环播放所述序列帧以显示所述目标音频文件对应的音效展示界面。The sequence frame is played cyclically to display the audio effect presentation interface corresponding to the target audio file.
- 根据权利要求5所述的方法,其中,所述显示所述目标音频文件对应的音效展示界面,包括:The method according to claim 5, wherein the displaying the audio effect display interface corresponding to the target audio file comprises:分别将所述序列帧、所述音波线以及所述封面图像显示于所述音效展示界面的不同图层中。The sequence frame, the sound wave line and the cover image are respectively displayed in different layers of the sound effect display interface.
- 根据权利要求1-6任一项所述的方法,其中,所述音波线的第一位置的颜色为第一颜色,所述音波线的第二位置的颜色为第二颜色;The method according to any one of claims 1-6, wherein the color of the first position of the sound wave line is a first color, and the color of the second position of the sound wave line is a second color;在所述音波线的所述第一位置到所述第二位置之间,所述音波线的颜色由所述第一颜色渐变为所述第二颜色。Between the first position and the second position of the sound wave line, the color of the sound wave line gradually changes from the first color to the second color.
- 根据权利要求7所述的方法,其中,在显示所述目标音频文件对应的音效展示界面之前,所述方法还包括:The method according to claim 7, wherein, before displaying the audio effect display interface corresponding to the target audio file, the method further comprises:获取所述封面图像的各个像素点的平均颜色值;Obtain the average color value of each pixel of the cover image;将所述平均颜色值转换为HSV颜色空间中的颜色,获取基础颜色;Converting the average color value to a color in the HSV color space to obtain the basic color;根据所述基础颜色确定所述第一颜色、所述第二颜色以及所述音效展示界面的背景颜色。The first color, the second color, and the background color of the sound effect display interface are determined according to the basic color.
- 根据权利要求8所述的方法,其中,所述根据所述基础颜色确定所述第一颜色,包括:The method according to claim 8, wherein said determining said first color according to said base color comprises:确定所述第一颜色的色相与所述基础颜色的色相相同;determining that the hue of the first color is the same as the hue of the base color;若所述基础颜色的饱和度大于或等于阈值饱和度,则确定所述第一颜色的饱和度与所述基础颜色的饱和度相同;若所述基础颜色的饱和度小于所述阈值饱和度,则确定所述第一颜色的饱和度为所述基础颜色的饱和度与预设饱和度的和;If the saturation of the base color is greater than or equal to a threshold saturation, then determining that the saturation of the first color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, Then determine the saturation of the first color as the sum of the saturation of the basic color and the preset saturation;确定所述第一颜色的明度为最大明度值。Determine the lightness of the first color as the maximum lightness value.
- 根据权利要求8所述的方法,其中,所述根据所述基础颜色确定所述第二颜色,包括:The method according to claim 8, wherein said determining said second color based on said base color comprises:确定所述第二颜色的色相为所述基础颜色的色相与预设色相的和;determining that the hue of the second color is the sum of the hue of the basic color and a preset hue;若所述基础颜色的饱和度大于或等于阈值饱和度,则确定所述第二颜色的饱和度与所述基础颜色的饱和度相同;若所述基础颜色的饱和度小于所述阈值饱和度,则确定所述第二颜色的饱和度为所述基础颜色的饱和度与预设饱和度的和;If the saturation of the base color is greater than or equal to a threshold saturation, then determining that the saturation of the second color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, Then determine the saturation of the second color as the sum of the saturation of the basic color and the preset saturation;确定所述第二颜色的明度为最大明度值。Determine the lightness of the second color as the maximum lightness value.
- 根据权利要求8所述的方法,其中,所述根据所述基础颜色确定所述背景颜色,包括:The method according to claim 8, wherein said determining said background color according to said basic color comprises:确定所述背景颜色的色相与所述基础颜色的色相相同;determining that the hue of the background color is the same as the hue of the base color;若所述基础颜色的饱和度大于或等于阈值饱和度,则确定所述背景颜色的饱和度与所述基础颜色的饱和度相同;若所述基础颜色的饱和度小于所述阈值饱和度,则确定所述背景颜色的饱和度为所述基础颜色的饱和度与预设饱和度的和;If the saturation of the base color is greater than or equal to the threshold saturation, then determine that the saturation of the background color is the same as the saturation of the base color; if the saturation of the base color is less than the threshold saturation, then determining the saturation of the background color as the sum of the saturation of the base color and a preset saturation;确定所述背景颜色的明度为所述基础颜色的明度与目标明度的差值,所述目标明度为所述基础颜色的明度所属的明度区间对应的明度,所述明度区间对应的明度与所述明度区间的中心明度值正相关。Determine the lightness of the background color as the difference between the lightness of the basic color and the target lightness, the target lightness is the lightness corresponding to the lightness interval to which the lightness of the basic color belongs, and the lightness corresponding to the lightness interval is the same as the The central lightness value of the lightness interval is positively correlated.
- 根据权利要求7所述的方法,其中,所述第一位置和所述第二位置分别为目标直线与所述音波线的两个交点位置;所述目标直线是第一平面内经过所述音波线的几何中心且与水平方向的夹角为预设角度的直线。The method according to claim 7, wherein the first position and the second position are two intersection positions of the target straight line and the sound wave line respectively; the target straight line is the first plane passing through the sound wave The geometric center of the line and the straight line whose included angle with the horizontal direction is a preset angle.
- 一种终端设备,其包括:A terminal device comprising:接收单元,用于接收对目标音频文件输入的第一操作;a receiving unit, configured to receive the first operation input to the target audio file;显示单元,用于响应于所述第一操作,显示所述目标音频文件对应的音效展示界面;A display unit, configured to display an audio effect presentation interface corresponding to the target audio file in response to the first operation;其中,所述音效展示界面包括:网格、音波线以及所述目标音频文件对应的封面图像;所述网格位于所述音效展示界面的界面场景中的第一平面上,所述第一平面为所述界面场景中的水平面;所述音波线为所述第一平面内的闭合曲线,用于展示所述目标音频文件的预设声音属性对应的音波波形;所述封面图像位于所述界面场景中的第二平面上,且所述封面图像的下边缘位于所述音波线在所述第一平面上围合形成的区域内,所述第二平面为垂直于所述界面场景的深度方向的平面。Wherein, the sound effect display interface includes: a grid, a sound wave line, and a cover image corresponding to the target audio file; the grid is located on the first plane in the interface scene of the sound effect display interface, and the first plane is the horizontal plane in the interface scene; the sound wave line is a closed curve in the first plane, used to display the sound wave waveform corresponding to the preset sound attribute of the target audio file; the cover image is located on the interface On the second plane in the scene, and the lower edge of the cover image is located in the area enclosed by the sound wave line on the first plane, the second plane is perpendicular to the depth direction of the interface scene plane.
- 一种电子设备,其包括:存储器和处理器,所述存储器用于存储计算机程序;所述处理器用于在调用所述计算机程序时,使得所述电子设备实现权利要求1-12任一项所述的音效展示方法。An electronic device, comprising: a memory and a processor, the memory is used to store a computer program; the processor is used to enable the electronic device to implement any one of claims 1-12 when calling the computer program. The sound effect display method described above.
- 一种计算机可读存储介质,其中,所述计算机可读存储介质上存储有计算机程序,当所述计算机程序被计算设备执行时,使得所述计算设备实现权利要求1-12任一项所述的音效展示方法。A computer-readable storage medium, wherein a computer program is stored on the computer-readable storage medium, and when the computer program is executed by a computing device, the computing device realizes any one of claims 1-12. The sound effect display method.
- 一种计算机程序产品,其中,当所述计算机程序产品在计算机上运行时,使得所述计算机实现权利要求1-12任一项所述的音效展示方法。A computer program product, wherein, when the computer program product is run on a computer, the computer is made to implement the sound effect presentation method according to any one of claims 1-12.
Applications Claiming Priority (2)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111243092.2 | 2021-10-25 | ||
CN202111243092.2A CN113885830B (en) | 2021-10-25 | 2021-10-25 | Sound effect display method and terminal equipment |
Publications (2)
Publication Number | Publication Date |
---|---|
WO2023071596A1 true WO2023071596A1 (en) | 2023-05-04 |
WO2023071596A9 WO2023071596A9 (en) | 2024-02-01 |
Family
ID=79014106
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
PCT/CN2022/119321 WO2023071596A1 (en) | 2021-10-25 | 2022-09-16 | Sound effect display method and terminal device |
Country Status (2)
Country | Link |
---|---|
CN (1) | CN113885830B (en) |
WO (1) | WO2023071596A1 (en) |
Families Citing this family (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN113885830B (en) * | 2021-10-25 | 2024-07-02 | 北京字跳网络技术有限公司 | Sound effect display method and terminal equipment |
Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20210019113A1 (en) * | 2019-07-16 | 2021-01-21 | Samsung Electronics Co., Ltd. | Display apparatus and controlling method thereof |
CN112738634A (en) * | 2019-10-14 | 2021-04-30 | 北京字节跳动网络技术有限公司 | Video file generation method, device, terminal and storage medium |
CN113192152A (en) * | 2021-05-24 | 2021-07-30 | 腾讯音乐娱乐科技(深圳)有限公司 | Audio-based image generation method, electronic device and storage medium |
CN113365134A (en) * | 2021-06-02 | 2021-09-07 | 北京字跳网络技术有限公司 | Audio sharing method, device, equipment and medium |
CN113885830A (en) * | 2021-10-25 | 2022-01-04 | 北京字跳网络技术有限公司 | Sound effect display method and terminal equipment |
Family Cites Families (14)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US9377990B2 (en) * | 2007-09-06 | 2016-06-28 | Adobe Systems Incorporated | Image edited audio data |
CN102663741B (en) * | 2012-03-22 | 2014-09-24 | 侯克杰 | Method for carrying out visual stereo perception enhancement on color digit image and system thereof |
CN104090883B (en) * | 2013-11-15 | 2017-05-17 | 广州酷狗计算机科技有限公司 | Playing control processing method and playing control processing device for audio file |
FR3035294A1 (en) * | 2015-04-15 | 2016-10-21 | Soclip ! | METHOD FOR GENERATING SYNCHRONIZED SLIDESHOW WITH AUDIO EVENTS |
CN111190514A (en) * | 2016-09-13 | 2020-05-22 | 华为机器有限公司 | Information display method and terminal |
CN107918514B (en) * | 2017-11-24 | 2020-12-29 | 北京小米移动软件有限公司 | Display method and device, electronic equipment and computer readable storage medium |
CN110515452B (en) * | 2018-05-22 | 2022-02-22 | 腾讯科技(深圳)有限公司 | Image processing method, image processing device, storage medium and computer equipment |
CN109634700A (en) * | 2018-11-26 | 2019-04-16 | 维沃移动通信有限公司 | A kind of the content of text display methods and terminal device of audio |
CN109636885B (en) * | 2018-11-28 | 2023-07-04 | 广东智合创享营销策划有限公司 | Sequential frame animation production method and system for H5 page |
CN113284523A (en) * | 2020-02-20 | 2021-08-20 | 腾讯数码(天津)有限公司 | Dynamic effect display method and device, computer equipment and storage medium |
CN113301414B (en) * | 2020-07-07 | 2023-06-02 | 阿里巴巴集团控股有限公司 | Interface generation processing method and device, electronic equipment and computer storage medium |
CN112416346B (en) * | 2020-11-19 | 2022-05-31 | 腾讯科技(深圳)有限公司 | Interface color scheme generation method, device, equipment and storage medium |
CN113050857B (en) * | 2021-03-26 | 2023-02-24 | 北京字节跳动网络技术有限公司 | Music sharing method and device, electronic equipment and storage medium |
CN113259740A (en) * | 2021-05-19 | 2021-08-13 | 北京字跳网络技术有限公司 | Multimedia processing method, device, equipment and medium |
-
2021
- 2021-10-25 CN CN202111243092.2A patent/CN113885830B/en active Active
-
2022
- 2022-09-16 WO PCT/CN2022/119321 patent/WO2023071596A1/en unknown
Patent Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20210019113A1 (en) * | 2019-07-16 | 2021-01-21 | Samsung Electronics Co., Ltd. | Display apparatus and controlling method thereof |
CN112738634A (en) * | 2019-10-14 | 2021-04-30 | 北京字节跳动网络技术有限公司 | Video file generation method, device, terminal and storage medium |
CN113192152A (en) * | 2021-05-24 | 2021-07-30 | 腾讯音乐娱乐科技(深圳)有限公司 | Audio-based image generation method, electronic device and storage medium |
CN113365134A (en) * | 2021-06-02 | 2021-09-07 | 北京字跳网络技术有限公司 | Audio sharing method, device, equipment and medium |
CN113885830A (en) * | 2021-10-25 | 2022-01-04 | 北京字跳网络技术有限公司 | Sound effect display method and terminal equipment |
Also Published As
Publication number | Publication date |
---|---|
WO2023071596A9 (en) | 2024-02-01 |
CN113885830A (en) | 2022-01-04 |
CN113885830B (en) | 2024-07-02 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
WO2023071571A1 (en) | Sound effect display method and terminal device | |
US10388004B2 (en) | Image processing method and apparatus | |
US10311548B2 (en) | Scaling render targets to a higher rendering resolution to display higher quality video frames | |
WO2023071572A1 (en) | Sound effect display method and terminal device | |
US9547427B2 (en) | User interface with color themes based on input image data | |
WO2021143564A1 (en) | Live broadcast control method and apparatus, electronic device, live broadcast system, and storage medium | |
US11908107B2 (en) | Method and apparatus for presenting image for virtual reality device, device and non-transitory computer-readable storage medium | |
WO2023071596A1 (en) | Sound effect display method and terminal device | |
WO2023066121A1 (en) | Rendering of three-dimensional model | |
WO2021135683A1 (en) | Display terminal adjustment method and display terminal | |
JP2015531097A (en) | Animation reproduction method, apparatus, device, program, and recording medium | |
WO2023071595A1 (en) | Sound effect display method and terminal device | |
CN110858388B (en) | Method and device for enhancing video image quality | |
WO2012040162A1 (en) | Color correction for digital images | |
CN107071574A (en) | Intelligent television method for page jump | |
WO2023197912A1 (en) | Image processing method and apparatus, device, storage medium, and program product | |
US20120070080A1 (en) | Color correction for digital images | |
TWI720628B (en) | Method and apparatus for enhancing brightness and contrast of video image,storage medium and electronic device | |
WO2023124318A1 (en) | Presentation processing method and apparatus for media file, and electronic device and readable storage medium | |
JP2018133043A (en) | Image processing device and image processing method | |
WO2023005724A1 (en) | Virtual model rendering method and apparatus | |
WO2023125097A1 (en) | Video synthesis method and apparatus | |
US20110074804A1 (en) | Selection of a region | |
CN114119797B (en) | Data processing method, data processing device, computer readable medium, processor and electronic equipment | |
WO2024087971A1 (en) | Method and apparatus for image processing, and storage medium |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
121 | Ep: the epo has been informed by wipo that ep was designated in this application |
Ref document number: 22885483 Country of ref document: EP Kind code of ref document: A1 |
|
NENP | Non-entry into the national phase |
Ref country code: DE |