Foldout display method and device, electronic equipment, readable storage medium and chip

Abstract

The invention provides a foldout display method and device, electronic equipment, a readable storage medium and a chip, the foldout display method is applied to the electronic equipment with a display screen, a user can achieve conversion of different forms of a foldout in the electronic equipment through simple operation, then pages of the foldout in the different forms are displayed, and the user experience is improved. According to the method and the device, the delicately-designed color inserts in the physical book and the creative foldout are interacted, so that the duplicating and restoring are realized on the electronic book, the reading experience of a user is improved, and the content quality is improved.

Description

Technical Field

[0001] This application relates to the field of computer technology, and in particular to a folding display method, apparatus, electronic device, readable storage medium, and chip. Background Technology

[0002] With the widespread use of electronic devices, more and more people are using devices such as mobile phones, tablets, or dedicated e-readers to read e-books. E-books have significant advantages in terms of portability, storage space, and search functionality. However, e-books sometimes fail to provide the authentic reading experience offered by printed books. For example, to highlight the design and ensure the overall coherence of the content, some physical books add high-quality, large-format, and interactive fold-out illustrations to their bindings. However, current e-book fold-out illustrations are typically processed by cutting the entire illustration into multiple smaller images, with the reader displaying each image independently. This loses both the overall coherence and the interactivity of the illustration, thus reducing the user's reading experience. Summary of the Invention

[0003] This application provides a folding display method, apparatus, electronic device, readable storage medium, and chip. Users can easily perform interactive operations to unfold or fold the page by performing simple operations on the electronic device, enabling users to read the page as a whole and improving the user's reading experience.

[0004] In a first aspect, a folding display method is provided, applied in an electronic device having a display screen. The method includes: displaying a first page, the first page being a folded page; receiving a first operation from a user on the first page; responding to the first operation, folding the first page or a portion of the first page along a first fold line on the first page; and after folding along the first fold line, displaying a second page, the second page displaying different content from the first page, or the second page displaying at least partially the same content as the first page, the aspect ratio of the second page being different from the aspect ratio of the first page, the aspect ratio representing the ratio of the dimension of the page along the length direction of the display area of ​​the display screen to the dimension of the page along the width direction of the display area of ​​the display screen.

[0005] The first aspect provides a folding display method that displays the first page of a folded brochure. Through simple user operation, the first page can be folded over, revealing the second page. The first and second pages are each a single, continuous page, similar to a page in a book. Furthermore, each page represents a different folding configuration, meaning each configuration can be displayed as a single, complete page. Therefore, there's no need to display images from the same configuration on different pages, ensuring the integrity of the folded brochure's display on electronic devices. This method simulates the unfolding or folding process of a real brochure through the folding motion. This method guarantees the interactivity and completeness of the folded brochure's display on electronic devices, improving the user's reading experience.

[0006] It should be understood that the folding display method in the embodiments of this application can be applied to any scenario where content needs to be displayed in the form of a folding page in an electronic device.

[0007] In one possible implementation of the first aspect, the fold-out display method is applied to e-books. This implementation allows physical books with fold-out illustrations to be converted into e-books with the same fold-out display effect, ensuring that the e-book can reproduce the overall design aesthetics and content continuity of the physical book's fold-out illustrations, thus improving the e-book's reading experience and increasing its potential for price appreciation.

[0008] For example, this folding display method can also be used by electronic devices to display promotional posters, tourist maps, attraction introductions, museum and art gallery exhibit descriptions, etc., which will not be elaborated upon in this application.

[0009] For example, the electronic device is an electronic device with a display screen. This electronic device may include, for instance, smartphones, e-readers, tablets, laptops, foldable phones, large-screen devices, smart TVs, in-vehicle infotainment systems, in-vehicle tablets, smartwatches, etc.

[0010] For example, the first operation can be a click operation on the first page, such as a single click or a double click operation; or the first operation can be a swipe operation or a drag operation on the first page, or the first operation can be a click operation, swipe operation or drag operation on an area of ​​the display screen of the electronic device other than the first page; or, for example, the first operation can be a press operation on a physical button of the electronic device. This application does not elaborate on or limit the specific method of the first operation.

[0011] In one possible implementation of the first aspect, the first fold line coincides with the first edge of the first page, and the first operation represents an operation to unfold the page. In this implementation, since the first fold line coincides with the first edge of the first page, after the first page or a portion of the first page folds along the first fold line, a larger page is displayed after the first page or a portion of the first page folds to one side of the first edge. This larger page consists of two smaller pages connected by the first fold line.

[0012] The relationship between fold lines and pages will be explained below using physical folds as an example. In physical folds, fold lines are located at the junction of two pages. When a fold line is located at the edge of a page, it means that there is another page connected to that page. For example, after the current page is folded along the fold line at the edge, the back page of the current page, as well as the page connected to the back page of the current page through the fold line, will be displayed.

[0013] In another possible implementation of the first aspect, the first fold line is located in the middle of the first page, and the first operation represents the operation of folding the page.

[0014] In one possible implementation of the first aspect, the method further includes: receiving a second operation from a user on a second page, the second operation representing a folding operation; responding to the second operation, folding a first portion of the second page along a second fold line on the second page, the folding direction along the second fold line being opposite to the folding direction along the first fold line; and displaying the first page after folding along the second fold line. In this implementation, the user can perform a folding operation (i.e., the second operation) on the unfolded second page, thereby folding the second page back to the initial first page, further improving the similarity between folding interaction in electronic devices and real folding interaction, and enhancing the user experience.

[0015] Understandably, for a single-fold brochure, the second operation of folding the brochure is to switch the brochure from the completed form to the initial form; while for a double-fold or triple-fold brochure, the second operation of folding the brochure can be to switch the brochure from the completed form to the partially completed form, or to switch the brochure from the partially completed form to the initial form, or it can be a switch between different partially completed forms.

[0016] In one possible implementation of the first aspect, the method further includes: receiving a third operation from the user on the second page, the third operation representing a folding operation; responding to the third operation, folding the second portion of the second page along a second fold line on the second page, the folding direction along the second fold line being the same as the folding direction along the first fold line; and displaying a third page after folding along the second fold line, the aspect ratio of the third page being different from that of the second page. In this implementation, the user can perform a folding operation (i.e., the third operation) on the unfolded second page, thereby folding the second page into a third page, making the folding interaction richer and more complete.

[0017] For example, the content displayed on the second page is different from that on the first page, the content displayed on the third page is different from that on the second page, and the content displayed on the third page is different from that on the first page.

[0018] In one possible implementation of the first aspect, the first page is folded along a first fold line, and the content displayed on the second page is different from that on the first page. The method further includes: receiving a fourth operation from the user on the second page, the fourth operation indicating an operation to unfold the page; responding to the fourth operation, folding a portion of the second page along a third fold line on the second page, the third fold line coinciding with one edge of the second page; after folding along the third fold line, displaying a fourth page, the aspect ratio of the fourth page is different from that of the second page, and the content displayed on the fourth page is partially the same as that on the second page. In this implementation, after the first operation to unfold the page, the page is further unfolded by the fourth operation. Multiple unfolding operations can ensure that the page is fully unfolded, thereby ensuring the authenticity and completeness of the page unfolding interaction.

[0019] In one possible implementation of the first aspect, the folding direction along the third fold line is opposite to the folding direction along the first fold line. In this implementation, the two unfolding operations are folded in opposite directions, enabling the double-fold overlay fold to open to both sides.

[0020] In one possible implementation of the first aspect, the folding direction along the third fold line is the same as the folding direction along the first fold line. In this implementation, the two unfolding operations are folded in the same direction, which can realize a double-fold covering folding opening process.

[0021] In one possible implementation of the first aspect, the method further includes: receiving a fifth operation from the user on the fourth page, the fifth operation representing an unfolding operation; in response to the fifth operation, folding a portion of the fourth page along a fourth fold line on the fourth page, the fourth fold line coinciding with one edge of the fourth page, the folding direction along the fourth fold line being the same as the folding direction along the third fold line; after folding along the fourth fold line, displaying a fifth page, the aspect ratio of the fifth page being different from that of the fourth page, and the content displayed on the fifth page being the same as that on the fourth page. In this implementation, the three unfolding operations are folded in the same direction, enabling the three-fold fold to be opened by a folding motion.

[0022] In one possible implementation of the first aspect, the first page includes a first part page and a second part page. The first part page of the first page is folded along a first fold line, and the second page includes the first part page. The content displayed on the first part page of the second page is the same as the content displayed on the second part page of the first page. The method further includes: receiving a sixth operation from the user on the second page, the sixth operation indicating an operation to unfold the page; responding to the sixth operation, folding the first part page of the second page along a fifth fold line on the second page, the fifth fold line coinciding with one edge of the first part page of the second page; after folding along the fifth fold line, displaying a sixth page, the aspect ratio of the sixth page being different from that of the second page, and the content displayed on the sixth page being partially the same as that displayed on the second page. In this implementation, the first part page of the first page folds along the first fold line, and the first part page of the second page folds along the fifth fold line, and the content displayed on the first part page of the second page is the same as that displayed on the second part page of the first page, thus achieving a double-fold interaction similar to a window-style fold. In this implementation of m, the folding direction along the fifth fold line is different from the folding direction along the first fold line. The different folding directions can include folding directions that are opposite or perpendicular.

[0023] In one possible implementation of the first aspect, the folding direction along the fifth fold line is opposite to the folding direction along the first fold line. This implementation can achieve window-style fold line interaction, improving the user experience.

[0024] In one possible implementation of the first aspect, the second page and the first page display different content. The first page includes a first part and a second part. The first part of the first page is folded along a first fold line. The method further includes: in response to a first operation, folding the second part of the first page along a sixth fold line on the first page, the sixth fold line coinciding with the second side of the first page; the second page is displayed after folding along the first fold line and the sixth fold line. In this implementation, both folds in the window-style folding can be triggered by the first operation, enriching the interaction methods of the window-style folding and improving the user experience.

[0025] In one possible implementation of the first aspect, the first side and the second side of the first page are two opposite and parallel sides of the first page, and the folding direction along the sixth fold line is opposite to the folding direction along the first fold line.

[0026] In one possible implementation of the first aspect, the first page is folded along a first fold line, and the second page displays different content than the first page. The method further includes: receiving a seventh operation from the user on the second page, the seventh operation indicating an operation to unfold the page; responding to the seventh operation, folding the second page along a seventh fold line in the second page, the folding direction along the seventh fold line being opposite to the folding direction along the first fold line, the seventh fold line coinciding with one edge of the second page; after folding along the seventh fold line, displaying a seventh page, the aspect ratio of the seventh page being different from that of the second page, and the content displayed on the seventh page being different from that of the second page. This implementation can achieve Z-shaped double-fold interaction, increasing the ways of page folding interaction and improving the user experience.

[0027] In one possible implementation of the first aspect, the method further includes: receiving an eighth operation from the user on the seventh page, the eighth operation representing an unfolding operation; responding to the eighth operation, folding the seventh page along an eighth fold line in the seventh page, the folding direction along the eighth fold line being opposite to the folding direction along the seventh fold line, the eighth fold line coinciding with one edge of the seventh page; after folding along the eighth fold line, displaying the eighth page, the aspect ratio of the eighth page being different from that of the seventh page, and the content displayed on the eighth page being different from that of the seventh page. This implementation can realize the interaction of accordion-style folding, increase the ways of folding interaction, and improve the user experience.

[0028] In one possible implementation of the first aspect, the first page is folded along a first fold line, and the content displayed on the second page is different from that of the first page. The method further includes: receiving a ninth operation from the user on the second page, the ninth operation indicating an operation to unfold the page; responding to the ninth operation, folding the second page along the ninth fold line in the second page, the ninth fold line coinciding with the first edge of the second page; after folding along the ninth fold line, displaying the ninth page, the aspect ratio of the ninth page is different from that of the second page, and the content displayed on the ninth page is different from that of the second page; the first edge of the second page coincides with the third edge of the first page, and the third edge of the first page and the first edge of the first page are two adjacent and mutually perpendicular edges. This implementation can achieve a similar page-folding interaction to a map-style page-folding page, increasing the ways of page-folding interaction and improving the user experience.

[0029] In one possible implementation of the first aspect, the second page includes a first part page and a second part page. The method further includes: receiving a tenth operation from a user on the second page, the tenth operation indicating an unfolding operation; in response to the tenth operation, folding the first part page of the second page along the tenth fold line in the second page, the tenth fold line coinciding with the first edge of the second page; after folding along the tenth fold line, displaying the tenth page, the aspect ratio of the tenth page being different from that of the second page, and the content displayed on the first part page of the tenth page being the same as the content displayed on the second part page of the second page; receiving an eleventh operation from a user on the tenth page, the eleventh operation indicating an unfolding operation; in response to the eleventh operation, folding the first part page of the tenth page along the eleventh fold line in the tenth page, the eleventh fold line coinciding with one edge of the first part page of the tenth page; after folding along the eleventh fold line, displaying the eleventh page, the aspect ratio of the eleventh page being different from that of the tenth page, and the content displayed on the eleventh page being different from that of the tenth page; the folding direction along the tenth fold line is different from the folding direction along the eleventh fold line. This implementation method enables tri-fold page interaction, improving the user experience.

[0030] In one possible implementation of the first aspect, the folding direction along the tenth fold line is opposite to the folding direction along the eleventh fold line; the folding direction along the tenth fold line is the same as the folding direction along the first fold line, or the folding direction along the eleventh fold line is the same as the folding direction along the first fold line. This implementation, because the folding direction along the tenth fold line is the same as the folding direction along the first fold line, or the folding direction along the eleventh fold line is the same as the folding direction along the first fold line, can achieve a double-door tri-fold page interaction, improving the user experience.

[0031] In one possible implementation of the first aspect, the second page includes a first part page and a second part page. The method further includes: receiving a twelfth operation from the user on the second page, the twelfth operation representing an unfolding operation; in response to the twelfth operation, folding the first part page of the second page along the twelfth fold line in the second page, and folding the second part page of the second page along the thirteenth fold line in the second page, the twelfth fold line coinciding with the first edge of the second page, and the thirteenth fold line coinciding with the second edge of the second page; after folding along the twelfth fold line and folding along the thirteenth fold line, displaying the twelfth page, the aspect ratio of the twelfth page being different from that of the second page; the folding direction along the twelfth fold line is different from the folding direction along the thirteenth fold line. This implementation can achieve tri-fold page interaction, improving the user experience.

[0032] In one possible implementation of the first aspect, the folding direction along the twelfth fold line is opposite to the folding direction along the thirteenth fold line; the folding direction along the twelfth fold line is the same as the folding direction along the first fold line, or the folding direction along the thirteenth fold line is the same as the folding direction along the first fold line. This implementation can achieve the interaction of a double-door fold in a tri-fold brochure, improving the user experience.

[0033] In one possible implementation of the first aspect, the first page folds along a first fold line, and the second page displays different content from the first page. The first part of the second page and the second part of the second page together form the second page. This implementation can achieve interactive features in a tri-fold, double-door brochure.

[0034] In one possible implementation of the first aspect, the first target page is a rectangular page, with at least two opposite sides of the first target page displayed along the edge of the display area of ​​the screen. The first target page includes at least one of a first page and any page displayed after arbitrary folding. In this implementation, the first target page refers to any page of the folded page, such as the first page, second page, third page, etc. In the displayed folded pages, at least one page is displayed along the edge of the display area of ​​the screen, eliminating the need for white space and making the overall page display more closely resemble the effect of a folded page, thus improving its aesthetics.

[0035] In one possible implementation of the first aspect, the first target page can be enlarged, reduced, or moved within the display area of ​​the screen. The first target page includes at least one of a first page and any page displayed after folding. In this implementation, the first target page refers to any page of the folded page, such as the first page, second page, third page, etc. Among the displayed folded pages, at least one page can be zoomed or moved, enhancing the interactive experience.

[0036] In one possible implementation of the first aspect, the method further includes: receiving a thirteenth operation by a user on a first target page, wherein the first target page is either the first page or any page displayed after arbitrary folding; and in response to the thirteenth operation, displaying a second target page, wherein the second target page is an enlarged version of the first target page, a reduced version of the first target page, or a page after the first target page has been moved within the display area of ​​the display screen.

[0037] In a second aspect, a folding display device is provided, which includes units for each step of the method in the first aspect or any possible implementation thereof.

[0038] Thirdly, a communication device is provided, comprising units for each step of the method in the first aspect or any possible implementation thereof.

[0039] Fourthly, a communication device is provided, comprising at least one processor and a memory coupled together, the memory storing program instructions, wherein when the program instructions stored in the memory are executed by the processor, the method of the first aspect or any possible implementation thereof is performed.

[0040] Fifthly, a communication device is provided, the communication device including at least one processor and interface circuitry, the at least one processor being configured to execute the method of the first aspect above or any possible implementation thereof.

[0041] In a sixth aspect, an electronic device is provided, the electronic device including a processor and a memory, the memory being used to store instructions, and the processor being used to read the instructions to perform the method in the first aspect above or any possible implementation of the first aspect.

[0042] In a seventh aspect, a computer program product is provided, comprising a computer program that, when executed by a processor, performs the method of the first aspect or any possible implementation thereof.

[0043] Eighthly, a computer-readable storage medium is provided, wherein a computer program is stored therein, which, when executed, performs the method of the first aspect or any possible implementation thereof.

[0044] Ninth aspect, a chip is provided, the chip comprising: a processor for calling and running a computer program from a memory, causing an electronic device having the chip mounted to perform the methods of the first aspect or any possible implementation thereof. Attached Figure Description

[0045] Figure 1 This is an illustration of a common fold-out color insert in physical books.

[0046] Figure 2 This is a schematic diagram illustrating the interactive form of fold-out color illustrations in a physical book.

[0047] Figure 3 This is a flowchart illustrating the process of creating folded color illustrations using an Epub e-book creation tool.

[0048] Figure 4 This is a flowchart illustrating the process of processing folded color illustrations using an Epub e-book creation tool in one embodiment of this application.

[0049] Figure 5 This is a schematic diagram of an e-book display system provided in one embodiment of this application.

[0050] Figure 6 This is a schematic diagram illustrating the process of creating and displaying an e-book based on an e-book display system in one embodiment of this application.

[0051] Figure 7 This is a schematic diagram illustrating the implementation logic of the technical solution in one embodiment of this application.

[0052] Figure 8 Here are three different e-book structure diagrams.

[0053] Figure 9 This is a schematic diagram of the interface of the window-style folding page in one embodiment of this application.

[0054] Figure 10 This is an example of folding element code and packaging specification in one embodiment of this application.

[0055] Figure 11This is a schematic diagram illustrating the animation of a window-style folding mechanism in one embodiment of this application.

[0056] Figure 12 This is a schematic diagram of the interface for the interactive process of a window-style fold-out in another embodiment of this application.

[0057] Figure 13 This is a schematic diagram of the interface of the interaction process of a single-fold card-type brochure in one embodiment of this application.

[0058] Figure 14 This is a schematic diagram of the interface for the interaction process of a single-fold card-type brochure in another embodiment of this application.

[0059] Figure 15 This is a schematic diagram of the interface of the interaction process of a single-fold calendar-style page in one embodiment of this application.

[0060] Figure 16 This is a schematic diagram of the interface for the interaction process of a single-fold calendar-style page in another embodiment of this application.

[0061] Figure 17 This is a schematic diagram of the interface of the interaction process of a double-fold overlay fold in one embodiment of this application.

[0062] Figure 18 This is a schematic diagram of the interface of the interaction process of a double-fold overlay fold in one embodiment of this application.

[0063] Figure 19 This is a schematic flowchart provided for an embodiment of this application.

[0064] Figure 20 This is a hardware structure block diagram of an example electronic device provided in this application.

[0065] Figure 21 This is a schematic diagram of a chip system provided in this application. Detailed Implementation

[0066] The technical solutions in the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings.

[0067] The terminology used in the following embodiments is for the purpose of describing specific embodiments only and is not intended to be limiting of this application. As used in the specification and appended claims of this application, the singular expressions “a,” “an,” “the,” “the,” “the,” and “this” are intended to also include expressions such as “one or more,” unless the context clearly indicates otherwise. It should also be understood that in the embodiments of this application, “one or more” means one or more (including two); “and / or” describes the relationship between related objects, indicating that three relationships may exist; for example, A and / or B can represent: A alone, A and B simultaneously, or B alone, where A and B can be singular or plural. The character “ / ” generally indicates that the preceding and following related objects are in an “or” relationship.

[0068] References to "one embodiment" or "some embodiments" as described in this specification mean that one or more embodiments of this application include a specific feature, structure, or characteristic described in connection with that embodiment. Therefore, the phrases "in one embodiment," "in some embodiments," "in other embodiments," "in still other embodiments," etc., appearing in different parts of this specification do not necessarily refer to the same embodiment, but rather mean "one or more, but not all, embodiments," unless otherwise specifically emphasized. The terms "comprising," "including," "having," and variations thereof mean "including but not limited to," unless otherwise specifically emphasized.

[0069] The "multiple" mentioned in the embodiments of this application refers to two or more. It should be noted that in the description of the embodiments of this application, terms such as "first" and "second" are used only for the purpose of distinguishing descriptions and should not be construed as indicating or implying relative importance, nor should they be construed as indicating or implying order.

[0070] Furthermore, various aspects or features of this application can be implemented as methods, apparatus, or articles of manufacture using standard programming and / or engineering techniques. The term "article of manufacture" as used in embodiments of this application encompasses a computer program accessible from any computer-readable device, carrier, or medium. For example, computer-readable media may include, but are not limited to: magnetic storage devices (e.g., hard disks, floppy disks, or magnetic tapes), optical discs (e.g., compact discs (CDs), digital versatile discs (DVDs), etc.), smart cards, and flash memory devices (e.g., erasable programmable read-only memory (EPROMs), cards, sticks, or key drives, etc.). Additionally, the various storage media described herein may represent one or more devices and / or other machine-readable media for storing information. The term "machine-readable medium" may include, but is not limited to, wireless channels and various other media capable of storing, containing, and / or carrying instructions and / or data.

[0071] The following example uses the application of folding in e-books to illustrate the folding display method in this application. Folding will not be elaborated on in other application scenarios.

[0072] Fold-out color illustrations refer to the use of large-format, high-definition color illustrations or images in e-book page design to enhance the reader's experience through rich fold-out interactions and visual effects. Color illustrations are generally images or pictures related to the book's content, and can include photographs, design drawings, product images, diagrams, flowcharts, scene illustrations, etc., used to supplement the text content and allow readers to more intuitively understand the relevant content in the book. High-quality, large-format, and interactively novel fold-out color illustrations can highlight the book's design, thereby improving the reader's experience and achieving a premium price relative to paperback books. It should be understood that fold-out color illustrations can be in color or black and white; this application does not impose any restrictions on this.

[0073] To facilitate understanding, the following description, in conjunction with the accompanying drawings, provides an exemplary illustration of the form and interactive characteristics of the fold-out color insert.

[0074] Figure 1 This is an illustration of a common fold-out color insert in physical books, such as... Figure 1 As shown, folded color illustrations can generally be classified into single-fold, double-fold, and triple-fold types based on the number of folds. Double-fold and triple-fold illustrations each include various interactive formats. For example... Figure 1 As shown, double-fold color inserts can be divided into different types based on their interaction patterns: door-type color inserts, passive color inserts, Z-type color inserts, and map-type color inserts; while triple-fold color inserts can be divided into different types based on their interaction patterns: double-door-type color inserts, single-sided tumbling color inserts, and accordion-style color inserts. Figure 2This is a schematic diagram illustrating the interactive form of fold-out color illustrations in a physical book, such as... Figure 2 As shown, the interactive modes of the fold-out color insert include: single opening, double opening, scrolling, flipping up, and stretching. Among them, single opening is a left-right flip, and flipping up is a right-left flip.

[0075] Currently, in the binding of physical hardcover books, key content is often presented through folded color illustrations of various forms and interactive styles, thereby enhancing the interactivity between the physical book and the reader and improving the reading experience. However, in the process of converting a paper book into an ebook, the original folded color illustrations are usually cropped and converted into simpler illustrations. For example, a large color illustration might be cut into multiple smaller images, which are then inserted into the text as regular illustrations or displayed statically in sequence.

[0076] Additionally, some reading apps use a double-page layout, similar to displaying the left and right pages of a physical book simultaneously. With this layout, one illustration can be displayed on each side. If the illustration is cut into two smaller parts, both can be shown on the left and right pages simultaneously. This layout often results in blank spaces between the two smaller illustrations on the left and right pages, preventing them from seamlessly combining into a single image; or the two smaller illustrations on the left and right pages may be of different sizes. Therefore, while the double-page layout achieves some of the experience of a single-fold illustration in form, it still lacks the overall cohesiveness of a single-fold illustration.

[0077] Common ebook formats include Epub (Electronic Publication), MOBI, and AZW3. The following example uses the creation of an Epub ebook to illustrate the process of adding folded color illustrations in traditional ebook production methods.

[0078] Figure 3 This is a flowchart illustrating the process of creating folded color illustrations using an Epub e-book authoring tool. Figure 3 As shown, the process mainly includes three steps: image slicing, creation, and reading. The details are explained below.

[0079] like Figure 3As shown, the large image corresponding to the brochure illustration is first cropped into multiple smaller images; then, these cropped smaller images are added sequentially to a chapter's HyperText Markup Language (HTML) file according to their numerical order, with each smaller image contained within a standard img tag; after the Epub ebook is created, it is loaded into the ebook reading application (APP). When the user reads in the reader, the reader's typesetting engine displays the images in the img tags of the chapter's HTML file either in a streaming manner or statically in sequence.

[0080] Understandably, standard img tags generally do not have special CSS (Cascading Style Sheets) styles or JS (JavaScript) animation definitions; images in img tags in chapter HTML files can be displayed in a streaming manner based on a Webview or a native view, or statically displayed in sequence.

[0081] In the process of using e-book tools to process folded color illustrations, because the large illustrations in the physical book were sliced, and due to the limitations of the current Epub image illustrations which are based on HTML layout capabilities, users can only read them one by one in sequence, losing the overall effect and relationship of the original large images. In addition, due to the limitations of Epub's specification definition, it is impossible to combine multiple images into an interactive, whole page element, thus losing the interactive and visual experience of folded pages.

[0082] In view of this, this application provides a folding display method, which is applied in an electronic device with a display screen. The method includes: displaying a first page, which is a folded page; receiving a first operation from a user on the first page; responding to the first operation, folding the first page or a portion of the first page along a first fold line on the first page; and displaying a second page after folding along the first fold line. The content displayed on the second page is different from that of the first page, or the content displayed on the second page is at least partially the same as that of the first page. The aspect ratio of the second page is different from that of the first page, where the aspect ratio represents the ratio of the page's length along the display area of ​​the screen to its width along the display area of ​​the screen. The first page and the second page represent folded pages in one folding configuration. Through simple user operation, the electronic device can switch between different folding configurations, thereby displaying folded pages in different configurations. This method replicates the exquisitely designed color illustrations and creative folding interactions of physical books on an e-book, enhancing the user's reading experience and improving content quality.

[0083] To achieve the aforementioned folded display method, during the e-book production process, based on the definition of folded elements, folded pages, image materials, and interactive animations are packaged into the e-book media file. When a user reads the folded pages on an electronic device, the electronic device reader achieves a simulation effect of folded color illustrations on the e-book by parsing and rendering the folded tags in the e-book media file.

[0084] The following is an exemplary description of the folding display method provided in this application. Those skilled in the art will understand that the following content is merely an example and is not intended to limit the scope of protection of this application.

[0085] It should be noted that in the embodiments of this application, "electronic device", "terminal device" and "terminal" all have the same meaning and the three expressions can be used interchangeably; "folded color insert" and "folded" have the same meaning and the two expressions can be used interchangeably; "insert page" and "folded page" have the same meaning and the two expressions can be used interchangeably.

[0086] To facilitate understanding, the general flow of the e-book creation method and the display method of the folded pages in the e-book on an electronic device in the embodiments of this application will be described first by way of example.

[0087] refer to Figure 4 , Figure 4 This is a schematic diagram illustrating the process of processing folded color illustrations using an Epub e-book creation tool and displaying the folded color illustrations via an electronic device, as described in one embodiment of this application. Figure 4 As shown, the process mainly includes four steps: template application, production and packaging, execution, and rendering. The details are explained below.

[0088] like Figure 4 As shown, firstly, in the Epub ebook creation tool, a fold template is selected based on the folded illustration. The fold template includes a definition of the fold type, which may include the following attributes: number of folds, number of fold lines, fold unfolding direction, image size limits, landscape / portrait preference, and animation configuration files, etc. Then, the fold template is applied to crop the folded illustration into multiple image materials, and these image materials are matched to the fold surfaces of the fold template to achieve the desired effect. Figure 1Taking a single-fold color illustration as an example, the single-fold color illustration is cropped into three images (i.e., image 1, image 2, and image 3). The fold template includes two folds, A and B. Image 1 is matched to side A, and images 2 and 3 are matched to side B. Then, the production and packaging are carried out, that is, the fold type, interaction, and materials are defined as a fold element and integrated into an Epub tag. The client (i.e., electronic device) layout engine recognizes the Epub tag corresponding to the fold element and processes the Epub tag as a whole (e.g., fold tag parsing, obtaining motion effect configuration files, obtaining illustration materials, etc.). Finally, the client's motion effect engine renders it. For example, the motion effect engine can respond to and execute the fold unfolding direction and motion effect defined by the fold type, thereby restoring the experience of the fold color illustration in the physical book on the e-book.

[0089] For ease of understanding, the following is an exemplary description of the e-book display system implemented in the embodiments of this application.

[0090] refer to Figure 5 , Figure 5 This is a schematic diagram of an e-book display system provided in one embodiment of this application. The page-folding display method in this embodiment can be applied to, for example... Figure 5 The electronic device 520 in the e-book display system shown.

[0091] like Figure 5 As shown, in Figure 5 In the illustrated embodiment, the e-book display system includes a server 510 and an electronic device 520. The server 510 and the electronic device 520 are communicatively connected. This communication connection can be a wired communication connection or a wireless communication connection, and this application does not limit it in this regard.

[0092] In the embodiments of this application, wireless communication can be one or more of mobile communication, satellite communication, wireless local area network (WLAN), wireless Fidelity (Wi-Fi), Bluetooth, Bluetooth Low Energy (BLE), radio frequency identification (RFID), infrared, and ultra-wideband (UWB).

[0093] The server 510 can be a standalone physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server providing basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communication, middleware services, domain name services, security services, CDN, and big data and artificial intelligence platforms. The electronic device 520 can be a handheld device, various portable laptops, various tablets, laptops, ultra-mobile personal computers (UMPCs), netbooks, personal digital assistants (PDAs), in-vehicle devices (such as in-vehicle head-up displays), wearable devices, etc. For example, the electronic device in this embodiment can be an e-reader, smartphone, foldable phone, mobile tablet, in-vehicle tablet, smartwatch, etc. This embodiment does not impose any limitations.

[0094] For example, server 510 can be a cloud server, carrying cloud services for e-reading, and providing e-reading services to electronic device 520 through network request service interfaces, such as providing users with services to purchase, download and read e-books, newspapers, magazines, blogs and other electronic media; electronic device 520 serves as the human-computer interaction interface for users to use the reading APP, and users can interact with the electronic device to use various functions of the reading APP through clicking, touching, pressing buttons, voice, gestures and other means.

[0095] Understandably, server 510 can interact with multiple electronic devices using the reading app, thereby providing reading app-related services to these devices.

[0096] For ease of understanding, the following example uses an Epub format ebook. Figure 5 The specific composition and function of the server 510 and electronic device 520 in this application are explained in an exemplary manner to illustrate the process of displaying folded color illustrations in an e-book in the embodiments of this application.

[0097] refer to Figure 6 , Figure 6 This is a schematic diagram illustrating the process of creating and displaying an e-book based on an e-book display system according to one embodiment of this application. Figure 6 As shown, the tool for creating ebooks is located on server 510, and this tool can be an Epub ebook creation tool; the reading app for displaying the ebooks is located on electronic device 520. Wherein:

[0098] The production tools include: an element creation module and Epub media. The element creation module, also known as the premium book element creation module, includes brochure templates and a brochure creation user interface (UI). Epub media is an industry-standard ebook file format that conforms to the standards of HTML and CSS (Cascading Style Sheets). Epub media contains the ebook's description file XML (Extensible Markup Language), ebook table of contents file, chapter HTML, typography CSS styles, cover, and inserted images, etc.

[0099] The reading app includes a reader component, which opens ebook media files (i.e., Epub media), reads and typeset the ebook content, and provides users with reading-related interactive operations and auxiliary tools. The reader component includes a typesetting engine and an animation engine. The typesetting engine is mainly responsible for reading, parsing, and typeset the downloaded ebook media files, while the animation engine is responsible for parsing and executing interactive animations and rendering them on the page.

[0100] Figure 6 The process of displaying folded color illustrations in an e-book is shown below:

[0101] (1) The user cuts the original brochure into multiple images and uploads these images to the production tool. These multiple images constitute the original materials. The user uses the brochure creation user interface within the production tool, applying the uploaded images and a suitable brochure template to perform the specific brochure creation process. The user selects a suitable brochure module on the brochure creation interface and matches corresponding images to each page of the brochure template to form brochure elements. These brochure elements are then added to the ebook media file (i.e., the Epub medium). Specifically, adding brochure elements to the ebook media file includes: adding brochure tags to the ebook media file and storing the image material files (i.e., the images used for matching) to the specified brochure image file path in the ebook media file. Finally, the production tool packages the entire ebook media file into an Epub file.

[0102] It is understood that, in this application embodiment, by defining folding elements, a new folding HTML is added to the e-book media file to insert the storage path of folding tags and material images, or the storage path of folding tags and material images is added to an existing chapter HTML.

[0103] (2) When a user opens an e-book containing the above-mentioned folded color illustrations on an electronic device using a reading app, the electronic device downloads the e-book media file from the server. The layout engine in the reader identifies the fold tags in the e-book media file, reads all the image materials contained in the fold tags, matches the fold template specified by the fold tags, and generates an independent insert page on the current reading page to carry the folded color illustrations. The layout engine also provides the above image materials and fold templates to the motion effects engine.

[0104] For example, the fold label can be<folding_page> The tag name is merely an identifier; other names can be used depending on the situation, as long as they do not conflict with existing tags in the Epub ebook standard. (The last part, "in tags," appears to be incomplete and unrelated to the tag description.)<folding_page> Multiple can be added inside Image material tags are used to store image material files in the specified fold-out image file path of the Epub ebook.

[0105] The animation engine in the reader loads the corresponding animation effects for the folded insert based on the image materials and folded template input by the typesetting engine, executes and renders the folded insert effect on the insert page, and at the same time accepts user interaction operations and executes subsequent animation effects of the interaction.

[0106] For example, the image assets that the layout engine inputs to the motion graphics engine can be the image's Uniform Resource Locator (URL). The motion graphics engine can obtain the image assets through the image's URL.

[0107] For example, image resources are stored in ebook media files. After the electronic device downloads the ebook media file, it saves the ebook media file to the local storage space of the electronic device.

[0108] For ease of understanding, the overall implementation logic of the technical solutions in the embodiments of this application will be described by way of example below.

[0109] refer to Figure 7 , Figure 7 This is a schematic diagram illustrating the implementation logic of the technical solution in one embodiment of this application. For example... Figure 7 As shown, the logic includes steps 001 to 006, wherein:

[0110] Step 001: Create an Epub ebook using an Epub ebook creation tool. Based on the embodiments of this application, the Epub ebook creation tool used has added an "add fold" function compared to the standard Epub ebook creation tool.

[0111] Understandably, when adding a fold page, you can either create a separate fold page in the ebook's table of contents or insert a fold page into an existing page.

[0112] Figure 8 Here are three examples of e-book structure diagrams. Figure 8 Figure a in the diagram is a schematic diagram of an e-book structure without color inserts or fold-out pages. Figure 8 Figure b in the figure is a schematic diagram of the e-book structure with an additional independent fold-out page in one embodiment of this application; Figure 8 Figure c in the figure is a schematic diagram of an e-book structure in which a folded page is inserted into an existing page in one embodiment of this application. In this embodiment, a folded page element tag is inserted at an appropriate position in the HTML of an existing chapter of the e-book, thereby realizing an e-book structure that adds folded pages to the chapter.

[0113] Step 002: When ebook creators need to add folds to an ebook, they need to prepare the original fold insert image materials in advance, that is, they need to prepare the images to be displayed in the fold insert.

[0114] For example, the image displayed on each fold of the brochure can be a separate image.

[0115] For example, when fully opened, the brochure displays a large image that corresponds to the largest fold in the brochure; the images corresponding to the other smaller folds in the brochure can be obtained by cropping this large image.

[0116] Step 003: The core of the folding creation process is to add a definition for the folding element. When the e-book creator wants to add a folding element, they need to provide suitable materials and set appropriate parameters according to the requirements and constraints of this definition to complete the folding creation.

[0117] For example, Figure 7 As shown, the definition 010 of the folding element includes: folding label and packaging specification module 011, folding type and attribute module 012, folding color insert material module 013, and folding animation module 014. The following is an exemplary description of each module in the definition 010 of the folding element with reference to the attached figure.

[0118] (1) Folding Labels and Packaging Specifications Module 011

[0119] For example, folding elements can be implemented by extending an ebook format standard (such as Epub 3.0) with a completely new...<folding_page> To declare using tags, the<folding_page> The label is the fold-out label.

[0120] It is understandable that<folding_page> The name of the fold label is just an identifier. Ebook creators can use other names to name the fold label according to the actual situation, as long as the name of the fold label does not conflict with the labels that already exist in the ebook format standard.

[0121] The following example uses a window-style brochure to illustrate brochure labeling and packaging specifications.

[0122] Figure 9 This is a schematic diagram of the interface for the interactive process of a window-style folding page in one embodiment of this application. Figure 9 As shown, this window-style brochure includes five folds: A1, A2, B1, B2, and B3. The image corresponding to each fold is shown below. Figure 9 As shown. The window line is located between surfaces A1 and A2. This fold includes two fold lines: the first fold line is located on the edge of surface A1 away from surface A2, and the second fold line is located on the edge of surface A2 on the edge of surface A1. Figure 9 The following is an example of the fold element code for a window-style brochure:

[0123] <folding_page type=“windows”>

[0124] <img alt＝"A1”src＝"image1 URL”>

[0125] <img alt＝"A2”src＝"image2 URL”>

[0126] <img alt＝"B1”src＝"image3 URL”>

[0127] <img alt＝"B2”src＝"image4 URL”>

[0128] <img alt＝"B3”src＝"image5 URL”>

[0129] < / folding_page>

[0130] The code snippet for the above folding element can be inserted into the standard HTML file of an Epub ebook, or it can be inserted separately into a new HTML folding page within the body tag. The alt attribute of the img tag stores the folding page corresponding to the image, and the src attribute stores the URL of the image's storage path in the ebook medium.

[0131] Figure 10 Here are sample codes for folding elements and sample packaging specifications in one embodiment of this application, wherein Figure 10 Figure a in the diagram is a sample code for fold-out elements; Figure 10 Figure b in the diagram is shown below, and the specific analysis is as follows:

[0132] In this embodiment of the application, a tag for carrying folding elements is defined by extending the Epub format specification. <flippage>, Figure 10 Figure a shows the fold label.<flippage url=xxx> Code example for page 101, fold label<flippage url=xxx> 101 includes multiple standards Tag 102, each Tag 102 contains the URLs of illustration resources (or illustration materials) for each fold in the corresponding brochure.

[0133] In the ebook creation process, adding folds can be achieved by inserting the fold tag into the Epub media file. Specifically, the fold tag can be created by defining page elements: users first need to select the fold type and provide multiple illustrations according to the size requirements of the images corresponding to the folds in the fold element definition; then, the ebook creation tool packages the fold animation configuration file and illustrations into the xxx.epub ebook media file to form a fold resource package.

[0134] like Figure 10 Figure b shows a suggested directory and naming convention for storing a fold label as an independent fold page in the Epub ebook medium. Fold file 103 includes, for example... Figure 10 The fold label shown in Figure a is<flippage url=xxx> The code is 101. The typesetting engine in an electronic device reader has parsing and recognition capabilities. During the parsing of Epub format ebook files, when the typesetting engine recognizes fold tags...<flippage url=xxx> After step 101, the page folding logic begins, using the page folding label.<flippage url=xxx> The URL attribute in 101 locates the brochure resource package, which includes illustration material 104 and motion effect configuration file 105; the layout engine sends the illustration material 104 and brochure style and motion effect configuration file 105 from the brochure resource package to the motion effect engine for execution and rendering.

[0135] It is understandable that in Figure 10 In the example of packaging specifications for Epub e-book media shown in Figure b, the specific naming conventions, storage directories, and storage directory structure can be customized according to the actual situation, as long as they are consistent with the typesetting engine and animation engine of the client reader on the user's electronic device.

[0136] (2) Folding Types and Attributes Module 012

[0137] For example, each fold type is achieved through<folding_page> The `type` attribute of the tag is used to distinguish them; for example, if the fold type is single fold, then...<folding_page> The tag contains `type="one_folding"`; if the folding type is a window-style bifold, then...<folding_page> The `type` attribute in the tag is "windows"; if the fold type is a double fold, then...<folding_page> The tag contains `type="two_folding"`; if the folding type is Z-fold, then...<folding_page> The type in the tag is "z_folding", etc.

[0138] It is understood that, in the embodiments of this application, multiple enumeration values ​​of fold types can be defined on the type attribute of the fold label. Each enumeration value corresponds to a fold type, each fold type corresponds to a fold template, and each fold template will define key information such as the number of pages, illustration material constraints, and fold animation effects for that fold type.

[0139] For example, each fold type defines its shape through certain attributes. Figure 9 Taking the window-style brochure shown as an example, its<folding_page> The attributes of the tag type="windows" are shown in Table 1.

[0140] Table 1

[0141] Several fold lines 2 lines Several folds 5 sides Side A1 Image Material 1 A2 side Image Material 2 B1 side Image Material 3 B2 side Image Material 4 Side B3 Image Material 5 Aspect Ratio of Side A 1.1：1 Width ratio of surfaces A and B 1：2 Height ratio of surfaces A and B 1：1 Landscape and portrait screen priority Vertical screen Animation Type native

[0142] like Figure 9 As shown, the window-style brochure includes five folds: A1, A2, B1, B2, and B3. The image corresponding to each fold is shown below. Figure 9 As shown, in this embodiment, the image material corresponding to each fold is an image cropped from the corresponding brochure insert.

[0143] like Figure 9 As shown, there are two fold lines and one window line in the fold. The two fold lines are the lines around which the folded surfaces are folded, and the window line is the dividing line between surfaces A1 and A2, which are displayed simultaneously in the initial form. In the initial form, surfaces A1 and A2 are displayed simultaneously, forming surface A of the fold. The fold line of fold 1 is located on the edge of surface A1 away from surface A2. After surface A1 is flipped around the fold line of fold 1, it is in a partially completed form, simultaneously displaying surfaces B1, B2, and A2. The fold line of fold 2 is located on the edge of surface A2 on one side of surface A1. Surface A2 can be flipped around the fold line of fold 2 to display the final completed form, simultaneously displaying surfaces B1, B2, and B3. Surfaces B1, B2, and B3 form surface B of the fold.

[0144] Understandable Figure 9 The broken line shown is for illustrative purposes only and is not visible to the user during actual display.

[0145] (3) Brochure insert module 013

[0146] It should be understood that each brochure type has certain requirements regarding the quantity and size (e.g., aspect ratio) of its illustrations, and these requirements may vary between different brochure types. The requirements for illustrations are generally agreed upon in the brochure properties. Illustrations uploaded by brochure creators must be stored in the directory specified by the ebook media, according to the highest brochure packaging standards.

[0147] (4) Folding animation module 014

[0148] Understandably, different brochure types will have different forms, so the initial form, user interaction-triggered animations, number of user interactions, and final state may all differ. Therefore, the definition of each brochure element for each brochure type will be matched with a corresponding animation.

[0149] Figure 11 This is a schematic diagram illustrating the animation of a window-style folding mechanism in one embodiment of this application. Figure 11 As shown, in its initial state, the animation page displays the illustration corresponding to side A; when the user clicks on side A in the interface, it triggers the two folds in side A to flip along their respective fold lines, and the flipping process is presented as... Figure 11 The intermediate form shown is a partial display of side B, with the two folds of side A tilted along their respective fold lines; this is revealed after the flipping is complete. Figure 11 The completed form shown here has side B fully displayed, while side A is not visible to the user.

[0150] Understandable Figure 11 The intermediate form shown is the folded form when both folds begin to fold simultaneously. When the folding order of the two folds changes, the intermediate form during the folding process will also be different. For example, if the two folds do not fold simultaneously, but the first fold folds and then the second fold begins to fold, then there will be an intermediate form where the first fold is displayed at an angle along the fold line while the second fold is not folded, and an intermediate form where the first fold is fully unfolded and invisible to the user, while the second fold is displayed at an angle along the fold line. This application will not elaborate on these intermediate forms.

[0151] For example, when the page is in its completed state, it can accept user interaction operations such as zooming and moving, thereby enabling the zooming and moving of side B; or it can accept user interaction operations to return to the initial state, thereby returning to the initial state displaying side A.

[0152] It should be understood that the above examples of animation effects for window-style folding are merely for ease of understanding and do not specifically limit the scope of protection of this application.

[0153] For example, the fold animation can support two execution types: 1. Execution via JavaScript; 2. Execution via a native animation library. The specific execution type of the fold animation can be specified in the fold attribute. After parsing the fold attribute, the reader in the electronic device will call the corresponding animation executor, script, or library to render and display the fold based on this type.

[0154] Step 004: After completing the folding page creation, the Epub ebook creation tool inserts the folding tags into the specified HTML of the Epub media file according to the folding tags and packaging specifications, and stores the image materials corresponding to the folds in the folding page in the specified directory of the Epub media file. Finally, the Epub media file is packaged into a standard ebook with the .epub extension for distribution.

[0155] Step 005: In this embodiment of the application, the reader in the electronic device needs to have the ability to recognize and parse fold tags. After downloading and decompressing the Epub media file, the HTML file in the Epub media file is parsed, and when the fold tag is recognized...<folding_page> When a tag is used, the tag and its contents are parsed and processed as page-folding elements.

[0156] Understandably, this tag can be ignored for readers on electronic devices that do not support page folding effects.<folding_page> The label is not processed, or is...<folding_page> The img tag under the tag is treated as a normal static illustration.

[0157] Step 006: After the reader in the electronic device completes the parsing of the fold label, it inputs the fold label's type definition and the list of img image materials under the label into the reader's fold rendering engine. This engine realizes the rendering and interaction of the fold shape combined with the image materials.

[0158] For example, the reader can use a layout engine to parse fold tags, while the rendering and interaction can be handled by a motion effects engine.

[0159] After introducing the overall implementation logic of the technical solutions in the embodiments of this application, the following is an exemplary description of the display and interaction process of the folded color insert in the electronic device in the embodiments of this application.

[0160] To facilitate understanding, the page flipping process in the embodiments of this application will be explained below.

[0161] It should be understood that the page folding in this embodiment is similar to the page-turning operation in a physical book, where a page is equivalent to a single sheet of paper in a book, the fold line is equivalent to the spine of the book, and folding the page along the fold line is equivalent to turning a single sheet of paper along the spine of the book once. The final result of each page folding is equivalent to rotating a single sheet of paper 180° along the spine of the book, thereby changing the display of a single page to displaying the back of that page and the page opposite to the back of that page.

[0162] It is understood that the folding direction of a page along a fold line can be represented by the direction in which the page moves within the interface during the folding process, or by the folding direction when the page undergoes the same fold in the corresponding physical fold. Unless otherwise defined, the folding direction of the page in the embodiments of this application can be defined according to the above rules.

[0163] For example, Figure 9 In diagram a, surface A1 folds along the first fold line in a leftward direction. Figure 9 In Figure b, the folding direction of surface A2 along the second fold line is to the right.

[0164] It should also be understood that when the placement of the page, fold line, and fold is fixed, the folding direction of the page along the fold line is also fixed. For example... Figure 9 In the diagram, the folding direction of surface A1 along the first fold line can only be to the left. Figure 9 In Figure b, the folding direction of surface A2 along the second fold line can only be to the right.

[0165] The following description, in conjunction with the accompanying drawings, provides an exemplary illustration of the display and interaction processes of different types of folds on electronic devices.

[0166] refer to Figure 9 , Figure 9 This is a schematic diagram of the interface of the window-style page-folding interaction process in one embodiment of this application. The embodiment shows a schematic diagram of the window-style page-folding interaction process when a user reads an e-book on a candybar mobile phone.

[0167] In the embodiments of this application, "window-style bi-fold" and "window-style fold" are mentioned. Figure 1 The "door style" in the bi-fold brochures shown all refer to the same type of fold.

[0168] like Figure 9 As shown, this window-style brochure includes five folds: A1, A2, B1, B2, and B3. The brochure includes two fold lines: the first fold line is located on the edge of A1 away from A2, and the second fold line is located on the edge of A2 away from A1. A1 and A2 are two sub-pages separated by window lines on the same page.

[0169] Figure 9 Figure a shows a schematic diagram of the interface of the window-style folding window in its initial form (or initial folded form), as follows: Figure 9 As shown in Figure a, this interface displays sides A1 and A2. Sides A1 and A2 together represent the content of side A of the folded color insert. The user... Figure 9 In Figure a, after clicking on the area containing surface A1, surface A1 will fold along the first fold line, as shown below. Figure 9 As shown in Figure a, arrow 901 indicates that the folding direction of surface A1 along the first fold line is to the left; after the folding is completed, the display interface changes from... Figure 9 The switch shown in Figure a is to Figure 9 As shown in Figure b.

[0170] Figure 9 Figure b shows the interface of a window-style brochure in its partially completed state (or in a partially opened state). Figure 9 The interface shown in Figure b has surfaces B1, B2, and A2.

[0171] It is understandable that Figure 9 The interface shown in Figure b, corresponding to a real folded page, is equivalent to the A1 side being invisible to the user after being folded, while the B1 side, located on the back of the paper containing the A1 side, is displayed. In the initial form of the window fold, a portion of the B2 side, which is opposite to the B1 side, is also displayed; while the A2 side obscures a portion of the B2 side. Figure 9 The B2 plane shown in Figure b is actually a part of the B2 plane.

[0172] like Figure 9 As shown in Figure b, the user in Figure 9 Clicking on the area containing surface A2 in diagram b will cause surface A2 to fold along the second fold line, as shown below. Figure 9 As shown in Figure b, arrow 902 indicates that the folding direction of surface A2 along the second fold line is to the right; after the folding is completed, the display interface changes from... Figure 9 The switch shown in Figure b is to Figure 9 As shown in Figure c.

[0173] Figure 9 The interface shown in Figure c is a schematic diagram of the window-style brochure in its completed state (or in the fully opened state). Figure 9 The interface shown in Figure c has sides B1, B2, and B3. Sides B1, B2, and B3 together represent the content of side B of the folded color insert.

[0174] Understandable Figure 9 The interface shown in Figure c, corresponding to a real folded page, is equivalent to the A2 side being invisible to the user after being folded, while the B3 side, located on the back of the paper containing the A2 side, is displayed. In the initial form of the window fold, the other part of the B2 side, which is opposite to the B3 side, is also displayed. Figure 9 The B2 page shown in Figure c is the complete B2 page.

[0175] It should be understood that Figure 9 The interactive process of the window-style brochure shown is equivalent to switching from a smaller A side to a larger B side in relation to a real brochure. Users can also switch the window-style brochure from the larger B side to the smaller A side.

[0176] For example, in electronic device displays Figure 9 In the case of the interface shown in Figure c, the user clicks Figure 9 In the diagram c, the area where B3 is located is folded to the left along the second fold line, and the display interface changes from... Figure 9 The switch shown in Figure c is to Figure 9 As shown in Figure b; in electronic device displays Figure 9 In the case of the interface shown in Figure b, the user clicks... Figure 9 In the diagram b, the area where B1 is located is folded to the right along the first fold line, and the display interface changes from... Figure 9 The switch shown in Figure b is to Figure 9 As shown in Figure a.

[0177] For ease of understanding, the following will be... Figure 9 The fold shown is described in correspondence with a real physical fold. A physical fold is a sheet of paper with two fold lines. Sides A1 and A2 together represent the folded state (or initial form), while sides B1, B2, and B3 together represent the fully unfolded state (or completed form). In the initial form, sides A1 and A2 are aligned along the window line. When side A1 is folded along the corresponding fold line, the first parts of sides B1 and B2 are gradually revealed. Side B1 is the page on the back of the paper containing side A1. Figure 9 In Figure b, side B2 (the first part of side B2) is opposite side B1. When side A2 is folded along the corresponding fold line, side B3 and the second part of side B2 (the part of side B2 excluding the first part) are gradually revealed. Side B3 is the page on the back of the paper where side A2 is located. In the initial folded state, Figure 9 The second part of page B2, as shown in diagram c, is opposite to page B3.

[0178] It should be understood that, Figure 9 In the illustrated embodiment, the user first clicks on the area containing surface A1, triggering a folding animation for surface A1, causing it to fold along the first fold line; then clicks on the area containing surface A2, triggering a folding animation for surface A2, causing it to fold along the second fold line. In other embodiments, the user may also first click on the area containing surface A2, triggering a folding animation for surface A2, causing it to fold along the second fold line; then clicks on the area containing surface A1, triggering a folding animation for surface A1, causing it to fold along the first fold line. This application will not elaborate on this method.

[0179] In some other embodiments, a single user action can trigger the flipping animations of both side A1 and side A2.

[0180] For example, when a user clicks Figure 9 In Figure a, any area of ​​the interface shown in the diagram is affected by the simultaneous flipping of surfaces A1 and A2, resulting in a different display interface. Figure 9 The switch shown in Figure a is as follows: Figure 9 As shown in diagram c. Accordingly, the user clicks... Figure 9 In the interface shown in Figure c, surfaces B1 and B3 simultaneously fold in any area, and the displayed interface changes from... Figure 9 The switch shown in Figure c is... Figure 9 As shown in Figure a.

[0181] For example, when a user clicks on... Figure 9 In the interface shown in Figure a, surface A1 folds first, and then the folding of surface A1 is completed and displayed. Figure 9 After the interface shown in Figure b, page A2 begins to fold, and the displayed interface changes from... Figure 9 The switch shown in Figure b is as follows Figure 9 As shown in diagram c. Accordingly, the user clicks... Figure 9 In the interface shown in Figure c, surface B2 folds first in any area, and the display is completed after the folding of surface B2. Figure 9 After the interface shown in Figure b, surface B3 begins to fold, and the displayed interface changes from... Figure 9 The switch shown in Figure b is as follows Figure 9 As shown in Figure a.

[0182] Or, the user clicks on Figure 9 In any area of ​​the interface shown in Figure a, surface A1 folds first, followed by surface A2, and the displayed interface changes from... Figure 9 The switch shown in Figure a is as follows: Figure 9 As shown in diagram c. Accordingly, the user clicks... Figure 9 In any area of ​​the interface shown in Figure c, surface B2 folds first, followed by surface B3 folding, resulting in a different display interface. Figure 9 The switch shown in Figure c is... Figure 9 As shown in Figure a.

[0183] refer to Figure 12 , Figure 12 This is a schematic diagram of the interface of the window-style folding page in one embodiment of this application. Figure 12 As shown, the window-style folding mechanism in this embodiment is similar to... Figure 9 The window-style brochure is basically the same as the one in the previous one. This window-style brochure includes five folds: A1, A2, B1, B2, and B3. The window line is located between A1 and A2. This brochure includes two fold lines: the first fold line is located on the edge of A1 away from A2, and the second fold line is located on the edge of A2 relative to A1. The difference lies in... Figure 12 The diagram shows the interactive process of window-style page turning when a user reads an e-book on a tablet.

[0184] Figure 12 Figure a in the diagram is a schematic diagram of the interface of the window-style folding window in its initial state, as shown below. Figure 12 As shown in Figure a, this interface displays sides A1 and A2. Sides A1 and A2, as a whole, represent the content of side A of the folded color insert. The user... Figure 12 In diagram a, after the area containing surface A1 slides to the left, surface A1 folds along the first fold line, as shown below. Figure 12 As shown in Figure a, arrow 1201 indicates that the folding direction of surface A1 along the first fold line is to the left; after the folding is completed, the display interface changes from... Figure 12 The switch shown in Figure a is to Figure 12 As shown in Figure b.

[0185] Figure 12 Figure b shows a schematic diagram of the interface of a window-style brochure in its partially completed form. Figure 12 The interface shown in Figure b has surfaces B1, B2, and A2.

[0186] It is understandable that in Figure 12 The interface shown in Figure b, corresponding to a real folded page, is equivalent to A1 being invisible to the user after being folded, while B1, located on the back of the paper containing A1, is displayed. In the initial form of the window fold, a portion of B2, which is opposite to B1, is also displayed; however, A2 partially obscures a portion of B2. Figure 12 The B2 plane shown in diagram b is actually a portion of the B2 plane. Users in Figure 12 In diagram b, the area containing surface A2 slides to the right, and surface A2 folds along the second fold line, as shown below. Figure 12 As shown in Figure b, arrow 1202 indicates that the folding direction of surface A2 along the second fold line is to the right; after the folding is completed, the display interface changes from... Figure 12 The switch shown in Figure b is to Figure 12 As shown in Figure c.

[0187] Figure 12 The interface shown in Figure c is a schematic diagram of the window-style brochure in its completed form. Figure 12 The interface shown in Figure c has sides B1, B2, and B3. Sides B1, B2, and B3 together represent the content of side B of the folded color insert.

[0188] In some other embodiments, Figure 12 The folding order of sides A1 and A2 in the image can also have other possibilities, for example, refer to the above regarding... Figure 9 The extended content related to the folding order of surfaces A1 and A2 in the illustrated embodiment will not be elaborated here.

[0189] In some embodiments, users can also Figure 12 In diagram c, the area containing surface B3 is slid to the left so that surface B3 folds along the second fold line. After surface B3 is folded, the displayed interface changes from... Figure 12 The switch shown in Figure c is to Figure 12 As shown in Figure b; then users can also... Figure 12 In Figure b, the area containing surface B1 is slid to the right so that surface B1 folds along the first fold line. After surface B1 is folded, the displayed interface changes from... Figure 12 The switch shown in Figure b is to Figure 12 As shown in Figure a.

[0190] In some embodiments, the user can Figure 12 In the interface shown in Figure c, zoom operations are performed to shrink or enlarge the displayed window-style fold. For example... Figure 12 As shown in Figure c, when the user zooms in on the interface, side B of the display gradually zooms in. Figure 12 As shown in Figure d, the top and bottom edges of side B of the window-style fold are displayed at the top and bottom edges of the display area of ​​the electronic device's screen, respectively.

[0191] In some embodiments, the user can Figure 12 In the interface shown in Figure d, drag left or right to display different parts of side B of the window-style brochure. For example... Figure 12 As shown in Figure d, when the user drags to the right in the interface, the B side of the window-style fold gradually slides to the right until it displays as shown. Figure 12 The interface shown in Figure e is in Figure 12 In the interface shown in Figure e, the left edge of side B of the window-style fold-out is displayed at the left edge of the display area of ​​the electronic device's screen; as shown in Figure e. Figure 12 As shown in Figure d, when the user drags to the left in the interface, the B side of the window-style fold gradually slides to the left until it displays as shown. Figure 12 The interface shown in Figure f is in Figure 12 In the interface shown in Figure f, the right edge of the B side of the window-style fold is displayed on the right edge of the display area of ​​the electronic device's screen.

[0192] It should be understood that Figure 12 The switching process shown in Figures c to d is the process of magnifying the B side of the window-style fold-out, while Figure 12 The switching process from diagram d to diagram e in the diagram and Figure 12 The switching process from image d to image f is the process of moving the B side of the window-style fold; users can also... Figure 12 d-graph in the middle Figure 12 The e-graph or Figure 12 The image in step f is zoomed out to switch the display interface. Figure 12 Figure c in the diagram.

[0193] refer to Figure 13 , Figure 13 This is a schematic diagram of the interface for the interaction process of a single-fold card-style page in one embodiment of this application. This embodiment illustrates the window-style page-folding interaction process during e-book reading on a candybar phone's reader.

[0194] like Figure 13 As shown, the single-fold card-style fold includes three folded sides, namely side A, side B1 and side B2. The fold includes a fold line located on one edge of side A.

[0195] Figure 13 Figure a shows a schematic diagram of the interface of a single-fold card fold in its initial form (or initial folded form), as follows: Figure 13 As shown in Figure a, this interface displays the content of side A, which contains a folded color insert. The user... Figure 13 In the image 'a', after clicking on the area containing surface A, surface A folds along the fold line, as shown below. Figure 13 As shown in Figure a, arrow 1301 indicates that the folding direction of surface A along the fold line is to the left; after the folding is completed, the display interface changes from... Figure 13 The switch shown in Figure a is to Figure 13 As shown in Figure b.

[0196] Figure 13 Figure b shows the interface of a single-fold card-style brochure in its completed state. Figure 13 The interface shown in Figure b has sides B1 and B2. Sides B1 and B2 together display the content of side B of the folded color insert.

[0197] It should be understood that Figure 13 The interactive process of the single-fold card-style brochure shown is equivalent to switching from the smaller side A to the larger side B in relation to a real brochure. Users can also switch the single-fold card-style brochure from the larger side B to the smaller side A.

[0198] For example, in electronic device displays Figure 13 In the case of the interface shown in Figure b, the user clicks... Figure 13 In the region where surface B1 is located in diagram b, surface B1 is along... Figure 13 The broken line in graph b flips, and the display interface changes from... Figure 13 The switch shown in Figure b is to Figure 13 As shown in Figure a, it can be understood that the folding direction of surface B1 is opposite to that of surface A; that is, surface B1 folds to the right along the fold line.

[0199] For ease of understanding, the following will be... Figure 13 The fold shown is described in correspondence with a real physical fold. A physical fold is a sheet of paper with a fold line. Side A, as a whole, represents the fold in its fully folded state (or initial form), while sides B1 and B2, as a whole, represent the fold in its fully unfolded state (or completed form). Side A is shown in the initial form of the physical fold. When side A is folded along the corresponding fold line, sides B1 and B2 are gradually revealed. Side B1 is the page on the back of the paper where side A1 is located. In the initial form of the physical fold... Figure 13 As shown in Figure b, plane B2 is opposite to plane B1.

[0200] It is understandable that in Figure 13 In this embodiment, the page on the back of the sheet containing side B2 is not displayed. However, in some other embodiments, the display and interaction of the page on the back of the sheet containing side B2 can be added. The specific display and interaction process is the same as... Figure 13 Figure a in the middle Figure 13 The process in Figure b is similar, except that the folding direction is reversed, which will not be elaborated upon in this application.

[0201] In some embodiments, the user can Figure 13 In the interface shown in Figure b, you can perform a zoom operation to reduce or increase the size of the displayed single-fold card brochure after it has been unfolded. For example... Figure 13 As shown in Figure b, when the user zooms in on the interface, side B of the display gradually zooms in to... Figure 13 As shown in Figure c, the top and bottom edges of side B of the single-fold card are displayed at the top and bottom edges of the electronic device's screen display area, respectively.

[0202] In some embodiments, the user can Figure 13 In the interface shown in Figure c, drag left or right to display different parts of side B of the single-fold brochure. For example... Figure 13 As shown in Figure c, when the user drags to the right on the interface, side B of the single-fold card-style brochure gradually slides to the right until it displays as shown. Figure 13 The interface shown in Figure d is in Figure 13 In the interface shown in Figure d, the left edge of side B of the single-fold card-style fold is displayed at the left edge of the display area of ​​the electronic device's screen; as shown in Figure d. Figure 13 As shown in Figure c, when the user drags to the left in the interface, side B of the single-fold card-style brochure gradually slides to the left until it displays as shown. Figure 13 The interface shown in Figure e is in Figure 13 In the interface shown in Figure e, the right edge of side B of the single-fold card is displayed on the right edge of the display area of ​​the electronic device's screen.

[0203] It should be understood that Figure 13 The switching process shown in Figures b to c is the process of zooming in on the B side of a single-fold brochure, while... Figure 13 The process of switching from diagram c to diagram d in the diagram and Figure 13 The switching process shown in diagram c to diagram e is the process of moving the B side of the single-fold brochure. Users can also... Figure 13 Figure c in the middle Figure 13 The d-graph or Figure 13 In the image 'e', ​​a zoom-out operation is performed to switch the display interface to... Figure 13 Figure b in the diagram.

[0204] refer to Figure 14 , Figure 14 This is a schematic diagram of the interface for the interaction process of a single-fold card-type brochure in another embodiment of this application. Figure 14 As shown, the single-fold card fold in this embodiment is similar to... Figure 13 The single-fold card brochure is basically the same as the one in the picture. This single-fold card brochure has three folded sides: side A, side B1, and side B2. It includes a fold line located on one edge of side A. The difference lies in... Figure 14 The diagram illustrates the interactive process of a single-fold card when a user is reading an e-book on a tablet.

[0205] Figure 14 Figure a shows a schematic diagram of the interface of a single-fold card fold in its initial form (or initial folded form), as follows: Figure 14 As shown in Figure a, this interface displays the content of side A, which contains a folded color insert. The user... Figure 14 In the image 'a', after clicking on the area containing surface A, surface A folds along the fold line, as shown below. Figure 14 As shown in Figure a, arrow 1401 indicates that the folding direction of surface A along the fold line is to the left; after the folding is completed, the display interface changes from... Figure 14 The switch shown in Figure a is to Figure 14 As shown in Figure b.

[0206] Figure 14 Figure b shows the interface of a single-fold card-style brochure in its completed state. Figure 14 The interface shown in Figure b has sides B1 and B2. Sides B1 and B2 together display the content of side B of the folded color insert.

[0207] It should be understood that Figure 14 The interactive process of the single-fold card-style brochure shown is equivalent to switching from the smaller A side to the larger B side in terms of a real brochure. Users can also switch the window-style brochure from the larger B side to the smaller A side.

[0208] For example, in electronic device displays Figure 14 In the case of the interface shown in Figure b, the user clicks... Figure 14 In the region where surface B1 is located in diagram b, surface B1 is along... Figure 14 The broken line in graph b flips, and the display interface changes from... Figure 14 The switch shown in Figure b is to Figure 14 As shown in Figure a.

[0209] It is understandable that Figure 14 In diagram a, the folding direction of surface A along the fold line is to the left. Figure 14 In Figure b, surface B1 is folded along the fold line. The folding direction of surface B1 is to the right, which means that the folding direction of surface B1 along the fold line is opposite to the folding direction of surface A along the fold line.

[0210] For ease of understanding, the following will be... Figure 14 The fold shown is described in correspondence with a real physical fold. A physical fold is a sheet of paper with a fold line. Side A, as a whole, represents the fold in its fully folded state (or initial form), while sides B1 and B2, as a whole, represent the fold in its fully unfolded state (or completed form). Side A is shown in the initial form of the physical fold. When side A is folded along the corresponding fold line, sides B1 and B2 are gradually revealed. Side B1 is the page on the back of the paper where side A1 is located. In the initial form of the physical fold... Figure 14 As shown in Figure b, plane B2 is opposite to plane B1.

[0211] Understandably, in Figure 14 The page on the back of the sheet containing side B2 is not shown in the original text. In some other embodiments, the display and interaction of the page on the back of the sheet containing side B2 can be added. For details of the display and interaction process, please refer to [link / reference]. Figure 14 Figure a in the middle Figure 14 The process of drawing diagram b in this application will not be described in detail here.

[0212] In some embodiments, the user can Figure 14 The zoom function shown in Figure b allows you to shrink or enlarge the displayed single-fold brochure page B after it has been unfolded. Figure 14 As shown in Figure b, when the user zooms in on the interface, side B of the display gradually zooms in to... Figure 14 As shown in Figure c, the top and bottom edges of side B of the single-fold card are displayed at the top and bottom edges of the electronic device's screen display area, respectively.

[0213] In some embodiments, the user can Figure 14 In the interface shown in Figure c, drag left or right to display different parts of side B of the single-fold brochure. For example... Figure 14 As shown in Figure c, when the user drags to the right on the interface, side B of the single-fold card-style brochure gradually slides to the right until it displays as shown. Figure 14 The interface shown in Figure d is in Figure 14 In the interface shown in Figure d, the left edge of side B of the single-fold card-style fold is displayed at the left edge of the display area of ​​the electronic device's screen; as shown in Figure d. Figure 14 As shown in Figure c, when the user drags to the left in the interface, side B of the single-fold card-style brochure gradually slides to the left until it displays as shown. Figure 14 The interface shown in Figure e is in Figure 14 In the interface shown in Figure e, the right edge of side B of the single-fold card is displayed on the right edge of the display area of ​​the electronic device's screen.

[0214] It should be understood that Figure 14 The switching process shown in Figures b to c is the process of enlarging the B side of a single-fold brochure, while... Figure 14 The process of switching from diagram c to diagram d in the diagram and Figure 14 The switching process shown in diagram c to diagram e is the process of moving the B side of the single-fold brochure. Users can also... Figure 14 Figure c in the middle Figure 14 The d-graph or Figure 14 In the diagram, zoom out to switch the display interface. Figure 14 Figure b in the diagram.

[0215] Understandably, single-fold brochures, besides... Figure 13 and Figure 14 Besides the single-fold card fold shown, there is also a single-fold calendar fold. The difference between the single-fold calendar fold and the single-fold card fold lies in the position of the fold line and the direction in which the pages are folded. The following is an illustrative explanation of the interaction process of the single-fold calendar fold, with reference to the accompanying diagram.

[0216] refer to Figure 15 , Figure 15 This is a schematic diagram of the interface for the interaction process of a single-fold calendar-style page in one embodiment of this application. The embodiment illustrates the interaction process of a user reading an e-book on a candybar phone's e-reader using a single-fold calendar-style page. The single-fold calendar-style page includes three folded surfaces: surface A, surface B1, and surface B2. A fold line is included in the page, located at the upper edge of surface A.

[0217] Figure 15 Figure a shows a schematic diagram of the interface of a single-fold calendar fold in its initial state (or initial folded state), as follows: Figure 15 As shown in Figure a, this interface displays the content of side A, which contains a folded color insert. The user... Figure 15 In the image 'a', after clicking on the area containing surface A, surface A folds along the fold line, as shown below. Figure 15 As shown in Figure a, arrow 1501 indicates that the folding direction of surface A along the fold line is upward; after the folding is completed, the display interface changes from... Figure 15 The switch shown in Figure a is to Figure 15 As shown in Figure b.

[0218] Figure 15 The fold shown is Figure 13 The brochures shown are all single folds; the difference lies in the direction in which the pages are folded. Figure 15 In Figure a, surface A folds upwards along the fold line. Figure 13 In Figure a, surface A is folded along the broken line in the direction of leftward folding.

[0219] Figure 15 Figure b shows the interface of a single-fold calendar in its completed state. Figure 15 The interface shown in Figure b has sides B1 and B2. Sides B1 and B2 together display the content of side B of the folded color insert.

[0220] It should be understood that Figure 15 The interactive process of the single-fold calendar-style fold shown is equivalent to switching from a smaller A side to a larger B side in terms of a real fold. Users can also switch the window-style fold from the larger B side to the smaller A side.

[0221] For example, in electronic device displays Figure 15 In the case of the interface shown in Figure b, the user clicks... Figure 15 In the region where surface B1 is located in diagram b, surface B1 is along... Figure 15 The broken line in graph b flips, and the display interface changes from... Figure 15 The switch shown in Figure b is to Figure 15 As shown in Figure a, it can be understood that the folding direction of surface B1 is opposite to that of surface A, that is, surface B1 folds along... Figure 15 In Figure b, the folding direction of the broken line is downward.

[0222] For ease of understanding, the following will be... Figure 15 The fold shown is described in correspondence with a real physical fold. A physical fold is a sheet of paper with a fold line. Side A, as a whole, represents the fold in its fully folded state (or initial form), while sides B1 and B2, as a whole, represent the fold in its fully unfolded state (or completed form). Side A is shown in the initial form of the physical fold. When side A is folded along the corresponding fold line, sides B1 and B2 are gradually revealed. Side B1 is the page on the back of the paper where side A1 is located. In the initial form of the physical fold... Figure 15 As shown in Figure b, plane B2 is opposite to plane B1.

[0223] Understandably, in Figure 15 The page on the back of the sheet containing side B2 is not shown in the original text. In some other embodiments, the display and interaction of the page on the back of the sheet containing side B2 can be added. For details of the display and interaction process, please refer to [link / reference]. Figure 15 Figure a in the middle Figure 15 The process of drawing diagram b in this application will not be described in detail here.

[0224] It should be understood that Figure 15 Although no interface for zooming or moving the page is displayed, Figure 15 The fold shown can also be achieved. Figure 13 The scaling and moving operations shown are not described in detail here.

[0225] refer to Figure 16 , Figure 16 This is a schematic diagram of the interface for the interaction process of a single-fold calendar-style page in another embodiment of this application. Figure 16 As shown, the single-fold calendar-style fold in this embodiment is similar to... Figure 15 The single-fold calendar fold is basically the same as the one in the picture. This single-fold calendar fold has three folded sides: side A, side B1, and side B2. It includes a fold line located on one edge of side A. The difference is... Figure 16 The diagram illustrates the interactive process of a single-fold calendar-style page turning when a user is reading an e-book on a tablet reader.

[0226] Figure 16 Figure a shows a schematic diagram of the interface of a single-fold calendar fold in its initial state (or initial folded state), as follows: Figure 16 As shown in Figure a, this interface displays the content of side A, which contains a folded color insert. The user... Figure 16 In the image 'a', after clicking on the area containing surface A, surface A folds along the fold line, as shown below. Figure 16 As shown in Figure a, arrow 1601 indicates that the folding direction of surface A along the fold line is upward; after the folding is completed, the display interface changes from... Figure 16 The switch shown in Figure a is to Figure 16 As shown in Figure b.

[0227] Figure 16 Figure b shows the interface of a single-fold calendar in its completed state. Figure 16 The interface shown in Figure b has sides B1 and B2. Sides B1 and B2 together display the content of side B of the folded color insert.

[0228] It should be understood that Figure 16 The interactive process of the single-fold calendar-style fold shown is equivalent to switching from a smaller A side to a larger B side in terms of a real fold. Users can also switch the window-style fold from the larger B side to the smaller A side.

[0229] For example, in electronic device displays Figure 16 In the case of the interface shown in Figure b, the user clicks... Figure 16 In the region where surface B1 is located in diagram b, surface B1 is along... Figure 16 The broken line in graph b flips, and the display interface changes from... Figure 16 The switch shown in Figure b is to Figure 16 As shown in Figure a, it can be understood that the folding direction of surface B1 is opposite to that of surface A, that is, surface B1 folds along... Figure 16 In Figure b, the folding direction of the broken line is downward.

[0230] For ease of understanding, the following will be... Figure 16 The fold shown is described in correspondence with a real physical fold. A physical fold is a sheet of paper with a fold line. Side A, as a whole, represents the fold in its fully folded state (or initial form), while sides B1 and B2, as a whole, represent the fold in its fully unfolded state (or completed form). Side A is shown in the initial form of the physical fold. When side A is folded along the corresponding fold line, sides B1 and B2 are gradually revealed. Side B1 is the page on the back of the paper where side A1 is located. In the initial form of the physical fold... Figure 16 As shown in Figure b, plane B2 is opposite to plane B1.

[0231] Understandably, in Figure 16 The page on the back of the sheet containing side B2 is not shown in the original text. In some other embodiments, the display and interaction of the page on the back of the sheet containing side B2 can be added. For details of the display and interaction process, please refer to [link / reference]. Figure 16 Figure a in the middle Figure 16 The process of drawing diagram b in this application will not be described in detail here.

[0232] In some embodiments, the user can Figure 16 The zoom function shown in Figure b allows you to shrink or enlarge the displayed single-fold brochure page B after it has been unfolded. Figure 16 As shown in Figure b, when the user zooms in on the interface, side B of the display gradually zooms in to... Figure 16 As shown in Figure c, the top and bottom edges of side B of the single-fold card are displayed at the top and bottom edges of the electronic device's screen display area, respectively.

[0233] In some embodiments, users can access the system through the system. Figure 16 In the interface shown in Figure c, drag upwards or downwards to display different parts of side B of the single-fold brochure. For example... Figure 16 As shown in Figure c, when the user drags downwards on the interface, side B of the single-fold card-style brochure gradually slides downwards until it displays as shown. Figure 16 The interface shown in Figure d is in Figure 16 In the interface shown in Figure d, the upper edge of side B of the single-fold card-style fold is displayed at the upper edge of the display area of ​​the electronic device's screen; as shown in Figure d. Figure 16 As shown in Figure c, when the user drags upwards on the interface, side B of the single-fold card-style brochure gradually slides upwards until it displays as shown. Figure 16 The interface shown in Figure e is in Figure 16 In the interface shown in Figure e, the lower edge of side B of the single-fold card is displayed at the lower edge of the display area of ​​the electronic device's screen.

[0234] It should be understood that Figure 16 The switching process shown in Figures b to c is the process of zooming in on the B side of a single-fold brochure, while... Figure 16 The process of switching from diagram c to diagram d in the diagram and Figure 14 The switching process shown in diagram c to diagram e is the process of moving the B side of the single-fold brochure. Users can also... Figure 16 Figure c in the middle Figure 16 The d-graph or Figure 16 In the diagram, zoom out to switch the display interface. Figure 16 Figure b in the diagram.

[0235] refer to Figure 17 , Figure 17 This is a schematic diagram of the interface for the interaction process of a double-fold overlay page in one embodiment of this application. This embodiment illustrates the interaction process of a double-fold overlay page during e-book reading on a candybar mobile phone. Figure 17 As shown, the double-fold overlay brooch has five folds, namely side A, side B, side C1, side C2 and side C3. The brooch includes two fold lines, with the first fold line located on the left edge of side A and the second fold line located on the right edge of side B.

[0236] Figure 17 Figure a shows a schematic diagram of the interface of a double-fold overlay fold in its initial form (or initial folded form), as follows: Figure 17 As shown in Figure a, this interface displays side A, which shows the content of one side of the brochure insert. The user... Figure 17 In the image 'a', after clicking on the area containing surface A, surface A folds along the first fold line, as shown below. Figure 17 As shown in Figure a, arrow 1701 indicates that the folding direction of surface A along the first fold line is to the left; after the folding is completed, the display interface changes from... Figure 17 The switch shown in Figure a is to Figure 17 As shown in Figure b.

[0237] Figure 17 Figure b shows the interface of a double-fold overlay brochure in its partially completed state (or in a partially opened state). Figure 17 The interface shown in Figure b has sides C1 and B. It's understandable that side B displays the content of one side of the brochure insert.

[0238] It is understandable that Figure 17 The interface shown in Figure b, corresponding to a real folded page, is equivalent to side A being invisible to the user after being folded, while side C1, located on the back of the paper containing side A, is displayed. In the initial form of a double-fold overlay fold, side B, which is opposite side C1, is also displayed.

[0239] like Figure 17 As shown in Figure b, the user in Figure 17 Clicking on the area containing side B in the image (b) will cause side B to fold along the second fold line, as shown below. Figure 17 As shown in Figure b, arrow 1702 indicates that the folding direction of side B along the second fold line is to the right; after the folding is completed, the display interface changes from... Figure 17 The switch shown in Figure b is to Figure 17 As shown in Figure c.

[0240] Figure 17 The interface shown in Figure c is a schematic diagram of the double-fold overlay brochure in its completed state (or in the fully opened state). Figure 17 The interface shown in Figure c has sides C1, C2, and C3. Sides C1, C2, and C3 together represent the content of side C of the folded color insert.

[0241] It is understandable that Figure 17 The interface shown in Figure c corresponds to the actual folded page. It is equivalent to the B side being invisible to the user after being folded, while the C3 side, located on the back of the paper where the B side is located, is displayed. In the initial form of the double-fold overlay fold, the C2 side, which is opposite to the C3 side, is also displayed.

[0242] It should be understood that Figure 17 The interactive process of the bi-fold overlay brochure shown is equivalent to switching from the smaller A side to the larger C side in terms of a real brochure. Users can also switch the bi-fold overlay brochure from the larger C side to the smaller A side.

[0243] For example, in electronic device displays Figure 17 In the case of the interface shown in Figure c, the user clicks Figure 17 In the diagram c, the area where C3 is located, the C3 surface folds to the left along the second fold line, and the display interface changes from... Figure 17 The switch shown in Figure c is to Figure 17 As shown in Figure b; in electronic device displays Figure 17 In the case of the interface shown in Figure b, the user clicks... Figure 17 In Figure b, the area where C1 is located is folded to the right along the first fold line, and the display interface changes from... Figure 17 The switch shown in Figure b is to Figure 17 As shown in Figure a.

[0244] For ease of understanding, the following will be... Figure 17 The fold shown is described in correspondence with a real physical fold. A physical fold is a sheet of paper with two fold lines. Side A represents the fold when fully folded (or in its initial state). Sides C1, C2, and C3 together represent the fold when fully unfolded (or in its completed state). Side B represents a portion of the fold when partially unfolded. In the initial state, as side A is folded along the corresponding fold line, sides C1 and B gradually become visible. Side C1 is the page on the back of the paper where side A is located. Figure 17 In Figure b, side B is opposite side C1; as side B is folded along the corresponding fold line, sides C2 and C3 gradually appear. Side C3 is the page on the back of the paper where side B is located. In the initial folded state, Figure 17 The C2 plane shown in diagram c is opposite to the C3 plane.

[0245] It should be understood that, Figure 17 In the illustrated embodiment, the user first clicks on the area where side A is located, triggering a folding animation effect on side A, which folds along the first fold line; then clicks on the area where side B is located, triggering a folding animation effect on side B, which folds along the second fold line.

[0246] In some other embodiments, a single user action can trigger both the flipping animation on side A and side B.

[0247] For example, when a user clicks on Figure 17 In the interface shown in Figure a, surface A folds over first, and then the folding of surface A is completed and displayed. Figure 17 After the interface shown in Figure b, side B begins to fold, and the displayed interface changes from... Figure 17 The switch shown in Figure b is as follows Figure 17 As shown in diagram c. Accordingly, the user clicks... Figure 17 In the interface shown in Figure c, surface C3 folds first in any area, and the displayed interface changes after surface C3 has finished folding. Figure 17 The switch shown in Figure c is... Figure 17 As shown in Figure b, then surface C1 begins to fold, and the display interface changes from... Figure 17 The switch shown in Figure b is as follows Figure 17 As shown in Figure a.

[0248] Or, the user clicks on Figure 17 In the interface shown in Figure a, if any area A is flipped first, then surface B will begin to flip, and the displayed interface will change from... Figure 17 The switch shown in Figure a is as follows: Figure 17 As shown in diagram c. Accordingly, the user clicks... Figure 17 In any area of ​​the interface shown in Figure c, surface C2 folds first, followed by surface C1 folding, resulting in a different display interface. Figure 17 The switch shown in Figure c is... Figure 17 As shown in Figure a.

[0249] refer to Figure 18 , Figure 18 This is a schematic diagram of the interface of the double-fold overlay folding page interaction process in one embodiment of this application, as shown below. Figure 18 As shown, the double-fold overlay fold in this embodiment is similar to... Figure 17 The double-fold overlay brooch is basically the same as the one in the previous one. This double-fold overlay brooch includes five folds: side A, side B, side C1, side C2, and side C3. It includes two fold lines: the first fold line is located on the left edge of side A, and the second fold line is located on the right edge of side B. The difference lies in... Figure 18 The diagram illustrates the interactive process of a double-fold overlay page when a user reads an e-book on a tablet.

[0250] Figure 18 Figure a in the diagram is a schematic diagram of the interface of the double-fold overlay brooch in its initial form, as shown below. Figure 18 As shown in Figure a, this interface displays side A, which shows the content of one side of the brochure insert. The user... Figure 18 Clicking on the area containing surface A in diagram a will cause surface A to fold along the first fold line, as shown below. Figure 18 As shown in Figure a, arrow 1801 indicates that the folding direction of surface A along the first fold line is to the left; after the folding is completed, the display interface changes from... Figure 18 The switch shown in Figure a is to Figure 18 As shown in Figure b.

[0251] Figure 18 Figure b shows a schematic diagram of the interface of a double-fold overlay brochure in its partially completed form. Figure 18 The interface shown in Figure b displays side C1 and side B. It's understandable that side B displays the content of one side of the brochure insert.

[0252] Understandably, in Figure 18 The interface shown in Figure b, corresponding to a real folded brochure, is equivalent to side C1, which is invisible to the user after side A is folded over, being displayed on the back of the paper where side A is located. In the initial form of a double-fold overlay brochure, side B is opposite side C1. It can be understood that side B displays the content of one side of the brochure's color insert.

[0253] like Figure 18 As shown in Figure b, the user clicks... Figure 18 In diagram b, the area containing surface B is folded along the second fold line, as shown below. Figure 18 As shown in Figure b, arrow 1802 indicates that the folding direction of side B along the second fold line is to the right; after the folding is completed, the display interface changes from... Figure 18 The switch shown in Figure b is to Figure 18 As shown in Figure c.

[0254] Figure 18 The interface shown in Figure c is a schematic diagram of the double-fold overlay brochure in its completed form. Figure 18 The interface shown in Figure c has sides C1, C2, and C3. Sides C1, C2, and C3 together represent the content of side C of the folded color insert.

[0255] In some other embodiments, Figure 18 The folding order of sides A and B in the image can also have other possibilities, for example, as mentioned above. Figure 17 The extended content related to the folding order of side A and side B in the illustrated embodiment will not be elaborated here.

[0256] In some embodiments, users can also click Figure 18 The area containing surface C3 in diagram c is designed so that surface C3 folds along the second fold line. After surface C3 is folded, the displayed interface changes from... Figure 18 The switch shown in Figure c is to Figure 18 As shown in Figure b; then the user can click Figure 18 The area containing surface C1 in diagram b is designed so that surface C1 folds along the first fold line. After surface C1 is folded, the displayed interface changes from... Figure 18 The switch shown in Figure b is to Figure 18 As shown in Figure a.

[0257] In some embodiments, the user can Figure 18 In the interface shown in Figure c, you can zoom in or out to reduce the size of the displayed double-fold overlay fold. For example... Figure 18 As shown in Figure C, when the user zooms in on the interface, surface C on the display gradually zooms in to... Figure 18 As shown in Figure d, the upper and lower edges of the C-side of the double-fold cover-type fold are displayed at the upper and lower edges of the display area of ​​the electronic device's screen, respectively.

[0258] In some embodiments, the user can Figure 18 In the interface shown in Figure d, drag left or right to display different parts of the C-side of the double-fold overlay brooch. For example... Figure 18 As shown in Figure d, when the user drags to the right in the interface, the C-side of the double-fold overlay fold gradually slides to the right until it displays as shown. Figure 18 The interface shown in Figure e is in Figure 18 In the interface shown in Figure e, the left edge of the C-side of the double-fold overlay fold is displayed at the left edge of the display area of ​​the electronic device's screen; as shown in Figure e. Figure 18 As shown in Figure d, when the user drags to the left in the interface, the B-side of the double-fold overlay brochure gradually slides to the left until it displays as shown. Figure 18 The interface shown in Figure f is in Figure 18 In the interface shown in Figure f, the right edge of side B of the double-fold overlay is displayed on the right edge of the display area of ​​the electronic device's screen.

[0259] It should be understood that Figure 18 The switching process shown in Figures c to d is the process of zooming in on the C-side of the double-fold overlay brooch, while... Figure 18 The switching process from diagram d to diagram e in the diagram and Figure 18 The switching process from diagram d to diagram f is the process of moving the C-side of the double-fold overlay brochure; users can also... Figure 18 d-graph in the middle Figure 18 The e-graph or Figure 18 The image in step f is zoomed out to switch the display interface. Figure 18 Figure c in the diagram.

[0260] To facilitate understanding, the following description, in conjunction with the accompanying drawings, provides an exemplary explanation of the specific processes of folding display methods in different scenarios.

[0261] Figure 19 The diagram shown is a schematic flowchart of an embodiment of this application, where the method is applied to an electronic device with a display screen. Figure 19 As shown, the process includes the following steps: S1910-S1940.

[0262] S1910, Display the first page, which is a folded page.

[0263] In the embodiments of this application, the first page can be any form of a folded page. For example, the first page can be a page in its initial form when the folded page is in a fully folded state, a page in a partially unfolded state, or a page in its completed form when the folded page is in a fully unfolded state.

[0264] It should be understood that, regardless of the page format, the first page is always displayed on the same page to ensure the integrity of the folded page display.

[0265] S1920, receives the user's first action on the first page.

[0266] For example, the first operation can be a click operation on the first page, such as a single click or double click operation; or the first operation can be a swipe operation or a drag operation on the first page, or the first operation can be a click operation, swipe operation or drag operation on an area of ​​the display screen of the electronic device other than the first page; for another example, the first operation can be a press operation on a physical button of the electronic device. This application does not elaborate on or limit the specific method of the first operation.

[0267] S1930, in response to the first operation, fold the first page or a portion of the first page along the first fold line on the first page.

[0268] In this embodiment of the application, the page is folded along the fold line, or it can be described as the page folding around the fold line, that is, the process of page folding is the process of the page rotating around the fold line as an axis.

[0269] The following example uses an analogy to illustrate the process of a page folding along a fold line.

[0270] As can be understood, folding a page along a fold line is similar to turning a page in a physical book. The page is analogous to a single sheet of paper in the book, the fold line to the spine, and folding the page along the fold line is like turning a single sheet of paper along the spine of the book. Each fold results in the final result of rotating a sheet of paper 180° along the spine, thus changing the view from one page to the reverse side of that page, and then to the page opposite that reverse side.

[0271] In some embodiments, in response to the first operation, a portion of the first page folds along a fold line on the first page. For example, see [reference needed]. Figure 9 The specific description of the switching process from image a to image b in the text is as follows: The first page can be page A, which includes pages A1 and A2; the first operation can be the user clicking on the area of ​​page A1; in response to the first operation, a portion of the first page (i.e., page A1) moves along... Figure 9 The first fold line shown in Figure a flips to the left.

[0272] In other embodiments, in response to the first operation, the first page folds along a fold line on the first page. For example, see [reference needed]. Figure 13 The specific description of the switching process from image A to image B in the text is as follows: the first page can be page A; the first operation can be the user clicking on the area of ​​page A; in response to the first operation, the first page (i.e., page A) moves along... Figure 13 The broken line shown in Figure a flips to the left.

[0273] S1940, after folding along the first fold line, a second page is displayed. The content displayed on the second page is different from that of the first page, or the content displayed on the second page is at least partially the same as that of the first page. The aspect ratio of the second page is different from that of the first page.

[0274] The aspect ratio refers to the ratio of the length of the page along the display area of ​​the screen to the width of the page along the display area of ​​the screen.

[0275] It should be understood that the display area of ​​a display screen refers to the area on the display screen actually used to display images or content. For example, the area of ​​the display area is less than or equal to the area of ​​the display screen.

[0276] It is understood that the aspect ratio of a page in this embodiment is not the ratio of length to width in the conventional sense, but rather the ratio of the length of the page along the display area of ​​the screen to the width of the page along the display area of ​​the screen.

[0277] It is understandable that when a page is folded along a fold line, the page displayed will change in at least one of the two directions of the display area on the screen: the length direction and the width direction. Therefore, the aspect ratio of the folded page will be different from that of the page before folding.

[0278] For example, Figure 9 In Figure a, the aspect ratio of surface A refers to the ratio of its length along the left-right direction to its length along the top-bottom direction, which is r1. Figure 9 The aspect ratio of side B shown in Figure c refers to the ratio of the length of side B along the left-right direction to the length of side B along the up-down direction, which is r2. Assuming r1 = 1.1, then r2 = 2.2.

[0279] For example, refer to Figure 9 The specific description of the switching process from image a to image b in the text. The first page can be side A, which includes side A1 and side A2; the first fold line along which the first page is flipped is the... Figure 9 The first fold line shown in Figure a, the view after surface A1 is folded along the first fold line. Figure 9 The page shown in Figure b is the second page, which displays side A2. The first page also displays side A2, so in this embodiment, the content displayed on the second page is partially the same as that displayed on the first page. The aspect ratio of the first page is r1 = 1.1, and the aspect ratio of the second page is r2 = 2.2; therefore, the aspect ratio of the second page is different from that of the first page.

[0280] For example, refer to Figure 17 The specific description of the switching process from image a to image b in the text, where the first page can be page A; the first fold line along which the first page is flipped is the... Figure 17 The first fold line shown in Figure a is the fold line along which surface A is folded to reveal the following. Figure 17 The page shown in Figure b is... Figure 17 The page shown in Figure b is the second page. The second page displays sides C1 and B, while the first page displays side A. Therefore, in this embodiment, the content displayed on the second page is different from the content displayed on the first page. The aspect ratio of the first page is r1 = 0.73, and the aspect ratio of the second page is r2 = 1.46; therefore, the aspect ratio of the second page is different from that of the first page.

[0281] In some embodiments, the first fold line coincides with the first edge of the first page, and the first operation represents the operation of unfolding the page. For example, refer to... Figure 9 The specific description of the switching process from image a to image b in the text. The first page can be side A, which includes side A1 and side A2; the first fold line along which the portion of the first page (i.e., side A1) is folded is the... Figure 9 The first fold line shown in Figure a coincides with the left side of surface A. At this point, the first operation is to unfold the fold.

[0282] In other embodiments, the first fold line is located in the middle of the first page, and the first operation represents a folding operation. For example, see reference... Figure 13 The specific description of the switching process from image b to image a is as follows: At this time, the first page includes pages B1 and B2; the first fold line along which part of the first page (i.e., page B1) is folded is... Figure 13 The broken line shown in Figure b is located in the middle of the first page. At this point, the first operation is to fold the page.

[0283] The folding display method provided in this application allows users to trigger the folding of the first page along the corresponding fold line with a simple operation, followed by the second page. The first and second pages are each a single, unified page, similar to a page in a book, representing one folded form of the folded page. By displaying each form of the folded page as a single unified page, there is no need to display images of the same folded form on different pages, thus ensuring the integrity of the folded page displayed on electronic devices. This display method simulates the unfolding or folding process of a real folded page through the folding process. This method guarantees the interactivity and integrity of the folded page displayed on electronic devices, improving the user's reading experience.

[0284] In some possible implementations, the folding display method further includes: receiving a second operation from the user on the second page, the second operation representing a folding operation; responding to the second operation, folding a first portion of the second page along a second fold line on the second page, the folding direction along the second fold line being opposite to the folding direction along the first fold line; and displaying the first page after folding along the second fold line. In this implementation, the user can perform a folding operation (i.e., the second operation) on the unfolded second page, thereby folding the second page back to the initial first page, further improving the similarity between folding interaction in electronic devices and real folding interaction, and enhancing the user experience. Since the folding direction along the second fold line is opposite to the folding direction along the first fold line, the folding operation after the second operation is exactly the opposite of the unfolding process of the first operation; therefore, the second operation can be regarded as the inverse operation of the first operation.

[0285] For example, refer to Figure 13 The process of switching from image b to image a in the image can be viewed on the first page. Figure 13 The second page is shown as side A in Figure a. Figure 13 The diagram in Figure b shows surface B, which includes surfaces B1 and B2. The second operation allows the user to... Figure 13 Clicking on the area containing surface B1 in the diagram (b) will open the first part of the second page, which is surface B1, and the second line will be... Figure 13 In Figure b, the second fold line causes surface B1 to fold to the right along this line, resulting in a different display interface. Figure 13 The switching shown in Figure b Figure 13 As shown in Figure a, the first page is displayed; the folding direction of side A along the first fold line is to the left, and the folding direction of side B1 along the second fold line is to the right. The two folding directions are opposite.

[0286] In some possible implementations, the folding display method further includes: receiving a third operation from the user on the second page, where the third operation represents a folding operation; responding to the third operation, folding the second portion of the second page along a second fold line on the second page, the folding direction along the second fold line being the same as the folding direction along the first fold line; and displaying a third page after folding along the second fold line, the aspect ratio of the third page being different from that of the second page. In this implementation, the user can perform a folding operation (i.e., the third operation) on the unfolded second page, thereby folding the second page into a third page, making the folding interaction richer and more complete.

[0287] For example, refer to Figure 13 In the middle, the first page can be Figure 13 The second page is shown as side A in Figure a. Figure 13 The diagram shows surface B, which includes surfaces B1 and B2. The third operation allows the user to... Figure 13 Clicking on the area containing surface B2 in the diagram (b) will open the second section of the second page, which is surface B2. The second broken line will then be... Figure 13 In Figure b, the second fold line leads to page B2. After the page folds to the left along this second fold line, the display switches to show the third page. Figure 13 (Not shown in the image) From the perspective of the physical fold, the third page is the page behind page B2; the folding direction of side A along the first fold line is to the left, and the folding direction of side B2 along the second fold line is also to the left. The two folding directions are the same.

[0288] For example, the second page displays different content than the first page, the third page displays different content than the second page, and the third page displays different content than the first page. In this implementation, different pages of the folded page can display different content, that is, the content displayed by the folded page is different in different forms, which enhances the interest of the folded page display.

[0289] It should be understood that different pages of a brochure may sometimes display the same content, and the specific content displayed on the brochure can be designed as needed, which will not be elaborated here.

[0290] In some implementations, the first page folds along a first fold line, and the second page displays different content from the first page. The method further includes: receiving a fourth user action on the second page, where the fourth action indicates an unfolding operation; responding to the fourth action, folding a portion of the second page along a third fold line, where the third fold line coincides with one edge of the second page; and displaying a fourth page after folding along the third fold line, where the aspect ratio of the fourth page differs from that of the second page, and the content displayed on the fourth page is partially the same as that on the second page. In this implementation, after the first unfolding operation, the fourth operation further unfolds the page, and multiple unfolding operations ensure that the page is fully unfolded, thus guaranteeing the authenticity and completeness of the unfolding interaction.

[0291] For example, refer to Figure 17 The specific description of the switching process from image a to image b, and from image b to image c, is as follows: the first page can be page A, and the image displayed after page A is folded along the first fold line. Figure 17 The page shown in Figure b is the second page, which displays side C1 and side B; side B is a portion of the second page, and the fourth operation allows the user to... Figure 17 Clicking on the area containing side B in the image b will result in the third line on the second page. Figure 17 The second broken line in graph b, Figure 17 In the diagram, side C is the fourth page, which includes sides C1 and C2. The portion of the fourth page that shares content with the second page is side C1.

[0292] In some embodiments, the folding direction along the third fold line is opposite to the folding direction along the first fold line. In this implementation, the two unfolding operations are folded in opposite directions, enabling the double-fold overlay fold to open to both sides. For example, in Figure 17 In the illustrated embodiment, the first operation is for the user to... Figure 17 Clicking on the area containing surface A in diagram a will cause surface A to move along the first polyline (i.e., ... Figure 17 The first fold line in diagram a) folds to the left, and the user... Figure 17 The click operation on the area containing face B in the diagram b is the fourth operation. After the fourth operation, face B will be moved along the third polyline (i.e. Figure 17 The second fold line in diagram b folds to the right.

[0293] In some other embodiments, the folding direction along the third fold line is the same as the folding direction along the first fold line. In this implementation, the two unfolding operations are folded in the same direction, enabling the double-fold overlay page to be opened by rolling.

[0294] In some embodiments, a fifth operation by the user on the fourth page is received, indicating an operation to unfold the fold. In response to the fifth operation, a portion of the fourth page is folded along a fourth fold line on the fourth page, the fourth fold line coinciding with one edge of the fourth page, and the folding direction along the fourth fold line is the same as the folding direction along the third fold line. After folding along the fourth fold line, a fifth page is displayed, the aspect ratio of the fifth page being different from that of the fourth page, and the content displayed on the fifth page is the same as that on the fourth page. In this implementation, the three unfolding operations are folded in the same direction, enabling the process of opening a three-fold fold page by scrolling.

[0295] In some implementations, the first page includes a first part page and a second part page. The first part page of the first page is folded along a first fold line, and the second page includes the first part page. The content displayed on the first part page of the second page is the same as the content displayed on the second part page of the first page. The method further includes: receiving a sixth operation from the user on the second page, the sixth operation indicating an operation to unfold the page; responding to the sixth operation, folding the first part page of the second page along a fifth fold line on the second page, the fifth fold line coinciding with one edge of the first part page of the second page; after folding along the fifth fold line, displaying a sixth page, the aspect ratio of the sixth page is different from that of the second page, and the content displayed on the sixth page is partially the same as that displayed on the second page. In this implementation, the first part page of the first page folds along the first fold line, and the first part page of the second page folds along the fifth fold line, and the content displayed on the first part page of the second page is the same as that displayed on the second part page of the first page, thus achieving a double-fold interaction similar to a window-style folding page. In this implementation, the folding direction along the fifth fold line is different from the folding direction along the first fold line. The different folding directions can include folding directions that are opposite or folding directions that are perpendicular.

[0296] In some implementations, the folding direction along the fifth fold line is opposite to the folding direction along the first fold line. This implementation allows for window-style fold line interaction. For example, see [reference]. Figure 9 The specific description of the switching process from image a to image b, and from image b to image c, is as follows: The first page can be page A, which includes pages A1 and A2: page A1 is the first part of the first page, and page A2 is the second part of the first page; the second page is... Figure 9 The page shown in Figure b is a second page that includes sections of pages B1 and B2, and page A2, where page A2 is the first part of the second page; the sixth operation allows the user to... Figure 9 The click operation in the area containing A2 in graph b, the fifth line is Figure 9 The second broken line in graph b; page six is... Figure 9 In diagram c, surface B includes surfaces B1, B2, and B3. The folding direction along the fifth fold line is to the right, while the folding direction along the first fold line is to the left.

[0297] In some implementations, the folding direction along the fifth fold line is perpendicular to the folding direction along the first fold line. This implementation can achieve other double-fold interactions similar to window-style folding. For example, the folding process in this implementation is... Figure 9 The switching process from diagram a to diagram b in this implementation is similar to, but not exactly the same as, that in this implementation. Figure 9 The embodiments shown are similar in that the first page can be side A, which includes side A1 and side A2: side A1 is the first part of the first page, and side A2 is the second part of the first page; the second page is... Figure 9 The page shown in Figure b is a second page that includes sections of pages B1 and B2, and page A2, where page A2 is the first part of the second page; the sixth operation allows the user to... Figure 9 The click operation of the area containing plane A2 in image b; in this implementation method, with Figure 9 The difference between the illustrated embodiment and the fifth fold line is that the fifth fold line is not... Figure 9 The right side of face A2 in the middle, but for Figure 9 The sixth page is the page obtained by folding the top edge of page A2 upwards. In this case, the folding direction along the fifth fold line is upwards. Alternatively, the folding direction along the fifth fold line can also be downwards. Since the folding direction along the first fold line is to the left, regardless of whether the folding direction along the fifth fold line is upwards or downwards, it can be considered that the folding direction along the fifth fold line is perpendicular to the folding direction along the first fold line.

[0298] In some implementations, the content displayed on the second page differs from that on the first page. The first page includes a first part and a second part. The first part of the first page is folded along a first fold line. The method further includes: in response to a first operation, folding the second part of the first page along a sixth fold line on the first page, the sixth fold line coinciding with the second edge of the first page; the second page is displayed after folding along the first and sixth fold lines. In this implementation, both folds in a window-style fold or a similar double-fold can be triggered by the first operation, enriching the interaction methods of double-fold folds similar to window-style folds and improving the user experience.

[0299] For example, such as Figure 9 The fold shown is a window fold. In its initial folded state, the first page of the window fold is rectangular. Similar double folds of the window fold can display pages of other shapes in their initial folded state, such as trapezoids, hexagons, octagons, or irregular polygons.

[0300] In some implementations, the first and second edges of the first page are two opposite and parallel edges, and the folding direction along the sixth fold line is opposite to the folding direction along the first fold line. In this implementation, the first page has two opposite and parallel edges; that is, the first page can be a polygon with two opposite and parallel edges. For example, the shape of the first page can be a rectangle, hexagon, octagon, or an irregular polygon with opposite and parallel edges. In this implementation, the folding directions of the two parts of the first page are opposite. For example, refer to... Figure 9 The specific description of the transition process from image a to image c is as follows: The first page can be page A, which includes pages A1 and A2: page A1 is the first part of the first page, and page A2 is the second part of the first page; the first line is... Figure 9 The first broken line shown in Figure a, and the sixth broken line are... Figure 9 The second fold line is shown in Figure a; in this case, after the user clicks on side A, side A1 folds along the first fold line, and side A2 folds along the second fold line, resulting in the second page. Figure 9 Surface B is shown in Figure c.

[0301] It is understandable that similar folds to window-style brochures can include brochures that, when folded, form polygons other than rectangles, such as trapezoids, hexagons, octagons, or irregularly shaped polygons. Additionally, similar folds to window-style brochures can also be... Figure 9 Based on the fold shown, the window line is positioned slightly to the left or right.

[0302] For example, the two fold lines of a window brochure or a similar brochure are the two parallel edges of the brochure.

[0303] In some implementations, the first page folds along a first fold line, and the second page displays different content from the first page. The method further includes: receiving a seventh user action on the second page, where the seventh action indicates an unfolding operation; responding to the seventh action, folding the second page along a seventh fold line in the second page, with the folding direction opposite to that along the first fold line, and the seventh fold line coinciding with one edge of the second page; after folding along the seventh fold line, displaying a seventh page with a different aspect ratio than the second page, and displaying different content. This implementation can achieve Z-shaped double-fold interaction, increasing the ways to interact with the folding pages and improving the user experience.

[0304] In some implementations, the method further includes: receiving an eighth operation from the user on the seventh page, where the eighth operation represents an unfolding operation; responding to the eighth operation, folding the seventh page along the eighth fold line in the seventh page, the folding direction along the eighth fold line being opposite to the folding direction along the seventh fold line, and the eighth fold line coinciding with one edge of the seventh page; after folding along the eighth fold line, displaying the eighth page, which has a different aspect ratio than the seventh page, and displaying different content on the eighth and seventh pages. This implementation can realize the interaction of accordion-style folding, increasing the ways of folding interaction and improving the user experience.

[0305] In some implementations, the first page folds along a first fold line, and the second page displays different content from the first page. The method further includes: receiving a ninth user action on the second page, where the ninth action represents an unfolding operation; responding to the ninth action, folding the second page along the ninth fold line, where the ninth fold line coincides with the first edge of the second page; after folding along the ninth fold line, displaying the ninth page, whose aspect ratio differs from the second page, and whose content differs from the second page; the first edge of the second page coincides with the third edge of the first page, and the third edge of the first page and the first edge of the first page are adjacent and perpendicular to each other. This implementation can achieve a map-style folding interaction, increasing the ways to interact with folding pages and improving the user experience. For example, the shape of the first page is a shape including two perpendicular edges, such as a rectangle, a quarter circle, or an irregular shape. When the first page is a rectangle, the folding in this implementation is a traditional map-style (i.e., as shown in the image). Figure 1 (The map-style fold-out shown).

[0306] In some implementations, the second page includes a first part page and a second part page. The method further includes: receiving a tenth operation from the user on the second page, the tenth operation indicating an unfolding operation; responding to the tenth operation, folding the first part page of the second page along the tenth fold line in the second page, the tenth fold line coinciding with the first edge of the second page; after folding along the tenth fold line, displaying the tenth page, the aspect ratio of the tenth page being different from that of the second page, and the content displayed on the first part page of the tenth page being the same as the content displayed on the second part page of the second page; receiving an eleventh operation from the user on the tenth page, the eleventh operation indicating an unfolding operation; responding to the eleventh operation, folding the first part page of the tenth page along the eleventh fold line in the tenth page, the eleventh fold line coinciding with one edge of the first part page of the tenth page; after folding along the eleventh fold line, displaying the eleventh page, the aspect ratio of the eleventh page being different from that of the tenth page, and the content displayed on the eleventh page being different from that of the tenth page; the folding direction along the tenth fold line is different from the folding direction along the eleventh fold line. This implementation allows for a three-fold brochure interaction, enhancing the user experience. For example, the brochure can be a double-door style brochure. For instance, folding along the tenth fold line and folding along the eleventh fold line both involve folding portions of the second page. Folding along the tenth fold line and folding along the eleventh fold line requires two operations to trigger.

[0307] In some implementations, the folding direction along the tenth fold line is opposite to that along the eleventh fold line; the folding direction along the tenth fold line is the same as that along the first fold line, or the folding direction along the eleventh fold line is the same as that along the first fold line. Because the folding direction along the tenth fold line is the same as that along the first fold line, or the folding direction along the eleventh fold line is the same as that along the first fold line, a two-door tri-fold page interaction can be achieved, improving the user experience.

[0308] In some implementations, the second page includes a first part page and a second part page. The method further includes: receiving a twelfth user operation on the second page, the twelfth operation representing an unfolding operation; in response to the twelfth operation, folding the first part page of the second page along the twelfth fold line of the second page, and folding the second part page of the second page along the thirteenth fold line of the second page, the twelfth fold line coinciding with the first edge of the second page, and the thirteenth fold line coinciding with the second edge of the second page; after folding along the twelfth and thirteenth fold lines, displaying the twelfth page, the aspect ratio of the twelfth page being different from that of the second page; the folding direction along the twelfth fold line is different from the folding direction along the thirteenth fold line. This implementation can achieve three-fold page interaction, improving the user experience. For example, the page can be a double-door-like fold, for example, folding along the tenth fold line and folding along the eleventh fold line are both partial page folds of the second page, and folding along the tenth fold line and folding along the eleventh fold line can be triggered by the same operation.

[0309] In some implementations, the folding direction along the twelfth fold line is opposite to that along the thirteenth fold line; the folding direction along the twelfth fold line is the same as that along the first fold line, or the folding direction along the thirteenth fold line is the same as that along the first fold line. This implementation can achieve the interaction of a double-door fold in a tri-fold brochure, improving the user experience. For example, the brochure can be a similar double-door fold, such as folding along the tenth fold line and folding along the eleventh fold line, both of which involve folding a portion of the second page. Folding along the tenth fold line and folding along the eleventh fold line requires two operations to trigger.

[0310] In some implementations, the first page folds along the first fold line, and the second page displays different content from the first page. The first part of the second page and the second part of the second page together form the second page. This implementation can achieve... Figure 1 The interactive features of the three-fold, double-door brochure.

[0311] In other embodiments, folding along the first fold line can be a folding of a portion of the first page, or there can be a gap between a first portion of the second page and a second portion of the second page.

[0312] In some implementations, the first target page is a rectangular page, with at least two opposite edges displayed along the edge of the display area of ​​the screen. The first target page includes at least one of the following: a first page and at least one page displayed after any folding. In this implementation, the first target page refers to any page of the folded page, such as the first page, second page, third page, etc. In the displayed folded pages, at least one page is displayed along the edge of the display area of ​​the screen, eliminating the need for white space and making the overall page display closer to the effect of a real folded page, thus improving its aesthetics.

[0313] In some implementations, the first target page can be enlarged, reduced, or moved within the display area of ​​the screen. The first target page includes at least one of the following: a first page and at least one page displayed after any folding. In this implementation, the first target page refers to any page of the folded page, such as the first page, second page, third page, etc. Among the displayed folded pages, at least one page can be zoomed or moved, enhancing the interactive experience.

[0314] In some implementations, the method further includes: receiving a thirteenth operation from a user on a first target page, wherein the first target page is either the first page or any page displayed after being arbitrarily flipped; and in response to the thirteenth operation, displaying a second target page, wherein the second target page is an enlarged version of the first target page, a reduced version of the first target page, or a page after the first target page has been moved within the display area of ​​the display screen.

[0315] It should be understood that the above description is merely to help those skilled in the art better understand the embodiments of this application, and is not intended to limit the scope of the embodiments of this application. Based on the examples given above, those skilled in the art can obviously make various equivalent modifications or changes. For example, some steps in the various embodiments of the above methods may be unnecessary, or new steps may be added, etc. Alternatively, any combination of two or more of the above embodiments may be used. Such modifications, changes, or combinations also fall within the scope of the embodiments of this application.

[0316] It should also be understood that the above description of the embodiments of this application focuses on highlighting the differences between the various embodiments. Any similarities or differences not mentioned can be referred to each other. For the sake of brevity, they will not be repeated here.

[0317] It should also be understood that the methods, situations, categories, and classifications of embodiments in this application are for the convenience of description only and should not constitute a special limitation. Various methods, categories, situations, and features in embodiments can be combined without contradiction.

[0318] It should also be understood that the various numerical designations used in the embodiments of this application are merely for descriptive convenience and are not intended to limit the scope of the embodiments of this application. The order of the process numbers described above does not imply the order of execution; the execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of this application.

[0319] It should also be understood that, in the various embodiments of this application, unless otherwise specified or in case of logical conflict, the terms and / or descriptions between different embodiments are consistent and can be referenced by each other, and the technical features in different embodiments can be combined to form new embodiments according to their inherent logical relationships.

[0320] The above combination Figures 1 to 19 The embodiments of the e-book display system, folding display method, and application scenarios of the folding display method provided in this application have been described. The electronic device provided in the embodiments of this application is described below.

[0321] This embodiment can divide the various devices (including the aforementioned electronic devices) into functional modules based on the above method embodiments. For example, each function can be divided into its own functional modules, or two or more functions can be integrated into one processing module. The integrated modules can be implemented in hardware. It should be noted that the module division in this embodiment is illustrative and only represents one logical functional division; other division methods may be used in actual implementation.

[0322] It should be noted that the relevant content of each step involved in the above method embodiments can be referenced from the functional description of the corresponding functional module, and will not be repeated here.

[0323] The electronic device provided in this application embodiment is used to execute the process provided in any of the above embodiments, and therefore can achieve the same effect as the above implementation method. When using integrated units, the electronic device may include a processing module, a storage module, and a communication module. The processing module can be used to control and manage the actions of the electronic device. For example, it can be used to support the electronic device in executing the steps executed by the processing unit. The storage module can be used to support the storage of program code and data, etc. The communication module can be used to support communication between the electronic device and other devices.

[0324] The processing module can be a processor or a controller. It can implement or execute various exemplary logic blocks, modules, and circuits described in conjunction with the disclosure of this application. The processor can also be a combination of functions that implement computing capabilities, such as a combination of one or more microprocessors, a combination of digital signal processing (DSP) and a microprocessor, etc. The storage module can be a memory. The communication module can specifically be a radio frequency circuit, a Bluetooth chip, a Wi-Fi chip, or other devices that interact with other electronic devices.

[0325] This application provides an electronic device for performing the steps executed by the first electronic device in the folding display method provided in this application, or for performing the steps executed by the second electronic device in the folding display method provided in this application. The electronic device in this application can be a handheld device (e.g., a mobile phone terminal), various portable laptops, various tablet computers, smart cameras, wearable devices, etc., and this application is not limited to these.

[0326] For example, Figure 20 A schematic diagram of the hardware structure of electronic device 2000 is shown. (For example...) Figure 20 As shown, the electronic device 2000 may include a processor 2010, an external memory interface 2020, an internal memory 2030, a universal serial bus (USB) interface 2040, a charging management module 2050, a power management module 2051, a battery 2052, an antenna 1, an antenna 2, a wireless communication module 2060, an e-book display module 2070, and a display screen 2080, which is used to display pictures, photos, text, videos, etc. to the user.

[0327] It is understood that the structures illustrated in the embodiments of this application do not constitute a specific limitation on the electronic device 2000. In other embodiments of this application, the electronic device 2000 may include more or fewer components than illustrated, or combine some components, or split some components, or have different component arrangements. The illustrated components may be implemented in hardware, software, or a combination of software and hardware.

[0328] Processor 2010 may include one or more processing units. For example, processor 2010 may include an application processor (AP), a modem processor, a graphics processing unit (GPU), an image signal processor (ISP), a controller, a video codec, a digital signal processor (DSP), a baseband processor, and / or a neural network processing unit (NPU). Different processing units may be independent components or integrated into one or more processors. In some embodiments, electronic device 2000 may also include one or more processors 2010. The controller can generate operation control signals based on instruction opcodes and timing signals to control instruction fetching and execution.

[0329] In some embodiments, the processor 2010 may include one or more interfaces. These interfaces may include an inter-integrated circuit (I2C) interface, an integrated circuit sound (I2S) interface, a pulse code modulation (PCM) interface, a universal asynchronous receiver / transmitter (UART) interface, a mobile industry processor interface (MIPI), a general-purpose input / output (GPIO) interface, a SIM card interface, and / or a USB interface, etc. The USB interface 2040 is a USB standard-compliant interface, specifically a Mini USB interface, a Micro USB interface, a USB Type-C interface, etc. The USB interface 2040 can be used for data transfer between the electronic device 2000 and peripheral devices.

[0330] It is understood that the interface connection relationships between the modules illustrated in the embodiments of this application are merely illustrative and do not constitute a structural limitation on the electronic device 2000. In other embodiments of this application, the electronic device 2000 may also employ different interface connection methods or combinations of multiple interface connection methods as described in the above embodiments.

[0331] The wireless communication function of the electronic device 2000 can be realized through antenna 1, antenna 2 and wireless communication module 2060, etc.

[0332] The wireless communication module 2060 can provide solutions for wireless communication applications on the electronic device 2000, including Wi-Fi (including Wi-Fi sensing and Wi-Fi AP), Bluetooth (BT), and wireless data transmission modules (e.g., 2033MHz, 868MHz, 915MHz). The wireless communication module 2060 can be one or more devices integrating at least one communication processing module. The wireless communication module 2060 receives electromagnetic waves via antenna 1 or antenna 2 (or antenna 1 and antenna 2), filters and frequency-modulates the electromagnetic wave signals, and sends the processed signal to the processor 2010. The wireless communication module 2060 can also receive signals to be transmitted from the processor 2010, frequency-modulate and amplify them, and then convert them into electromagnetic waves for radiation via antenna 1 or antenna 2. For example, the electronic device 2000 can communicate with other electronic devices through the wireless communication module 2060.

[0333] The external storage interface 2020 can be used to connect external storage cards, such as Micro SD cards, to expand the storage capacity of the electronic device 2000. The external storage card communicates with the processor 2010 through the external storage interface 2020 to perform data storage functions. For example, music, video, and other files can be saved on the external storage card.

[0334] Internal memory 2030 can be used to store one or more computer programs, which include instructions. Processor 2010 can execute the instructions stored in internal memory 2030, thereby causing electronic device 2000 to perform the methods provided in some embodiments of this application, as well as various applications and data processing. Internal memory 2030 may include a code storage area and a data storage area. The code storage area may store the operating system. The data storage area may store data created during the use of electronic device 2000. In addition, internal memory 2030 may include high-speed random access memory, and may also include non-volatile memory, such as one or more disk storage components, flash memory components, universal flash storage (UFS), etc. In some embodiments, processor 2010 can execute instructions stored in internal memory 2030 and / or instructions stored in memory disposed in processor 2010, thereby causing electronic device 2000 to perform the methods provided in embodiments of this application, as well as other applications and data processing.

[0335] This application also provides a chip system, such as... Figure 21 As shown, the chip system includes at least one processor 2101 and at least one interface circuit 2102. The processor 2101 and the interface circuit 2102 are interconnected via lines. For example, the interface circuit 2102 can be used to receive signals from other devices (e.g., the memory of any of the aforementioned electronic devices). As another example, the interface circuit 2102 can be used to send signals to other devices (e.g., the processor 2101). Exemplarily, the interface circuit 2102 can read instructions stored in the memory and send those instructions to the processor 2101. When the instructions are executed by the processor 2101, the electronic device can perform the various steps performed by any of the electronic devices in the above embodiments (e.g., the electronic device can be a handheld device (e.g., a mobile phone terminal), various portable laptops, various tablet computers, smart cameras, wearable devices, etc.). Of course, the chip system may also include other discrete components, which are not specifically limited in this application embodiment.

[0336] This application also provides an apparatus included in an electronic device, which has the function of implementing the behavior of the electronic device in any of the above embodiments. This function can be implemented by hardware or by hardware executing corresponding software. The hardware or software includes at least one module or unit corresponding to the above function.

[0337] It should also be understood that the division of units in the above device is merely a logical functional division. In actual implementation, they can be fully or partially integrated into a single physical entity, or they can be physically separated. Furthermore, all units in the device can be implemented entirely through software calls from processing elements; all units can be implemented entirely in hardware; or some units can be implemented through software calls from processing elements, while others are implemented in hardware. For example, each unit can be a separate processing element, or it can be integrated into a chip within the device. Alternatively, it can be stored as a program in memory, and its function can be called and executed by a processing element within the device. Here, the processing element can also be called a processor, which can be an integrated circuit with signal processing capabilities. In the implementation process, each step of the above method or each of the above units can be implemented through integrated logic circuits in the processor element or through software calls from processing elements. In one example, a unit in any of the above devices can be one or more integrated circuits configured to implement the above methods, such as one or more application-specific integrated circuits (ASICs), or one or more digital signal processors (DSPs), or one or more field-programmable gate arrays (FPGAs), or a combination of at least two of these forms of integrated circuits. As another example, when a unit in the device can be implemented in the form of a processing element scheduler, the processing element can be a general-purpose processor, such as a central processing unit (CPU) or other processor capable of calling programs. Furthermore, these units can be integrated together to implement a system-on-a-chip (SOC).

[0338] This application also provides a computer-readable storage medium for storing computer program code, the computer program including steps for executing or displaying an interface of an electronic device in any of the embodiments provided in this application. The readable medium may be a read-only memory (ROM) or a random access memory (RAM), and this application does not limit this.

[0339] This application also provides a computer program product including instructions that, when executed, cause an electronic device to perform the steps of executing or displaying an interface of any of the above embodiments.

[0340] This application also provides a graphical user interface for an electronic device, the electronic device having a display screen, a camera, a memory, and one or more processors, the one or more processors being used to execute one or more computer programs stored in the memory, the graphical user interface including a graphical user interface displayed when the electronic device performs the steps performed by the electronic device as in any of the above embodiments.

[0341] In this embodiment, the electronic device, apparatus, computer-readable storage medium, computer program product, or chip system are all used to execute the corresponding methods provided above. Therefore, the beneficial effects they can achieve can be referred to the beneficial effects in the corresponding methods provided above, and will not be repeated here.

[0342] It is understood that the aforementioned electronic devices, etc., include hardware structures and / or software modules corresponding to the execution of each function in order to achieve the above-mentioned functions. Those skilled in the art should readily recognize that, based on the units and algorithm steps of the various examples described in conjunction with the embodiments disclosed herein, the embodiments of this application can be implemented in hardware or a combination of hardware and computer software. Whether a function is executed by hardware or by computer software driving hardware depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementation should not be considered beyond the scope of the embodiments of this application.

[0343] This application embodiment can divide the above-mentioned electronic device into functional modules according to the method example described above. For example, each function can be divided into its own functional module, or two or more functions can be integrated into one processing module. The integrated module can be implemented in hardware or as a software functional module. It should be noted that the module division in this application embodiment is illustrative and only represents one logical functional division. In actual implementation, there may be other division methods.

[0344] Through the above description of the embodiments, those skilled in the art will clearly understand that, for the sake of convenience and brevity, only the division of the above functional modules is used as an example. In practical applications, the above functions can be assigned to different functional modules as needed, that is, the internal structure of the device can be divided into different functional modules to complete all or part of the functions described above. The specific working process of the system, device, and unit described above can be referred to the corresponding process in the foregoing method embodiments, and will not be repeated here.

[0345] In the embodiments of this application, the functional units can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit can be implemented in hardware or as a software functional unit.

[0346] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solutions of the embodiments of this application, essentially, or the parts that contribute to the prior art, or all or part of the technical solutions, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) or processor to execute all or part of the steps of the methods described in the various embodiments of this application. The aforementioned storage medium includes various media capable of storing program code, such as flash memory, portable hard disk, read-only memory, random access memory, magnetic disk, or optical disk.

[0347] The above is only a specific embodiment of the present application, but the scope of protection of this application is not limited to this. Any changes or substitutions within the technical scope disclosed in this application should be included in the scope of protection of this application. Therefore, the scope of protection of this application should be based on the scope of protection of the claims.< / flippage>

Claims

1. A folding display method, characterized in that, Applied to electronic devices having a display screen, the method includes: The first page is displayed, which is a single page in a folded brochure. Receive the user's first operation on the first page; In response to the first operation, the first page or a portion of the first page is folded along the first fold line on the first page; After folding along the first fold line, a second page is displayed. The content displayed on the second page is different from that of the first page, or the content displayed on the second page is at least partially the same as that of the first page. The aspect ratio of the second page is different from that of the first page. The aspect ratio represents the ratio of the dimension of the page along the length direction of the display area of ​​the display screen to the dimension of the page along the width direction of the display area of ​​the display screen.

2. The method according to claim 1, characterized in that, The first fold line coincides with the first edge of the first page, and the first operation represents the operation of unfolding the page.

3. The method according to claim 2, characterized in that, The method further includes: Receive a second operation from the user on the second page, the second operation representing a page folding operation; In response to the second operation, the first part of the second page is folded along the second fold line on the second page, and the folding direction along the second fold line is opposite to the folding direction along the first fold line. After folding along the second fold line, the first page is displayed.

4. The method according to claim 2, characterized in that, The method further includes: Receive a third operation from the user on the second page, wherein the third operation represents a page folding operation; In response to the third operation, the second portion of the second page is folded along the second fold line on the second page, and the folding direction along the second fold line is the same as the folding direction along the first fold line. After folding along the second fold line, a third page is displayed, the aspect ratio of which is different from that of the second page.

5. The method according to claim 4, characterized in that, The second page displays content different from the first page, the third page displays content different from the second page, and the third page displays content different from the first page.

6. The method according to claim 2, characterized in that, The first page folds along the first fold line, and the second page displays different content from the first page. The method further includes: Receive a fourth operation from the user on the second page, the fourth operation representing an operation to expand the page; In response to the fourth operation, a portion of the second page is folded along a third fold line on the second page, the third fold line coinciding with one edge of the second page; After folding along the third fold line, a fourth page is displayed. The aspect ratio of the fourth page is different from that of the second page, and the content displayed on the fourth page is the same as that displayed on the second page.

7. The method according to claim 6, characterized in that, The folding direction along the third fold line is opposite to the folding direction along the first fold line.

8. The method according to claim 6, characterized in that, The folding direction along the third fold line is the same as the folding direction along the first fold line.

9. The method according to claim 8, characterized in that, The method further includes: Receive a fifth operation from the user on the fourth page, the fifth operation representing an operation to expand the page; In response to the fifth operation, a portion of the fourth page is folded along the fourth fold line on the fourth page, the fourth fold line coinciding with one edge of the fourth page, and the folding direction along the fourth fold line is the same as the folding direction along the third fold line. After folding along the fourth fold line, a fifth page is displayed. The aspect ratio of the fifth page is different from that of the fourth page, but the content displayed on the fifth page is the same as that on the fourth page.

10. The method according to claim 2, characterized in that, The first page includes a first part of the page and a second part of the page. The first part of the first page is folded along the first fold line. The second page includes the first part of the page. The content displayed on the first part of the second page is the same as the content displayed on the second part of the first page. The method further includes: Receive a sixth operation from the user on the second page, the sixth operation representing an operation to expand the folded page; In response to the sixth operation, the first part of the second page is folded along the fifth fold line on the second page, the fifth fold line coinciding with one edge of the first part of the second page; After folding along the fifth fold line, a sixth page is displayed. The aspect ratio of the sixth page is different from that of the second page, and the content displayed on the sixth page is the same as that on the second page.

11. The method according to claim 10, characterized in that, The folding direction along the fifth fold line is opposite to the folding direction along the first fold line.

12. The method according to claim 2, characterized in that, The second page and the first page display different content. The first page includes a first part of the page and a second part of the page. The first part of the first page is folded along the first fold line. The method further includes: In response to the first operation, the second part of the first page is also folded along the sixth fold line on the first page, which coincides with the second side of the first page; The second page is displayed after folding along the first fold line and the sixth fold line shown.

13. The method according to claim 12, characterized in that, The first side and the second side of the first page are two opposite and parallel sides of the first page, and the folding direction along the sixth fold line is opposite to the folding direction along the first fold line.

14. The method according to claim 2, characterized in that, The first page folds along the first fold line, and the second page displays different content from the first page. The method further includes: Receive a seventh operation from the user on the second page, the seventh operation representing an operation to expand the page; In response to the seventh operation, the second page is folded along the seventh fold line in the second page. The folding direction along the seventh fold line is opposite to the folding direction along the first fold line. The seventh fold line coincides with one edge of the second page. After folding along the seventh fold line, a seventh page is displayed. The aspect ratio of the seventh page is different from that of the second page, and the content displayed on the seventh page is different from that on the second page.

15. The method according to claim 14, characterized in that, The method further includes: Receive the user's eighth operation on the seventh page, the eighth operation representing the operation of expanding the page; In response to the eighth operation, the seventh page is folded along the eighth fold line in the seventh page. The folding direction along the eighth fold line is opposite to the folding direction along the seventh fold line, and the eighth fold line coincides with one edge of the seventh page. After folding along the eighth fold line, an eighth page is displayed. The aspect ratio of the eighth page is different from that of the seventh page, and the content displayed on the eighth page is different from that on the seventh page.

16. The method according to claim 2, characterized in that, The first page folds along the first fold line, and the second page displays different content from the first page. The method further includes: Receive the user's ninth operation on the second page, the ninth operation representing the operation of unfolding the page; In response to the ninth operation, the second page is folded along the ninth fold line in the second page, the ninth fold line coinciding with the first edge of the second page; After folding along the ninth fold line, a ninth page is displayed. The aspect ratio of the ninth page is different from that of the second page, and the content displayed on the ninth page is different from that on the second page. The first side of the second page coincides with the third side of the first page, and the third side of the first page and the first side of the first page are two adjacent and perpendicular sides.

17. The method according to claim 2, characterized in that, The second page includes a first part of the page and a second part of the page, and the method further includes: Receive the user's tenth operation on the second page, the tenth operation representing the operation of unfolding the page; In response to the tenth operation, the first portion of the second page is folded along the tenth fold line in the second page, the tenth fold line coinciding with the first edge of the second page; After folding along the tenth fold line, the tenth page is displayed. The aspect ratio of the tenth page is different from that of the second page. The content displayed in the first part of the tenth page is the same as the content displayed in the second part of the second page. Receive the user's eleventh operation on the tenth page, where the eleventh operation represents an operation to unfold the page; In response to the eleventh operation, the first part of the tenth page is folded along the eleventh fold line in the tenth page, and the eleventh fold line coincides with one edge of the first part of the tenth page; After folding along the eleventh fold line, the eleventh page is displayed. The aspect ratio of the eleventh page is different from that of the tenth page, and the content displayed on the eleventh page is different from that on the tenth page. The folding direction along the tenth fold line is different from the folding direction along the eleventh fold line.

18. The method according to claim 17, characterized in that, The folding direction along the tenth fold line is opposite to the folding direction along the eleventh fold line; the folding direction along the tenth fold line is the same as the folding direction along the first fold line, or the folding direction along the eleventh fold line is the same as the folding direction along the first fold line.

19. The method according to claim 2, characterized in that, The second page includes a first part of the page and a second part of the page, and the method further includes: Receive the user's twelfth operation on the second page, the twelfth operation representing the operation of unfolding the page; In response to the twelfth operation, the first part of the second page is folded along the twelfth fold line in the second page, and the second part of the second page is folded along the thirteenth fold line in the second page, wherein the twelfth fold line coincides with the first edge of the second page, and the thirteenth fold line coincides with the second edge of the second page; After folding along the twelfth fold line and folding along the thirteenth fold line, the twelfth page is displayed, and the aspect ratio of the twelfth page is different from that of the second page; The folding direction along the twelfth fold line is different from the folding direction along the thirteenth fold line.

20. The method according to claim 19, characterized in that, The folding direction along the twelfth fold line is opposite to the folding direction along the thirteenth fold line; the folding direction along the twelfth fold line is the same as the folding direction along the first fold line, or the folding direction along the thirteenth fold line is the same as the folding direction along the first fold line.

21. The method according to any one of claims 17 to 20, characterized in that, The first page is flipped along the first fold line. The second page displays different content from the first page. The first part of the second page and the second part of the second page constitute the second page.

22. The method according to any one of claims 1 to 21, characterized in that, The first target page is a rectangular page, and at least two opposite sides of the first target page are displayed along the edge of the display area of ​​the display screen. The first target page includes at least one of the first page and pages displayed after arbitrary folding.

23. The method according to any one of claims 1 to 22, characterized in that, The first target page can be enlarged, reduced, or moved in the display area of ​​the display screen. The first target page includes at least one of the first page and any page displayed after being folded.

24. The method according to any one of claims 1 to 23, characterized in that, The method is applied to e-books.

25. A folding display device, characterized in that, The apparatus includes units for performing the steps of the method as described in any one of claims 1 to 24.

26. An electronic device, characterized in that, The electronic device includes a processor, a memory, and a display screen, wherein the memory is used to store instructions, and the processor is used to read the instructions to perform the method as described in any one of claims 1 to 24.

27. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program, the computer program including program instructions that, when executed by a processor, cause the processor to perform the method as described in any one of claims 1 to 24.

28. A chip, characterized in that, include: A processor for retrieving and running a computer program from memory, causing a communication device on which the chip is mounted to perform the method as described in any one of claims 1 to 24.

Images