CN115793913A - Information block control method, device, equipment and medium - Google Patents

Information block control method, device, equipment and medium Download PDF

Info

Publication number
CN115793913A
CN115793913A CN202310068360.4A CN202310068360A CN115793913A CN 115793913 A CN115793913 A CN 115793913A CN 202310068360 A CN202310068360 A CN 202310068360A CN 115793913 A CN115793913 A CN 115793913A
Authority
CN
China
Prior art keywords
information block
sequence number
display
hiding
information
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202310068360.4A
Other languages
Chinese (zh)
Inventor
余获
蔡伟江
金昊
周辉
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Guangzhou Qianjun Network Technology Co ltd
Original Assignee
Guangzhou Qianjun Network Technology Co ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Guangzhou Qianjun Network Technology Co ltd filed Critical Guangzhou Qianjun Network Technology Co ltd
Priority to CN202310068360.4A priority Critical patent/CN115793913A/en
Publication of CN115793913A publication Critical patent/CN115793913A/en
Pending legal-status Critical Current

Links

Images

Abstract

The application provides an information block control method, device, equipment and medium. When the method is executed, acquiring a display sequence number and an information block sequence number; and matching the display sequence number with the information block sequence number, and controlling the display or the hiding of the information block according to the matching result, thereby only displaying the information block with the specified sequence number by matching and comparing the display sequence number with the information block sequence number and by the condition display mode, only displaying one information block each time, and hiding the information blocks with different sequence numbers. The control method has the advantages of less code amount, simple timer for modifying the appointed display serial number, simple and clear logic, easy understanding and maintenance and high control efficiency, and a fussy processing process in the prior art is omitted.

Description

Information block control method, device, equipment and medium
Technical Field
The present application relates to the field of artificial intelligence technologies, and in particular, to a method, an apparatus, a device, and a medium for controlling an information block.
Background
The infinite carousel scene is common in software products, a certain amount of information is presented to a user in turn in a presentation area, and the information is presented again from the beginning after being presented completely, is seamlessly butted and is infinitely circulated.
In the prior art, all information blocks are connected into a whole according to a normal layout, and rolling animation is performed on the whole information blocks through a timer. The target rolling distance needs to be calculated when the method is applied to each rolling. When scrolling to the bottom, the whole information block needs to be instantly moved to the top to achieve the effect of seamless docking. However, due to the characteristics of seamless end-to-end connection and infinite loop, the conventional implementation method is relatively complicated, has many cautions, a large amount of codes, high complexity and low program maintainability.
Disclosure of Invention
In view of this, embodiments of the present application provide an information block control method, apparatus, device, and medium, which aim to improve control efficiency of infinite carousel.
A first aspect of the present application provides an information block control method, where the method includes:
acquiring a display sequence number and an information block sequence number;
and matching the display sequence number with the information block sequence number, and controlling the display or the hiding of the information block according to the matching result.
Optionally, the controlling the displaying or hiding of the information block according to the matching result includes:
and responding to the display sequence number consistent with the information block sequence number, and displaying the first information block with the information block sequence number equal to the display sequence number.
Optionally, the controlling the displaying or hiding of the information block according to the matching result includes:
hiding the first information block in response to the fact that the display sequence number is inconsistent with the information block sequence number of the first information block displayed currently;
and displaying a second information block with the information block sequence number equal to the display sequence number.
Optionally, the hiding the first information block includes:
and controlling the first information block to leave a display area by the departure animation corresponding to the first information block.
Optionally, the displaying the second information block with the sequence number equal to the display sequence number includes:
and controlling the second information block to enter a display area through the approach animation corresponding to the second information block.
Optionally, the display sequence number is specified by incrementing a timer.
Optionally, after the obtaining of the display sequence number and the information block sequence number, the method further includes:
and when the display serial number is larger than a preset threshold serial number, adjusting the display serial number to be a preset initial value.
A second aspect of the present application provides an information block control apparatus, the apparatus comprising:
the acquisition module is used for acquiring a display serial number and an information block serial number;
and the control module is used for matching the display sequence number and the information block sequence number and controlling the display or the hiding of the information block according to the matching result.
A third aspect of the present application provides an electronic device comprising: the information block control method includes a memory, a processor, and a computer program stored in the memory and executable on the processor, and when the processor executes the computer program, the information block control method is implemented as provided by the first aspect of the embodiments of the present application.
A fourth aspect of the present application provides a computer-readable storage medium, where instructions are stored in the computer-readable storage medium, and when the instructions are executed on a terminal device, the terminal device is caused to execute the information block control method provided in the first aspect of the present application.
The application provides an information block control method, device, equipment and medium. When the method is executed, acquiring a display sequence number and an information block sequence number; and matching the display sequence number with the information block sequence number, and controlling the display or the hiding of the information block according to the matching result, so that only the information block with the specified sequence number is displayed in a matching and comparing manner with the display sequence number and the information block sequence number, only one information block is displayed each time, and the information blocks with different sequence numbers are hidden. The control method has the advantages that the code amount is small, particularly only one simple timer is needed by the JavaScript part to modify the appointed display sequence number, the complicated processing process in the prior art is omitted, the logic is simple and clear, the understanding and the maintenance are easy, and the control efficiency is high.
Drawings
In order to more clearly illustrate the technical solutions in the embodiments or the prior art, the drawings used in the embodiments or the prior art descriptions will be briefly described below, and obviously, the drawings in the following description are only some embodiments of the present application, and other drawings can be obtained by those skilled in the art without creative efforts.
Fig. 1 is a flowchart of a method for controlling an information block according to an embodiment of the present application;
fig. 2 is a schematic diagram illustrating overlapping of multiple information blocks according to an embodiment of the present application;
FIG. 3 is a schematic diagram of a display result provided in an embodiment of the present application;
fig. 4 is a schematic structural diagram of an apparatus for controlling information blocks according to an embodiment of the present application.
Detailed Description
In order to make the technical solutions of the present application better understood, the technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the drawings in the embodiments of the present application, and it is obvious that the described embodiments are only a part of the embodiments of the present application, and not all of the embodiments. All other embodiments obtained by a person of ordinary skill in the art based on the embodiments in the present application without making any creative effort belong to the protection scope of the present application.
As described above, the method adopted in the prior art is to connect all the information blocks into a whole according to the normal layout, and perform a rolling animation on the whole information blocks through a timer. The target rolling distance needs to be calculated when the method is applied to each rolling. When scrolling to the bottommost part, the whole information block needs to be instantly moved to the topmost part so as to achieve the effect of seamless docking.
The existing method has the following two defects: the scrolling distance needs to be calculated, for example, on the PC side, the height of each information block is 50px, when the 1 st information block is displayed, the scrolling distance is 0, when the 2 nd information block is displayed, the scrolling distance is 50px, and when the nth information block is displayed, the scrolling distance is (N-1) × 50px. However, when the mobile terminal is moved, the size of the mobile phone screen is different, and the size of the content is also adapted, so that the height of the information block is not a fixed value, and the actual distance from the top of the current information block to the top of the whole information block needs to be acquired as the scrolling distance. Although the target scroll distance can be calculated, the complexity is increased. The second disadvantage is that: since all blocks are normally laid out as a whole, when the last block is scrolled to the first block, it is not possible to scroll because their positions are physically separated head and tail and not concatenated. The conventional solution is to copy and add the first block to the last, which is originally the last one changed to the second last. The above figures are examples, the head and the tail are numbers 1, when the number 4 scrolls to the number 1 at the tail, the user needs to wait for the end of the scrolling animation, and immediately jumps to the number 1 at the head in a non-animation mode, and because the display of the head and the tail numbers 1 is identical, the user does not feel during the jumping process. Similarly, although the effect can be achieved, the application complexity is high.
In order to solve the problem, embodiments of the present application provide an information block control method, apparatus, device, and medium. When the method is executed, acquiring a display sequence number and an information block sequence number; and matching the display sequence number and the information block sequence number, and controlling the display or the hiding of the information block according to the matching result, so that each information block is independently moved into and out of the field animation, the offset distance is fixed to be 100% of the height of the information block, and the trouble of calculating the rolling distance by the existing integral method is avoided. Meanwhile, each information block is absolutely laid out, so that special processing required by tail-to-head rolling under normal layout of the existing integral method is avoided. The method has the advantages of simple implementation mode, novel thought and less code amount, and particularly, only one simple timer is needed by the JavaScript part to modify the appointed display sequence number, so that a plurality of original processing flows are saved, the logic is simple and clear, and the method is easy to understand and maintain. The control efficiency is high.
The method execution main body provided by the embodiment of the application can be a control system.
The information block control method provided in the present application is explained below by an embodiment. Referring to fig. 1, fig. 1 is a flowchart of a method of controlling an information block according to an embodiment of the present application, including:
s101: and acquiring a display sequence number and an information block sequence number.
The variable noticeIndex is set as the display number, and the default value is 0. The sequence number setting of the information blocks starts with 0. By v-show command control, display is enabled when the chunk sequence number equals noticeIndex, so that only one chunk is displayed at a time.
The principles of the present invention are generic and non-limiting to development languages, and are described in detail below based on a Web front end and framework Vue. Firstly, positioning is carried out, the width and the height of all information blocks displayed by carousel are set to be the same as those of the display area, and the coordinates of the information blocks are set to be at the positions corresponding to the display area (0, 0) in an absolute layout mode, namely all the information blocks are positioned on the display area and completely overlapped with the display area. Referring to fig. 2, fig. 2 is a schematic diagram illustrating overlapping of multiple information blocks according to an embodiment of the present application. The characters are the same, but the characters cannot be seen by overlapping, but the numbers are different, and the characters can be seen to be overlapped by 1 to 4. Each information block sequence number has a corresponding information block sequence number. And the naming format of each information block sequence number is the same as the display sequence number, i.e. the information block sequence number has the same number as the display sequence number.
S102: and matching the display sequence number with the information block sequence number, and controlling the display or the hiding of the information block according to the matching result.
In a possible implementation manner, the controlling the displaying or hiding of the information block according to the matching result includes the steps of:
step A: and responding to the display sequence number consistent with the information block sequence number, and displaying the first information block with the information block sequence number equal to the display sequence number.
That is, whether the information blocks match with each other is determined according to the display sequence number and the information block sequence number obtained in the step S101, for example, the display sequence number is 1, the information block sequence number is also 1, and the sequence numbers are the same, and the information block with the information block sequence number 1 is controlled to be displayed, and the information blocks with different sequence numbers are hidden, and there is no overlapping. Referring to fig. 3, fig. 3 is a schematic diagram of a display result provided by an embodiment of the present application;
in a possible implementation manner, the controlling the displaying or hiding of the information block according to the matching result may include steps B1-B2:
step B1: and hiding the first information block in response to the display sequence number not being consistent with the information block sequence number of the first information block currently displayed.
In an actual application scene, the designated display sequence number can be incremented through the timer, and then the sequence number of the current display information block is different from the designated display sequence number, so that the hiding operation is performed.
In a possible implementation manner, the manner of hiding the first information block may be to control the first information block to leave the presentation area with the departure animation corresponding to the first information block.
Responding to the change of the display sequence number, and acquiring the field-off animation of the first information block; and controlling the first information block to leave a display area by the departure animation.
In one possible implementation scenario, only the currently displayed first block of information may be played back, but the first block of information is always in the display area and not moved. Therefore, whether the control information block is equal to the display sequence number or not and whether the advance and retreat animation is played or not can be realized, all the information blocks are always positioned in the display area, and the infinite carousel can be realized.
In an actual application scene, an approach animation and an departure animation can be added. By adding relevant styles to the display or the hiding of the information blocks through the Transition component of Vue, the approach animation during display and the departure animation during hiding can be independently set for the information blocks. For example, an approach animation is scrolled from below the presentation area to the presentation area, and the initial position of the approach is a distance that is offset by 100% of the height of the information block downwards from the normal position, since the height of the information block is the same as the presentation area, i.e. the initial position is just below the adjacent presentation area. The departure animation is scrolled from the presentation area to above the presentation area, and the end position of the departure animation is offset upward by a distance of 100% of the height of the information block from the normal position, i.e., adjacently above the presentation area.
And step B2: and displaying a second information block with the information block sequence number equal to the display sequence number.
In a possible implementation manner, the manner of displaying the second information block may be to control the second information block to enter the presentation area with the approach animation corresponding to the second information block.
Acquiring a second information block with the same display sequence number as the changed display sequence number and an approach animation of the second information block; and controlling the second information block to enter a display area through the approach animation. When the designated display sequence number is greater than the maximum sequence number, the display sequence number is reset to 0.
The naming, adjusting mode, adjusting rule and adjusting mechanism of the display sequence number may be set according to actual requirements, and are not limited herein.
The approach animation and the departure animation of each information block can be set according to actual requirements, and the animations of each information block can be set to be the same or different from each other, which is not limited herein.
The absolute layout refers to that the content blocks are separated from the normal layout, the position is determined by the set specific coordinate value, and the content blocks can be mutually overlapped and do not interfere with each other when the coordinates are the same. Vue is a progressive JavaScript framework that uses a compact template syntax to declaratively render data into the DOM. The v-for instruction is used for list loop rendering. The v-show instruction is used to show when the condition is satisfied, and hide otherwise. The Transition tag is used for adding frequently relevant styles in element display or hiding, and the styles can be used for producing the approach and departure animations.
In summary, all the information blocks displayed in the carousel are positioned on the display area in an absolute layout manner, that is, all the information blocks are positioned at the same position and completely overlapped. Then only the information blocks with the assigned sequence numbers are displayed in a condition display mode, so that only one information block is displayed at a time. And simultaneously adding an approach animation for displaying and an departure animation for hiding to the information block independently, wherein the approach animation is scrolled from the lower part of the showing area to the showing area, and the departure animation is scrolled from the showing area to the upper part of the showing area. Therefore, the information blocks with the appointed sequence numbers to be displayed are switched through the timer, the currently displayed information blocks are subjected to hiding operation, the off-scene animation is played, and the information blocks are scrolled upwards until the information blocks completely leave the display area. And displaying the new information display block, playing the approach animation, and scrolling upwards until the new information display block completely enters the display area. When the animation parameters (animation duration, animation speed and animation track) of the approach animation and the departure animation are consistent, the effect of uniform upward rolling of the whole is generated.
The foregoing provides some specific implementation manners of the information block control method for the embodiments of the present application, and based on this, the present application also provides a corresponding apparatus. The device provided by the embodiment of the present application will be described in terms of functional modularity.
Referring to fig. 4, fig. 4 is a schematic structural diagram of an information block control apparatus according to an embodiment of the present disclosure.
In this embodiment, the apparatus may include:
an obtaining module 201, configured to obtain a display sequence number and an information block sequence number;
and the control module 202 is configured to match the display sequence number with the information block sequence number, and control display or hiding of the information block according to a matching result.
Optionally, the control module includes:
and the first display module is used for responding to the consistency of the display sequence number and the information block sequence number and displaying the first information block with the information block sequence number equal to the display sequence number.
Optionally, the control module includes:
the first hiding module is used for hiding the first information block in response to the fact that the display sequence number is inconsistent with the sequence number of the information block of the first information block currently displayed;
and the second display module is used for displaying the second information block with the information block serial number equal to the display serial number.
Optionally, the first hiding module is configured to control the first information block to leave the display area with the departure animation corresponding to the first information block.
Optionally, the second display module includes:
and controlling the second information block to enter a display area through the approach animation corresponding to the second information block.
Optionally, the display sequence number is specified by incrementing a timer.
Optionally, the method further comprises the steps of,
and the adjusting module is used for adjusting the display sequence number to be a preset initial value in response to the fact that the display sequence number is larger than a preset threshold sequence number.
The embodiment of the application also provides corresponding equipment and a computer storage medium, which are used for realizing the scheme of the information block control method provided by the embodiment of the application.
The device comprises a memory and a processor, wherein the memory is used for storing instructions or codes, and the processor is used for executing the instructions or codes so as to enable the device to execute the information block control method in any embodiment of the application.
The computer storage medium has code stored therein, and when the code is executed, an apparatus that runs the code implements the information block control method according to any embodiment of the present application.
It should be noted that, in the present specification, the embodiments are described in a progressive manner, each embodiment focuses on differences from other embodiments, and the same and similar parts among the embodiments may be referred to each other. For the system or the device disclosed by the embodiment, the description is simple because the system or the device corresponds to the method disclosed by the embodiment, and the relevant points can be referred to the method part for description.
It should be understood that, in this application, "at least one" means one or more, "a plurality" means two or more. "and/or" for describing an association relationship of associated objects, indicating that there may be three relationships, e.g., "a and/or B" may indicate: only A, only B and both A and B are present, wherein A and B may be singular or plural. The character "/" generally indicates that the former and latter associated objects are in an "or" relationship. "at least one of the following" or similar expressions refer to any combination of these items, including any combination of single item(s) or plural items. For example, at least one (one) of a, b, or c, may represent: a, b, c, "a and b", "a and c", "b and c", or "a and b and c", wherein a, b, c may be single or plural.
It is further noted that, herein, relational terms such as first and second, and the like may be used solely to distinguish one entity or action from another entity or action without necessarily requiring or implying any actual such relationship or order between such entities or actions. Also, the terms "comprises," "comprising," or any other variation thereof, are intended to cover a non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements does not include only those elements but may include other elements not expressly listed or inherent to such process, method, article, or apparatus. Without further limitation, an element defined by the phrases "comprising a," "8230," "8230," or "comprising" does not exclude the presence of additional like elements in a process, method, article, or apparatus that comprises the element.
The steps of a method or algorithm described in connection with the embodiments disclosed herein may be embodied directly in hardware, in a software module executed by a processor, or in a combination of the two. A software module may reside in Random Access Memory (RAM), memory, read Only Memory (ROM), electrically programmable ROM, electrically erasable programmable ROM, registers, hard disk, a removable disk, a CD-ROM, or any other form of storage medium known in the art.
The previous description of the disclosed embodiments is provided to enable any person skilled in the art to make or use the present application. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the generic principles defined herein may be applied to other embodiments without departing from the spirit or scope of the application. Thus, the present application is not intended to be limited to the embodiments shown herein but is to be accorded the widest scope consistent with the principles and novel features disclosed herein.

Claims (10)

1. An information block control method, comprising:
acquiring a display sequence number and an information block sequence number;
and matching the display sequence number with the information block sequence number, and controlling the display or the hiding of the information block according to the matching result.
2. The method according to claim 1, wherein said controlling the displaying or hiding of the information block according to the matching result comprises:
and responding to the display sequence number consistent with the information block sequence number, and displaying the first information block with the information block sequence number equal to the display sequence number.
3. The method according to claim 1, wherein said controlling the displaying or hiding of the information block according to the matching result comprises:
hiding the first information block in response to the fact that the display sequence number is inconsistent with the information block sequence number of the first information block displayed currently;
and displaying a second information block with the information block serial number equal to the display serial number.
4. The method of claim 3, wherein the concealing the first information block comprises:
and controlling the first information block to leave the display area with the departure animation corresponding to the first information block.
5. The method of claim 3, wherein displaying the second information block with the information block sequence number equal to the display sequence number comprises:
and controlling the second information block to enter a display area through the approach animation corresponding to the second information block.
6. The method of claim 1, wherein the display sequence number is specified by incrementing a timer.
7. The method of claim 1, wherein after obtaining the display sequence number and the information block sequence number, the method further comprises:
and when the display serial number is larger than a preset threshold serial number, adjusting the display serial number to be a preset initial value.
8. An information block control apparatus, comprising:
the acquisition module is used for acquiring a display serial number and an information block serial number;
and the control module is used for matching the display sequence number with the information block sequence number and controlling the display or hiding of the information block according to the matching result.
9. An electronic device, characterized in that the device comprises a memory for storing a program or code and a processor for executing the program or code stored in the memory to implement the information block control method according to any one of claims 1-7.
10. A computer-readable storage medium having code stored therein, wherein when the code is executed, an apparatus executing the code implements the information block control method according to any one of claims 1 to 7.
CN202310068360.4A 2023-02-06 2023-02-06 Information block control method, device, equipment and medium Pending CN115793913A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202310068360.4A CN115793913A (en) 2023-02-06 2023-02-06 Information block control method, device, equipment and medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202310068360.4A CN115793913A (en) 2023-02-06 2023-02-06 Information block control method, device, equipment and medium

Publications (1)

Publication Number Publication Date
CN115793913A true CN115793913A (en) 2023-03-14

Family

ID=85430048

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202310068360.4A Pending CN115793913A (en) 2023-02-06 2023-02-06 Information block control method, device, equipment and medium

Country Status (1)

Country Link
CN (1) CN115793913A (en)

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20210011609A1 (en) * 2019-07-12 2021-01-14 Qingdao Hisense Media Networks Ltd. Method for displaying user interface and display device
CN114282135A (en) * 2021-12-10 2022-04-05 北京卓越乐享网络科技有限公司 Data carousel method and device, electronic equipment and storage medium
CN114995810A (en) * 2022-05-27 2022-09-02 珠海格力电器股份有限公司 List data multiplexing implementation method, device, equipment and storage medium

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20210011609A1 (en) * 2019-07-12 2021-01-14 Qingdao Hisense Media Networks Ltd. Method for displaying user interface and display device
CN114282135A (en) * 2021-12-10 2022-04-05 北京卓越乐享网络科技有限公司 Data carousel method and device, electronic equipment and storage medium
CN114995810A (en) * 2022-05-27 2022-09-02 珠海格力电器股份有限公司 List data multiplexing implementation method, device, equipment and storage medium

Similar Documents

Publication Publication Date Title
CN107077274B (en) Method and apparatus for moving context tags in a strip
US20050022128A1 (en) System and method for providing a webpage
CN107147940B (en) Content carousel method and device, electronic equipment and storage medium
CN112188255A (en) Video-based interaction method, video processing method, device, equipment and storage medium
JP4462819B2 (en) Information processing apparatus and method, recording medium, and program
US20110285727A1 (en) Animation transition engine
CN111399831A (en) Page display method and device, storage medium and electronic device
US20230241499A1 (en) Position adjustment method and apparatus for operation control, terminal, and storage medium
CN109343770B (en) Interactive feedback method, apparatus and recording medium
CN114443945A (en) Display method of application icons in virtual user interface and three-dimensional display equipment
JP4606692B2 (en) Information processing apparatus and method, recording medium, and program
WO2020186837A1 (en) Text animation control method and device, storage medium and processor
CN113050861B (en) Display interface control method, electronic device and storage medium
CN112565858A (en) Program editing method and device and program publishing method and device
CN115407985A (en) Virtual multimedia scene editing method, electronic device and storage medium
CN115793913A (en) Information block control method, device, equipment and medium
CN113181640B (en) Menu bar display method and device, electronic equipment and storage medium
CN111782095B (en) Switching display method and device for display objects in visual area
CN108898652B (en) Skin image setting method and device and electronic equipment
CN113117329A (en) Display control method and device in game, storage medium and electronic equipment
CN110908749A (en) Layout generation method and device for display object
CN114594890A (en) Carousel display method and device of media information, electronic equipment and storage medium
CN112540761A (en) Control display control method and device
US20230195291A1 (en) Information processing system
US20210279882A1 (en) Information processing apparatus and non-transitory computer readable medium

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
RJ01 Rejection of invention patent application after publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20230314