Method for displaying handwritten notes and electronic device

Abstract

The application provides a handwriting note display method and an electronic device, and relates to the terminal field. The application provides a handwriting note display method, which is applied to an electronic device. The electronic device displays a foreground layer corresponding to a note page in response to a user operation of reloading a handwriting note, before a handwriting layer and a background layer of the note page to be displayed are both loaded. The foreground layer loads picture or PDF content corresponding to the note page, and the loading speed is faster than that of the handwriting layer or the background layer in the note page. The foreground layer is displayed above the handwriting layer and completely blocks the handwriting layer and the background layer. After the handwriting layer and the background layer of the note page are both loaded, the foreground layer is removed. The method in the application embodiment can quickly display the note page even if the content of the current note page to be displayed is large when the electronic device opens the handwriting note, reduces the time length of white screen or avoids the problem of segmented display of the current note page, improves the smoothness of handwriting note display, and improves the visual experience of the user.

Description

Technical Field

[0001] This application relates to the field of terminals, and more particularly to a method and electronic device for displaying handwritten notes. Background Technology

[0002] In today's digital world, mobile devices (such as smartphones) have become indispensable tools, profoundly impacting people's lives and work. Mobile devices typically come with note-taking applications, allowing users to record multimedia data (such as text, voice, video, and images). Note-taking applications generally include handwritten notes and text notes. Handwritten notes are created by users drawing information in a designated writing area using their fingers or a stylus; while text notes are recorded by users using a soft keyboard or voice input.

[0003] However, when the i-th page of the handwritten notes (where i is a positive integer) contains a lot of content (e.g., the page is already filled with text, images, and other data), the note-taking application may display a blank screen first and then display the page notes normally after a period of time (e.g., more than 2 seconds) during the loading process when the user opens the i-th page of handwritten notes. Alternatively, the note-taking application may display the page notes in segments (e.g., displaying the first paragraph of text first, then the third paragraph of text after a 1-second interval), which affects the user experience. Summary of the Invention

[0004] To address the aforementioned technical issues, this application provides a method for displaying handwritten notes, enabling electronic devices to quickly display handwritten notes even when the current note page contains a lot of content, reducing the duration of blank screens or avoiding the problem of segmented display of the current note page, thereby improving the smoothness of handwritten note display and enhancing the user's visual experience.

[0005] In a first aspect, embodiments of this application provide a method for displaying handwritten notes, applied to an electronic device, comprising:

[0006] In response to the user's first input, the system retrieves the selected handwritten notes page that needs to be displayed immediately as the first page. Each note page includes a foreground layer, a handwritten layer, and a background layer. The foreground layer is displayed above the handwritten layer, and the handwritten layer is displayed above the background layer. The handwritten layer displays the first data recorded by the user on the note page, and the background layer displays the background image of the note page. The system retrieves the target data for the first page, which can be a local image containing all the content of the first page or a PDF containing all the content of the first page. The system populates the foreground layer of the first page with the target data. The system displays the foreground layer of the first page immediately. When it is detected that the handwritten layer of the first page has finished loading the first data and the background layer of the first page has finished loading the background image, the system removes the display of the foreground layer of the first page.

[0007] For example, the electronic device may be a computer, mobile phone, in-vehicle device, or tablet computer that supports touch functionality.

[0008] For example, handwritten notes can be handwritten notes in a note-taking app or a memo app. Here, handwritten notes refer to information recorded by the user using their finger or touchscreen in the handwriting area.

[0009] For example, each handwritten note includes at least one note page, and each note page includes a foreground layer, a handwriting layer, and a background layer. The foreground layer, handwriting layer, and background layer are all views in the Android system. The handwriting layer is used to record and display the data entered by the user, and the background layer is used to display the background image selected by the user.

[0010] For example, the number of note pages displayed at the first moment may be multiple. The electronic device can use the N note pages displayed at the first moment as N first pages, where N is an integer greater than 1. In other words, the electronic device can obtain multiple first pages.

[0011] For example, the first operation could be opening a handwritten note, or switching between portrait and landscape modes, or split-screen display, etc.

[0012] For example, when the target data is PDF content, the electronic device can convert the PDF content into an image (hereinafter referred to as a PDF image) and use the PDF image to fill the foreground layer.

[0013] In this way, when the user inputs their first action, the system retrieves the selected handwritten note page to be displayed and its target data. Since the target data is an image or PDF, the time it takes for the foreground layer to load the target data is less than the sum of the time it takes for the handwritten layer to load the first data and the time it takes for the background layer to load the background image. This allows the foreground layer to display before the handwritten and background layers. Furthermore, the foreground layer, being above the handwritten layer, can obscure the unloaded handwritten and background layers. In this example, the local image or PDF content loaded as the target data includes all the content of the note page, ensuring that the effect of the foreground layer loading is the same as the effect of both the handwritten and background layers loading. This avoids prolonged blank screens or fragmented display of the note page, improving the smoothness of the handwritten note display. Additionally, once both the handwritten and background layers have finished loading, the foreground layer is removed from the display to prevent issues such as delayed or untimely updates to the displayed content after the user enters information.

[0014] According to the first aspect, when a first object lift-up event is detected in the handwriting area of ​​the electronic device and no touch event of the first object in the handwriting area is detected within a first preset time period, it is determined that the content of the handwriting layer of the current note page has changed, wherein the first object includes a finger or a stylus; the display content of the current note page is acquired and saved as a local image corresponding to the current note page, wherein the display content of the current note page includes the first data of the handwriting layer in the current note page and the background image of the background layer.

[0015] For example, a first object lift-off event, such as a finger lifting off the handwriting area or a stylus lifting off the handwriting area.

[0016] For example, the first preset duration can be 1 second, 0.5 seconds, 2 seconds, etc.

[0017] For example, the content of a note page includes the initial data recorded and a background image.

[0018] Thus, when a user records information in the handwriting area with their finger or stylus, the content of that page of notes changes (i.e., the first recorded data changes). If the content of that page of notes is retrieved and saved as a local image every time the first data changes, it will increase CPU consumption and the power consumption of the electronic device. In this example, the page of notes is saved only after a first touch event is detected and no touch event occurs within a first preset time period. By delaying the saving of the local image of that page of notes, the problem of data inconsistency caused by frequent local image saving can be avoided, as well as the problem of system performance being affected by frequent image writing to disk. In this example, only one most recently generated local image is saved for each note page.

[0019] According to the first aspect, before obtaining the note page that needs to be displayed in the selected handwritten notes as the first page in response to the first operation of user input, the method further includes: when it is detected that any page parameter in the current note page has changed, obtaining the display content of the current note page and saving it as a local image corresponding to the current note page, wherein the display content of the current note page includes the first data of the handwritten layer and the background image of the background layer in the current note page; wherein the page parameters include the page size information, the page color and the page display orientation.

[0020] For example, the page size information includes the paper specifications of the note page, the page color includes the background image, and the page display orientation includes the paper display orientation of the note page (such as landscape or portrait).

[0021] In this way, when page parameters change, the local image of the note page is saved in time to avoid the content displayed in the foreground layer being different from the current note page.

[0022] According to the first aspect, before obtaining the note page that needs to be displayed in the first moment from the selected handwritten notes as the first page in response to the first operation of user input, the method further includes: when detecting that the user has input a second operation to save the current note page, obtaining the display content of the current note page and saving it as a local image corresponding to the current note page, wherein the display content of the current note page includes the first data of the handwritten layer and the background image of the background layer in the current note page.

[0023] In some scenarios, the user saves the note page within a first preset time after lifting their finger or stylus. If the note page is not saved at this time, it may affect the foreground layer's inability to use local images, thus affecting the display speed of the foreground layer.

[0024] According to the first aspect, the method further includes: responding to a first operation input by the user, reading a PDF file corresponding to the handwritten notes from a database, the PDF file being used to record the content of each note page in the handwritten notes; parsing the PDF file; storing the parsed PDF file into a first array; initializing the first array; obtaining target data for the first page, including: detecting whether the initialization of the first array is complete and obtaining a first detection result; detecting whether a corresponding local image exists on the first page and obtaining a second detection result; and determining the target data for the first page based on the first detection result and the second detection result.

[0025] In this way, the electronic device stores PDF files of each page of the handwritten notes. The PDF files are parsed and stored in the first array, ensuring fast loading when the foreground layer is filled with PDF content. In this example, the data for filling the foreground layer is determined based on whether the first array initialization is complete and whether the note page contains a local image. This makes the foreground layer display compatible with handwritten notes before the foreground layer feature was added, expanding the applicability of the foreground layer display.

[0026] According to the first aspect, the target data of the first page is determined based on the first detection result and the second detection result, including: when a corresponding local image is detected on the first page, the local image corresponding to the first page is used as the target data; when the initialization of the first array is completed and the corresponding local image is detected on the first page, the PDF content corresponding to the first page is obtained from the first array, and the obtained PDF content is used as the target data.

[0027] In this way, before the handwriting layer and background layer of the first page are fully loaded, if the current note page has a corresponding local image, the local image is used to fill the foreground layer; if the current note page does not have a local image and the first array is initialized, the PDF content of the current note page is used to fill it. These two ways of filling the foreground layer make the solution of using the foreground layer to cover the handwriting layer and background layer compatible with handwritten notes before the foreground layer function was added, ensuring the covering effect of the foreground layer.

[0028] According to the first aspect, the method further includes: when it is detected that the initialization of the first array is incomplete and that the first page does not contain a corresponding local image, canceling the display of the foreground layer of the first page or determining that the target data is empty. Thus, the foreground layer is not displayed when the first array has not been fully loaded and there is no corresponding local image.

[0029] According to the first aspect, before using the target data to populate the foreground layer of the first page, the method further includes: setting the size of the foreground layer of the first page to the maximum size supported by the first page. This ensures that the size of the local image matches the maximum size supported by the first page, thus determining the sharpness of the local image, preventing a significant difference between the displayed foreground layer and the first page, and ensuring the occlusion effect of the foreground layer.

[0030] According to a first aspect, the electronic device includes a multi-view sliding page adapter, a foreground layer listener, and a background layer adapter; the method further includes: in response to a first operation input by a user, the multi-view sliding page adapter binds the content of each note page in the handwritten notes to the corresponding note page, so that the background layer adapter loads the background image of the handwritten notes and the handwriting layer loads the first data corresponding to each note page; during the process of the multi-view sliding page adapter binding the content of each note page in the handwritten notes to the corresponding note page, the foreground layer listener is called to set the foreground layer of the first page to a visible state; the background layer adapter notifies the foreground layer listener through a first callback function that the background layer adapter has completed loading the background image of the first page; the handwriting layer notifies the foreground layer listener through a second callback function that the first data of the first page has been completed loading; when the foreground layer listener detects that the handwriting layer of the first page has completed loading the first data and the background layer of the first page has completed loading the background image, the foreground layer listener de-displays the foreground layer of the first page, including: the foreground layer listener sets the foreground layer of the first page to an invisible state.

[0031] In this way, the application to which the handwritten notes belong (such as a note-taking app or memo app) uses a multi-view sliding page switcher to bind the content of each note page in the handwritten notes to the corresponding note page. This allows the handwriting layer to load its corresponding initial data and the background layer to load its background image. During the binding operation of the multi-view sliding page switcher adapter, the foreground layer is set to a visible state so that it can be displayed immediately after loading the target data, avoiding the problem of the foreground layer not displaying in time. The background layer and the handwritten layer can call callback functions to notify the foreground layer listener in a timely manner, so that the foreground layer can be displayed in a timely manner.

[0032] According to the first aspect, the first operation includes any one of the following operations: opening a handwritten note, switching between portrait and landscape modes, switching from single-screen display to multi-screen display, switching from multi-screen display to single-screen display, and scaling the handwritten note when the electronic device is in split-screen mode.

[0033] Secondly, this application provides an electronic device, including: one or more processors; a memory; and one or more computer programs, wherein the one or more computer programs are stored in the memory, and when the computer programs are executed by the one or more processors, the electronic device performs the method of displaying handwritten notes corresponding to the first aspect and any implementation thereof.

[0034] The second aspect and any implementation thereof correspond to the first aspect and any implementation thereof, respectively. The technical effects of the second aspect and any implementation thereof are similar to those of the first aspect and any implementation thereof, and will not be repeated here.

[0035] Thirdly, this application provides a computer-readable medium for storing a computer program that, when the computer program is run on an electronic device, causes the electronic device to perform the handwritten note display method corresponding to the first aspect and any implementation thereof. Attached Figure Description

[0036] To more clearly illustrate the technical solutions of the embodiments of this application, the drawings used in the description of the embodiments of this application will be briefly introduced below. Obviously, the drawings described below are only some embodiments of this application. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0037] Figure 1a This is an illustrative diagram illustrating a scenario for creating handwritten notes;

[0038] Figure 1b This is an illustrative diagram illustrating a scenario of opening a handwritten note.

[0039] Figure 2 This is an exemplary hardware structure diagram of an electronic device;

[0040] Figure 3 This is an exemplary software structure diagram of an electronic device;

[0041] Figure 4a This is an exemplary flowchart illustrating the loading of a foreground layer on an electronic device;

[0042] Figure 4b This is an illustrative diagram showing the foreground layer, handwriting layer, and background layer in a note-taking page.

[0043] Figure 5 This is an exemplary timing diagram showing the foreground layer being shown and unshown;

[0044] Figure 6 This is an example of a class diagram showing the foreground layer when it is displayed;

[0045] Figure 7 This is a complete flowchart illustrating the loading of a foreground layer on an electronic device;

[0046] Figure 8This is an illustrative diagram illustrating a scenario of opening a handwritten note.

[0047] Figure 9 This is an example of the foreground layer display. Detailed Implementation

[0048] The technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.

[0049] In this article, the term "and / or" is merely a description of the relationship between related objects, indicating that there can be three relationships. For example, A and / or B can represent three situations: A exists alone, A and B exist simultaneously, and B exists alone.

[0050] The terms "first" and "second," etc., used in the specification and claims of this application are used to distinguish different objects, not to describe a specific order of objects. For example, "first target object" and "second target object," etc., are used to distinguish different target objects, not to describe a specific order of target objects.

[0051] In the embodiments of this application, the terms "exemplary" or "for example" are used to indicate that something is an example, illustration, or description. Any embodiment or design that is described as "exemplary" or "for example" in the embodiments of this application should not be construed as being more preferred or advantageous than other embodiments or design. Specifically, the use of the terms "exemplary" or "for example" is intended to present the relevant concepts in a specific manner.

[0052] In the description of the embodiments in this application, unless otherwise stated, "multiple" means two or more. For example, multiple processing units means two or more processing units; multiple systems means two or more systems.

[0053] Before providing a detailed explanation of the embodiments of this application, the application scenarios of the embodiments of this application will first be described with reference to the accompanying drawings. In this example, the electronic device is a mobile phone, and the application used to create handwritten notes can be a note-taking application, a memo application, or an electronic document application. In this example, the application used to create handwritten notes is a note-taking application.

[0054] The following is combined Figure 1a This document explains the process of creating handwritten notes on a mobile phone.

[0055] See Figure 1aIn example (1), the phone's display screen shows the phone's desktop 101, which includes icons for multiple applications, such as a note-taking app icon and a voice recorder app icon. In response to the user clicking the note-taking app icon, the phone runs the note-taking app and jumps from desktop 101 to the main interface 102 of the note-taking app. The main interface 102 of the note-taking app includes a note search box 103 and the name of each note (e.g., ...). Figure 1a (2) shows “Note 1”, “Note 2”, note creation control 104, and the number of notes stored in the note application (e.g.) Figure 1a (2) shows "2 notes". In response to the user clicking the note creation control 104, the note application displays a pop-up window 105 on the main interface, which displays icons for text notes and handwritten notes. The difference between text notes and handwritten notes lies in the input method. Text notes are input using a soft keyboard, while handwritten notes are input using a handwriting input method. Soft keyboard input refers to the way users input note content by operating the soft keyboard, while handwriting input refers to the way users input note content by sliding their fingers in the handwriting area.

[0056] like Figure 1a As shown in (2), when the user clicks the handwritten note icon on pop-up window 105, the note application responds to the user's selection and jumps to the handwritten note creation interface 107. The handwritten note creation interface 107 displays note cover options 107-1 and note paper options 107-2. (See diagram 107 for details.) Figure 1aAs shown in (3), in response to the user's selection of the note cover option 107-1, the note application displays images of different styles on the main interface 107 for the user to choose from. In this example, the image styles include basic, business, and artistic styles, with multiple images under each style. For example, in this example, images 107-11 and 107-12 under the artistic style are displayed on the main interface 107. Optionally, the user can swipe left and right to display other images. The user selected image 107-11 under the artistic style as the cover of the current handwritten note. The paper option 107-2 includes the paper orientation option 107-22 and the paper size option 107-21. The user can adjust the paper size of the handwritten note through the size option 107-21. In this example, the paper option 107-2 provides multiple paper sizes, such as A4, A5, B5, B6, etc. Users can adjust the paper orientation in the notes using the paper orientation option 107-22. This option provides both landscape and portrait orientation options; in this example, portrait orientation and A4 paper size are used. After selecting the cover option 107-1 and paper option 107-2, the user can click the completion control 107-3 in the handwritten note creation interface 107. In response to the user clicking the completion control 107-3, the note application completes the creation of the handwritten note and transitions from the current creation interface to the handwritten note editing interface 108.

[0057] like Figure 1a As shown in (4) above. The editing interface 108 includes a handwriting area 108-1 and a handwriting toolbar. The handwriting area 108-1 is the editable area of ​​a page in the notes. The bottom of the handwriting area 108-1 displays the current page number 108-11, as shown below. Figure 1a As shown in (5), the page number indicates that the current page is page 1 of the notes. Users can handwrite text or draw in the handwriting area 108-1, which displays the user's completed input in real time, such as... Figure 1aAs shown in (4) therein, the user is writing the second stroke of the character "正". The handwriting toolbar includes multiple tool controls, such as a brush stroke selection control (the leftmost first control in (4) of 1a), an erasure control, a text box insertion control, a picture insertion control, a paper addition control 108-2, etc. The user can modify the width of the brush stroke through the brush stroke control. The user can delete any content in the handwriting area through the erasure control. When the user clicks on the paper addition control 108-2, a new piece of paper can be added. The navigation bar of this editing interface 108 includes an undo control, a redo control, and a text editing completion control 108-3. This handwriting area 108-1 displays any content entered by the user in this area. It should be noted that the user can insert a picture into this handwriting area through the picture insertion control in the handwriting toolbar 108-2. The user can drag the picture within this handwriting area to change the placement position of the picture; the user can also change the size of the picture. After the user finishes editing the note, the user can click on the text editing completion control 108-3 in the editing page 108 of the handwriting note, as Figure 1a As shown in (5) therein, in response to the user's operation of clicking on the text editing completion control 108-3, the note application saves this note and exits the text editing state. After the note is saved, the user can close this handwriting note.

[0058] The following is an explanation in combination with Figure 1b the process of opening a note on a mobile phone.

[0059] Refer to Figure 1b In (1) therein, exemplarily, in response to the user's operation of opening the note application icon on the mobile phone, the display interface of the mobile phone shows the main interface 201 of the note application. The number of notes stored in the current note application is shown on the main interface 201 of this note application (such as Figure 1b "3 notes" shown in (1) therein), a note search box 202, and the name of each note. Generally, the note application saves the page information of each note when it was last closed, so that the note application can display the note page when it was last closed when opening this note this time. In this example, the note named "Note 3" is a handwriting note. Assume that the information capacity of the note recorded on the first page is 1M, and the first page was shown when it was last closed. The content data of this first-page note is large, and the time for loading the note is too long, resulting in the display interface showing a blank screen for too long, as Figure 1b shown in (2) and (3) therein. After a blank screen for 2 seconds, the display interface 205 of this note shows the first-page note page 206.

[0060] In some embodiments, during the process of displaying "Note 3", when the note application jumps from the main interface to the first page of notes, some content in the first page of notes loads quickly and is displayed first, causing the first page of notes to appear in segments. Figure 1b As shown in (4), the first two lines of the notes on page 1, 206-1, are displayed first. After 1 second, the entire content of page 1, 206, is displayed. Figure 1b As shown in (5) of the text.

[0061] In this example, if the data content stored on page N of the handwritten notes is too large, such as if page N is already filled with text or images (e.g., 3 images with a resolution of 1080×1080), when the note-taking application opens page N of the handwritten notes, a blank screen will first be displayed for a period of time (e.g., 1.5 seconds, 2 seconds, etc.) before the content of page N of the notes is fully displayed, or the content of page N of the notes will be displayed in segments, which seriously affects the user experience.

[0062] This application provides a method for displaying handwritten notes, which is executed by an electronic device. A first application, in response to a user opening a handwritten note, retrieves the note page from the last time the note was closed as the note page to be displayed. The first application loads the note page to be displayed and displays a foreground layer of the note page before the note page is fully loaded. This foreground layer loads a local image or PDF content of the note page, wherein the local image or PDF content contains all the content of the note page. When the first application finishes loading the note page to be displayed, the foreground layer is removed from display.

[0063] In this example, each note page contains a foreground layer, a handwriting layer, and a background layer. The foreground layer is displayed on top of the handwriting layer, and the handwriting layer is displayed on top of the background layer. Before the handwriting layer and background layer are fully displayed, the foreground layer is used to occlude the partially displayed handwriting layer and background layer. Since the content displayed in the foreground layer is the same as the content presented on the note page, and the time consumed by the foreground layer to load the image or PDF is less than the sum of the time it takes for the handwriting layer to load the content and the time it takes for the background layer to load the background image, the duration of the blank screen is reduced and the problem of the note page being displayed in segments is avoided. This makes the user perceive that the note page loads quickly and with short latency, thus providing the user with a smoother visual feedback and improving the user experience.

[0064] The electronic devices to which this application embodiment applies may be, for example, mobile phones, laptops, or tablets.

[0065] It should be understood that, Figure 2The electronic device 100 shown is merely an example of an electronic device, and the electronic device 100 may have more or fewer components than those shown in the figure, may combine two or more components, or may have different component configurations. Figure 2 The various components shown can be implemented in hardware, software, or a combination of hardware and software, including one or more signal processing and / or application-specific integrated circuits. In this example, electronic device 100 is exemplified by a mobile phone.

[0066] Electronic device 100 may include: a processor 110, an external memory interface 120, an internal memory 121, a Universal Serial Bus (USB) interface 130, a charging management module 140, a power management module 141, a battery 142, antenna 1, antenna 2, a mobile communication module 150, a wireless communication module 160, an audio module 170, a speaker 170A, a receiver 170B, a microphone 170C, a headphone jack 170D, a sensor module 180, buttons 190, a motor 191, an indicator 192, a camera 193, a display screen 194, and a Subscriber Identification Module (SIM) card interface 195, etc. The sensor module 180 may include pressure sensors, gyroscope sensors, barometric pressure sensors, magnetic sensors, accelerometers, distance sensors, proximity sensors, fingerprint sensors, temperature sensors, touch sensors, ambient light sensors, bone conduction sensors, etc.

[0067] It is understood that, in order to achieve the above-mentioned functions, electronic devices include hardware and / or software modules that perform the respective functions. Based on the algorithmic steps of the examples described in the embodiments disclosed herein, 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 in conjunction with the embodiments, but such implementation should not be considered beyond the scope of this application.

[0068] Figure 3 This is a software structure block diagram of the electronic device 100 according to an embodiment of this application.

[0069] The layered architecture of the electronic device 100 divides the software into several layers, each with a clear role and division of labor. Layers communicate with each other through software interfaces. In some embodiments, the Android system is divided into three layers, from top to bottom: the application layer, the application framework layer, and the kernel layer.

[0070] The application layer can include a series of application packages.

[0071] like Figure 3 As shown, the application package can include applications such as notes, camera, calendar, music, SMS, gallery, calling, and maps.

[0072] Note-taking apps can be used to record multimedia data, such as text, video, images, or audio recordings. These apps can include text notes and handwritten notes. When using text notes, users input text using the system's soft keyboard and can also insert images, videos, and audio recordings while recording text; text notes can also convert audio recordings into text. When using handwritten notes, users input text by touching the screen within the handwriting area, and images can also be inserted into the handwritten note page.

[0073] The application framework layer provides application programming interfaces (APIs) and a programming framework for applications in the application layer. The application framework layer includes some predefined functions.

[0074] like Figure 3 As shown, the application framework layer may include a window manager, content provider, view system, phone manager, resource manager, notification manager, etc.

[0075] The window manager is used to manage windowed applications. It can retrieve screen size, determine the presence of a status bar, lock the screen, and capture screenshots, among other things.

[0076] Content providers store and retrieve data, making that data accessible to applications. This data may include videos, images, audio, made and received phone calls, browsing history and bookmarks, phone books, etc.

[0077] A view system includes visual controls, such as controls for displaying text and controls for displaying images. View systems can be used to build applications. A display interface can consist of one or more views. For example, a display interface including a text notification icon could include views for displaying text and views for displaying images.

[0078] The phone manager is used to provide communication functions for electronic device 100. For example, it manages call status (including connection and disconnection).

[0079] The file explorer provides applications with various resources, such as localized strings, icons, images, layout files, video files, and more.

[0080] The notification manager allows applications to display notification information in the status bar. It can be used to convey informational messages and can disappear automatically after a short time without user interaction.

[0081] The kernel layer is the layer between hardware and software. The kernel layer contains at least the display driver, camera driver, audio driver, and sensor driver.

[0082] Understandable Figure 3 The layers in the illustrated software structure and the components contained in each layer do not constitute a specific limitation on the electronic device 100. In other embodiments of this application, the electronic device 100 may include more or fewer layers than illustrated, and each layer may include more or fewer components; this application does not impose any limitations.

[0083] In this embodiment of the application, each note stored by the note-taking application may include at least one note page. For example, continuing to refer to... Figure 1b In the example shown in (1), the note-taking application stores 3 notes. Assume that note 1 contains 3 note pages, note 2 contains 5 note pages, and note 3 contains 1 note page (e.g., ...). Figure 1b Page 206 shown in (3) is a single note page. Each note page displayed on the screen includes multiple views. In this example, each note page consists of a foreground layer, a handwriting layer, and a background layer from top to bottom, as shown below. Figure 4b As shown, the foreground layer is displayed on top of the handwriting layer, and the handwriting layer is displayed on top of the background layer. In other words, when the foreground layer is visible and the content has been loaded, the foreground layer can obscure the handwriting layer and the background layer.

[0084] In this example, each page's foreground, handwriting, and background layers load their respective content, and the loading speed of any one layer is unaffected by the loading speed of the other two layers. The foreground, handwriting, and background layers can execute their respective loading tasks simultaneously. We will first combine this with... Figure 4a The process of loading content into the foreground layer is explained in detail. The process of loading the foreground layer on this mobile phone includes:

[0085] Step 401: The note-taking application loads the note and displays the foreground layer.

[0086] For example, in response to a user opening any handwritten note, the note application retrieves the page that was displayed when the note was last closed as the initial display page when the note is opened this time, or the note application retrieves the first page of the note as the initial display page when the note is opened this time. In this example, the note application retrieves the page that was displayed when the note was last closed as the initial display page when the note is opened this time.

[0087] The initial display page may include at least one page of notes, for example, continue referring to Figure 1b The handwritten note in (1) (i.e., "Note 3"), assuming that the handwritten note has a total of 3 note pages, when the note application last closed "Note 3", the displayed pages were the bottom half of page 1 and the top half of page 2, such as Figure 9 As shown, the initial display pages obtained by the note-taking application at this time include the first page of notes and the second page of notes.

[0088] In this example, each note page consists of a foreground layer, a handwriting layer, and a background layer from top to bottom. After determining the initial display page, the note-taking application can retrieve the content of each note page (i.e., the first page) within that initial display page. The handwriting layer of the first page begins loading its corresponding data, and the background layer loads its corresponding background image. During the loading of the handwriting layer, the note-taking application can set the foreground layer of the first page to be visible.

[0089] Step 402: The note-taking application determines whether the current note page has a corresponding local image. If the note-taking application detects that the current note page does not have a corresponding local image, proceed to step 403; if the note-taking application detects that the current note page has a corresponding local image, proceed to step 404.

[0090] For example, after adding the foreground layer display feature, the note-taking application saves a local image for each newly created or modified page of notes. This local image contains all the content of the handwritten layer and background layer in that page of notes.

[0091] In one example, the note-taking application, after detecting a change in the handwriting layer content of the current note page and after a first preset time period, retrieves the content of the handwriting layer and background layer of the current note page to generate a local image of the current note page. The first preset time period can be greater than or equal to 1 second and less than 5 seconds; for example, the first preset time period is 1 second.

[0092] Events indicating changes in the handwriting layer content can include any of the following: the user adds text or an image to the handwriting area of ​​the current note page, deletes text or an image, or modifies text or an image. Optionally, the note-taking application can determine whether a change has occurred in the handwriting layer of the current note page by detecting when the user lifts their finger / stylus. When the note-taking application determines that the user's finger / stylus has been lifted, it can start a timer; when the timer reaches a first preset duration, the note-taking application determines that a change has occurred in the handwriting layer of the current note page and that the change has occurred after the first preset duration. The note-taking application then retrieves the content of the handwriting layer and the background layer of the current note page and saves them as local images.

[0093] For example, the user uses a finger to write the character "可" on the handwriting page. As shown in Figure 1a in the note page 108-1 in (5) of . When the note application detects that the user lifts the finger, the note application determines that the content of the current page note has changed and starts a timer. When the timer reaches 1 second, the note application determines that the content of the current page note has changed and the duration of the change reaches the first preset duration. The note application obtains the picture corresponding to the current note page 108-1 and saves the picture as the local picture corresponding to the note of this page. It can be understood that the note application can use the page (View) screenshot function in Android to generate the picture of this page note.

[0094] Through the mechanism of delayed saving, the electronic device can avoid frequently triggering save operations in a short period of time. Frequent saving not only consumes system resources, but may also cause performance problems such as the user interface freezing and the handwriting not following the finger. And delayed saving can merge multiple save requests into one, so as to ensure that the user will not feel obvious delay or freezing when performing handwriting operations, thus providing a smoother user experience.

[0095] In one example, when the note application detects that the paper parameters (i.e., page parameters) of the current note page change, it obtains the content of the handwriting layer and the background layer in the current note page to generate the local picture of the current note page. The events of the paper parameter change include any one of the following listed events: the paper size changes (such as the paper size changes from A4 to A5), the orientation of the paper changes (such as changes from portrait to landscape, or the orientation of the paper changes from landscape to portrait), and the color of the paper (i.e., the background picture) changes.

[0096] In one example, when the user inputs an operation to save the current note page, it obtains the content of the handwriting layer and the background layer in the current note page to generate the local picture of the current note page. For example, referring to Figure 1a in (5) of , when the user clicks the text editing completion control 108-3, the note application determines that the user has input an operation to save the current page note, generates a picture containing the content of the handwriting layer and the background layer in the note page, and uses the generated picture as the local picture of the note page.

[0097] In this example, the electronic device provides three scenarios for generating local pictures. When any one of the above 3 scenarios is detected (that is, it is detected that the content of the handwriting layer of the current note page has changed and has passed the first preset duration; it is detected that the page parameters of the current note page have changed; it is detected that the user has input an operation to save the current note page), the local picture of the current note page is generated and saved.

[0098] In this example, the electronic device stores a PDF file for each note. That is, the electronic device stores a PDF file for each note before the foreground layer display feature was added, as well as a PDF file for each note created / modified after the foreground layer display feature was added.

[0099] To improve the display effect of the foreground layer, the note-taking application can, after making the foreground layer visible, determine whether the current note page (i.e., the initial display page) has a corresponding local image. If the note-taking application detects that the current note page does not have a corresponding local image, it fills the foreground layer of the current note page with the corresponding PDF content, i.e., proceeds to step 403. If the note-taking application detects that the current note page has a corresponding local image, it fills the foreground layer of the note page with that local image, i.e., proceeds to step 404.

[0100] Step 403: The note-taking application fills the foreground layer with the PDF content corresponding to the current note page.

[0101] For example, when the note-taking application detects that there is no corresponding local image for the current note page, it retrieves the PDF content corresponding to that note page. The note-taking application parses the PDF content corresponding to that note page and converts the parsed PDF content into an image (hereinafter referred to as the first display image). The note-taking application uses this first display image to fill the foreground layer of the current note page.

[0102] Step 404: The note-taking application fills the foreground layer with a local image.

[0103] For example, when the note-taking application detects that the current note page has a corresponding local image, it directly uses the local image corresponding to the current note page to fill the foreground layer of the current note page.

[0104] Step 405: The note-taking application determines whether both the background layer and the handwriting layer are fully displayed. When the note-taking application detects that both the background layer and the handwriting layer are fully displayed, it executes step 406, which removes the foreground layer. When the note-taking application detects that either the background layer or the handwriting layer is not fully displayed, it can wait for a preset time before re-executing step 405.

[0105] For example, since the foreground layer is set to visible, the display can show the content of the foreground layer after it has been filled with local images or PDF content on the current note page. Once the note-taking application detects that both the background layer and the handwriting layer are fully displayed, it can set the foreground layer of the current page to invisible, thereby deactivating the foreground layer's display. Optionally, after the background layer is fully displayed, it can notify the foreground layer via a callback that the background layer is now fully displayed; similarly, after the handwriting layer is fully displayed, it can also notify the foreground layer via a callback that the handwriting layer is now fully displayed.

[0106] Optionally, the note-taking application can detect whether both the background and foreground layers of the current page are fully displayed when it receives a notification of the background or handwriting layer.

[0107] Step 406: Undo the foreground layer in the note application.

[0108] For example, a note-taking application sets the foreground layer to be invisible.

[0109] In one example Figure 4a The foreground layer shown involves Figure 6 The class shown. (Refer to...) Figure 6 The classes involved in the foreground layer display include: ForeGroundListener, PageViewAdapter, PageViewAdapterListener, BackgroundView, NoteWritingView, and PageView.

[0110] PageViewAdapter is an adapter class for ViewPager, used to control the creation, binding, and recycling of views. This PageViewAdapter can call ForeGroundListener (such as...). Figure 6 The dashed arrow pointing to the ForeGroundListener indicates that the PageViewAdapter calls the ForeGroundListener, which sets the foreground layer to be visible. The PageViewAdapter can also refresh the foreground layer via the PageViewAdapterListener.

[0111] NoteWritingView can notify ForeGroundListener that it has finished loading the handwritten content after the handwritten layer content has been loaded (e.g., ...). Figure 6 The middle line points to the ForeGroundListener. After the BackgroundView has finished loading its background content, it notifies the ForeGroundListener that the BackgroundView has finished loading the background content (e.g., ...). Figure 6 The middle line pointing to ForeGroundListener is a solid line.

[0112] PageView is a component that generates scrolling pages on the screen. For example... Figure 6 As shown, the PageView is bound to the PageViewAdapter, and the PageView is loaded into the NoteWritingView so that the handwriting layer and the foreground layer can be scrolled.

[0113] The following is combined Figure 5 The logical sequence diagram illustrates the display and disappearance of the foreground layer.

[0114] Step 501: The multi-view sliding page adapter receives the user's action of opening the handwritten note.

[0115] For example, when a user inputs an action to open a handwritten note, the PageViewAdapter in the note application receives the first action input by the user, which is to open the handwritten note.

[0116] Step 502: Bind the handwriting layer to the multi-view sliding page adapter to display each page of notes.

[0117] For example, in response to the first user input, the PageViewAdapter executes the page binding method (i.e., the onBindViewHolder method) to bind the content corresponding to the handwriting layer to the handwriting layer, so that the handwriting layer can load the content corresponding to each page of the note.

[0118] Optionally, during the execution of the onBindViewHolder method by PageViewAdapter, the onBindViewHolder method calls ForeGroundListener to set the foreground layer to a visible state. That is, during the execution of the onBindViewHolder method by PageViewAdapter, ForeGroundListener executes step 503 to set the foreground layer to a visible state.

[0119] Step 503: The foreground layer listener sets the foreground layer to be visible.

[0120] For example, after the foreground layer has finished loading and filling its content, the display shows the foreground layer, thereby obscuring the handwriting layer and the background layer. In other words, the time when the foreground layer begins to be displayed is independent of the loading speed of the background layer and the loading speed of the handwriting layer.

[0121] Step 504: The background layer adapter loads the content of the background layer.

[0122] For example, StylusNoteAdapter loads the content of the background layer.

[0123] Step 505: The handwriting layer adapter loads the content of the handwriting layer.

[0124] For example, after the PageViewAdapter binds the content of each page of the note to the corresponding handwriting layer, the handwriting layer of the current page loads the corresponding handwriting content.

[0125] It should be noted that steps 504 and 505 are not executed in any particular order; they can be understood as StylusNoteAdapter and NoteWritingView executing synchronously. Furthermore, there is no sequential order between steps 504 and 505 and step 503.

[0126] Step 506: After the background layer adapter has finished loading the background layer content, execute the first callback method.

[0127] For example, the first callback method can be the executeCallBack method. After the background layer adapter finishes loading the background layer content, the first callback method is executed, so that the foreground layer listener can know in time that the background layer has finished loading.

[0128] Step 507: After the handwriting layer has finished loading its content, execute the second callback method.

[0129] For example, the second callback method can be the onPathInfoLoaded method. After the handwriting layer finishes loading its content, the second callback method is executed, so that the foreground layer listener can know in time that the handwriting layer has finished loading.

[0130] Step 508: After the foreground layer listener detects that the content of the background layer has been loaded and the content of the handwriting layer has been loaded, it sets the foreground layer to an invisible state.

[0131] For example, after the foreground layer listener detects that the background layer and the handwriting layer have finished loading, it sets the foreground layer to an invisible state to avoid obscuring the normal display of the handwriting layer and the background layer.

[0132] from Figure 5 As shown in the sequence diagram of the foreground layer's display and disappearance, the foreground layer is set to be visible during the binding process between the handwriting layer and the corresponding content, which can avoid the problem of the handwriting layer being displayed first; and the duration of the foreground layer's display depends on the duration of the background layer's content loading and the duration of the handwriting layer's content loading.

[0133] Figure 7 To illustrate, a complete flowchart of loading the foreground layer is shown below. Figure 7 A detailed explanation of the process of loading the foreground layer:

[0134] Step 701: The note-taking application receives the user's request to open the handwritten note.

[0135] For example, in response to a user opening a handwritten note, the note-taking application determines the tags of the opened note. Based on the retrieved tags, the application can use the PDFFragment class to read the full PDF file of the note from the database. This full PDF file stores all the content of the note. The PDFFragment class parses the content of each page in the PDF file and saves the parsed content to the AllPdfListOrder array (i.e., the first array).

[0136] Step 702: The note-taking application loads and initializes the AllPdfListOrder array.

[0137] For example, the PDFFragment class is also used to create a corresponding ForeGroundNoteAdapter object for the note. After the PDFFragment class completes the initialization of the AllPdfListOrder array, it sets the AllPdfListOrder array into the ForeGroundNoteAdapter object.

[0138] Step 703: The note-taking application determines whether the AllPdfListOrder array has been fully initialized. If the note-taking application detects that the AllPdfListOrder array has been fully initialized, proceed to step 704; if the note-taking application detects that the AllPdfListOrder array has not been fully initialized, proceed to step 708.

[0139] For example, after the ForeGroundNoteAdapter object is created, it can detect whether the AllPdfListOrder array has been initialized. When it detects that the AllPdfListOrder array has been initialized, it can call the onBindViewHolder method to determine whether the current note page has a corresponding local image, i.e., execute step 704. When it detects that the AllPdfListOrder array has not been initialized, it also needs to call the onBindViewHolder method, i.e., execute step 707.

[0140] In other words, regardless of whether the AllPdfListOrder array has been initialized, the ForeGroundNoteAdapter object will call the onBindViewHolder method to determine whether the current note page has a corresponding local image.

[0141] Step 704: The note-taking application determines whether there is a corresponding local image on the current note page. If the note-taking application detects that there is a corresponding local image on the current note page, proceed to step 705; if the note-taking application detects that there is no corresponding local image on the current note page, proceed to step 706.

[0142] For example, when the ForeGroundNoteAdapter object calls the onBindViewHolder method, if a corresponding local image is detected on the current note page, step 705 is executed, which binds the local image corresponding to the current page to the foreground layer. If no corresponding local image is detected on the current note page, the PDF content corresponding to the current page is retrieved from the AllPdfListOrder array, and the PDF content is converted into the corresponding image (hereinafter referred to as the PDF image).

[0143] Step 705: The note-taking application fills the foreground layer with the local image corresponding to the current note page.

[0144] For example, the foreground layer loads the local image based on the bound local image.

[0145] Step 706: The note-taking application fills the foreground layer with the PDF corresponding to the current note page.

[0146] For example, the ForeGroundNoteAdapter binds the PDF image and the foreground layer, and the foreground layer loads the PDF image based on the bound PDF image.

[0147] Step 707: The note-taking application determines whether there is a corresponding local image on the current note page. If the note-taking application detects that there is a corresponding local image on the current note page, it proceeds to step 705; if the note-taking application detects that there is no corresponding local image on the current note page, it proceeds to step 708.

[0148] For example, the ForeGroundNoteAdapter object calls the onBindViewHolder method to check if there is a corresponding local image on the current page. If it exists, step 705 is executed directly. When it is detected that there is no image, the foreground layer cannot be filled with the PDF content corresponding to the current page because the AllPdfListOrder array has not been initialized yet.

[0149] Step 708: The note application determines that the foreground layer is not working.

[0150] For example, even if the ForeGroundListener sets the foreground layer to be visible, it will not take effect because the ForeGroundNoteAdapter object detects that the AllPdfListOrder array has not been initialized and there is no corresponding local image on the current note page. Therefore, the foreground layer has no content to fill and it cannot be used.

[0151] In one example, when the handwriting layer notifies the ForeGroundListener that it has finished loading its content, or the background layer notifies the ForeGroundListener that it has finished loading its content, the ForeGroundListener determines whether both the handwriting layer and the background layer have finished loading by calling the second setting method. If the ForeGroundListener detects that both the handwriting layer and the background layer have finished loading, it removes the display of the foreground layer. If the ForeGroundListener detects that both the handwriting layer and the background layer have finished loading, it retains the foreground layer.

[0152] For example, when ForeGroundListener calls the setInVisibility method (the second setting method), it obtains the first piece of information indicating whether the background layer's content has finished loading. For instance, if backgroundIsFinished = false, it indicates the background layer's content has not finished loading; if backgroundIsFinished = true, it indicates the background layer's content has finished loading. ForeGroundListener can also obtain the second piece of information indicating whether the handwriting layer's content has finished loading. If NoteWritingIsFinished = false, it indicates the handwriting layer's content has not finished loading; if NoteWritingIsFinished = true, it indicates the handwriting layer's content has finished loading. When ForeGroundListener detects that both backgroundIsFinished and NoteWritingIsFinished are true, it performs the operation of setting the foreground layer to invisible (i.e., undoing the foreground layer).

[0153] The following is combined Figure 8 This section explains the process of opening notes on a mobile phone.

[0154] See Figure 8 In example (1), in response to a user opening the note-taking application icon on their phone, the phone's display shows the note-taking application's main interface 801. This main interface 801 displays the number of notes currently stored in the note-taking application (e.g., ...). Figure 8(1) shows “3 notes”, note search box 802 and the name of each note.

[0155] In response to the user clicking "Note 3", the note application retrieves the note page (e.g., page 1) from when the note (i.e., the handwritten note named "Note 3") was last closed, and uses that note page as the initial display page when the note is opened this time.

[0156] In the note-taking application, the PageViewAdapter executes the page binding method (i.e., the onBindViewHolder method), binding the content corresponding to the handwriting layer to the handwriting layer so that the handwriting layer can load the content corresponding to each page of the note. During the execution of the onBindViewHolder method, the PageViewAdapter calls the ForeGroundListener to set the foreground layer to a visible state. The StylusNoteAdapter obtains the background content of the note and loads the background layer content. Based on the bound content, the NoteWritingView loads the content of the first page of the note.

[0157] In response to the user clicking "Note 3", the note-taking application reads the full PDF file of the note from the database using the PDFFragment class. This full PDF file stores all the content of the note. The PDFFragment class parses the content of each page in the PDF file and saves the parsed content to the AllPdfListOrder array. The PDFFragment class creates a ForeGroundNoteAdapter object for this note (i.e., "Note 3") and sets the AllPdfListOrder array into this ForeGroundNoteAdapter object. After the ForeGroundNoteAdapter object detects that the AllPdfListOrder array has been initialized, it calls the onBindViewHolder method, which determines whether there is a corresponding local image for page 1. When the ForeGroundNoteAdapter object detects that there is a corresponding local image for the current page, it binds the local image for page 1 to the foreground layer, and the foreground layer loads the bound local image. Since the foreground layer has been set to visible by the ForeGroundListener, the local image is displayed on the screen after the foreground layer has finished loading. Because the foreground layer loads a local image, the loading speed is fast, resulting in a short time between the main interface of the note-taking application (801) and the display of the content in the foreground layer (806). Figure 8As shown in (3), the content of the foreground layer is displayed after 100 milliseconds. This allows users to seamlessly experience the transition from the main interface to the initial interface of the note.

[0158] In another example, the ForeGroundNoteAdapter object detects that the AllPdfListOrder array has not been fully initialized and calls the onBindViewHolder method. This method checks if there is a corresponding local image for page 1. When the ForeGroundNoteAdapter object detects that there is no corresponding local image for the current page, it reads the PDF content corresponding to page 1 from the AllPdfListOrder array and converts it into an image (hereinafter referred to as a PDF image). The foreground layer loads this PDF image. Since the foreground layer has been set to visible by the ForeGroundListener, the PDF image is displayed on the screen after it has finished loading. Because the foreground layer loads a PDF image, and the AllPdfListOrder array takes time to parse the PDF file and convert it into a PDF image (this time is less than the time it takes for the handwriting layer to load content or the background layer to load background content), the foreground layer loads a PDF image. Figure 8 As shown in (1), (2) and (4), when the first page of notes contains a lot of content, the display screen first shows a white screen. After 0.6 seconds, when the PDF image of the foreground layer is loaded, the image of the foreground layer is displayed.

[0159] In another example, when the handwritten note was last closed, the display showed pages including at least two pages from that note (e.g., ...). Figure 9 When the image shows a portion of page 1 and a portion of page 2, the note-taking application follows the above... Figure 8 As shown, the foreground layers of the first and second page notes are loaded separately, and both pages are displayed on the screen. Since the screen has a limited size, the final display will look like this. Figure 9 The effect shown.

[0160] It should be noted that the foreground layer display scenario in this application embodiment is not only applicable to the scenario of opening handwritten notes, but also to the scenario of the display screen switching from landscape to portrait mode, or switching from portrait to landscape mode, or zooming in or out of the current note page in a split-screen view. In other words, when the electronic device detects a landscape / portrait switching operation, a zooming in or out of the current note page in a split-screen view, or an opening of a note page, the handwritten note display method in this application embodiment will be triggered.

[0161] This application also provides a chip system including at least one processor and at least one interface circuit. The processor and the interface circuit are interconnected via lines. For example, the interface circuit can be used to receive signals from other devices (e.g., the memory of an electronic device). As another example, the interface circuit can be used to send signals to other devices (e.g., the processor). Exemplarily, the interface circuit can read instructions stored in the memory and send the instructions to the processor. When the instructions are executed by the processor, the electronic device can perform the steps in the above embodiments. Of course, the chip system may also include other discrete devices, and this application does not specifically limit this.

[0162] This embodiment also provides a computer storage medium storing computer instructions. When these computer instructions are executed on an electronic device, the electronic device performs the aforementioned method steps to implement the handwritten note display method described in the above embodiment. The storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.

[0163] This embodiment also provides a computer program product that, when run on a computer, causes the computer to perform the aforementioned steps to implement the handwritten note display method described in the above embodiment.

[0164] In this embodiment, the electronic device, computer storage medium, computer program product or chip are all used to execute the corresponding handwritten note display method provided above. Therefore, the beneficial effects that can be achieved can be referred to the beneficial effects of the corresponding method provided above, and will not be repeated here.

[0165] Any content in the various embodiments of this application, as well as any content in the same embodiment, can be freely combined. Any combination of the above content is within the scope of this application.

[0166] The embodiments of this application have been described above with reference to the accompanying drawings. However, this application is not limited to the specific embodiments described above. The specific embodiments described above are merely illustrative and not restrictive. Those skilled in the art can make many other forms under the guidance of this application without departing from the spirit and scope of the claims, and all of these forms are within the protection scope of this application.

Claims

1. A method for displaying handwritten notes, characterized in that, Applied to electronic devices, including: When a first object lift-up event is detected in the handwriting area of ​​an electronic device and no touch event of the first object in the handwriting area is detected within a first preset time period, it is determined that the content of the handwriting layer of the current note page has changed, wherein the first object includes a finger or a stylus. The display content of the current note page is obtained and saved as a local image corresponding to the current note page. The display content of the current note page includes the first data of the handwriting layer and the background image of the background layer in the current note page. In response to the user's first input, the selected handwritten notes page that needs to be displayed at the first moment is obtained as the first page. Each note page includes a foreground layer, a handwriting layer, and a background layer. The foreground layer is displayed on the handwriting layer, and the handwriting layer is displayed on the background layer. The handwriting layer is used to display the first data recorded by the user on the note page, and the background layer is used to display the background image of the note page. Obtain the target data of the first page, wherein the target data is a local image containing all the content of the first page or a PDF containing all the content of the first page; The process of obtaining the target data from the first page includes: Determine whether the first page contains a corresponding local image; If so, the local image corresponding to the first page shall be used as the target data; If not, the PDF content corresponding to the first page will be used as the target data; Use the target data to populate the foreground layer of the first page; The foreground layer of the first page is displayed at the first moment; When it is detected that the handwriting layer of the first page has finished loading the first data and the background layer of the first page has finished loading the background image, the foreground layer of the first page is removed from display.

2. The method according to claim 1, characterized in that, Before retrieving the selected handwritten note page that needs to be displayed immediately as the first page in response to the user's first input, the method further includes: When a change is detected in any page parameter of the current note page, the display content of the current note page is obtained and saved as a local image corresponding to the current note page. The display content of the current note page includes the first data of the handwriting layer and the background image of the background layer in the current note page. The page parameters include the page size, page color, and page orientation.

3. The method according to claim 1, characterized in that, Before retrieving the selected handwritten note page that needs to be displayed immediately as the first page in response to the user's first input, the method further includes: When the system detects that the user has entered a second operation to save the current note page, it obtains the display content of the current note page and saves it as a local image corresponding to the current note page. The display content of the current note page includes the first data of the handwriting layer and the background image of the background layer in the current note page.

4. The method according to any one of claims 1 to 3, characterized in that, The method further includes: In response to the first operation of user input, the PDF file corresponding to the handwritten notes is read from the database, and the PDF file is used to record the content of each note page in the handwritten notes; Parse the PDF file; Store the parsed PDF file into the first array; Initialize the first array; The step of obtaining the target data of the first page includes: Check whether the initialization of the first array is complete, and obtain the first detection result; Detect whether the first page contains a corresponding local image to obtain a second detection result; Based on the first detection result and the second detection result, the target data of the first page is determined.

5. The method according to claim 4, characterized in that, The step of determining the target data of the first page based on the first detection result and the second detection result includes: When a corresponding local image is detected on the first page, the local image corresponding to the first page is used as the target data; When it is detected that the first array has been initialized and that the first page does not have a corresponding local image, the PDF content corresponding to the first page is obtained from the first array, and the obtained PDF content is used as the target data.

6. The method according to claim 5, characterized in that, The method further includes: When it is detected that the first array has not been initialized and that the first page does not have a corresponding local image, the foreground layer of the first page is removed from display or the target data is determined to be empty.

7. The method according to any one of claims 1 to 3, characterized in that, Before using the target data to populate the foreground layer of the first page, the method further includes: Set the size of the foreground layer of the first page to the maximum size supported by the first page.

8. The method according to any one of claims 1 to 3, characterized in that, The electronic device includes a multi-view sliding switcher adapter, a foreground layer listener, and a background layer adapter; The method further includes: In response to the first operation of user input, the multi-view sliding page adapter binds the content of each note page in the handwritten notes to the corresponding note page, so that the background layer adapter can load the background image of the handwritten notes and the handwriting layer can load the first data corresponding to each note page; During the process of the multi-view sliding page adapter binding the content of each note page in the handwritten notes to the corresponding note page, the foreground layer listener is called to set the foreground layer of the first page to a visible state; The background layer adapter notifies the foreground layer listener through a first callback function that the background layer adapter has finished loading the background image of the first page; The handwriting layer notifies the foreground layer listener that it has finished loading the first data of the first page through the second callback function; When the foreground layer listener detects that the handwriting layer of the first page has finished loading the first data and the background layer of the first page has finished loading the background image, it deselects the foreground layer of the first page, including: The foreground layer listener sets the foreground layer of the first page to an invisible state.

9. The method according to any one of claims 1 to 3, characterized in that, The first operation includes any one of the following operations: opening the handwritten notes, switching between portrait and landscape modes, switching from single-screen display to multi-screen display, switching from multi-screen display to single-screen display, and zooming in or out of the handwritten notes when the electronic device is in split-screen mode.

10. An electronic device, characterized in that, include: A memory and a processor, wherein the memory is coupled to the processor; The memory stores program instructions that, when executed by the processor, cause the electronic device to perform the handwritten note display method according to any one of claims 1 to 9.

11. A computer-readable storage medium comprising a computer program, characterized in that, When the computer program is run on an electronic device, the electronic device performs the method for displaying handwritten notes as described in any one of claims 1 to 9.

Images