Graphical user interface with IoT device management app for mobile phones

Abstract

1. Name of the product of this design: Graphical user interface for mobile phones with an IoT device management application. 2. Purpose of this design: Supporting software for experimental box products used in teaching professional teaching related to software and hardware development in colleges and universities - Hongmeng Mobile App. 3. The key design point of this design product lies in the graphical user interface content on the screen. 4. The picture or photo that best illustrates the key points of the design: main view. 5. The hardware part of the product is of conventional design, and the rear view is omitted; the hardware part of the product is of conventional design, and the left view is omitted; the hardware part of the product is of conventional design, and the right view is omitted; the hardware part of the product is of conventional design, and the top view is omitted; the hardware part of the product is of conventional design, and the bottom view is omitted. 6. Purpose of the graphical user interface: It is used as an experimental box product for teaching software and hardware development related majors in colleges and universities, and is used for daily teaching and practical training of OpenHarmony distributed devices, as well as integrated development and teaching of OpenHarmony lightweight device application development. 7. Other situations that require explanation: Refer to the following diagrams: Open the phone and click the application icon to enter the interface, and the interface change status diagram 1 is presented; jump to the account login interface: users can register / log in to use this software, and the mobile phone number can be automatically registered after entering, and the interface change status diagram 2 is presented; after logging in, jump to the interface homepage, display the device functions, and present the change status diagram; card display: This application has a total of 24 device cards for display. Users can use the card components to quickly operate some functions within the application. In the offline state, the entire device card is displayed semi-transparently, and the device that has not been added is displayed in an empty state prompt, indicating that there is no device, and the interface change status diagram 4 is presented; the interface style after all 24 device cards are added online, and the interface change status diagram is presented. 5‑8; User connection device network configuration interface display: (1) Users can add devices by clicking the add button, or use the touch of the unconnected device to pull up the device network atomic service on the mobile phone to quickly complete the network configuration between the mobile phone and the device; (2) After controlling the action of adding the device, the user enters the offline prompt interface, presenting the interface change status Figure 9, the connected device interface, presenting the interface change status Figure 10, the device offline prompt interface, presenting the interface change status Figure 11, the main page display interface after the device is successfully added, presenting the interface change status Figure 12, the page display interface after the device fails to add, presenting the interface change status Figure 13, after the case device is successfully added; based on the 24 device cards added by the user, Provide an enlarged state diagram of each device card: Epidemic access control: the door magnet is opened, the buzzer sounds, and the interface change state diagram 14 is presented; the door magnet is closed, the buzzer stops, and the interface change state diagram 15 is presented. Home safety monitoring is realized, and you can delete this device by clicking the delete button; Liquefied gas alarm: gas value monitoring can be realized, and an alarm will be issued when the threshold is exceeded, and the interface change state diagram 16 will be presented. When the threshold is not exceeded, the display is normal, and the interface change state diagram 17 will be presented. The threshold can also be set, and the interface change state diagram 18 will be presented to achieve safety monitoring at home or in industrial areas; Heart rate monitor: Place your fingertips on the sensor and hold it for more than 30 seconds. You can measure the heart rate and blood oxygen value. When the heart rate value is less than 40 beats / minute and greater than 10 0 times / min, when the blood oxygen value is less than 70%, the alarm is activated and the interface change status diagram 19 is presented. If the value is normal, no alarm is given and the interface change status diagram 20 is presented. If you only monitor the value, you can also view the monitoring log records and set the threshold range. The interface change status diagram 21 is presented; Noise monitor: real-time monitoring of the current environmental noise, if noise is detected, the alarm is presented and the interface change status diagram 22 is presented. If no noise is detected, the display is normal and the interface change status diagram 23 is presented. Only the monitoring log records are displayed. If there are no records, the empty state is displayed and the interface change status diagram 24 is presented; Raindrop alarm: real-time monitoring of whether the current environment is raining, an alarm is given if it is raining and the interface change status diagram 25 is presented. If it is not raining, the display is normal and the interface change status diagram 26 is presented;Voice-controlled switch: You can control the voice-controlled switch to "on / off" by speaking "turn on / off the light", and the interface status diagrams 27-28 are displayed. Meteorological data collector: Collects the current environment's air pressure, altitude, temperature and humidity data in real time, and the interface status diagram 29 is displayed. NFC card reader: Touch the card reader with any NFC card, and the information recognized by the card reader will be displayed below, and the interface status diagram 30 is displayed. The default page before reading is displayed, and the interface status diagram 31 is displayed. Elevator door controller: The progress bar digital tube simulates the opening and closing of the elevator door, and the elevator door can be opened / closed remotely, and the interface status diagrams 32-33 are displayed. Smart electronic scale: By applying pressure to the film pressure sensor, it simulates the electronic scale to collect weight data; when it detects When the weight is reached, the alarm will be activated, and the interface change status diagram 34 will be displayed. If there is no weight, the page will be displayed, and the interface change status diagram 35 will be displayed; PM2.5 monitoring: real-time monitoring of indoor and outdoor PM2.5 data. When the PM threshold is greater than 75μg / m3, an alarm will be issued, and the interface change status diagram 36 will be displayed. Otherwise, it is in normal state, and the interface change status diagram 37 will be displayed. The PM2.5 threshold can also be adjusted and set, and the interface change status diagram 38 will be displayed; Industrial controller: real simulation of three commonly used industrial control interfaces. When the device with the corresponding protocol is connected, the specific content will be displayed below, and the interface change status diagram 39 will be displayed. If the device is not connected, it will prompt to insert the device illustration, and the interface change status diagram 40 will be displayed; Flame alarm: simulates a fire alarm When an open flame appears, an alarm is automatically triggered, and the interface status diagram 41 is displayed. If no open flame is detected, it is displayed as normal, and the interface status diagram 42 is displayed. There is a monitoring log record. If there is no record, it is displayed as empty. Parking space detection: simulates parking lot parking space detection to determine whether the parking space is parked. The interface status diagrams 43-44 are displayed. Voice announcer: select text content and send it to the voice announcer for voice broadcast, as well as a toast prompt for success / failure. The interface status diagrams 45-46 are displayed. Alcohol detector: blow into the sensor to detect the alcohol content. If the threshold is exceeded, an alarm will be issued. The interface status diagram 47 is displayed. If it is normal, no alarm will be issued. The interface status diagram 48 is displayed. It can also detect PM2.5 The threshold is adjusted and set, and the interface change state diagram 49 is presented; touch alarm: the detection point can be touched by a finger or other body part to simulate a touch alarm, and the interface change state diagram 50 is presented. If it is not touched, there will be no alarm, and the interface change state diagram 51 is presented; infrared detector: when a human body passes by the sensor, the alarm is automatically triggered, and the interface change state diagram 52 is presented. If there is no one, there will be no alarm, and the interface change state diagram 53 is presented. It is used to simulate application scenarios such as safety protection; human body thermometer: put the body close to the temperature sensor to simulate human body temperature detection scenarios such as forehead thermometers. If the threshold is exceeded, an alarm will be issued, and the interface change state diagram 54 will be presented. If it is not exceeded, there will be no alarm, and the interface change state diagram 55 will be presented. The threshold can also be adjusted, and the interface change state diagram 56 is presented;Fan controller: Remotely turns fans on and off, displaying interface status diagrams 57-58. Smoke alarm: Monitors smoke particle levels, triggering an alarm if the threshold is exceeded, displaying interface status diagram 59. Normal display is displayed if the threshold is not exceeded, displaying interface status diagram 60. The threshold can also be adjusted, displaying interface status diagram 61, enabling safety monitoring in homes or industrial areas. Light controller: Remotely turns lights on and off, displaying interface status diagrams 62-63. Logistics monitor: Uses GPS positioning to track routes and simulates the routes of logistics and express delivery. If there is movement, the specific latitude and longitude values ​​are displayed, displaying interface status diagram 64. If there is no movement, there is no display, displaying interface status diagram 65. Manhole cover detector: Uses a six-axis sensor to simulate the current state of the manhole cover. If it is tilted or moved, an alarm is displayed, displaying interface status diagram 66. If there is no movement, the normal display is displayed, displaying interface status diagram 67.

Images