Input Box Adjustment During Display Mode Switch
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
When switching between portrait and landscape modes on mobile devices, the input box often becomes obscured or moves outside the viewable area, causing inconvenience to users as it is not properly adjusted, leading to difficulties in inputting data.
Innovation Solution
A method and apparatus that detect the display mode switch, determine the input box's position, and adjust the webpage accordingly to ensure the input box remains within the viewable area by calculating and applying the necessary adjustments based on the distance between the input box and the viewable area.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Adaptability or versatility
If the display mode is switched between portrait and landscape, then the display orientation changes to accommodate different viewing preferences, but the input box moves outside the webpage viewable area causing user inconvenience
Solution Approach 1:
The system performs preliminary detection of display mode switches and proactively adjusts the webpage viewable area before the input box becomes obscured. By detecting the mode switch event and calculating the required adjustment distance in advance, the system prevents the input box from moving outside the visible area, ensuring continuous user accessibility without requiring manual intervention.
Solution Approach 2:
The system establishes a feedback loop by continuously monitoring the input box position relative to the webpage viewable area after display mode switches. When the input box is detected to be outside the viewable area, the system automatically calculates the adjustment distance and repositions the webpage, creating a closed-loop control system that maintains input box accessibility across different display orientations.
2Stability of the object's composition
If the input box position is fixed during display mode switch, then the webpage layout remains stable, but the input box may be covered by the soft keyboard or move outside the screen
Solution Approach 1:
The system introduces dynamic adjustment mechanisms that allow the webpage viewable area to adapt its position and size based on display mode changes. By calculating the adjustment distance based on the input box position and viewable area boundaries, the system dynamically repositions the webpage to ensure the input box remains visible, transforming the static layout into a responsive design that maintains usability across different orientations.
3Manufacturing precision
If manual adjustment is required to keep the input box visible, then precise positioning can be achieved, but user convenience is reduced and operation complexity increases
Solution Approach 1:
The system implements self-service functionality by automatically detecting when the input box moves outside the webpage viewable area and autonomously adjusting the webpage position. The system calculates the required adjustment distance and executes the repositioning without user intervention, eliminating the need for manual dragging or scrolling while maintaining precise input box positioning, thus reducing operational complexity while preserving positioning accuracy.
Data Source
AI summary
A method and apparatus for adjusting an input box in a display screen is provided, the method includes the following steps: detecting whether a display mode of the display screen is switched; upon detecting the display mode of the display screen is switched, obtaining a position of an input box in a webpage; and if the input box is outside a webpage viewable area of the display screen, adjusting the webpage and a canvas of the webpage in accordance with a distance between the input box and the webpage viewable area, wherein the adjusted input box is within the webpage viewable area.