CN112306616A - Loading display processing method and device, computer equipment and storage medium - Google Patents
Loading display processing method and device, computer equipment and storage medium Download PDFInfo
- Publication number
- CN112306616A CN112306616A CN202011323318.5A CN202011323318A CN112306616A CN 112306616 A CN112306616 A CN 112306616A CN 202011323318 A CN202011323318 A CN 202011323318A CN 112306616 A CN112306616 A CN 112306616A
- Authority
- CN
- China
- Prior art keywords
- frame
- box model
- box
- target progress
- progress bar
- 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.)
- Granted
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T19/00—Manipulating 3D models or images for computer graphics
- G06T19/20—Editing of 3D images, e.g. changing shapes or colours, aligning objects or positioning parts
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T2219/00—Indexing scheme for manipulating 3D models or images for computer graphics
- G06T2219/20—Indexing scheme for editing of 3D models
- G06T2219/2012—Colour editing, changing, or manipulating; Use of colour codes
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T2219/00—Indexing scheme for manipulating 3D models or images for computer graphics
- G06T2219/20—Indexing scheme for editing of 3D models
- G06T2219/2016—Rotation, translation, scaling
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Architecture (AREA)
- Computer Graphics (AREA)
- Computer Hardware Design (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
- Management, Administration, Business Operations System, And Electronic Commerce (AREA)
Abstract
The present disclosure provides a loading display processing method, apparatus, computer device and storage medium, the method comprising: creating a first box model of a Cascading Style Sheet (CSS), creating a plurality of second box models in the first box model based on the first box model, creating a third box model corresponding to the second box models in the first box model based on the second box models, forming the first box model by the plurality of second box models, and enabling the third box model to be the same as the first box model in shape, size and position; for each second box model, hiding the part, which exceeds the second box model, of the third box model corresponding to the second box model; adjusting the frame of the third box model to be a round corner frame, and determining a target progress bar; and rotating the target progress bar according to a preset track to finish the loading display of the target progress bar. The embodiment of the disclosure realizes the effect of loading the target progress bar through simple logic, and ensures smooth transition.
Description
Technical Field
The present disclosure relates to the field of computer technologies, and in particular, to a method and an apparatus for processing a load display, a computer device, and a storage medium.
Background
At present, the manner of loading display effect presentation includes a circular progress bar, a rectangular progress bar, and the like, wherein the circular progress bar is most commonly used for loading display application scenes. A canvas (canvas) is generally used to draw a circular loading progress bar, and a circle is drawn by a time control function.
However, the above-mentioned technology has a high requirement for the front-end performance, the code implementation is complex, and more logic is required for control, for example, in the wechat applet, the front-end technology is used to implement the circular progress bar loading effect, which may cause the transition effect to be unsmooth, and may cause poor interactive experience such as flicker. Therefore, how to simply realize the progress bar loading and ensure the smooth transition of the progress bar loading is a problem to be solved in the field of computers at present.
Disclosure of Invention
In view of this, the embodiments of the present disclosure at least provide a loading display processing method, an apparatus, a computer device, and a storage medium, which implement the effect of loading a target progress bar through simple logic, and ensure that the progress bar runs smoothly and transitions smoothly in the loading process.
In a first aspect, an embodiment of the present disclosure provides a load display processing method, including:
creating a first box model of a Cascading Style Sheet (CSS), creating a plurality of second box models in the first box model based on the first box model, and creating a third box model corresponding to the second box models in the first box model based on the second box models, wherein the first box model is formed by the second box models, and the third box model is the same as the first box model in shape, size and position;
for each second box model, hiding the part, which exceeds the second box model, of the third box model corresponding to the second box model;
adjusting the frame of the third box model to be a round corner frame, and determining a target progress bar;
and rotating the target progress bar according to a preset track to finish the loading display of the target progress bar.
In an optional implementation manner, the adjusting the frame of the third box model to be a round frame and determining a target progress bar includes:
selecting a first frame of the third box model, taking the centroid of the first box model as a center and half of the length of the frame of the first box model as a radius, and adjusting the first frame into a first fillet frame; selecting a third frame of the third box model, taking the centroid of the first box model as a center, taking half of the length of the frame of the first box model as a radius, and adjusting the third frame into a second fillet frame, wherein the third frame is a frame of the third box model except the first frame; or
Selecting a first frame and a second frame of the third box model, taking the centroid of the first box model as the center and half of the length of the frame of the first box model as the radius, and adjusting the first frame and the second frame into a first fillet frame, wherein the first frame and the second frame are adjacent frames of the third box model; selecting a third frame of the third box model, taking the centroid of the first box model as a center, taking half of the length of the frame of the first box model as a radius, and adjusting the third frame into a second fillet frame, wherein the third frame is a frame of the third box model except the first frame and the second frame;
determining the target progress bar based on the first and second fillets.
In an optional embodiment, the method further comprises:
configuring a preset color for the first frame of the third box model, wherein the preset color is a color other than a transparent color; configuring a transparent color for a third frame of the third box model, wherein the third frame is a frame of the third box model except the first frame; or
Configuring a preset color for a first frame and a second frame of the third box model, wherein the preset color is a color other than a transparent color, and the first frame and the second frame are adjacent frames of the third box model; and configuring a transparent color for a third frame of the third box model, wherein the third frame is a frame of the third box model except the first frame and the second frame.
In an optional implementation manner, after the adjusting the frame of the third box model to be a round-cornered frame and determining a target progress bar, before the rotating the target progress bar according to a preset track and completing the loading and displaying of the target progress bar, the method further includes:
acquiring the target progress bars corresponding to the second box models, and preset directions and preset angles corresponding to the target progress bars;
and respectively rotating the target progress bar corresponding to each second box model by a preset angle corresponding to the target progress bar according to a first preset direction corresponding to the target progress bar by taking the centroid of the first box model as the center to reach the initial position of each target progress bar.
In an optional implementation manner, the rotating the target progress bar according to a preset trajectory to complete the loading and displaying of the target progress bar includes:
acquiring the display sequence of each target progress bar;
rotating the target progress bar with the first display sequence for a first preset time according to a second preset direction to finish the loading display of the first target progress bar;
and for each target progress bar except the target progress bar with the first display sequence, after the last target progress bar of the target progress bars is loaded, rotating the target progress bars for a second preset time according to a second preset direction, and completing the loading display of the target progress bars.
In an alternative embodiment, the first box model is a square.
In an optional embodiment, the method further comprises: and adjusting the width of the frame of the third box model.
In a second aspect, an embodiment of the present disclosure further provides a loading display processing apparatus, including:
the system comprises a creating module, a first box model and a third box model, wherein the creating module is used for creating a first box model of a Cascading Style Sheet (CSS), creating a plurality of second box models in the first box model based on the first box model, and creating a third box model corresponding to the second box models in the first box model based on the second box models, the plurality of second box models form the first box model, and the third box model is the same as the first box model in shape, size and position;
the hiding module is used for hiding the part, which exceeds the second box model, of the third box model corresponding to the second box model aiming at each second box model;
the adjusting module is used for adjusting the frame of the third box model into a round corner frame and determining a target progress bar;
and the loading module is used for rotating the target progress bar according to a preset track to finish the loading display of the target progress bar.
In an optional embodiment, the adjusting module is configured to select a first frame of the third box model, use the centroid of the first box model as a center, use half of the length of the frame of the first box model as a radius, and adjust the first frame to be a first fillet frame; selecting a third frame of the third box model, taking the centroid of the first box model as a center, taking half of the length of the frame of the first box model as a radius, and adjusting the third frame into a second fillet frame, wherein the third frame is a frame of the third box model except the first frame; or selecting a first frame and a second frame of the third box model, taking the centroid of the first box model as the center, taking half of the length of the frame of the first box model as the radius, and adjusting the first frame and the second frame into a first round frame, wherein the first frame and the second frame are adjacent frames of the third box model; selecting a third frame of the third box model, taking the centroid of the first box model as a center, taking half of the length of the frame of the first box model as a radius, and adjusting the third frame into a second fillet frame, wherein the third frame is a frame of the third box model except the first frame and the second frame; determining the target progress bar based on the first and second fillets.
In an optional embodiment, the adjusting module is further configured to configure a preset color for the first border of the third box model, where the preset color is a color other than a transparent color; configuring a transparent color for a third frame of the third box model, wherein the third frame is a frame of the third box model except the first frame; or configuring a preset color for a first frame and a second frame of the third box model, wherein the preset color is a color other than a transparent color, and the first frame and the second frame are adjacent frames of the third box model; and configuring a transparent color for a third frame of the third box model, wherein the third frame is a frame of the third box model except the first frame and the second frame.
In an optional implementation manner, the adjusting module is further configured to obtain the target progress bars corresponding to the second box models, and preset directions and preset angles corresponding to the target progress bars; and respectively rotating the target progress bar corresponding to each second box model by a preset angle corresponding to the target progress bar according to a first preset direction corresponding to the target progress bar by taking the centroid of the first box model as the center to reach the initial position of each target progress bar.
In an optional implementation manner, the loading module is configured to obtain a preset track, where the preset track is a circular track that takes a centroid of the first box model as a center and takes a half of a frame length of the first box model as a radius; acquiring the display sequence of each target progress bar; rotating the target progress bar with the first display sequence for a first preset time according to a second preset direction to finish the loading display of the first target progress bar; and for each target progress bar except the target progress bar with the first display sequence, after the last target progress bar of the target progress bars is loaded, rotating the target progress bars for a second preset time according to a second preset direction, and completing the loading display of the target progress bars.
In an alternative embodiment, the first box model is a square.
In an optional embodiment, the adjusting module is further configured to adjust a width of a border of the third box model.
In a third aspect, an embodiment of the present disclosure further provides a computer device, including: a processor, a memory and a bus, the memory storing machine-readable instructions executable by the processor, the processor and the memory communicating via the bus when the computer device is running, the machine-readable instructions when executed by the processor performing the steps of the first aspect described above, or any possible implementation of the first aspect.
In a fourth aspect, this disclosed embodiment also provides a computer-readable storage medium, on which a computer program is stored, where the computer program is executed by a processor to perform the steps in the first aspect or any one of the possible implementation manners of the first aspect.
For the description of the effects of the loading display processing apparatus, the computer device and the storage medium, reference is made to the description of the loading display processing method, which is not described herein again.
According to the loading display processing method, the loading display processing device, the computer equipment and the storage medium provided by the embodiment of the disclosure, a first box model of a Cascading Style Sheet (CSS) is created, a plurality of second box models are created in the first box model based on the first box model, a third box model corresponding to the second box model is created based on the second box model, wherein the first box model is square, the third box model is the same as the first box model in size and position, and a third box model which exceeds the second box model and corresponds to the second box model is hidden; adjusting the frame of the three-box model into a round corner frame, and determining a target progress bar; and operating the target progress bar according to a preset track to finish the loading display of the target progress bar. Compared with the prior art that the running effect of the target progress bar is realized through complex codes and more logic algorithms, the requirement on the performance of the front end is high, and smooth transition is not easy to realize, the loading effect of the target progress bar is realized through simple logic, and smooth running and smooth transition of the target progress bar in the loading process are ensured.
In order to make the aforementioned objects, features and advantages of the present disclosure more comprehensible, preferred embodiments accompanied with figures are described in detail below.
Drawings
In order to more clearly illustrate the technical solutions of the embodiments of the present disclosure, the drawings required for use in the embodiments will be briefly described below, and the drawings herein incorporated in and forming a part of the specification illustrate embodiments consistent with the present disclosure and, together with the description, serve to explain the technical solutions of the present disclosure. It is appreciated that the following drawings depict only certain embodiments of the disclosure and are therefore not to be considered limiting of its scope, for those skilled in the art will be able to derive additional related drawings therefrom without the benefit of the inventive faculty.
Fig. 1 is a flowchart illustrating a loading display processing method according to an embodiment of the present disclosure;
FIG. 2 is a schematic diagram illustrating a layout of second box models within a first box model provided by an embodiment of the present disclosure;
FIG. 3a is a schematic diagram illustrating a process of adjusting the border of two third box models to be a round border according to an embodiment of the disclosure;
FIG. 3b is a schematic diagram illustrating a process of adjusting the border of four third box models to be a round border according to an embodiment of the disclosure;
FIG. 3c is a schematic diagram illustrating a process of adjusting the frame of the eight third box models to be a round frame according to an embodiment of the disclosure;
FIG. 4a is a schematic diagram illustrating a process of adjusting the starting positions of two target progress bars according to an embodiment of the disclosure;
FIG. 4b is a schematic diagram illustrating a process of adjusting the starting positions of four target progress bars according to an embodiment of the disclosure;
fig. 5 is a schematic diagram illustrating a loading display processing apparatus provided in an embodiment of the present disclosure;
fig. 6 shows a schematic structural diagram of a computer device provided by an embodiment of the present disclosure.
Detailed Description
In order to make the objects, technical solutions and advantages of the embodiments of the present disclosure more clear, the technical solutions of the embodiments of the present disclosure will be described clearly and completely with reference to the drawings in the embodiments of the present disclosure, and it is obvious that the described embodiments are only a part of the embodiments of the present disclosure, not all of the embodiments. The components of the embodiments of the present disclosure, generally described and illustrated in the figures herein, can be arranged and designed in a wide variety of different configurations. Thus, the following detailed description of the embodiments of the present disclosure, presented in the figures, is not intended to limit the scope of the claimed disclosure, but is merely representative of selected embodiments of the disclosure. All other embodiments, which can be derived by a person skilled in the art from the embodiments of the disclosure without making creative efforts, shall fall within the protection scope of the disclosure.
Furthermore, the terms "first," "second," and the like in the description and in the claims, and in the drawings described above, in the embodiments of the present disclosure are used for distinguishing between similar elements and not necessarily for describing a particular sequential or chronological order. It will be appreciated that the data so used may be interchanged under appropriate circumstances such that the embodiments described herein may be practiced otherwise than as specifically illustrated or described herein.
Reference herein to "a plurality or a number" means two or more. "and/or" describes the association relationship of the associated objects, meaning that there may be three relationships, e.g., a and/or B, which may mean: a exists alone, A and B exist simultaneously, and B exists alone. The character "/" generally indicates that the former and latter associated objects are in an "or" relationship.
Research shows that the mode of realizing the loading effect of the target progress bar by using the front end has higher requirement on the performance of the front end, the code realization is complex, more logic algorithms are needed for control, and the conditions of unsmooth running effect and unsmooth transition effect of the target progress bar can be caused.
Based on the research, the loading display processing method includes the steps that firstly, a CSS box model is built layer by layer, the box model is adjusted, a target progress bar is determined, then the target progress bar is rotated according to a preset track, loading display of the target progress bar is completed, the loading effect of the target progress bar can be achieved only by means of the CSS, and meanwhile smooth operation and smooth transition of the target progress bar in the loading process are guaranteed.
The above-mentioned drawbacks are the results of the inventor after practical and careful study, and therefore, the discovery process of the above-mentioned problems and the solutions proposed by the present disclosure to the above-mentioned problems should be the contribution of the inventor in the process of the present disclosure.
It should be noted that: like reference numbers and letters refer to like items in the following figures, and thus, once an item is defined in one figure, it need not be further defined and explained in subsequent figures.
To facilitate understanding of the present embodiment, first, an Application scenario of the loading display processing method disclosed in the present embodiment is introduced, and a user may log in an Application server through an Application client installed in a terminal device, where the Application client may be a browser of a web page or an Application client installed in a terminal device, such as a mobile phone, a tablet computer, and the like, such as an applet or a mobile phone software (APP).
The terminal device and the application server are in communication connection through a network, and the network can be a local area network, a cellular network, a wide area network and the like. The terminal device may be a User Equipment (UE), a Personal Computer (PC), a mobile device, a User terminal, a Personal Digital Assistant (PDA), a handheld device, a computing device, a vehicle-mounted device, a wearable device, or the like, and the application server may be any device capable of providing internet services. The application server may provide the user with countdown prompts for different application functions, which may include the following cases:
the application server can provide voice countdown prompt for the user, in this case, when the user prepares to send voice through mobile phone software, the voice function provided by the application server is called, the application server can provide a countdown dynamic special effect of the target progress bar for the user within the final time limit of voice recording, and after the special effect display is completed, the voice recording is finished.
The application server can also provide a button long-press function starting countdown prompt for the user, in this case, when the user prepares to start a function through the terminal device, the user needs to press the button for a long time, at this moment, the application server can provide a target progress bar countdown dynamic special effect for the user, and after the special effect display is completed, the function starts to be started.
The application server can also provide a task amount countdown completion prompt for the user, and in this case, for example, the step number information of the user is recorded in the smart watch, a dynamic special effect of countdown of the target progress bar can be provided for the user through the application server, and after the special effect display is completed, the step number in the smart watch is increased by one.
For example, in an internet online education scene, assuming that a user purchases an english course, in a follow-up reading link, a recording button for follow-up reading can be clicked or pressed, so that a dynamic special effect of progress bar countdown is realized; or, assuming that the user purchases a Chinese course, in the ancient poetry recitation link, the recording button can be clicked or pressed to realize the dynamic effect of the countdown of the progress bar, and no limitation is made on the dynamic effect.
The target progress bar related to the embodiment of the disclosure can show countdown prompting effects with different meanings for different application functions for a user, and the countdown prompting effects are not listed one by one.
To facilitate understanding of the present embodiment, first, a detailed description is given of a loading display processing method disclosed in an embodiment of the present disclosure, where an execution subject of the loading display processing method provided in the embodiment of the present disclosure is generally a computer device with certain computing capability, and the computer device includes, for example: terminal equipment or servers or other processing devices. In some possible implementations, the load display handling method may be implemented by the processor calling computer readable instructions stored in the memory.
The following describes a loading display processing method provided by the embodiment of the present disclosure, taking an execution subject as a computer device as an example.
Example one
Referring to fig. 1, a flowchart of a loading display processing method provided in an embodiment of the present disclosure is shown, where the method includes steps S101 to S104, where:
s101: creating a first box model of the cascading style sheet CSS, creating a plurality of second box models in the first box model based on the first box model, and creating a third box model corresponding to the second box models in the first box model based on the second box model.
In this step, the first box model may be a square, the plurality of second box models form the first box model, and the third box model has the same shape, size and position as the first box model. In addition, on the premise that the first box model is square, the size of the first box model can be obtained according to an empirical value, and is not limited herein.
In specific implementation, when the target progress bar countdown is realized by using the CSS, a square CSS box model may be created as the first box model at first, the size of the first box model may be customized, and then, based on the first box model, a plurality of second box models may be created in the first box model, the size of the second box model may be customized, so as to ensure that the plurality of second box models may form the first box model, for example, two second box models, three second box models, four second box models, five second box models, six second box models, seven second box models, eight second box models, sixteen second box models, and the like may be created in the first box model. The size and position of the specifically created second box model can be referred to fig. 2, which is a schematic diagram of the layout form of each second box model in the first box model. And based on the second box model, creating a third box model corresponding to the second box model in the first box model, wherein the third box model can be the same as the first box model in shape, size and position, the second box model can display the frame of the third box model corresponding to the third box model, and the frames of other third box models except the third box model with the corresponding relation cannot be displayed.
For example, a div box model with a width of 100px and a height of 100px is created, and is marked as div _ 0; creating two div box models with the width of 50px and the height of 100px in div _0, and marking the models as div _1 and div _ 2; a div box model corresponding to div _1 and having a width of 100px and a height of 100px is created in div _0 and is denoted as div _1_1, and a div box model corresponding to div _2 and having a width of 100px and a height of 100px is created in div _0 and is denoted as div _2_ 2.
In a possible implementation manner, a width value may be set for a border of the third box model in advance, and the border width of the third box model may be adjusted. In specific implementation, the width of the frame of the third box model can be determined according to one tenth of the width or height of the third box model; or the width of the third box model frame can be adjusted according to an empirical value, and the specific width value is not limited herein.
S102: and hiding the part, which exceeds the second box model, of the third box model corresponding to the second box model aiming at each second box model.
In this step, a portion of the third box model corresponding to the second box model, which exceeds the border of the second box model, may be hidden, and only the content of the third box model corresponding to the second box model in the second box model is correspondingly displayed.
Continuing with the above example, the part of the div _1_1 box model exceeding the frame of the div _1 box model is hidden, and the part of the div _2_2 box model exceeding the frame of the div _2 box model is hidden.
S103: and adjusting the frame of the third box model into a round corner frame, and determining a target progress bar.
In specific implementation, the first frame and the second frame of the third box model may be selected, the centroid of the first box model is taken as the center, half of the length of the frame of the first box model is taken as the radius (in the specific implementation, the radius may be less than or equal to the radius of the length of the frame of the first box model), and the first frame and the second frame are adjusted to be the first fillet frame; selecting a third frame of a third box model, taking the centroid of the first box model as the center, taking half of the length of the frame of the first box model as the radius, and adjusting the third frame into a second fillet frame, wherein the third frame is a frame of the third box model except the first frame and the second frame; and determining a target progress bar based on the first fillet frame and the second fillet frame. For example, reference may be made to fig. 3a, which is a schematic diagram illustrating a process of adjusting the borders of the two third box models to be round-cornered. Creating div _1_1 and div _2_2 in div _0, wherein the layout in div _0 can refer to the layout manner of the two box models shown in fig. 2, and continuing the above example, div _1 can be placed at the left position of div _0, and div _2 can be placed at the right position of div _ 0; an upper frame and a right frame of the div _1_1 can be selected, the centroid of the div _0 box model is taken as the center, a half 50px of the length of the div _0 frame is taken as the radius, and the upper frame and the right frame are adjusted to be first fillet frames; a lower frame and a left frame of the div _1_1 can be selected, the center of the model centroid of the div _0 box is taken as the center, and the radius of 50px of half of the length of the div _0 frame is taken as the radius, so that the lower frame and the left frame are adjusted to be second fillet frames; an upper frame and a left frame of the div _2_2 box can be selected, the centroid of the div _0 box model is taken as the center, a half 50px of the length of the div _0 frame is taken as the radius, and the upper frame and the left frame are adjusted to be first fillet frames; the lower frame and the right frame of div _2_2 may be selected, centered on the center of the div _0 box model, and adjusted to a second rounded box with a radius of 50px, which is half the length of the div _0 frame.
During specific implementation, a first frame of a third box model can be selected, the first frame is adjusted to be a first round-corner frame by taking the centroid of the first box model as the center and taking half of the length of the frame of the first box model as the radius, and the first frame and the second frame are adjacent frames of the third box model; and selecting a third frame of the third box model, taking the centroid of the first box model as the center and half of the length of the frame of the first box model as the radius, and adjusting the third frame into a second fillet frame, wherein the third frame is a frame of the third box model except the first frame.
For example, refer to fig. 3b, which is a schematic diagram illustrating a process of adjusting the border of the four third box models to be a round border. Creating div _1_1, div _2_2, div _3_3 and div _4_4 in div _0, wherein the layout in div _0 can refer to the layout mode of four box models shown in fig. 2, upper borders of div _1_1, div _2_2, div _3_3 and div _4_4 can be respectively selected, the centroid of the div _0 box model is taken as the center, and half 50px of the length of the div _0 border is taken as the radius, and the upper borders are adjusted to be first round corner boxes; the other frames except the upper frame of the div _1_1, the div _2_2, the div _3_3 and the div _4_4 frames can be selected respectively, the center of the div _0 box model is taken as the center, the radius is taken as the half 50px of the length of the div _0 frame, and the other frames except the upper frame are adjusted to be second fillet frames.
For example, refer to fig. 3c, which is a schematic diagram illustrating a process of adjusting the frame of the eight third box models to be a round frame. Creating div _1_1, div _2_2, div _3_3, div _4_4, div _5_5, div _6_6, div _7_7 and div _8_8 in div _0, wherein the layout in div _0 can refer to the layout mode of eight box models in fig. 2, the upper borders of div _1_1 and div _8_8, the right borders of div _2_2 and div _3_3, the lower borders of div _4_4 and div _5_5, the left borders of div _6_6 and div _7_7 can be respectively selected, the center of the div _0 box model is taken as the center, the radius is taken as the half 50px of the length of the div _0 border, and the correspondingly selected borders of each third box model are adjusted to be first round corner boxes; the other frames of div _1_1 and div _8_8 except the upper frame, the other frames of div _2_2 and div _3_3 except the right frame, the other frames of div _4_4 and div _5_5 except the lower frame, the other frames of div _6_6 and div _7_7 except the left frame can be respectively selected, the centroid of the div _0 box model is taken as the center, and the radius is taken as the half 50px of the length of the div _0 frame, so that the frame correspondingly selected by each third box model is adjusted to be the second fillet frame.
In a possible implementation manner, before the border of the third box model is adjusted to be the round corner frame, the border of the third box model can be configured with colors.
In specific implementation, preset colors can be configured for a first frame and a second frame of the third box model, wherein the preset colors are colors except for transparent colors, and the first frame and the second frame are adjacent frames of the third box model; and configuring transparent color for a third frame of a third box model, wherein the third frame is a frame of the third box model except the first frame and the second frame.
Continuing with the above example of creating two third box models within the first box model, red may be configured for the upper and right borders of div _1_1, and transparent may be configured for the lower and left borders of div _1_ 1; red may be configured for the upper and left frames of div _2_2 and transparent for the lower and right frames of div _2_ 2.
In specific implementation, a preset color can be configured for the first frame of the third box model, wherein the preset color is a color other than a transparent color; and configuring a transparent color for a third frame of the third box model, wherein the third frame is a frame of the third box model except the first edge.
Continuing with the above example of creating four third box models within the first box model, blue may be configured for the upper border of div _1_1, div _2_2, div _3_3, div _4_4, and transparent may be configured for the borders of div _1_1, div _2_2, div _3_3, div _4_4 except for the upper border.
Continuing with the example of creating eight third box models within the first box model described above, the upper borders may be div _1_1, div _8_ 8; right borders of div _2_2, div _3_ 3; the lower borders of div _4_4 and div _5_ 5; yellow is configured in the left frames of div _6_6 and div _7_ 7; transparent color can be configured for other frames of div _1_1 and div _8_8 except for the upper frame; transparent color can be configured for other frames of div _2_2 and div _3_3 except for the right frame; transparent color can be configured for other frames of div _4_4 and div _5_5 except for the lower frame; transparent color may be configured for the frames of div _6_6 and div _7_7 except for the left frame.
In one possible embodiment, the target progress bar corresponds to the second box model one to one. Adjusting the third box model may further include obtaining a target progress bar corresponding to each second box model, and a preset direction and a preset angle corresponding to each target progress bar; and respectively rotating the target progress bar corresponding to each second box model by a preset angle corresponding to the target progress bar according to a first preset direction corresponding to the target progress bar by taking the centroid of the first box model as the center to reach the initial position of each target progress bar.
Reference may be made to fig. 4a, which is a schematic diagram illustrating a process of adjusting the starting positions for two target progress bars. Continuing the above example of creating two third box models in the first box model, because the target progress bars correspond to the second box models one to one, the target progress bars corresponding to the two second box models can be obtained and respectively marked as T1 and T2, where the first preset direction corresponding to T1 is clockwise, the preset angle corresponding to T1 is 45 °, the first preset direction corresponding to T2 is counterclockwise, and the preset angle corresponding to T2 is 45 °; rotating the T1 clockwise by 45 degrees to the starting position of T1 by taking the centroid of the first box model as a center; the T2 is rotated 45 ° counterclockwise to the start of T2 centered on the first box model centroid.
Reference may be made to fig. 4b, which is a schematic diagram illustrating a process of adjusting the starting positions of four target progress bars. Continuing the above example of creating four third box models in the first box model, target progress bars corresponding to four second box models may be obtained and respectively recorded as T1, T2, T3, and T4, where a first preset direction corresponding to T1 is counterclockwise, a preset angle corresponding to T1 is 45 °, a first preset direction corresponding to T2 is clockwise, a preset angle corresponding to T2 is 45 °, a first preset direction corresponding to T3 is clockwise, a preset angle corresponding to T3 is 135 °, a first preset direction corresponding to T4 is counterclockwise, and a preset angle corresponding to T4 is 135 °; rotating T1 counterclockwise by 45 ° to the start position of T1 centered on the first box model centroid, rotating T2 clockwise by 45 ° to the start position of T2 centered on the first box model centroid, rotating T3 clockwise by 135 ° to the start position of T3 centered on the first box model centroid, and rotating T4 counterclockwise by 135 ° to the start position of T4 centered on the first box model centroid.
Continuing the above example of creating eight third box models in the first box model, obtaining target progress bars corresponding to the eight second box models and adjusted by the eight third box models, which are respectively marked as T1, T2, T3, T4, T5, T6, T7 and T8, where the first preset direction corresponding to T1 is counterclockwise, the preset angle corresponding to T1 is 45 °, the first preset direction corresponding to T2 is counterclockwise, the preset angle corresponding to T2 is 90 °, the first preset direction corresponding to T3 is counterclockwise, the preset angle corresponding to T3 is 45 °, the first preset direction corresponding to T4 is counterclockwise, the preset angle corresponding to T4 is 90 °, the first preset direction corresponding to T5 is counterclockwise, the preset angle corresponding to T5 °, the first preset direction corresponding to T6 is counterclockwise, the preset angle corresponding to T6 is counterclockwise, the first preset angle corresponding to T7 is 90 °, the preset angle corresponding to T7 is counterclockwise, the preset angle corresponding to T57345 °, the first preset direction corresponding to the T8 is anticlockwise, and the corresponding preset angle of the T8 is 90 degrees; rotating T1 counterclockwise by 45 ° to the start position of T1, rotating T2 counterclockwise by 90 ° to the start position of T2, rotating T3 counterclockwise by 45 ° to the start position of T3, rotating T4 counterclockwise by 90 ° to the start position of T4, rotating T5 counterclockwise by 45 ° to the start position of T5, rotating T6 counterclockwise by 90 ° to the start position of T6, rotating T7 by 45 ° to the start position of T7, rotating T8 counterclockwise by 90 ° to the start position of T8.
It should be noted that the present disclosure is not limited to the case of adjusting two, four, and eight third box models in the above disclosed embodiments, but may also be applied to the case of adjusting other multi-box models, and the specific adjustment process may refer to the three cases listed above, which are not listed here.
S104: and rotating the target progress bar according to a preset track to finish the loading display of the target progress bar.
In this step, the preset trajectory may be a circular trajectory having a center at the centroid of the first box model and a radius equal to half the length of the frame of the first box model.
In specific implementation, a preset track can be obtained, wherein the preset track is a circular track which takes the centroid of the first box model as the center and takes half of the length of the frame of the first box model as the radius; acquiring the display sequence of each target progress bar; rotating the target progress bar with the first display sequence for a first preset time according to a second preset direction to finish the loading display of the first target progress bar; and for each target progress bar except the target progress bar with the first display sequence, after the last target progress bar of the target progress bars is loaded, rotating the target progress bars for a second preset time according to a second preset direction, and completing the loading display of the target progress bars.
Continuing the above example of obtaining the target progress bars corresponding to the two second box models, T2 may be used as a first target progress bar, and T1 may be used as a second target progress bar, where the second preset direction corresponding to T1 and T2 may be clockwise, the first preset time corresponding to T1 may be 30 seconds, the second preset time corresponding to T2 may also be 30 seconds, based on the T2 start position and the preset trajectory, the T2 is rotated clockwise for 30 seconds along the circular trajectory, when the rotation of T2 is terminated, the T1 starts to rotate clockwise for 30 seconds from the start position based on the preset trajectory, and the 60-second target progress bar loading display process is completed.
Continuing the above example of obtaining the target progress bars corresponding to the four second box models, T1 may be used as the first target progress bar, T2, T3, T4 may be used as the second target progress bar, wherein, the second preset direction corresponding to T1, T2, T3, T4 may be clockwise, the first preset time corresponding to T1 may be 15 seconds, the second preset time corresponding to T2, T3, T4 may also be 15 seconds, based on the start position of T1 and the preset track, the T1 is rotated clockwise along the circular track for 15 seconds, when the rotation of T1 is turned off, T2 starts to rotate in the clockwise direction for 15 seconds based on the preset trajectory from the start position, when the rotation of T2 is turned off, T3 starts to rotate in the clockwise direction for 15 seconds based on the preset trajectory from the start position, when the rotation of T3 is terminated, T4 starts to rotate in the clockwise direction for 15 seconds from the start position based on the preset trajectory, completing the 60 second target progress bar loading display process.
Continuing with the above example of obtaining the target progress bars corresponding to the eight second box models, T1 may be used as the first target progress bar, T2, T3, T4 may be used as the second target progress bar, where the second preset direction corresponding to T4, and T4 may be clockwise, the first preset time corresponding to T4 may be 1 second, T4 may also be 1 second, based on the start position of T4 and the preset trajectory, T4 rotates clockwise for 1 second along the circular trajectory, when T4 rotates for a cutoff, T4 starts to rotate clockwise for 1 second from the start position based on the preset trajectory, when T4 rotates clockwise from the start position, the start position is rotated clockwise from the preset trajectory, when T4 rotates clockwise from the start position based on the preset trajectory, the start position by analogy, and when T4 rotates clockwise from the preset trajectory, the start position is rotated by analogy, and when T4 rotates clockwise from the preset trajectory, the start trajectory is rotated clockwise from the preset trajectory, the start trajectory is rotated, and completing the loading display process of the 8-second target progress bar.
The loading display processing method provided by the embodiment of the disclosure is explained in detail through the steps S101 to S104, the CSS box models are created layer by layer, the box models are adjusted, the target progress bar is determined, the target progress bar is rotated according to the preset track, loading display of the target progress bar is completed, the loading effect of the target progress bar can be achieved only by using the CSS, and meanwhile smooth operation and smooth transition of the target progress bar in the loading process are ensured.
It will be understood by those skilled in the art that in the method of the present invention, the order of writing the steps does not imply a strict order of execution and any limitations on the implementation, and the specific order of execution of the steps should be determined by their function and possible inherent logic.
Based on the same inventive concept, a loading display processing apparatus corresponding to the loading display processing method is also provided in the embodiments of the present disclosure, and since the principle of the apparatus in the embodiments of the present disclosure for solving the problem is similar to the loading display processing method in the embodiments of the present disclosure, the implementation of the apparatus may refer to the implementation of the method, and repeated details are not described again.
Example two
Referring to fig. 5, which is a schematic diagram of a loading display processing apparatus according to a fifth embodiment of the present disclosure, the apparatus includes: a creating module 501, a hiding module 502, an adjusting module 503 and a loading module 504; wherein the content of the first and second substances,
a creating module 501, configured to create a first box model of a cascading style sheet CSS, create a plurality of second box models in the first box model based on the first box model, and create a third box model corresponding to the second box model in the first box model based on the second box model, where the plurality of second box models form the first box model, and the third box model is the same as the first box model in shape, size, and position;
a hiding module 502, configured to hide, for each second box model, a portion of a third box model corresponding to the second box model, which exceeds the second box model;
an adjusting module 503, configured to adjust a frame of the third box model to be a rounded corner frame, and determine a target progress bar;
and a loading module 504, configured to rotate the target progress bar according to a preset trajectory, and complete loading and displaying of the target progress bar.
In an optional embodiment, the adjusting module 503 is configured to select a first frame of the third box model, take the centroid of the first box model as a center, take half of the length of the frame of the first box model as a radius, and adjust the first frame to be a first fillet frame; selecting a third frame of the third box model, taking the centroid of the first box model as a center, taking half of the length of the frame of the first box model as a radius, and adjusting the third frame into a second fillet frame, wherein the third frame is a frame of the third box model except the first frame; or selecting a first frame and a second frame of the third box model, taking the centroid of the first box model as the center, taking half of the length of the frame of the first box model as the radius, and adjusting the first frame and the second frame into a first round frame, wherein the first frame and the second frame are adjacent frames of the third box model; selecting a third frame of the third box model, taking the centroid of the first box model as a center, taking half of the length of the frame of the first box model as a radius, and adjusting the third frame into a second fillet frame, wherein the third frame is a frame of the third box model except the first frame and the second frame; determining the target progress bar based on the first and second fillets.
In an optional embodiment, the adjusting module 503 is further configured to configure a preset color for the first frame of the third box model, where the preset color is a color other than a transparent color; configuring a transparent color for a third frame of the third box model, wherein the third frame is a frame of the third box model except the first frame; or configuring a preset color for a first frame and a second frame of the third box model, wherein the preset color is a color other than a transparent color, and the first frame and the second frame are adjacent frames of the third box model; and configuring a transparent color for a third frame of the third box model, wherein the third frame is a frame of the third box model except the first frame and the second frame.
In an optional implementation manner, the adjusting module 503 is further configured to obtain the target progress bars corresponding to the second box models, and preset directions and preset angles corresponding to the target progress bars; and respectively rotating the target progress bar corresponding to each second box model by a preset angle corresponding to the target progress bar according to a first preset direction corresponding to the target progress bar by taking the centroid of the first box model as the center to reach the initial position of each target progress bar.
In an optional implementation manner, the loading module 504 is configured to obtain a preset track, where the preset track is a circular track that takes a centroid of the first box model as a center and takes a half of a frame length of the first box model as a radius; acquiring the display sequence of each target progress bar; rotating the target progress bar with the first display sequence for a first preset time according to a second preset direction to finish the loading display of the first target progress bar; and for each target progress bar except the target progress bar with the first display sequence, after the last target progress bar of the target progress bars is loaded, rotating the target progress bars for a second preset time according to a second preset direction, and completing the loading display of the target progress bars.
In an alternative embodiment, the first box model is a square.
In an optional embodiment, the adjusting module 503 is further configured to adjust the third box model border width.
The description of the processing flow of each module in the device and the interaction flow between each module may refer to the related description in the above method embodiments, and will not be described in detail here.
EXAMPLE III
Based on the same technical concept, the embodiment of the application also provides computer equipment. Referring to fig. 6, a schematic structural diagram of a computer device provided in an embodiment of the present application includes:
a processor 601, a memory 602, and a bus 603. Wherein the memory 602 stores machine-readable instructions executable by the processor 601, the processor 601 is configured to execute the machine-readable instructions stored in the memory 602, and when the machine-readable instructions are executed by the processor 601, the processor 601 performs the following steps: s101: creating a first box model of a Cascading Style Sheet (CSS), creating a plurality of second box models in the first box model based on the first box model, and creating a third box model corresponding to the second box models in the first box model based on the second box models; s102: for each second box model, hiding the part, which exceeds the second box model, of the third box model corresponding to the second box model; s103: adjusting the frame of the third box model to be a round corner frame, and determining a target progress bar; s104: and rotating the target progress bar according to a preset track to finish the loading display of the target progress bar.
The memory 602 includes a memory 6021 and an external memory 6022; the memory 6021 is also referred to as an internal memory and is used for temporarily storing the operation data in the processor 601 and the data exchanged with the external memory 6022 such as a hard disk, the processor 601 exchanges data with the external memory 6022 through the memory 6021, and when the computer device is operated, the processor 601 communicates with the memory 602 through the bus 603, so that the processor 601 executes the execution instructions mentioned in the above method embodiments.
The embodiments of the present disclosure also provide 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 processor, the computer program performs the steps of the loading display processing method described in the above method embodiments. The storage medium may be a volatile or non-volatile computer-readable storage medium.
The embodiments of the present disclosure also provide a computer program product, where the computer program product carries a program code, and instructions included in the program code may be used to execute the steps of the loading display processing method in the foregoing method embodiments, which may be referred to specifically in the foregoing method embodiments, and are not described herein again.
The computer program product may be implemented by hardware, software or a combination thereof. In an alternative embodiment, the computer program product is embodied in a computer storage medium, and in another alternative embodiment, the computer program product is embodied in a Software product, such as a Software Development Kit (SDK), or the like.
It is clear to those skilled in the art that, for convenience and brevity of description, the specific working processes of the system and the apparatus described above may refer to the corresponding processes in the foregoing method embodiments, and are not described herein again. In the several embodiments provided in the present disclosure, it should be understood that the disclosed method and apparatus may be implemented in other manners. The above-described apparatus embodiments are merely illustrative, and for example, the division of the modules is merely a logical division, and there may be other divisions in actual implementation, and for example, a plurality of modules or components may be combined or integrated into another system, or some features may be omitted, or not executed. In addition, the shown or discussed mutual coupling or direct coupling or communication connection may be an indirect coupling or communication connection of devices or units through some communication interfaces, and may be in an electrical, mechanical or other form.
The units described as separate parts may or may not be physically separate, and parts displayed as units may or may not be physical units, may be located in one place, or may be distributed on a plurality of network units. Some or all of the units can be selected according to actual needs to achieve the purpose of the solution of the embodiment.
In addition, functional modules in the embodiments of the present disclosure may be integrated into one processing module, or each module may exist alone physically, or two or more modules are integrated into one module.
The functions, if implemented in the form of software functional modules and sold or used as a stand-alone product, may be stored in a non-volatile computer-readable storage medium executable by a processor. Based on such understanding, the technical solution of the present disclosure may be embodied in the form of a software product, which is stored in a storage medium and includes several instructions for causing a computer device (which may be a personal computer, a server, or a network device) to execute all or part of the steps of the method according to the embodiments of the present disclosure. And the aforementioned storage medium includes: various media capable of storing program codes, such as a usb disk, a removable hard disk, a Read-Only Memory (ROM), a Random Access Memory (RAM), a magnetic disk, or an optical disk.
Finally, it should be noted that: the above-mentioned embodiments are merely specific embodiments of the present disclosure, which are used for illustrating the technical solutions of the present disclosure and not for limiting the same, and the scope of the present disclosure is not limited thereto, and although the present disclosure is described in detail with reference to the foregoing embodiments, those skilled in the art should understand that: any person skilled in the art can modify or easily conceive of the technical solutions described in the foregoing embodiments or equivalent technical features thereof within the technical scope of the present disclosure; such modifications, changes or substitutions do not depart from the spirit and scope of the embodiments of the present disclosure, and should be construed as being included therein. Therefore, the protection scope of the present disclosure shall be subject to the protection scope of the claims.
Claims (10)
1. A loading display processing method is characterized by comprising the following steps:
creating a first box model of a Cascading Style Sheet (CSS), creating a plurality of second box models in the first box model based on the first box model, and creating a third box model corresponding to the second box models in the first box model based on the second box models, wherein the first box model is formed by the second box models, and the third box model is the same as the first box model in shape, size and position;
for each second box model, hiding the part, which exceeds the second box model, of the third box model corresponding to the second box model;
adjusting the frame of the third box model to be a round corner frame, and determining a target progress bar;
and rotating the target progress bar according to a preset track to finish the loading display of the target progress bar.
2. The loading display processing method according to claim 1, wherein the adjusting the frame of the third box model to be a round-corner frame and determining a target progress bar includes:
selecting a first frame of the third box model, taking the centroid of the first box model as a center and half of the length of the frame of the first box model as a radius, and adjusting the first frame into a first fillet frame; selecting a third frame of the third box model, taking the centroid of the first box model as a center, taking half of the length of the frame of the first box model as a radius, and adjusting the third frame into a second fillet frame, wherein the third frame is a frame of the third box model except the first frame; or
Selecting a first frame and a second frame of the third box model, taking the centroid of the first box model as the center and half of the length of the frame of the first box model as the radius, and adjusting the first frame and the second frame into a first fillet frame, wherein the first frame and the second frame are adjacent frames of the third box model; selecting a third frame of the third box model, taking the centroid of the first box model as a center, taking half of the length of the frame of the first box model as a radius, and adjusting the third frame into a second fillet frame, wherein the third frame is a frame of the third box model except the first frame and the second frame;
determining the target progress bar based on the first and second fillets.
3. The loading display processing method according to claim 1 or 2, wherein the adjusting the frame of the third box model to be a round frame further includes, before determining the target progress bar:
configuring a preset color for the first frame of the third box model, wherein the preset color is a color other than a transparent color; configuring a transparent color for a third frame of the third box model, wherein the third frame is a frame of the third box model except the first frame; or
Configuring a preset color for a first frame and a second frame of the third box model, wherein the preset color is a color other than a transparent color, and the first frame and the second frame are adjacent frames of the third box model; and configuring a transparent color for a third frame of the third box model, wherein the third frame is a frame of the third box model except the first frame and the second frame.
4. The method for processing loading display according to claim 1, wherein after the adjusting the frame of the third box model to be a round-corner frame and determining the target progress bar, the method further includes, before the rotating the target progress bar according to a preset trajectory and completing the loading display of the target progress bar:
acquiring the target progress bars corresponding to the second box models, and preset directions and preset angles corresponding to the target progress bars;
and respectively rotating the target progress bar corresponding to each second box model by a preset angle corresponding to the target progress bar according to a first preset direction corresponding to the target progress bar by taking the centroid of the first box model as the center to reach the initial position of each target progress bar.
5. The loading display processing method according to claim 1, wherein the rotating the target progress bar according to a preset track to complete the loading display of the target progress bar comprises:
acquiring a preset track, wherein the preset track is a circular track which takes the centroid of the first box model as the center and takes half of the length of the frame of the first box model as the radius;
acquiring the display sequence of each target progress bar;
rotating the target progress bar with the first display sequence for a first preset time according to a second preset direction to finish the loading display of the first target progress bar;
and for each target progress bar except the target progress bar with the first display sequence, after the last target progress bar of the target progress bars is loaded, rotating the target progress bars for a second preset time according to a second preset direction, and completing the loading display of the target progress bars.
6. The load display processing method according to claim 1, wherein the first box model is a square.
7. The load display processing method according to claim 1, further comprising:
and adjusting the width of the frame of the third box model.
8. A loaded display processing apparatus, comprising:
the system comprises a creating module, a first box model and a third box model, wherein the creating module is used for creating a first box model of a Cascading Style Sheet (CSS), creating a plurality of second box models in the first box model based on the first box model, and creating a third box model corresponding to the second box models in the first box model based on the second box models, the plurality of second box models form the first box model, and the third box model is the same as the first box model in shape, size and position;
the hiding module is used for hiding the part, which exceeds the second box model, of the third box model corresponding to the second box model aiming at each second box model;
the adjusting module is used for adjusting the frame of the third box model into a round corner frame and determining a target progress bar;
and the loading module is used for rotating the target progress bar according to a preset track to finish the loading display of the target progress bar.
9. A computer device, comprising: a processor, a memory and a bus, the memory storing machine-readable instructions executable by the processor, the processor and the memory communicating over the bus when a computer device is running, the machine-readable instructions when executed by the processor performing the steps of the method of loading display processing according to any one of claims 1 to 7.
10. A computer-readable storage medium, having stored thereon a computer program for executing the steps of the method of loading a display process according to any one of claims 1 to 7 when executed by a processor.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011323318.5A CN112306616B (en) | 2020-11-23 | 2020-11-23 | Loading display processing method and device, computer equipment and storage medium |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011323318.5A CN112306616B (en) | 2020-11-23 | 2020-11-23 | Loading display processing method and device, computer equipment and storage medium |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN112306616A true CN112306616A (en) | 2021-02-02 |
| CN112306616B CN112306616B (en) | 2023-09-29 |
Family
ID=74336043
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202011323318.5A Active CN112306616B (en) | 2020-11-23 | 2020-11-23 | Loading display processing method and device, computer equipment and storage medium |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN112306616B (en) |
Citations (13)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US6490722B1 (en) * | 1999-03-30 | 2002-12-03 | Tivo Inc. | Software installation and recovery system |
| CN102455852A (en) * | 2010-10-29 | 2012-05-16 | 汉王科技股份有限公司 | Method and device for displaying progress of electronic reader |
| CN102779046A (en) * | 2012-07-04 | 2012-11-14 | 合一网络技术(北京)有限公司 | Video playing system based on HTML5 development and video playing method thereof |
| US20130145310A1 (en) * | 2007-01-07 | 2013-06-06 | Apple Inc. | Portable Electronic Device, Method, and Graphical User Interface for Displaying Electronic Lists and Documents |
| CN103309581A (en) * | 2013-05-29 | 2013-09-18 | 广东欧珀移动通信有限公司 | Method and device for positioning progress bar |
| CN104239053A (en) * | 2014-09-12 | 2014-12-24 | 广州华多网络科技有限公司 | Progress bar display method and system |
| CN104461496A (en) * | 2014-10-30 | 2015-03-25 | 华中科技大学 | And-or graph layering displaying method |
| CN106127862A (en) * | 2016-06-16 | 2016-11-16 | 财付通支付科技有限公司 | The treating method and apparatus of figure |
| CN106681706A (en) * | 2016-08-09 | 2017-05-17 | 腾讯科技（深圳）有限公司 | Application progress processing method and terminal |
| CN107346250A (en) * | 2017-07-16 | 2017-11-14 | 北京酷我科技有限公司 | A kind of stacking display algorithm of the progress bar of breath light effect |
| CN109901894A (en) * | 2017-12-07 | 2019-06-18 | 腾讯科技（深圳）有限公司 | A kind of progress bar image generating method, device and storage medium |
| CN109976865A (en) * | 2019-03-29 | 2019-07-05 | 北京金山云网络技术有限公司 | Display methods, device and the terminal device of Task Progress |
| CN111596853A (en) * | 2020-04-29 | 2020-08-28 | 五八有限公司 | Method and device for realizing rolling indicator, electronic equipment and storage medium |
-
2020
- 2020-11-23 CN CN202011323318.5A patent/CN112306616B/en active Active
Patent Citations (13)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US6490722B1 (en) * | 1999-03-30 | 2002-12-03 | Tivo Inc. | Software installation and recovery system |
| US20130145310A1 (en) * | 2007-01-07 | 2013-06-06 | Apple Inc. | Portable Electronic Device, Method, and Graphical User Interface for Displaying Electronic Lists and Documents |
| CN102455852A (en) * | 2010-10-29 | 2012-05-16 | 汉王科技股份有限公司 | Method and device for displaying progress of electronic reader |
| CN102779046A (en) * | 2012-07-04 | 2012-11-14 | 合一网络技术(北京)有限公司 | Video playing system based on HTML5 development and video playing method thereof |
| CN103309581A (en) * | 2013-05-29 | 2013-09-18 | 广东欧珀移动通信有限公司 | Method and device for positioning progress bar |
| CN104239053A (en) * | 2014-09-12 | 2014-12-24 | 广州华多网络科技有限公司 | Progress bar display method and system |
| CN104461496A (en) * | 2014-10-30 | 2015-03-25 | 华中科技大学 | And-or graph layering displaying method |
| CN106127862A (en) * | 2016-06-16 | 2016-11-16 | 财付通支付科技有限公司 | The treating method and apparatus of figure |
| CN106681706A (en) * | 2016-08-09 | 2017-05-17 | 腾讯科技（深圳）有限公司 | Application progress processing method and terminal |
| CN107346250A (en) * | 2017-07-16 | 2017-11-14 | 北京酷我科技有限公司 | A kind of stacking display algorithm of the progress bar of breath light effect |
| CN109901894A (en) * | 2017-12-07 | 2019-06-18 | 腾讯科技（深圳）有限公司 | A kind of progress bar image generating method, device and storage medium |
| CN109976865A (en) * | 2019-03-29 | 2019-07-05 | 北京金山云网络技术有限公司 | Display methods, device and the terminal device of Task Progress |
| CN111596853A (en) * | 2020-04-29 | 2020-08-28 | 五八有限公司 | Method and device for realizing rolling indicator, electronic equipment and storage medium |
Non-Patent Citations (3)
| Title |
|---|
| 刘军华;陶永进;: "DIV+CSS网页布局技术中盒子模型的应用研究", 长沙通信职业技术学院学报, no. 04, pages 35 - 39 * |
| 张校君 等: ""Loading页面设计中反馈机制的研究"", 《设计》, pages 20 - 22 * |
| 王刚: ""基于MifavorUI***的动效设计研究"", 《中国优秀硕士学位论文全文数据库 (信息科技辑)》, pages 138 - 850 * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN112306616B (en) | 2023-09-29 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN111145326B (en) | Processing method of three-dimensional virtual cloud model, storage medium, processor and electronic device | |
| Howse | OpenCV computer vision with python | |
| CN109710206A (en) | Show method, apparatus, terminal and the storage medium of information | |
| CN111488149B (en) | Canvas element-based table rendering method and device and computer equipment | |
| KR102208183B1 (en) | Method and apparatus for realizing color tween animation | |
| US9919224B2 (en) | Color sorting puzzle game | |
| US11341706B2 (en) | Virtual scene display method and apparatus, and storage medium | |
| CN110688506A (en) | Template generation method and device, electronic equipment and storage medium | |
| CN104536649A (en) | Page display method and device | |
| WO2023087990A1 (en) | Image display method and apparatus, computer device, and storage medium | |
| CN112967367A (en) | Water wave special effect generation method and device, storage medium and computer equipment | |
| WO2023092950A1 (en) | Material processing method and apparatus for virtual scenario, and electronic device, storage medium and computer program product | |
| CN109045694A (en) | Virtual scene display method, apparatus, terminal and storage medium | |
| JP6661780B2 (en) | Face model editing method and apparatus | |
| CN112306616A (en) | Loading display processing method and device, computer equipment and storage medium | |
| CN107864333A (en) | Image processing method, device, terminal and storage medium | |
| CN112988008A (en) | Information display method and device, computer equipment and storage medium | |
| CN110458667A (en) | Dress ornament recommended method, device, terminal and medium | |
| CN110276817B (en) | Picture making method and device and electronic equipment | |
| CN106201256B (en) | Picture positioning method and device and electronic equipment | |
| EP4124050A1 (en) | Image display method and apparatus, device, and storage medium | |
| CN110554823B (en) | Image processing method, device, equipment and storage medium | |
| Morson | Learn design for iOS development | |
| CN110705242A (en) | Method and device for manufacturing slide template and electronic equipment | |
| CN111782333B (en) | Interface display method and device in game, storage medium and terminal equipment |
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 | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |