Method for dynamically modifying initial positions of sub-assemblies in each row of rolling layout and spacing of sub-assemblies
By setting up a grid layout manager and a custom loop layout decorator in RecyclerView, dynamically modifying the starting position and spacing of sub-components in each row, the problem of difficulty in realizing non-default style layout in the existing technology is solved, and flexibility is achieved layout design and simplified maintenance process.
Patent Information
- Application Number
- CN202411414005.9
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-10-11
- Publication Date
- 2025-02-14
AI Technical Summary
In the RecyclerView of Android system, when N subcomponents are added in a row, it is difficult for the prior art to dynamically modify the starting position and spacing of subcomponents in each row, especially when non-default style layout is required, resulting in design and maintenance difficulty.
By setting the grid layout manager GridLayoutManager and the custom loop layout decorator MyItemDecoration, dynamically modify the starting position and spacing of each row of subcomponents in the RecyclerView. The specific steps include initializing the grid layout manager and custom loop layout decorator, assigning the RecyclerView, and obtaining and modifying the offset of the subcomponents through the getItemOffsets() method when rendering each subcomponent.
It realizes dynamically modifying the starting position and spacing of subcomponents in each row without special calculation of each position subcomponent coordinates or changing the RecyclerView layout itself, simplifying the design and maintenance process, reducing workload and post-maintenance costs. .
Smart Images
Figure CN119440656A_ABST
Abstract
Description
Technical Field
[0001] The invention belongs to the technical field of user interaction, and in particular relates to a method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout. Background Art
[0002] When adding N subcomponents to a row in the RecyclerView of the Android system, you need to use the grid layout manager GridLayoutManager to manage the RecyclerView. In this case, RecyclerView will automatically divide the space of this row into N areas evenly. Each area displays the subcomponent on the left to form a layout item of RecyclerView. The blue area is visually a blank area. By default, these layout items are arranged in order. This is the default layout of RecyclerView.
[0003] However, in the actual design process, designers may design non-default layouts for various reasons. In this layout, the spacing between each sub-layout in each row is still consistent visually, but the position of each sub-component cannot be determined by simple average division. For this situation, there are generally the following solutions: 1. In the Adapter of RecyclerView, set the coordinates of each subcomponent according to its position; however, this method is time-consuming and laborious. When there are too many items placed in a row, it is necessary to set the position for each subcomponent separately, and the position needs to be calculated separately.
[0004] 2. Work on the RecyclerView layout itself. By modifying the position and width of the RecyclerView layout, the subcomponents can be visually aligned with the positions in the design. However, the modified position and width need to be calculated by the developer, which will leave hidden dangers for subsequent maintenance. Summary of the invention
[0005] In view of the above defects existing in the prior art, the present invention provides a method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout. The method uses RecyclerView and sets a grid layout manager GridLayoutManager. When the width of RecyclerView and the number of subcomponents in each row are constant, a unique scrolling layout can be implemented. By using a custom circular layout decorator MyItemDecoration, the list obtains a unique offset of each subcomponent that has been modified when drawing the subcomponent. The drawing area corresponding to each subcomponent is determined by the offset. Even if the width of RecyclerView and the number of subcomponents in each row are constant, the starting position and spacing of subcomponents in each row of the scrolling layout can be freely changed.
[0006] The present invention is achieved through the following technical solutions: In a first aspect, an embodiment of the present invention provides a method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout, specifically comprising the following steps: Step 1: Initialize the grid layout manager, set the spanCount of each row and the vertical layout direction according to the design diagram, and assign the grid layout manager to RecyclerView; Step 2: Initialize the custom loop layout decorator and input the parameters into the custom loop layout decorator; Step 3: Assign the custom circular layout decorator MyItemDecoration to RecyclerView; Step 4: Android's RecyclerView executes the rendering process. When rendering each subcomponent, it obtains the parameter outRect through the getItemOffsets() method in the custom cyclic layout decorator, obtains the modified value of outRect.left, determines the left offset of each subcomponent compared to the default position, and draws the design based on the corrected new position.
[0007] Furthermore, in step 2, the parameters include: the layout width recyclerLayoutWidth of RecyclerView, the number of rows in the design drawing spanCount, the distance x from the first subcomponent in the design drawing to the left border, the subcomponent spacing y in the design drawing, and the subcomponent width itemWidth in the design drawing.
[0008] Furthermore, in step 4, the value of outRect.left is modified by a custom loop layout decorator, which specifically includes the following steps: S41. Create a custom loop layout decorator; S42, obtaining design information of the current list layout; S43, write method to calculate the offset of the corresponding position item; Write method private int getOutRectLeft( View view, RecyclerView parent); this method returns the child component offset; S44. Modify the offset of each subcomponent.
[0009] Furthermore, step S41 specifically includes: Customize a class MyItemDecoration as a custom circular layout decorator and let it inherit from RecyclerView.ItemDecoration.
[0010] Further, step S42 specifically includes: MyItemDecoration creates member variables x, y, recyclerLayoutWidth, spanCount, itemWidth, and overloads the constructor, passing in design information through the constructor's parameters and assigning them to the corresponding member variables.
[0011] Further, step S43 specifically includes: First, determine the coordinates of the default position. If the starting position of the subcomponent in the design drawing is consistent with the default value and only the spacing is changed, the offset of the component compared to the default position is leftOffset = (recyclerLayoutWidth / spanCount - itemWidth - y) * (position / getSpanCount), where all parameters except position are assigned to the corresponding member variables as parameters of the constructor when MyItemDecoration is initialized in step S42, and are directly obtained. The parameter position is obtained through the getChildAdapterPosition(view) method of the object parent of the RecyclerView class; if the starting position of the subcomponent in the design drawing is inconsistent with the default position, it is obtained by subtracting the starting position x from the response distance of the entire row of subcomponents to the right, that is, leftOffset = (recyclerLayoutWidth / spanCount - itemWidth - y) * (position / getSpanCount) – x; the method returns the value of leftOffset.
[0012] Further, step S44 specifically includes: Repeat step S43, rewrite the getItemOffsets() method of MyItemDecoration, call it when each subcomponent is drawn, and then obtain the input parameters view and parent required by the getOutRectLeft() method in step S43; and the getItemOffsets() method can also obtain the parameter outRect, the outRect.left parameter defaults to 0, and the leftOffset is calculated and returned by the method of step S43, and outRect.left is reassigned to 0 - leftOffset.
[0013] In a second aspect, an embodiment of the present invention further provides a computer device, comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein when the processor executes the program, a method for dynamically modifying the starting position and spacing between subcomponents in each row of a scrolling layout as described in any one of the embodiments of the present invention is implemented.
[0014] In a third aspect, an embodiment of the present invention further provides a computer-readable storage medium having a computer program stored thereon, which, when executed by a processor, implements a method for dynamically modifying the starting position and spacing between subcomponents in each row of a scrolling layout as described in any one of the embodiments of the present invention.
[0015] Compared with the prior art, the advantages of the present invention are as follows: The present invention provides a method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout. It is unnecessary to specially calculate the coordinates of the subcomponents at each position or to change the layout of the RecyclerView by itself. Only based on the given known parameters, the method of the present invention can obtain the correct position coordinates of the subcomponents and display them at the correct position. It is unnecessary to develop self-calculations, save workload, and reduce later maintenance costs. BRIEF DESCRIPTION OF THE DRAWINGS
[0016] 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.
[0017] Figure 1 It is a flow chart of a method for dynamically modifying the starting position of subcomponents and the spacing between subcomponents in each row of a scrolling layout according to the present invention; Figure 2 This is a schematic diagram of the structure of an electronic device in Embodiment 2 of the present invention. DETAILED DESCRIPTION
[0019] In order to clearly and completely describe the technical solution and its specific working process of the present invention, the specific implementation methods of the present invention are as follows in conjunction with the accompanying drawings of the specification: Example 1 like Figure 1 FIG. 1 is a flow chart of a method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout according to an embodiment of the present invention. The method specifically includes the following steps: Step 1: Initialize the grid layout manager, set the spanCount of each row and the vertical layout direction according to the design diagram, and assign the grid layout manager to RecyclerView; Step 2: Initialize the custom loop layout decorator and input the parameters into the custom loop layout decorator; The parameters include: the layout width recyclerLayoutWidth of RecyclerView, the number of each row spanCount in the design drawing, the distance x from the first subcomponent in the design drawing to the left border, the subcomponent spacing y in the design drawing, and the subcomponent width itemWidth in the design drawing.
[0020] Step 3: Assign the custom circular layout decorator MyItemDecoration to RecyclerView; Step 4: Android's RecyclerView executes the rendering process. When rendering each subcomponent, it obtains the parameter outRect through the getItemOffsets() method in the custom cyclic layout decorator, obtains the modified value of outRect.left, determines the left offset of each subcomponent compared to the default position, and draws the design based on the corrected new position.
[0021] Among them, the value of outRect.left is modified through a custom loop layout decorator, which specifically includes the following steps: S41. Create a custom loop layout decorator; Customize a class MyItemDecoration as a custom circular layout decorator and let it inherit from RecyclerView.ItemDecoration.
[0022] S42, obtaining design information of the current list layout; MyItemDecoration creates member variables x, y, recyclerLayoutWidth, spanCount, itemWidth, and overloads the constructor, passing in design information through the constructor's parameters and assigning them to the corresponding member variables.
[0023] S43, write method to calculate the offset of the corresponding position item; Write method private int getOutRectLeft( View view, RecyclerView parent); this method returns the child component offset; First, determine the coordinates of the default position. If the starting position of the subcomponent in the design drawing is consistent with the default value and only the spacing is changed, the offset of the component compared to the default position is leftOffset = (recyclerLayoutWidth / spanCount - itemWidth - y) * (position / getSpanCount), where all parameters except position are assigned to the corresponding member variables as parameters of the constructor when MyItemDecoration is initialized in step S42, and are directly obtained. The parameter position is obtained through the getChildAdapterPosition(view) method of the object parent of the RecyclerView class; if the starting position of the subcomponent in the design drawing is inconsistent with the default position, it is obtained by subtracting the starting position x from the response distance of the entire row of subcomponents to the right, that is, leftOffset = (recyclerLayoutWidth / spanCount - itemWidth - y) * (position / getSpanCount) – x; the method returns the value of leftOffset.
[0024] S44. Modify the offset of each subcomponent.
[0025] Repeat step S43, rewrite the getItemOffsets() method of MyItemDecoration, call it when each subcomponent is drawn, and then obtain the input parameters view and parent required by the getOutRectLeft() method in step S43; and the getItemOffsets() method can also obtain the parameter outRect, the outRect.left parameter defaults to 0, and the leftOffset is calculated and returned by the method of step S43, and outRect.left is reassigned to 0 - leftOffset.
[0026] This method can calculate the offset of each subcomponent at a different position without making special settings for the subcomponent at a specific position.
[0027] Example 2 Figure 2 This is a schematic diagram of the structure of a computer device in Example 2 of the present invention. Figure 2 A block diagram of an exemplary computer device 12 suitable for use in implementing embodiments of the present invention is shown. Figure 2 The computer device 12 shown is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present invention.
[0028] like Figure 2 As shown, the computer device 12 is in the form of a general-purpose computing device. The components of the computer device 12 may include, but are not limited to: one or more processors or processing units 16, a system memory 28, and a bus 18 that connects various system components (including the system memory 28 and the processing unit 16).
[0029] Bus 18 represents one or more of several types of bus structures, including a memory bus or memory controller, a peripheral bus, an accelerated graphics port, a processor or a local bus using any of a variety of bus architectures. By way of example, these architectures include, but are not limited to, an Industry Standard Architecture (ISA) bus, a Micro Channel Architecture (MAC) bus, an Enhanced ISA bus, a Video Electronics Standards Association (VESA) local bus, and a Peripheral Component Interconnect (PCI) bus.
[0030] The computer device 12 typically includes a variety of computer system readable media. These media can be any available media that can be accessed by the computer device 12, including volatile and non-volatile media, removable and non-removable media.
[0031] The system memory 28 may include computer system readable media in the form of volatile memory, such as random access memory (RAM) 30 and / or cache memory 32. The computer device 12 may further include other removable / non-removable, volatile / non-volatile computer system storage media. By way of example only, the storage system 34 may be used to read and write non-removable, non-volatile magnetic media ( Figure 2 not shown, usually called a "hard drive"). Although Figure 2Not shown in the figure, a disk drive for reading and writing to a removable non-volatile disk (e.g., a "floppy disk"), and an optical disk drive for reading and writing to a removable non-volatile optical disk (e.g., a CD-ROM, a DVD-ROM, or other optical media) may be provided. In these cases, each drive may be connected to the bus 18 via one or more data medium interfaces. The memory 28 may include at least one program product having a set (e.g., at least one) of program modules that are configured to perform the functions of the various embodiments of the present invention.
[0032] A program / utility 40 having a set (at least one) of program modules 42 may be stored, for example, in the memory 28, such program modules 42 including, but not limited to, an operating system, one or more application programs, other program modules, and program data, each of which or some combination thereof may include an implementation of a network environment. The program modules 42 generally perform the functions and / or methods of the embodiments described herein.
[0033] The computer device 12 may also communicate with one or more external devices 14 (e.g., keyboard, pointing device, display 24, etc.), may also communicate with one or more devices that enable a user to interact with the computer device 12, and / or communicate with any device that enables the computer device 12 to communicate with one or more other computing devices (e.g., network card, modem, etc.). Such communication may be performed through an input / output (I / O) interface 22. In addition, in the computer device 12 in this embodiment, the display 24 is not present as an independent individual, but is embedded in the mirror surface. When the display surface of the display 24 is not displayed, the display surface of the display 24 is visually integrated with the mirror surface. In addition, the computer device 12 may also communicate with one or more networks (e.g., local area network (LAN), wide area network (WAN) and / or public network, such as the Internet) through a network adapter 20. As shown in the figure, the network adapter 20 communicates with other modules of the computer device 12 through a bus 18. It should be understood that although not shown in the figures, other hardware and / or software modules may be used in conjunction with the computer device 12, including but not limited to: microcode, device drivers, redundant processing units, external disk drive arrays, RAID systems, tape drives, and data backup storage systems.
[0034] The processing unit 16 executes various functional applications and data processing by running programs stored in the system memory 28, such as implementing a method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout provided by an embodiment of the present invention.
[0035] Example 3 Embodiment 3 of the present invention provides a computer-readable storage medium having a computer program stored thereon. When the program is executed by a processor, a method for dynamically modifying the starting position and spacing between subcomponents in each row of a scrolling layout as provided in all embodiments of the present application is implemented.
[0036] Any combination of one or more computer-readable media may be used. A computer-readable medium may be a computer-readable signal medium or a computer-readable storage medium. A computer-readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device, or device, or any combination thereof. More specific examples (a non-exhaustive list) of computer-readable storage media include: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination thereof. In this document, a computer-readable storage medium may be any tangible medium containing or storing a program that may be used by or in conjunction with an instruction execution system, device, or device.
[0037] Computer-readable signal media may include a data signal propagated in baseband or as part of a carrier wave, which carries a computer-readable program code. Such propagated data signals may take a variety of forms, including, but not limited to, electromagnetic signals, optical signals, or any suitable combination of the above. Computer-readable signal media may also be any computer-readable medium other than a computer-readable storage medium, which may send, propagate, or transmit a program for use by or in conjunction with an instruction execution system, apparatus, or device.
[0038] Program code embodied on a computer readable medium may be transmitted using any appropriate medium, including but not limited to wireless, wireline, optical fiber cable, RF, etc., or any suitable combination of the foregoing.
[0039] Computer program code for performing the operations of the present invention may be written in one or more programming languages or a combination thereof, including object-oriented programming languages, such as Java, Smalltalk, C++, and conventional procedural programming languages, such as "C" or similar programming languages. The program code may be executed entirely on the user's computer, partially on the user's computer, as a separate software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In the case of a remote computer, the remote computer may be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or may be connected to an external computer (e.g., via the Internet using an Internet service provider).
[0040] Note that the above are only preferred embodiments of the present invention and the technical principles used. Those skilled in the art will understand that the present invention is not limited to the specific embodiments described herein, and that various obvious changes, readjustments and substitutions can be made by those skilled in the art without departing from the scope of protection of the present invention. Therefore, although the present invention has been described in more detail through the above embodiments, the present invention is not limited to the above embodiments, and may include more other equivalent embodiments without departing from the concept of the present invention, and the scope of the present invention is determined by the scope of the appended claims.
Claims
1. A method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout, characterized in that: The specific steps include: Step 1: Initialize the grid layout manager, set the spanCount of each row and the vertical layout direction according to the design diagram, and assign the grid layout manager to RecyclerView; Step 2: Initialize the custom loop layout decorator and input the parameters into the custom loop layout decorator; Step 3: Assign the custom circular layout decorator MyItemDecoration to RecyclerView; Step 4: Android's RecyclerView executes the rendering process. When rendering each subcomponent, it obtains the parameter outRect through the getItemOffsets() method in the custom cyclic layout decorator, obtains the modified value of outRect.left, determines the left offset of each subcomponent compared to the default position, and draws the design based on the corrected new position.
2. A method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout as claimed in claim 1, characterized in that: In step 2, the parameters include: the layout width recyclerLayoutWidth of RecyclerView, the number of rows in the design drawing spanCount, the distance x from the first subcomponent in the design drawing to the left border, the subcomponent spacing y in the design drawing, and the subcomponent width itemWidth in the design drawing.
3. A method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout as claimed in claim 1, characterized in that: In step 4, the value of outRect.left is modified through a custom loop layout decorator, which includes the following steps: S41. Create a custom loop layout decorator; S42, obtaining design information of the current list layout; S43, write method to calculate the offset of the corresponding position item; Write method private int getOutRectLeft(View view,RecyclerView parent); this method returns the child component offset; S44. Modify the offset of each subcomponent.
4. A method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout as claimed in claim 3, characterized in that: Step S41 specifically includes: Customize a class MyItemDecoration as a custom circular layout decorator and let it inherit from RecyclerView.ItemDecoration.
5. A method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout as claimed in claim 3, characterized in that: Step S42 specifically includes: MyItemDecoration creates member variables x, y, recyclerLayoutWidth, spanCount, and itemWidth, and overloads the constructor, passing in design information through the constructor's parameters and assigning them to the corresponding member variables.
6. A method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout as claimed in claim 3, characterized in that: Step S43 specifically includes: First, determine the coordinates of the default position. If the starting position of the subcomponent in the design drawing is consistent with the default value and only the spacing is changed, the offset of the component compared to the default position is leftOffset = (recyclerLayoutWidth / spanCount-itemWidth-y)*(position / getSpanCount), where all parameters except position are assigned to the corresponding member variables as parameters of the construction method when MyItemDecoration is initialized in step S42, and are directly obtained. The parameter position is obtained through the getChildAdapterPosition(view) method of the object parent of the RecyclerView class; if the starting position of the subcomponent in the design drawing is inconsistent with the default position, it is obtained by moving the entire row of subcomponents to the right with the response distance minus the starting position x, that is, leftOffset = (recyclerLayoutWidth / spanCount-itemWidth-y)*(position / getSpanCount)–x; the method returns the value of leftOffset.
7. A method for dynamically modifying the starting position and spacing of subcomponents in each row of a scrolling layout as claimed in claim 3, characterized in that: Step S44 specifically includes: Repeat step S43, rewrite the getItemOffsets() method of MyItemDecoration, call it when each subcomponent is drawn, and then obtain the input parameters view and parent required by the getOutRectLeft() method in step S43; and the getItemOffsets() method can also obtain the parameter outRect, the outRect.left parameter defaults to 0, and the leftOffset is calculated and returned by the method of step S43, and outRect.left is reassigned to 0-leftOffset.
8. A computer device, characterized in that: The invention comprises a memory, a processor and a computer program stored in the memory and executable on the processor. When the processor executes the program, the method for dynamically modifying the starting position and spacing between subcomponents in each row of a scrolling layout as described in any one of claims 1 to 7 is implemented.
9. A computer-readable storage medium, characterized in that: A computer program is stored thereon, and when the program is executed by a processor, a method for dynamically modifying the starting position and spacing between subcomponents in each row of a scrolling layout as described in any one of claims 1 to 7 is implemented.