Window control arrangement method, system and storage medium for code reading

By using columnar layout and optimizing insertion operations, the problems of unintuitive window layout and high complexity in code reading are solved, improving reading efficiency and user experience.

CN116244018BActive Publication Date: 2026-05-08CHONGQING JUEXUE NETWORK TECH CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
CHONGQING JUEXUE NETWORK TECH CO LTD
Filing Date
2023-01-29
Publication Date
2026-05-08

AI Technical Summary

Technical Problem

In existing technologies, the window layout is not intuitive for code reading, file switching is frequent, which affects reading efficiency, and opening a new window can cause existing windows to be obscured or increase complexity.

Method used

It adopts a column layout, with several code editors in each column. It optimizes window insertion by estimating the insertion position and connecting the lines, and supports insertion, moving, sliding, stretching and scaling operations, reducing overlap and complexity.

Benefits of technology

It improves code reading efficiency, reduces user memory burden and repetitive operations, and ensures a clear window layout that conforms to user reading habits.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN116244018B_ABST
    Figure CN116244018B_ABST
Patent Text Reader

Abstract

The application relates to the technical field of code development, in particular to a window control arrangement method and system for code reading and a storage medium, wherein the method comprises the following steps: arranging code editors in columns on a display page, a plurality of code editors are arranged in each column, and a spacing column is arranged between two columns; if an operation signal is acquired, the code editors are subjected to an insertion operation, a moving operation, a sliding operation, a stretching operation or a zooming operation according to the operation signal; wherein the insertion operation comprises the following steps: if a new code editor is opened by taking any code editor as a reference code editor, a connection relationship exists between the reference code editor and the new code editor, and the insertion position of the new code editor is acquired according to the position of the reference code editor and the current connection relationship of the column where the reference code editor is located. According to the scheme, the code editors are arranged in columns, and the insertion can be optimized, so that the code reading is facilitated, and the reading efficiency is improved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This invention relates to the field of code development technology, specifically to a window control arrangement method, system, and storage medium for code reading. Background Technology

[0002] When reading source code, analyzing the main logical structure of a project, or viewing the specific functional implementation mechanism, it is necessary to jump between a large number of files or folders, because different functions are distributed in different files and / or folders according to a certain organizational structure.

[0003] Current technologies can only display different code files and code through tabs or split screens. This is inconvenient for users when reading source code, analyzing the main logical structure of a project, or viewing specific functions, because the display is not intuitive enough and the effective information presented is not rich enough. Users need to switch between code files repeatedly, which makes reading inconvenient and limits reading efficiency. Furthermore, when opening a new code file in the display page, the new windows are arranged haphazardly, which is not conducive to user viewing. As more code files are opened, users need to spend time searching for the code file they need among several windows, and new windows can also obstruct or affect the reading of already opened windows, further impacting user reading efficiency. Summary of the Invention

[0004] One of the objectives of this invention is to provide a window control arrangement method for code reading, which enables columnar layout of the code editor and optimized insertion to facilitate reading and improve reading efficiency.

[0005] The basic solution provided by this invention is a window control arrangement method for code reading, which includes the following:

[0006] The code editors are laid out in columns on the display page, with several code editors in each column and a separator bar between the two columns.

[0007] If an operation signal is received, the code editor will perform an insertion, movement, sliding, stretching, or scaling operation based on the operation signal.

[0008] The insertion operation includes: if any code editor is used as a reference code editor, and a new code editor is opened, then there is a connection between the reference code editor and the new code editor, and the insertion position of the new code editor is obtained by the estimated insertion position method, wherein the estimated insertion position method is to obtain the insertion position based on the position of the reference code editor and the current connection relationship of its column.

[0009] The beneficial effects of basic solution one: The code editor is laid out in a column, with several code editors in each column and a separator between the two columns. Multiple code editors can be displayed on the same display page to display multiple code files, avoiding switching between multiple files and reducing the memory burden on users when reading source code.

[0010] Furthermore, depending on the different operation signals received, different operations can be performed on the code editor on the display page, including but not limited to: insertion operation, movement operation, sliding operation, stretching operation, or scaling operation; among them, the insertion operation is not simply inserting the code editor directly into a preset position, which would seriously affect the current layout of the display page. Instead, when performing the insertion operation, if any code editor is used as a reference code editor and a new code editor is opened, there is a connection between the reference code editor and the new code editor, and the insertion position of the new code editor is obtained through the estimated insertion position method, which is to obtain the insertion position based on the position of the reference code editor and the current connection relationship of its column.

[0011] Each newly opened code editor is connected to its reference code editor. This connection is visualized on the display page, allowing users to intuitively understand the relationship between the newly opened code editor and its reference editor. In other words, the relationship between the code (in the reference code editor) and the content being navigated to (in the new code editor). Furthermore, all the new code editors are arranged in a column layout with no overlap or intersection. No switching is required when viewing any code editor. Therefore, no matter how many code editors are open, the reading experience will not be affected by the large number of newly opened code editors.

[0012] Furthermore, the insertion position is determined by estimating the insertion position based on the location of the reference code editor and the current connection relationships in its column. This addresses the issue of increased complexity caused by overlapping connections as more code editors are opened and the number of connections on the display page increases. By estimating the insertion position, the insertion point with the least impact on the current connection relationships is selected when a new code editor is opened. This minimizes the risk of connection intersections as the number of connections increases, reduces display page complexity, reduces the impact of new code editors on the layout of existing code editors, better aligns with user reading habits, reduces repetitive user operations, and facilitates a clearer display of the project structure.

[0013] In summary, this solution provides a columnar layout for the code editor and optimizes insertion to facilitate reading and improve reading efficiency.

[0014] Furthermore, the insertion operation also includes: if no code editor is used as the reference code editor, when a new code editor is opened, the insertion position of the new code editor is the preset position of the preset column.

[0015] Beneficial effect: If no code editor is used as a reference code editor, the insertion position cannot be obtained based on the position of the reference code editor and the current connection relationship of its column. Therefore, the insertion position of the new code editor is the preset position of the preset column, thus determining the insertion position of the new code editor when there is no reference code editor.

[0016] Furthermore, the operation signals include: a code file open signal and a symbol jump signal;

[0017] If a code file is opened, an insertion operation is performed without using any code editor as the reference code editor, and a new code editor is opened to display the contents of the selected code file;

[0018] If a code element jump signal is obtained, the jump content is obtained based on the selected code element. It is then determined whether the jump content is in an already opened code editor. If so, a connection is added with the selected code element as the starting point and the jump content as the ending point. If not, an insertion operation is performed, using the code editor where the selected code element is located as the reference code editor. A new code editor is opened to display the jump content, and a connection is added with the selected code element as the starting point and the jump content as the ending point.

[0019] Beneficial effects: If a code file is opened, no code editor is used as the reference code editor. Instead, a new code editor is inserted at a preset position to display the code of the selected code file. Users can select files according to their needs, and a code editor will be opened at the preset position to display the code. Multiple files can be opened simultaneously. If a code element jump signal is received, the jump content is obtained based on the selected code element. It is then determined whether the jump content is in an already opened code editor. If so, a connection is added between the selected code element and the jump content, without needing to open a new code editor.

[0020] Furthermore, the connection relationship is a connection relationship that starts with the selected code element and ends with the target code element in the jump content;

[0021] The method for estimating the insertion position includes:

[0022] Get all the connections between all code editors in the column containing the reference code editor;

[0023] Based on the connection relationships, the connection relationships are filtered to obtain valid connections; where a valid connection is the column below the column of its starting point, where the end point of the connection is located.

[0024] The position information of the selected symbol is compared with the position information of the starting point of the valid connection. The valid connection is divided into an upper half connection and a lower half connection. The position information of the starting point of the upper half connection is less than the position information of the selected symbol, and the position information of the starting point of the lower half connection is greater than the position information of the selected symbol. The comparison of position information is based on the selected symbol. If the starting point of the connection is before the selected symbol, its position information is less than the position information of the selected symbol. If the starting point of the connection is after the selected symbol, its position information is greater than the position information of the selected symbol.

[0025] Pair the lines connecting the upper half and the lower half together to form several clamping pairs;

[0026] The squeezing pairs are filtered to obtain valid squeezing pairs; where a valid squeezing pair is a squeezing pair whose two connecting lines do not intersect.

[0027] Determine whether a valid clamping pair has been obtained. If so, among the valid clamping pairs, select the one with the smallest distance between the starting point and the selected symbol, and use it as the valid clamping pair for the insertion position. Then, take the next position of the column containing the endpoint of the line connecting the upper half of the valid clamping pair as the insertion position. If not, use the preset position as the insertion position.

[0028] Beneficial effects: The system filters connection relationships to obtain valid connections. These valid connections are then categorized based on their starting point's position relative to the selected symbol (either before or after it). Upper and lower connections are paired to form several clamping pairs, with each clamping pair sandwiching another clamping pair. These clamping pairs are then filtered to obtain valid pairs where the two connections do not intersect, reducing subsequent data processing and interference, and improving the accuracy of insertion position identification. Finally, it determines whether a valid clamping pair has been obtained. If so, the pair with the smallest distance between its starting point and the selected symbol is selected as the valid clamping pair for insertion. The next position in the column following the endpoint of the upper connection in this valid clamping pair is then used as the insertion position, thus obtaining a reasonable insertion position. This minimizes the impact of the newly opened code editor on the original layout and reduces the complexity of the display page.

[0029] Furthermore, the operation signal also includes: a movement operation signal;

[0030] If a move operation signal is received, the move operation is performed, and the selected code editor is moved to any position in any column according to the move operation signal.

[0031] Beneficial effects: Users can drag and drop to move the selected code editor to any position in any column, making it easy to adjust the layout.

[0032] Furthermore, the operation signal also includes: a sliding operation signal;

[0033] If a sliding operation signal is received, the sliding operation is performed. Based on the sliding operation signal, the selected code editor is controlled to slide in the corresponding column, and only the spacing between the code editors is changed, and the code editors do not overlap.

[0034] If the code editor slides in the corresponding column, and the sliding distance is less than or equal to the interval between adjacent code editors in the same column, the positions of the other code editors in the same column will not change.

[0035] If the sliding distance is greater than the interval between adjacent code editors in the same column, then push the code editor in the sliding direction to slide to the corresponding position.

[0036] Beneficial effects: During the swiping operation, only the spacing between the code editors changes, and the code editors do not overlap. Therefore, the relative positions of the code editors and the relative positions of the connecting lines do not change. This allows the swiping process to meet the user's swiping requirements without affecting the original layout, ensuring that the complexity of the displayed page does not increase due to swiping.

[0037] Furthermore, the operation signals also include: upper and lower edge stretching operation signals and interval column moving operation signals;

[0038] If the top and bottom edge stretching operation signal is obtained, the top and bottom edge stretching operation is performed. Based on the top and bottom edge stretching operation signal, the selected edge is moved to adjust the height of the code editor.

[0039] If the edge of the code editor moves, and the moving distance is less than or equal to the interval between adjacent code editors in the same column, then the positions of the other code editors in the same column remain unchanged.

[0040] If the movement distance is greater than the interval between adjacent code editors in the same column, then the code editor in the movement direction will be moved to the corresponding position.

[0041] If a separator bar movement operation signal is received, the left and right sides are stretched. Based on the separator bar movement operation signal, the selected separator bar is moved, and the width of all code editors in the corresponding column is adjusted.

[0042] Beneficial effects: The top and bottom drag operation can change the height of the code editor, but does not change the relative position between the code editors or the relative position of the connecting lines. This ensures that the height of the code editor meets the user's needs without affecting the original layout, and that the complexity of the display page does not increase due to scrolling.

[0043] By using a separator bar to change the width of all code editors in the corresponding column, the display structure becomes concise while also providing users with the flexibility to freely adjust the window size.

[0044] Furthermore, the operation signal also includes: a scaling operation signal;

[0045] If a scaling operation signal is received, the scaling operation is performed. Based on the scaling operation signal, all code editors are controlled to zoom in or out by the corresponding ratio.

[0046] Beneficial effects: Based on the scaling operation signal, all code editors are controlled to be enlarged or reduced proportionally, thereby performing proportional enlargement or reduction operations on all code editors, making it easier for users to adjust the size of all code editors and increasing the flexibility of window adjustment.

[0047] The second objective of this invention is to provide a window control and arrangement system for code reading, which provides a columnar layout for the code editor and allows for optimized insertion to facilitate reading and improve reading efficiency.

[0048] The present invention provides a second basic solution: a window control and arrangement system for code reading, which adopts the above-mentioned window control and arrangement method for code reading.

[0049] The beneficial effects of basic scheme two: This system uses a column layout for the code editor, with several code editors in each column and a separator between the two columns. Multiple code editors can be displayed on the same display page to display multiple code files, avoiding switching between multiple files and reducing the memory burden on users when reading source code.

[0050] Furthermore, depending on the different operation signals received, different operations can be performed on the code editor on the display page, including but not limited to: insertion operation, movement operation, sliding operation, stretching operation, or scaling operation; among them, the insertion operation is not simply inserting the code editor directly into a preset position, which would seriously affect the current layout of the display page. Instead, when performing the insertion operation, if any code editor is used as a reference code editor and a new code editor is opened, there is a connection between the reference code editor and the new code editor, and the insertion position of the new code editor is obtained through the estimated insertion position method, which is to obtain the insertion position based on the position of the reference code editor and the current connection relationship of its column.

[0051] Each newly opened code editor is connected to its reference code editor. This connection is visualized on the display page, allowing users to intuitively understand the relationship between the newly opened code editor and its reference editor. In other words, the relationship between the code (in the reference code editor) and the content being navigated to (in the new code editor). Furthermore, all the new code editors are arranged in a column layout with no overlap or intersection. No switching is required when viewing any code editor. Therefore, no matter how many code editors are open, the reading experience will not be affected by the large number of newly opened code editors.

[0052] Furthermore, the insertion position is determined by estimating the insertion position based on the location of the reference code editor and the current connection relationships in its column. This addresses the issue of increased complexity caused by overlapping connections as more code editors are opened and the number of connections on the display page increases. By estimating the insertion position, the insertion point with the least impact on the current connection relationships is selected when a new code editor is opened. This minimizes the risk of connection intersections as the number of connections increases, reduces display page complexity, reduces the impact of new code editors on the layout of existing code editors, better aligns with user reading habits, reduces repetitive user operations, and facilitates a clearer display of the project structure.

[0053] In summary, this solution provides a columnar layout for the code editor and optimizes insertion to facilitate reading and improve reading efficiency.

[0054] The third objective of this invention is to provide a window-controlled arrangement storage medium for code reading, which allows for columnar layout of the code editor and optimized insertion to facilitate reading and improve reading efficiency.

[0055] The present invention provides a third basic solution: a window control arrangement storage medium for code reading, wherein the storage medium stores a computer program, and when the computer program is executed by a processor, it implements the steps of the window control arrangement method for code reading.

[0056] The beneficial effects of basic solution three: This solution provides a columnar layout for the code editor and allows for optimized insertion, which facilitates reading, improves reading efficiency, and facilitates the application and promotion of window control and arrangement methods for code reading. Attached Figure Description

[0057] Figure 1 This is a schematic diagram of a column layout in an embodiment of the window control arrangement method for code reading according to the present invention. Detailed Implementation

[0058] The following detailed description illustrates the specific implementation method:

[0059] The reference numerals in the accompanying drawings include: Resource Tree 1, Canvas 2, Code Editor 3, Connection 4, Target Code 5.

[0060] Example 1

[0061] This embodiment is basically as shown in the appendix. Figure 1 As shown: Window control arrangement methods for code reading, including:

[0062] The code editor 3 is displayed in a column layout, with several code editors 3 in each column and separator bars between columns. This embodiment is based on a web IDE architecture similar to VS Code, but is not limited to native architectures such as IntelliJ IDEACE, nor is it limited to web platforms or standalone application distribution. This embodiment uses Monaco as the code editor 3 for code display.

[0063] The display page includes: Resource Tree 1 and Canvas 2; Resource Tree 1 is used to display project files, which contain several code files. The filenames of the code files are displayed through Resource Tree 1. Canvas 2 is used to display the code editor 3.

[0064] When a code file is opened, the code editor 3 unfolds flat on the canvas 2, renders the code within the code editor 3, and collapses the code according to the code folding signal. In this embodiment, a code file can be opened by double-clicking its filename in the resource tree 1.

[0065] Specifically, the code editors 3 are arranged in a column layout in canvas 2, with several code editors 3 in each column and a spacing bar between two columns. Each code editor in a column has a default height DEFAULT_HEIGHT and a default spacing with the next code editor 3 in the same column. In this embodiment, the default spacing is 0. The x-axis coordinate of the nth code editor 3 in the mth column is equal to the sum of the widths of the 1st to the (m-1th)th columns, and the y-axis coordinate is equal to the sum of the spacing and height of the 1st to the (n-1th)th code editor 3 in that column and its own spacing, where spacing is the distance between the spacings, i.e., the distance between the spacings of two code editors 3 in the same column. The spacing bar corresponds one-to-one with the column where the code editor 3 is located. Each time a new column containing a code editor 3 is added, a new spacing bar is added.

[0066] If an operation signal is received, the code editor will perform an insertion operation, a movement operation, a sliding operation, a stretching operation, or a scaling operation based on the operation signal. The operation signals include: code file opening operation signal, code element jump operation signal, movement operation signal, sliding operation signal, top and bottom stretching operation signal, separator bar movement operation signal, and scaling operation signal.

[0067] If a code file open signal is received, an insertion operation is performed without using any code editor as a reference. A new code editor is opened to display the contents of the selected code file. Furthermore, if no code editor is used as a reference, the new code editor is inserted at a preset position within a preset column. In this embodiment, the preset position is the first or last position of the first column. If code editor 3 does not exist in canvas 2, no column exists on canvas 2. When code editor 3 is opened, the column containing code editor 3 and the separator bar are generated. The code file open signal is generated by selecting a code file. In this embodiment, double-clicking the corresponding code file name in the resource tree generates the code file open signal.

[0068] If a code element jump signal is obtained, the jump content is obtained based on the selected code element. It is then determined whether the jump content is in an already opened code editor. If so, a connection is added with the selected code element as the starting point and the jump content as the ending point. If not, an insertion operation is performed. The code editor where the selected code element is located is used as the reference code editor. A new code editor is opened to display the jump content, and a connection is established with the selected code element as the starting point and the jump content as the ending point. Furthermore, if any code editor is used as the reference code editor and a new code editor is opened, a connection exists between the reference code editor and the new code editor. The insertion position of the new code editor is obtained through an estimated insertion position method, which involves obtaining the insertion position based on the position of the reference code editor and the current connection relationship of its column.

[0069] The code element jump signal is the input code element jump signal when a code element is clicked in an open code editor; according to the selected code element, the jump content is obtained. Specifically, static language parsing is performed on the selected code element, and the jump content of the code element is obtained based on the parsing result; the jump content includes, but is not limited to, definitions, type definitions, implementations, references, declarations and / or type declarations. The jump content may exist in the reference code editor or in other code files, but any code file can only be opened once in the column layout, that is, each code editor 3 has a unique path parameter representing the code file path.

[0070] The connection relationship is a connection with the selected code element as the starting point and the jump content as the ending point. Specifically, the position information of the selected code element is obtained as the starting point information, and the position information of the jump content is obtained as the ending point information. Based on the starting point information and the ending point information, a connection relationship connecting the starting point and the ending point is determined. Assuming the code element jump signal, the selected code element is the code element word0 in the i0 row and j0 column of the m0th column and the n0th editor. A code editor 3 is opened at the insertion position, the code element word1 in the i1th row and j1st column of the m1th column of the code editor 3 is used as the target code element 5, and a connection 4 is generated from word0 to word1. l0, word0 is the starting point of line 4, and word1 is the ending point of line 4; the coordinates of word0 are represented by (m0,n0,i0,j0), and the coordinates of the connection relationship are represented by (word0,word1) or ((m0,n0,i0,j0),(m1,n1,i1,j1)); there is a connection relationship between each newly opened code editor and its reference code editor. This connection relationship can be visualized on the display page, so that users can intuitively understand the relationship between the newly opened code editor and its reference code editor during the reading process.

[0071] In this embodiment, the method for estimating the insertion position uses the optimal squeeze method to calculate the insertion position of the new code editor 3:

[0072] Get all the connection relationships of all code editors 3 in the column where the reference code editor is located; when the m0th column and n0th code editor 3 is used as the reference code editor, the code jump signal is selected from the code word 0 in the i0th row and j0th column of the reference code editor. When a new code editor 3 is opened, first get all the connection relationships of all code editors 3 in the m0th column.

[0073] Based on the connection relationships, the connection relationships are filtered to obtain 4 valid connections; where a valid connection is the connection whose endpoint column is the next column after the starting column, i.e., a connection where m1=m0+1; in this embodiment, based on the connection relationships, connection 4 is filtered to obtain a valid connection queue list, which is a queue list containing all valid connections.

[0074] The position information of the selected symbol is compared with the position information of the starting point of the valid connection 4, and the valid connection 4 is divided into the upper half connection 4 and the lower half connection 4. In this embodiment, the position information of the starting point of the connection in the list is compared with the position information of the selected symbol, and the list is divided into the upper half connection queue and the lower half connection queue.

[0075] Among them, the position information of the starting point of the upper half of the connection line 4 is less than the position information of the selected symbol, and the position information of the starting point of the lower half of the connection line 4 is greater than the position information of the selected symbol; and both the upper half of the connection line 4 and the lower half of the connection line 4 are sorted from small to large according to the distance between their starting points and the selected symbol; the essence of the comparison of the size of the position information is to use the selected symbol as a reference to compare whether the starting point is before or after the selected symbol. Specifically, for two symbols word0 and word1 in the same column, their sizes are first determined by the n value, secondly by the i value, and then by the j value. If word0 appears above word1, that is, n0 < n1 or n0 == n1 && i0 < i1 or n0 == n1 && i0 == i1 && j0 < j1, then word0 is less than word1, otherwise, word0 is greater than word1; the sizes of the two connection lines 4 are determined by their respective starting points, that is, if l0.word0 > l1.word0, then l0 is called greater than l1; in this embodiment, the position information of the starting point of each valid connection line 4 in the valid connection line 4 queue list is compared with the position information (m0, n0, i0, j0) of the selected symbol. The valid connection line 4 queue greater than (m0, n0, i0, j0) enters the queue l_list_up (the upper half of the connection line), and the valid connection line 4 queue less than (m0, n0, i0, j0) enters the queue l_list_down (the lower half of the connection line). Then, the valid connection lines 4 in l_list_up are sorted from large to small, and l_list_down is sorted from small to large. In this way, the index value of each valid connection line 4 in the queue indicates the distance between its starting point and the selected symbol.

[0076] Pair up the upper half of the connection line 4 and the lower half of the connection line 4 two by two to form a number of sandwich pairs; specifically, pair up the valid connection lines 4 in l_list_up and the valid connection lines 4 in l_list_down to form a sandwich pair list pairs_list, and each sandwich pair has a weight value, and the weight value is the sum of the index values of the two valid connection lines 4 in l_list_up and l_list_down respectively;

[0077] Filter the sandwich pairs to obtain valid sandwich pairs, where a valid sandwich pair is a sandwich pair where the two connecting lines do not cross; specifically, two valid connecting lines 4l0 and l1 can form a sandwich pair p0, denoted as (l0, l1); if l0 and l1 do not cross, that is, l0.word0 > l1.word0 && l0.word1 > l1.word1 or l0.word0 < l1.word0 && l0.word1 < l1.word1, then (l0, l1) is a valid sandwich pair, otherwise, (l0, l1) is an invalid sandwich pair, where l0.word0 and l1.word0 are the starting points of 10 and 11 respectively, and l0.word1 and l1.word1 are the ending points of 10 and 11 respectively; filter out the invalid sandwich pairs in pairs_list to obtain valid sandwich pairs; and sort the valid sandwich pairs in pairs_list from smallest to largest according to the weight value;

[0078] Judge whether a valid sandwich pair is obtained. If so, among the valid sandwich pairs, obtain the valid sandwich pair with the smallest distance between the starting point and the selected symbol element as the insertion position valid sandwich pair, and use the next position of the column where the ending point of the upper half connecting line 4 in the insertion position valid sandwich pair is located as the insertion position; if not, use the preset position as the insertion position;

[0079] Specifically, judge whether pairs_list is non-empty. If so, obtain the first valid sandwich pair in pairs_list as the insertion position valid sandwich pair, and use the next position of the column where the ending point of the upper half connecting line 4 in the insertion position valid sandwich pair is located as the insertion position. That is, the position of the newly inserted code editor 3 is below the ending point of the upper half connecting line 4 in the first valid sandwich pair in pairs_list. That is, the n1 value of the newly created connecting line 4 is equal to pairs_list[0].l0.word1.n1 + 1;

[0080] If not, use the preset insertion position as the insertion position. The principle for selecting the preset insertion position in this embodiment is:

[0081] If l_list_up is non-empty, the preset insertion position is below the ending point of the first valid connecting line 4 in l_list_up. That is, the n1 value of the newly created connecting line 4 is equal to l_list_up[0].word1.n1 + 1;

[0082] If l_list_up is empty and l_list_down is non-empty, the preset insertion position is above the ending point of the first valid connecting line 4 in l_list_down. That is, the n1 value of the newly created connecting line 4 is equal to l_list_down[0].word1.n1;

[0083] If l_list_up is empty and l_list_down is empty, the default insertion position is the bottom of the next column in the reference code editor.

[0084] If a move operation signal is received, the move operation is performed. According to the move operation signal, the selected code editor 3 is moved to any position in any column. Specifically, click on the code editor 3 to be moved to perform the move. If the destination of the move originally has a code editor 3, the original position of the code editor 3 will be adaptively changed, that is, it will slide down accordingly.

[0085] If a sliding operation signal is received, the sliding operation is performed. Based on the sliding operation signal, the selected code editor 3 is controlled to slide in the corresponding column, and only the spacing is changed, so that the code editors 3 do not overlap.

[0086] Specifically, code editor 3 slides in the corresponding column. If the sliding distance is less than or equal to the spacing of adjacent code editors 3 in the same column, the positions of the other code editors 3 in the same column will not change.

[0087] If the sliding distance is greater than the spacing of the adjacent code editors 3 in the same column, then the code editor 3 in the sliding direction will be moved to the corresponding position. That is, the sliding direction is the same, and the sliding distance is the sliding distance of the selected code editor 3 minus the spacing.

[0088] Specifically, when swiping upwards, the spacing of the selected code editor 3 is reduced to compensate for the upward swipe distance. When the swipe distance continues to increase, even if its own spacing is reduced to 0, it is still insufficient to compensate for the upward swipe distance. Then, the spacing of the previous code editor 3 is reduced sequentially until the spacing of all the code editors 3 above is reduced to 0, which means that the code editors 3 are in close contact and cannot be swipe upwards any further. In order to keep all the code editors 3 below in their original positions, the spacing of the first code editor 3 below the selected code editor 3 should be added to the sum of the reduction values ​​of all the spacing above it.

[0089] When swiping down, the spacing of the selected code editor 3 is equal to the sum of its original spacing and the swipe distance. The spacing of the code editors 3 below the selected code editor 3 should decrease sequentially to compensate for the downward swipe distance, until the spacing of all the editors below decreases to 0.

[0090] In this embodiment, the horizontal direction to the right is the positive x-axis, and the vertical direction downward is the positive y-axis. The interval of the nth code editor 3 is spacing. n ;

[0091] When the nth code editor 3 is selected and slid upwards (i.e., dragY < 0), where the plus or minus sign in dragY indicates the sliding direction of the selected code editor 3 and the number indicates the sliding distance, the spacing of the selected code editor 3 and the code editor 3 above it in the same column is iteratively decreased until dragY is fully compensated or the spacing is reduced to 0. Specifically:

[0092] S101. Perform the operation on the nth code editor 3: dragY = dragY + spacing n and update spacing n =Math.max(0, dragY), where Math.max(0, dragY) means selecting the larger value between 0 and dragY;

[0093] S102. Determine if n is equal to 1. If yes, execute S104; otherwise, execute S103. If n=1, it means that all the code editors above have been traversed.

[0094] S103. Determine if dragY is less than 0. If yes, then n = n - 1 and execute S101; otherwise, execute S104.

[0095] S104, End.

[0096] For the first code editor 3 selected below the chosen code editor 3, i.e., the (n+1)th code editor 3, its spacing n+1 =spacing n+1 +Math.min(-dragY,spacing1+spacing2+...+spacing n Because when -dragY <spacing1+spacing2+...+spacing n When -dragY >= spacing1 + spacing2 + ... + spacing, the sum of all spacing reduction values ​​is -dragY. n At that time, the sum of all spacing reduction values ​​is spacing1 + spacing2 + ... + spacing n Therefore, spacing is executed. n+1 =spacing n+1 +Math.min(-dragY,spacing1+spacing2+...+spacing nTo keep the position of the (n+1)th editor unchanged, Math.min(-dragY, spacing1+spacing2+...+spacing) is used. n () indicates the selection of -dragY and spacing1+spacing2+...+spacing n The smallest value in the middle;

[0097] When dragging the nth editor downwards (dragY > 0), increase the spacing of the nth code editor 3, while iteratively decreasing the spacing of the code editor 3 below the selected code editor 3 in the same column, until dragY is fully compensated or all spacing is reduced to 0; specifically:

[0098] S101. Perform an operation on the nth code editor 3, spacing. n =spacing n +dragY;

[0099] S102. Determine if there is an (n+1)th code editor 3. If yes, execute S103; otherwise, execute S106.

[0100] S103. Perform the operation on the (n+1)th code editor 3: dragY = dragY - spacing n+1 and update spacing n+1 =Math.max(0, -dragY);

[0101] S104. Determine if n+1 is equal to the total number of code editors 3 in the same column. If yes, execute S106; otherwise, execute S105. If n+1 is equal to the total number of code editors 3 in the same column, it means that all the code editors 3 below have been traversed.

[0102] S105. Determine if dragY is greater than 0. If yes, then n = n + 1 and execute S101; otherwise, execute S105.

[0103] S106, End.

[0104] In practical applications, the sliding operation can be performed using the custom function `shrinkArray(spacingList, index, direction, value)`. `spacingList` is a list of interval values, `index` is the index of the interval value to be compressed (i.e., the selected code editor 3), `direction` is the compression direction (i.e., the sliding direction), and `value` is the compression value (i.e., the sliding distance). The custom function, given a list of interval values, iteratively compensates for the value at the interval value at the specified index, either forward or backward, until complete compensation or complete iteration. The specific principle is as described above and will not be repeated here. For example, `shrinkArray([10,10,10,10,10],2,'down',25)` returns `[10, 10, 0, 0, 5]`, and `shrinkArray([10,10,10,10,10],3,'up',37)` returns `[3, 0, 0, 0, 10]`.

[0105] If a top and bottom edge stretching operation signal is received, the top and bottom edge stretching operation is performed. Based on the top and bottom edge stretching operation signal, the selected edge is moved to adjust the height of the code editor 3. Specifically, if the movement distance of the edge of the code editor 3 is less than or equal to the spacing of the adjacent code editors 3 in the same column, the position of the other code editors 3 in the same column remains unchanged.

[0106] If the movement distance is greater than the spacing of the adjacent code editors 3 in the same column, then the code editor 3 in the movement direction will be moved to the corresponding position. That is, the movement direction is the same, and the movement distance is the movement distance of the selected code editor 3 minus the spacing.

[0107] The top and bottom edge stretching operation signals are used to stretch and change the height of code editor 3. The principle is similar to the sliding operation described above, that is, to minimize the impact on the position of other code editors 3. Specifically, when stretching the top edge of the nth code editor 3 upwards, i.e., increasing the height of code editor 3, the height of code editor 3 is updated first, and then `spacingList = shrinkArray(spacingList, n, 'up', -dragY)` is executed to calculate and update `spacingList`. When dragging the top edge downwards, i.e., shortening the height of code editor 3, the height of code editor 3 is updated first, and then `spacingList` is updated. n =spacing n+dragY; When dragging the bottom down, i.e., increasing the height of Code Editor 3, first update the height of Code Editor 3, then execute `spacingList = shrinkArray(spacingList, n + 1, 'down', dragY)` to calculate and update `spacingList`; When dragging the bottom up, i.e., decreasing the height of Code Editor 3, first update the height of Code Editor 3, then update `spacing`. n+1 =spacing n+1 -dragY.

[0108] If a separator bar movement operation signal is received, the left and right sides are stretched. Based on the separator bar movement operation signal, the selected separator bar is moved, and the width of all code editors 3 in the corresponding column is adjusted.

[0109] If a zoom operation signal is received, the zoom operation is performed. Based on the zoom operation signal, all code editors are controlled to be enlarged or reduced by the corresponding ratio. That is, all code editors in the canvas and the code displayed in them are enlarged or reduced proportionally. The corresponding ratio is determined by the zoom operation signal. For example, if the user inputs the zoom operation signal by sliding the mouse, the enlargement or reduction and its corresponding ratio can be determined based on the mouse sliding distance and direction.

[0110] This embodiment also provides a window control and arrangement system for code reading, employing a window control and arrangement method for code reading;

[0111] This embodiment also provides a window control arrangement storage medium for code reading, wherein a computer program is stored on the storage medium, and when the computer program is executed by a processor, it implements any of the steps of the above-described window control arrangement method for code reading.

[0112] If the aforementioned window control arrangement method for code reading is implemented as a software functional unit and sold or used as an independent product, it can be stored in a storage medium. Based on this understanding, all or part of the processes in the methods of the above embodiments of the present invention can also be implemented by a computer program instructing related hardware. The computer program can be stored in a readable storage medium, and when executed by a processor, it can implement the steps of the above method embodiments. The computer program includes computer program code, which can be in the form of source code, object code, executable files, or certain intermediate forms. The readable medium can include: any entity or device capable of carrying the computer program code, a recording medium, a USB flash drive, a portable hard drive, a magnetic disk, an optical disk, a computer memory, a read-only memory (ROM), a random access memory (RAM), an electrical carrier signal, a telecommunication signal, and a software distribution medium, etc.

[0113] The above descriptions are merely embodiments of the present invention. Commonly known structures and characteristics are not described in detail here. Those skilled in the art are aware of all common technical knowledge in the field prior to the application date or priority date, are aware of all existing technologies in that field, and have the ability to apply conventional experimental methods prior to that date. Those skilled in the art can, under the guidance of this application, improve and implement this solution in combination with their own capabilities. Some typical known structures or methods should not be obstacles for those skilled in the art to implement this application. It should be noted that those skilled in the art can make several modifications and improvements without departing from the structure of the present invention. These should also be considered within the scope of protection of the present invention, and will not affect the effectiveness of the implementation of the present invention or the practicality of the patent. The scope of protection claimed in this application should be determined by the content of its claims, and the specific embodiments described in the specification can be used to interpret the content of the claims.

Claims

1. A window control arrangement method for code reading, characterized in that: Includes the following: The code editors are laid out in columns on the display page, with several code editors in each column and a separator bar between the two columns. If an operation signal is received, the code editor will perform an insertion, movement, sliding, stretching, or scaling operation based on the operation signal. The operation signals include: code file open signal and code element jump signal; If a code file is opened, an insertion operation is performed without using any code editor as the reference code editor. Instead, a new code editor is opened to display the contents of the selected code file. If a code element jump signal is obtained, the jump content is obtained based on the selected code element. It is then determined whether the jump content is in an already opened code editor. If so, a connection relationship is added with the selected code element as the starting point and the jump content as the ending point. If not, an insertion operation is performed, using the code editor where the selected code element is located as the reference code editor, a new code editor is opened to display the jump content, and a connection relationship is added with the selected code element as the starting point and the jump content as the ending point. The insertion operation includes: if any code editor is used as a reference code editor, and a new code editor is opened, then there is a connection between the reference code editor and the new code editor, and the insertion position of the new code editor is obtained through an estimated insertion position method. The estimated insertion position method obtains the insertion position based on the position of the reference code editor and the current connection relationship of its column. The estimated insertion position method includes: Get all the connections between all code editors in the column containing the reference code editor; Based on the connection relationships, the connection relationships are filtered to obtain valid connections; where a valid connection is the column below the column of its starting point, where the end point of the connection is located. The position information of the selected symbol is compared with the position information of the starting point of the valid connection. The valid connection is divided into an upper half connection and a lower half connection. The position information of the starting point of the upper half connection is less than the position information of the selected symbol, and the position information of the starting point of the lower half connection is greater than the position information of the selected symbol. The comparison of position information is based on the selected symbol. If the starting point of the connection is before the selected symbol, its position information is less than the position information of the selected symbol. If the starting point of the connection is after the selected symbol, its position information is greater than the position information of the selected symbol. Pair the lines connecting the upper half and the lower half together to form several clamping pairs; The squeezing pairs are filtered to obtain valid squeezing pairs; where a valid squeezing pair is a squeezing pair whose two connecting lines do not intersect. Determine whether a valid clamping pair has been obtained. If so, among the valid clamping pairs, select the one with the smallest distance between the starting point and the selected symbol, and use it as the valid clamping pair for the insertion position. Then, take the next position of the column containing the endpoint of the line connecting the upper half of the valid clamping pair as the insertion position. If not, use the preset position as the insertion position.

2. The window control arrangement method for code reading according to claim 1, characterized in that: The insertion operation further includes: if no code editor is used as the reference code editor, when a new code editor is opened, the insertion position of the new code editor is the preset position of the preset column.

3. The window control arrangement method for code reading according to claim 1, characterized in that: The operation signal further includes: a movement operation signal; If a move operation signal is received, the move operation is performed, and the selected code editor is moved to any position in any column according to the move operation signal.

4. The window control arrangement method for code reading according to claim 1, characterized in that: The operation signal also includes: a sliding operation signal; If a sliding operation signal is received, the sliding operation is performed. Based on the sliding operation signal, the selected code editor is controlled to slide in the corresponding column, and only the spacing between the code editors is changed, and the code editors do not overlap. If the code editor slides in the corresponding column, and the sliding distance is less than or equal to the interval between adjacent code editors in the same column, the positions of the other code editors in the same column will not change. If the sliding distance is greater than the interval between adjacent code editors in the same column, then push the code editor in the sliding direction to slide to the corresponding position.

5. The window control arrangement method for code reading according to claim 1, characterized in that: The operation signals also include: top and bottom edge stretching operation signals and interval column moving operation signals; If the top and bottom edge stretching operation signal is obtained, the top and bottom edge stretching operation is performed. Based on the top and bottom edge stretching operation signal, the selected edge is moved to adjust the height of the code editor. If the edge of the code editor moves, and the moving distance is less than or equal to the interval between adjacent code editors in the same column, then the positions of the other code editors in the same column remain unchanged. If the movement distance is greater than the interval between adjacent code editors in the same column, then the code editor in the movement direction will be moved to the corresponding position. If a separator bar movement operation signal is received, the left and right sides are stretched. Based on the separator bar movement operation signal, the selected separator bar is moved, and the width of all code editors in the corresponding column is adjusted.

6. The window control arrangement method for code reading according to claim 1, characterized in that: The operation signal also includes: a scaling operation signal; If a scaling operation signal is received, the scaling operation is performed. Based on the scaling operation signal, all code editors are controlled to zoom in or out by the corresponding ratio.

7. A window control and arrangement system for code reading, characterized in that: The window control arrangement method for code reading as described in any one of claims 1-6 is adopted.

8. A window-controlled arrangement storage medium for code reading, wherein a computer program is stored on the storage medium, characterized in that: When the computer program is executed by the processor, it implements the steps of the window control arrangement method for code reading as described in any one of claims 1-6.

Citation Information

Patent Citations

  • Interaction method and device for application window interface, electronic equipment and storage medium

    CN109364479A

  • Window display method and computing device

    CN113312130A