Page focus processing method and electronic equipment
By configuring the focus determination policy and historical focus records of the scrolling group in the page, the fluency and experience problems of the existing focus library when scrolling on the page is solved, and more efficient user interaction is achieved.
Patent Information
- Application Number
- CN202411327090.5
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-09-23
- Publication Date
- 2025-02-18
AI Technical Summary
The existing focus library causes the user's operation fluency to decrease when the page is scrolled, the user experience is poor, and it is prone to incorrect operations.
By configuring the focus of each scroll group in the page, the historical focus of the scroll group is automatically recorded. When the focus enters the scroll group, focus to the historical focus recorded previously to avoid page scrolling.
It improves the fluency of user operations, improves user experience, enhances users' control over page interaction, and reduces users' misoperation.
Smart Images
Figure CN119473107A_ABST
Abstract
Description
Technical Field
[0001] The invention belongs to the field of page design, and in particular relates to a method for processing page focus and an electronic device. Background Art
[0002] In the front-end focus library, the focus generally moves on the page according to the cross movement principle. The cross movement principle includes horizontal movement and vertical movement. Horizontal movement means that the focus moves to the adjacent focus in the horizontal direction, and vertical movement means that the focus moves to the adjacent focus in the vertical direction. Figure 1 The main implementation methods of the existing focus library include: 1) searching for the next focus closest to the current focus in the specified direction according to the cross movement principle; 2) if the current focus exceeds the visible range of the window, the current focus needs to be scrolled into the visible area, which reduces the smoothness of user operations, reduces the user experience, reduces the user's control over page interaction, and is prone to misoperation. Summary of the invention
[0003] In view of the defects in the prior art, the present invention provides a method for processing page focus and an electronic device, which improves the fluency of user operations, improves user experience, improves user control over page interaction, and reduces user errors.
[0004] In a first aspect, a method for processing page focus includes:
[0005] Configure the focus determination strategy for each scroll group in the page;
[0006] When it is detected that the current focus enters the scroll group, the next focus is determined to be the historical focus or the specified element of the scroll group according to the corresponding focus determination strategy;
[0007] When it is detected that the current focus leaves the scroll group, the current focus is defined as the historical focus of the scroll group.
[0008] Furthermore, before configuring the focus determination strategy of each scroll group, the method further includes:
[0009] Configure different animation effect functions;
[0010] Control the focus movement effect according to the animation effect function.
[0011] Furthermore, before configuring the focus determination strategy of each scroll group, the method further includes:
[0012] Configure the scroll quantity of each scroll group in the page;
[0013] When it is detected that the current focus is located in the scroll group and moves in the scroll group, the number of elements in the scroll group that are scrolled at a single time is determined as the scroll number.
[0014] Furthermore, before configuring the focus determination strategy of each scroll group, the method further includes:
[0015] Configure the touch events of each element in the page;
[0016] When a touch event of an element is listened to, the touch event is executed to implement touch response.
[0017] Furthermore, before configuring the focus determination strategy of each scroll group, the method further includes:
[0018] Configure the double-click delay time and double-click event of each element in the page;
[0019] When it is detected that an element has two interactive actions within the double-click delay time, the corresponding double-click event is executed.
[0020] Furthermore, before configuring the focus determination strategy of each scroll group, the method further includes:
[0021] Configure the back events of each back button in the page;
[0022] When the interaction action of the back button in the page is monitored, the corresponding back event is executed.
[0023] Furthermore, before configuring the focus determination strategy of each scroll group, the method further includes:
[0024] The activation status of each restriction group in the configuration page; each restriction group defines the range of elements that can be focused; the activation status includes active or inactive;
[0025] When the current focus is moving, the range of elements that the current focus can focus on is determined based on the activated restriction group.
[0026] Furthermore, the method of moving the focus in the page includes:
[0027] Get the moving direction of the current focus;
[0028] Get the margin information of the element with the current focus and the elements in the nearest row in the moving direction;
[0029] Calculate the vertical margin difference between the element with the current focus and the element in the nearest row according to the margin information to obtain the vertical difference;
[0030] The minimum value of the difference in the horizontal margin between the element with the current focus and the elements in the nearest row is calculated according to the margin information to obtain the horizontal difference;
[0031] The number of elements that the current focus moves is calculated based on the vertical difference and the horizontal difference.
[0032]
[0033] Controls the movement of the current focus according to the number of elements.
[0034] Further, the margin information includes a top margin, a bottom margin, a left margin, and a right margin;
[0035] The vertical difference includes the difference between the top margin of the element with the current focus and the bottom margin of the nearest row of elements in the moving direction;
[0036] The horizontal margin differences between the element with current focus and each element in the nearest row include: the difference between the left margin of the element with current focus and the left margin of each element in the nearest row, the difference between the left margin of the element with current focus and the right margin of each element in the nearest row, the difference between the right margin of the element with current focus and the left margin of each element in the nearest row, and the difference between the right margin of the element with current focus and the right margin of each element in the nearest row.
[0037] In a second aspect, an electronic device includes a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the method of the first aspect is implemented when the processor executes the program.
[0038] It can be seen from the above technical solution that the page focus processing method and electronic device provided by the present invention can automatically record the historical focus of the scrolling group. When the focus enters the scrolling group from the outside, it first focuses on the previously recorded historical focus to prevent the page from scrolling due to searching for the nearest focus, thereby improving the smoothness of user operations, improving user experience, improving user control over page interaction, and reducing user errors. BRIEF DESCRIPTION OF THE DRAWINGS
[0039] In order to more clearly illustrate the specific embodiments of the present invention or the technical solutions in the prior art, the following is a brief introduction to the drawings required for the specific embodiments or the description of the prior art. In all the drawings, similar elements or parts are generally identified by similar reference numerals. In the drawings, the elements or parts are not necessarily drawn according to the actual scale.
[0040] Figure 1 Schematic diagram of the implementation method of the existing focus library.
[0041] Figure 2 A flowchart of a method for processing page focus provided by an embodiment.
[0042] Figure 3 A schematic diagram of an embodiment in which there are defocusable elements in the moving direction provided.
[0043] Figure 4 A schematic diagram of an embodiment in which no focusable elements exist in the moving direction.
[0044] Figure 5 A schematic diagram of the historical focus being out of focus in a scrolling group provided in an embodiment.
[0045] Figure 6 A schematic diagram of multi-focal point defocusing provided in an embodiment.
[0046] Figure 7 A flow chart of a focus moving method provided in an embodiment.
[0047] Figure 8 A schematic diagram of a focus moving method provided in an embodiment. DETAILED DESCRIPTION
[0048] The embodiments of the technical solution of the present invention will be described in detail below in conjunction with the accompanying drawings. The following embodiments are only used to more clearly illustrate the technical solution of the present invention, and are therefore only used as examples, and the protection scope of the present invention cannot be limited thereto. It should be noted that, unless otherwise specified, the technical terms or scientific terms used in this application should be the common meanings understood by those skilled in the art to which the present invention belongs.
[0049] It should be understood that when used in this specification and the appended claims, the terms "include" and "comprises" indicate the presence of described features, integers, steps, operations, elements and / or components, but do not exclude the presence or addition of one or more other features, integers, steps, operations, elements, components and / or combinations thereof.
[0050] It should also be understood that the terms used in this specification of the present invention are only for the purpose of describing specific embodiments and are not intended to limit the present invention. As used in the specification of the present invention and the appended claims, unless the context clearly indicates otherwise, the singular forms "a", "an" and "the" are intended to include plural forms.
[0051] As used in this specification and the appended claims, the term "if" may be interpreted as "when" or "upon" or "in response to determining" or "in response to detecting," depending on the context. Similarly, the phrases "if it is determined" or "if [described condition or event] is detected" may be interpreted as meaning "upon determination" or "in response to determining" or "upon detection of [described condition or event]" or "in response to detecting [described condition or event]," depending on the context.
[0052] Example:
[0053] A method for handling page focus, see Figure 2 ,include:
[0054] Configure the focus determination strategy for each scroll group in the page;
[0055] When it is detected that the current focus enters the scroll group, the next focus is determined to be the historical focus or the specified element of the scroll group according to the corresponding focus determination strategy;
[0056] When it is detected that the current focus leaves the scroll group, the current focus is defined as the historical focus of the scroll group.
[0057] Elements in a page are the basic components that make up the page. Elements can be various visible or invisible objects such as text, images, buttons, forms, links, etc. The focus is a specific element or area that the user is currently interacting with or paying special attention to on the page. The focus is usually determined by the user's interactive actions (such as mouse clicks, keyboard input, etc.), and any element on the page may become the focus. For example, in a form, it can be determined whether a certain input box is a focusable element based on the user's operation or specific business logic. For example, when the user clicks a button, the specific input box gets the focus so that the user can start typing directly. For example, in some dynamically generated interfaces, it can be determined which elements can get the focus according to different situations. For example, in a pop-up window, it is determined whether a button can be focused based on the state of the window.
[0058] In this embodiment, the method can set the focusable attribute of each element in the page through the v-focusable custom instruction in the Vue project to add specific focus behavior to the element. The focusable attribute is used to control whether the element can be out of focus. When the focusable attribute is set to true, it means that the element can be out of focus. For example, a text input box is usually out of focus by default. When the user uses the keyboard to navigate, the current focus can be moved to the text input box by pressing the Tab key. When the focusable attribute is set to false, it means that the element cannot be out of focus. For example, a text input box that is purely used for layout or decoration Elements may not need to be focused. This way, the current focus can find the range of elements that can be focused when it moves. This method can also modify the focusable attribute of the element through the global itemAttrname attribute. The global itemAttrName attribute is usually used to specify a specific attribute name for unified data access and processing in different components or modules.
[0059] In this embodiment, the cross movement principle mainly includes the following points: 1) See Figure 3 , when there is an element that can be focused in the moving direction of the current focus curr, the next element to be focused is determined according to the distance; 2) See Figure 4 If the next row of elements of the current focus curr is closer to the current focus and there is no focusable element in the moving direction of the current focus, the focusable element next is still searched in the moving direction.
[0060] In this embodiment, the method adds a processing method for moving the current focus to a scroll group on the basis of the existing cross movement principle. A scroll group is usually composed of a series of scrollable elements. For example, when the content of a web page exceeds the visible range of the browser window, the content of the entire page can be browsed by configuring a scroll group. For example, some chart libraries or map plug-ins with scrolling functions can also be implemented through scroll groups. When implementing some existing page focuses, if the current focus exceeds the visual range of the page, the current focus needs to be scrolled into the visible range, which has poor flexibility. The method creates a scroll group according to multiple elements that need to be scrolled, and configures the focus determination strategy of each scroll group in the page, wherein the focus determination strategies of different scroll groups may be different, and the focus determination strategy is used to determine the focusable element after the current focus moves to the scroll group. For example, see Figure 5 Assuming that the focusable element of the focus determination strategy is the historical focus, then if the current focus curr enters the scroll group scroll-group, the next focus is the historical focus history of the scroll group. Assuming that the focusable element of the focus determination strategy is a specified element, such as the first element, then if the current focus enters the scroll group, the next focus is the first element of the scroll group. This method records the current focus as the historical focus of the scroll group when the current focus exits the scroll group, so that when the current focus enters the scroll group again, the last recorded historical focus can be focused.
[0061] In this embodiment, the scrolling direction of the scrolling group can be set to the x-axis (horizontal direction) or the y-axis (vertical direction). If not set, both the x-axis and the y-axis can be scrolled by default. The method can set the scroll-in event and the scroll-out event. When the current focus enters the scrolling group from somewhere else, the scroll-in event is triggered, and the next focus is determined to be the historical focus or the specified element of the scrolling group according to the corresponding focus determination strategy. When the current focus leaves the scrolling group, the scroll-out event is triggered, and the current focus is recorded as the historical focus of the scrolling group. In addition, when the current focus moves to the front or last element in the scrolling direction, the focus cannot move out of the scrolling group, but can continue to move in the opposite direction or cross direction.
[0062] In this embodiment, the method can also set the SCROLL_GROUP_RECORD array to save the historical focus of each scroll group. If the element of the current focus is an element of the scroll group, when the next method is called to find the next focus, the historical focus of the scroll group is updated in the SCROLL_GROUP_RECORD array, so that when the current focus calls the next method to re-enter the scroll group, the historical focus of the scroll group is read from the SCROLL_GROUP_RECORD array.
[0063] In summary, this method can automatically record the historical focus of the scrolling group. When the focus enters the scrolling group from the outside, it first focuses on the previously recorded historical focus, which improves the smoothness of user operations, improves user experience, improves user control over page interaction, and reduces user errors.
[0064] Furthermore, in some embodiments, before configuring the focus determination strategy of each scrolling group, the method further includes:
[0065] Configure different animation effect functions;
[0066] Control the focus movement effect according to the animation effect function.
[0067] In this embodiment, the animation effect function may be an existing function or a user-defined function. For example, the animation effect function may be Linear, Quad.easeIn, Quad.easeOut, Quad.easeInOut Cubic.easeIn, Cubic.easeOut, Cubic.easeInOut, Quart.easeIn, Quart.easeOut, Quart.easeInOut, Quint.easeIn, Quint.easeOut, Quint.easeInOut, Sine.easeIn, Sine.easeOut, Sine.easeInOut, Expo.easeIn, Expo.easeOut, Expo.easeInOut, Circ.easeIn, Circ.easeOut, Circ.easeInOut, Elastic.easeIn, Elastic.easeOut, Elastic.easeInOut, Back.easeIn, Back.easeOut, Back.easeInOut, Bounce.easeIn, Bounce.easeOut, Bounce.easeInOut, and the like. This method can simulate the time speed curve through the animation effect function, so that the focus movement speed changes in different time periods, thereby producing a more realistic and vivid movement effect. In specific implementation, this method controls the animation by requestAnimationFrame and setTimeout by default to achieve compatibility with high refresh rate devices.
[0068] In conclusion, this method supports common animation effect functions, and can also control the focus movement effect through customized animation effect functions, making the animation effect more flexible and the animation configuration more personalized. It can also dynamically adjust the animation frame number according to the device refresh rate, making the animation movement on the high refresh screen more delicate.
[0069] Furthermore, in some embodiments, before configuring the focus determination strategy of each scrolling group, the method further includes:
[0070] Configure the scroll quantity of each scroll group in the page;
[0071] When it is detected that the current focus is located in the scroll group and moves in the scroll group, the number of elements in the scroll group that are scrolled at a single time is determined as the scroll number.
[0072] In this embodiment, the method can configure the scrolling number of each scrolling group in the page, and the scrolling numbers configured for different scrolling groups can be the same or different. When it is detected that the current focus is located in the scrolling group and moves in the scrolling group, the number of elements that are scrolled in a single time in the scrolling group is determined as the scrolling number. For example, when the scrolling number of the scrolling group is set to 6, the scrolling group scrolls 6 elements each time.
[0073] Furthermore, in some embodiments, before configuring the focus determination strategy of each scrolling group, the method further includes:
[0074] Configure the touch events of each element in the page;
[0075] When a touch event of an element is listened to, the touch event is executed to implement touch response.
[0076] In this embodiment, the method can configure whether the focus on the page supports the touch screen during initialization, for example, by completing the configuration of the touch event through the touchpad, and the default focus turns on the touch screen function. Touch events include touchstart events, touchmove events, and touchend events, wherein the touchstart event is triggered when the user touches an element of the page through the touch screen. For example, when the user touches a button, the touchstart event is triggered to change the style of the button. The touchmove event is triggered when the user moves his finger after touching the screen to track the movement of the finger. For example, the touchmove event is triggered to adjust the size of the picture according to the moving distance of the finger. The touchend event is triggered when the user lifts his finger after touching the screen. For example, when the user lifts his finger after entering content in a form, the touchmove event is triggered to submit the form data.
[0077] In this embodiment, the method monitors the touchstart event, touchmove event, and touchend event of the element; when the touchstart event is triggered, the clicked element is recorded; when the touchend event is triggered, it is determined whether the element when the finger is lifted and the element of the historical focus are the same. The method can also configure click events, long press events, and move events. When the touchend event is triggered, it can also determine whether the pressing time reaches the set long press standard, thereby triggering the corresponding click event, long press event, and move event.
[0078] In summary, this method supports configuring whether to start the touch screen to meet the user's touch operation.
[0079] Furthermore, in some embodiments, before configuring the focus determination strategy of each scrolling group, the method further includes:
[0080] Configure the double-click delay time and double-click event of each element in the page;
[0081] When it is detected that an element has two interactive actions within the double-click delay time, the corresponding double-click event is executed.
[0082] In this embodiment, the method can configure the double-click delay time and double-click event of each element in the page. For example, the method can configure the double-click delay time to 200ms through dblEnterTime during initialization. If the method detects two interactive actions (such as clicks or touches) of an element within 200ms, it determines that the current element is double-clicked, and triggers the execution of the double-click event corresponding to the element.
[0083] Furthermore, in some embodiments, before configuring the focus determination strategy of each scrolling group, the method further includes:
[0084] Configure the back events of each back button in the page;
[0085] When the interaction action of the back button in the page is monitored, the corresponding back event is executed.
[0086] In this embodiment, the method can also configure the back events of each back button in the page, for example, bind the corresponding back event to the document object (such as the document object). When the interactive action of the back button in the page is monitored, the back event is executed. For example, the method configures the back button range KEY_BACK to [27, 10000] during initialization. The method monitors the interactive actions of each button. When the keyCode of the clicked or touched button is monitored, it is determined whether the monitored keyCode is within the back button range KEY_BACK. If it is within the back button range KEY_BACK, it means that the back button is triggered, and the corresponding back event (such as the back event) is executed at this time. For example, assuming that the keyCode of the monitored button is 27, which is within the back button range KEY_BACK, it means that the back button with keyCode 27 in the page is pressed. If the keyCode of the monitored button is 50, it does not fall within the back button range KEY_BACK, which means that no back button in the page is pressed. For example, when the back button is pressed, the back event is executed to navigate the page. The keyCode is used to uniquely identify different buttons on the page. Different buttons can be configured with the same or different back events.
[0087] In summary, this method supports the setting of double-click events and return events, expands more key events, and makes page design more diversified.
[0088] Furthermore, in some embodiments, before configuring the focus determination strategy of each scrolling group, the method further includes:
[0089] The activation status of each restriction group in the configuration page; each restriction group defines the range of elements that can be focused; the activation status includes active or inactive;
[0090] When the current focus is moving, the range of elements that the current focus can focus on is determined based on the activated restriction group.
[0091] In this embodiment, see Figure 6 , multiple limit groups limit-group can be set in the page. This method also configures the activation status of each limit group, such as configuring which limit groups to activate or which limit groups to close. For example, this method uses the custom instruction v-limit-group to pass a value of true or false to the limit group to configure the activation status of each limit group. For example, the custom instruction v-limit-group passes a value of true to limit group A to activate limit group A. The custom instruction v-limit-group passes a value of false to limit group B to activate limit group B. Each limit group defines the range of elements that can be focused. For example, in the limit group, the focusable elements are marked as "limit-item=sequence number", where each limit group limit-group has one and only one focusable element. When the current focus is moving, the range of elements that can be focused on by the current focus is determined according to the activated limit group, so that the next focusable element can be found according to whether the limit group is activated, and the next focusable element is determined to be element A in limit group A.
[0092] In summary, the method achieves multi-focus control by setting multiple restriction groups so that one element can be focused in each restriction group.
[0093] Further, in some embodiments, see Figure 7 , the methods for moving the focus in the page include:
[0094] Get the moving direction of the current focus;
[0095] Get the margin information of the element with the current focus and the elements in the nearest row in the moving direction;
[0096] Calculate the vertical margin difference between the element with the current focus and the element in the nearest row according to the margin information to obtain the vertical difference;
[0097] The minimum value of the difference in the horizontal margin between the element with the current focus and the elements in the nearest row is calculated according to the margin information to obtain the horizontal difference;
[0098] The number of elements that the current focus moves is calculated based on the vertical difference and the horizontal difference.
[0099]
[0100] Controls the movement of the current focus according to the number of elements.
[0101] In this embodiment, when controlling the focus movement, the method calculates the focus movement distance according to the Pythagorean theorem. The method first determines the focus movement direction according to the object on which the user performs an interactive action, and simultaneously obtains the margin information of the element where the current focus is located and the elements in the nearest row in the movement direction, for example, see Figure 8 , assuming the moving direction is upward, it is necessary to determine which element in the previous row the current focus moves to. At this time, get the top margin currTop, bottom margin currBottom, left margin currLeft, and right margin currRight of the element where the current focus is located, and get the top margin nextTop, bottom margin nextBottom, left margin nextLeft, and right margin nextRight of elements 2 and 3 in the previous row respectively. Since elements 1 and 4 are farther away from the current focus than elements 2 and 3, it is not necessary to collect the margin information of elements 1 and 4. Only the margin information of elements 2 and 3 needs to be collected to determine whether the current focus moves to element 2 or element 3. This method can call the function el.getBoundingClientRect() to collect the margin information of the elements.
[0102] In this embodiment, after the margin information of each element is collected, the method calculates the difference in the margin between the element currently in focus and the nearest row of elements in the vertical direction according to the margin information to obtain a vertical difference, wherein the vertical difference represents the distance between the element currently in focus and the previous row of elements in the vertical direction. For example, the vertical difference is determined according to the absolute value of the difference between the top margin currTop of the element currently in focus and the bottom margin nextBottom of the nearest row of elements in the moving direction.
[0103] In this embodiment, after the margin information of each element is collected, the method calculates the minimum value of the difference in the horizontal margin between the element currently in focus and the elements in the nearest row based on the margin information to obtain the horizontal difference, wherein the horizontal difference represents the distance between the current focus element and the previous row of elements in the horizontal direction. For example, the method calculates the absolute value 2a of the difference between the left margin currLeft of the element currently in focus and the left margin nextLeft of element 2, the absolute value 2b of the difference between the left margin currLeft of the element currently in focus and the right margin nextRight of element 2, the absolute value 2c of the difference between the right margin currRight of the element currently in focus and the left margin nextLeft of element 2, and the absolute value 2d of the difference between the right margin currRight of the element currently in focus and the right margin nextRight of element 2; calculates the left margin currLeft of the element currently in focus and the left margin of element 3. The absolute value 3a of the difference between the left margin currLeft of the element currently focused and the right margin nextRight of element 3, the absolute value 3c of the difference between the right margin currRight of the element currently focused and the left margin nextLeft of element 3, and the absolute value 3d of the difference between the right margin currRight of the element currently focused and the right margin nextRight of element 3. Then take the minimum value of the absolute value 2a, the absolute value 2b, the absolute value 2c, the absolute value 2d, the absolute value 3a, the absolute value 3b, the absolute value 3c, and the absolute value 3d to get the horizontal difference.
[0104] In this embodiment, after obtaining the vertical difference and the horizontal difference, the method uses the Pythagorean theorem to calculate the moving distance of the focus, that is, the number of elements that the current focus moves, and controls the movement of the current focus according to the number of elements, where For example, this method calculates that the distance moved by the current focus is 2 focus points.
[0105] Another embodiment of the present application provides an electronic device, the electronic device comprising: a processor and a memory. The processor and the memory are connected, such as through a bus. Further, the electronic device may also include a transceiver. It should be noted that in actual applications, the transceiver is not limited to one, and the structure of the electronic device does not constitute a limitation on the embodiment of the present application.
[0106] The processor may be a CPU, a general-purpose processor, a DSP, an ASIC, an FPGA or other programmable logic device, a transistor logic device, a hardware component or any combination thereof. It may implement or execute various exemplary logic blocks, modules and circuits described in conjunction with the disclosure of this application. The processor may also be a combination that implements computing functions, such as a combination of one or more microprocessors, a combination of a DSP and a microprocessor, etc.
[0107] The bus may include a path to transmit information between the above components. The bus may be a PCI bus or an EISA bus, etc. The bus may be divided into an address bus, a data bus, a control bus, etc.
[0108] The memory can be a ROM or other type of static storage device that can store static information and instructions, a RAM or other type of dynamic storage device that can store information and instructions, or an EEPROM, CD-ROM or other optical disk storage, optical disk storage (including compressed optical disk, laser disk, optical disk, digital versatile disk, Blu-ray disk, etc.), magnetic disk storage medium or other magnetic storage device, or any other medium that can be used to carry or store the desired program code in the form of instructions or data structures and can be accessed by a computer, but is not limited to this.
[0109] The memory is used to store the application code for executing the solution of the present application, and the execution is controlled by the processor. The processor is used to execute the application code stored in the memory to implement the above method.
[0110] The electronic device provided in the embodiment of the present invention is briefly described. For matters not mentioned in the embodiment part, reference may be made to the corresponding contents in the aforementioned embodiment.
[0111] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention, rather than to limit it. Although the present invention has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or replace some or all of the technical features therein by equivalents. These modifications or replacements do not make the essence of the corresponding technical solutions deviate from the scope of the technical solutions of the embodiments of the present invention, and they should all be included in the scope of the claims and specification of the present invention.
Claims
1. A method for processing page focus, characterized in that: include: Configure the focus determination strategy for each scroll group in the page; When it is detected that the current focus enters the scroll group, the next focus is determined to be the historical focus or the specified element of the scroll group according to the corresponding focus determination strategy; When it is detected that the current focus leaves the scroll group, the current focus is defined as the historical focus of the scroll group.
2. The method for processing page focus according to claim 1, characterized in that: Before configuring the focus determination strategy for each scroll group, also include: Configure different animation effect functions; The moving effect of the focus is controlled according to the animation effect function.
3. The method for processing page focus according to claim 1, characterized in that: Before configuring the focus determination strategy for each scroll group, also include: The scroll quantity of each scroll group in the configuration page; When it is detected that the current focus is located in the scrolling group and moves in the scrolling group, the number of elements in the scrolling group that are scrolled at a single time is determined as the scrolling number.
4. The method for processing page focus according to claim 1, characterized in that: Before configuring the focus determination strategy for each scroll group, also include: Configure the touch events of each element in the page; When a touch event of an element is monitored, the touch event is executed to implement a touch response.
5. The method for processing page focus according to claim 1, characterized in that: Before configuring the focus determination strategy for each scroll group, also include: Configure the double-click delay time and double-click event of each element in the page; When it is monitored that the element has two interactive actions within the double-click delay time, a corresponding double-click event is executed.
6. The method for processing page focus according to claim 1, characterized in that: Before configuring the focus determination strategy for each scroll group, also include: Configure the back events of each back button in the page; When the interaction action of the back button in the page is monitored, the corresponding back event is executed.
7. The method for processing page focus according to claim 1, characterized in that: Before configuring the focus determination strategy for each scroll group, also include: The activation status of each restriction group in the configuration page; each restriction group defines the range of elements that can be focused; the activation status includes active or inactive; When the current focus is moving, the range of elements that the current focus can focus on is determined based on the activated restriction group.
8. The method for processing page focus according to claim 1, characterized in that: Methods for moving focus on a page include: Get the moving direction of the current focus; Get the margin information of the element with the current focus and the elements in the nearest row in the moving direction; Calculate the vertical margin difference between the element with the current focus and the element in the nearest row according to the margin information to obtain the vertical difference; The minimum difference between the horizontal margins of the element with the current focus and the elements in the nearest row is calculated according to the margin information to obtain the horizontal difference; The number of elements that the current focus moves is calculated based on the vertical difference and the horizontal difference. Controls the movement of the current focus according to the number of elements.
9. The method for processing page focus according to claim 8, characterized in that: The margin information includes top margin, bottom margin, left margin and right margin; The vertical difference includes the difference between the top margin of the element where the current focus is located and the bottom margin of the nearest row of elements in the moving direction; The difference in horizontal margin between the element with current focus and each element in the nearest row includes: the difference between the left margin of the element with current focus and the left margin of each element in the nearest row, the difference between the left margin of the element with current focus and the right margin of each element in the nearest row, the difference between the right margin of the element with current focus and the left margin of each element in the nearest row, and the difference between the right margin of the element with current focus and the right margin of each element in the nearest row.
10. An electronic device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, characterized in that: When the processor executes the program, the method according to any one of claims 1 to 9 is implemented.