Visual Page Layout Using Ratio-Based Control Parameters
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Existing methods for configuring dynamic pages in a user interface are inefficient and require extensive coding, making it difficult for developers to create and adapt pages across different devices with varying display parameters.
Innovation Solution
A page configuration system and method that involves generating a visualized configuration page, obtaining display states of controls, creating control parameters based on these states, and transmitting them to terminal devices to determine optimal display states based on device-specific parameters, allowing for efficient and adaptable page configuration without extensive coding.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Productivity
If visual editor is used to configure dynamic pages in a code-free manner, then productivity is improved, but adaptability to different display parameters deteriorates
Solution Approach 1:
The patent transforms absolute position and size parameters into relative parameters (ratios). The control parameters include a first parameter representing the ratio of the distance from the control to the page boundary relative to the page width, and a second parameter representing the ratio of the control width to the page width. This allows the same configuration to be automatically adapted to different screen sizes and display parameters without requiring manual reconfiguration.
2Manufacturing precision
If control parameters include absolute position and size, then manufacturing precision is improved, but ease of manufacture deteriorates
Solution Approach 1:
The patent converts absolute position and size measurements into relative ratios. Instead of specifying exact pixel values for control positions and dimensions, the system uses ratios relative to the page boundaries and overall page size. This maintains precise control over layout while simplifying the configuration process, as the same ratio-based parameters automatically scale to different screen resolutions and sizes.
3Adaptability or versatility
If extensive coding is required for page configuration, then adaptability to different devices is improved, but productivity deteriorates
Solution Approach 1:
The patent creates a reusable template system where the page configuration, including control parameters defined by ratios, can be copied and applied across different devices and projects. Once a configuration is created with ratio-based parameters, it can be instantiated multiple times on different terminal devices with varying display parameters, eliminating the need to write custom code for each device while maintaining full adaptability.
Data Source
AI summary
The present disclosure provides a page configuration method, a page configuration system, an electronic device and a readable storage medium. The page configuration method includes: generating, by the control device, a visualized configuration page; obtaining, by the control device, a display state of a control in the configuration page; generating, by the control device, a control parameter in accordance with the display state, the control parameter including a distance between the display position of the control and each boundary of the configuration page, and a ratio of the display size to a size of the configuration page; transmitting, by the control device, the control parameter to the terminal device; and determining, by the terminal device, a display state of the control in the terminal device in accordance with a display parameter of the terminal device and the control parameter.