Display device, terminal device and file display method
By establishing a LAN connection between the display device and the mobile device and using a QR code to achieve a quick connection, the file upload progress is displayed in real time, solving the problem of users being unable to understand the file transfer status, and improving the user experience and transmission stability.
Patent Information
- Application Number
- CN202510113547.0
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-01-23
- Publication Date
- 2025-09-16
AI Technical Summary
During the file transfer process between the existing display device and the mobile device, the user cannot understand the file transfer status in real time, resulting in a degraded user experience.
By establishing a LAN connection between the display device and the mobile device, a quick connection is achieved using a QR code, and the file upload progress is displayed in real time on the display device interface, providing detailed transmission status feedback.
It improves users' understanding of the file transfer process, ensures transmission stability and user experience, and improves operational efficiency and user satisfaction.
Smart Images

Figure CN120653336A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of data processing technology, and in particular to a display device, a mobile device, and a file display method. Background Art
[0002] Display devices generally serve as home media centers and can work together with other mobile devices (such as mobile phones) to transfer files from mobile devices to display devices, providing a better visual experience, convenient operation and efficient sharing experience.
[0003] Currently, the file transfer process between the display device and the mobile device only prompts "Upload Started" and "Upload Completed", resulting in the user being unable to understand the transfer status from the start to the completion of the upload, which reduces the user experience. Summary of the Invention
[0004] Some embodiments of the present application provide a display device, a mobile device, and a file display method. During the file transfer process between the display device and the mobile device, the upload progress of the file is displayed, so that the user can know the transmission status of the file transfer process and improve the user experience.
[0005] In a first aspect, some embodiments of the present application provide a display device, including:
[0006] a display configured to display a user interface;
[0007] A communication device configured to establish a communication connection with a terminal device; the mobile device is a device in the same local area network as the display device;
[0008] The controller is configured as:
[0009] receiving an upload instruction sent by the terminal device through the communication device; the upload instruction includes the files to be uploaded and the total number of files to be uploaded;
[0010] Based on the upload instruction, the display is controlled to display a first target upload interface, where the first target upload interface includes a first target pop-up window, and the first target pop-up window includes the upload progress of all the files to be uploaded.
[0011] The above technical solution has the following beneficial effects or advantages: file transfer is achieved by establishing a communication connection between the terminal device and the display device within the same local area network. During the transfer process, the upload progress of all pending files is displayed in real time on the display device interface, allowing the user to understand the transfer status (from the start to the completion of the upload) and improving the user experience. Furthermore, file transfer via the local area network can effectively ensure the stability of file transfer.
[0012] In some embodiments, before the controller executes the step of receiving, through the communication device, the upload instruction sent by the terminal device, the controller further includes:
[0013] In response to a first selection operation input by a user, controlling the display to display a first upload interface, the first upload interface including a first pop-up window, the first pop-up window including a first control, the first control being used to allow the user to select a source device for a file to be uploaded, the first selection operation being used to allow the user to perform a file upload operation;
[0014] In response to a first operation of the user on the first control, a second upload interface is displayed, the second upload interface including a second pop-up window, the second pop-up window including a QR code, and the QR code including website information of the display device; the first operation is used to indicate the source device of the file to be uploaded selected by the user;
[0015] receiving, by the communication device, a first request, where the first request is generated after the terminal device successfully scans the QR code and is used to represent a request for permission to establish a connection;
[0016] Based on the first request, a communication connection is established with the terminal device and the display is controlled to display a third upload interface; the third upload interface includes a third pop-up window, the third pop-up window includes prompt information, the prompt information includes prompt information, and the prompt information includes information about waiting for file upload.
[0017] The above technical solution has the following beneficial effects or advantages: By using a QR code as the medium for communication between the display device and the terminal device, users can quickly obtain the display device's website address by simply scanning the QR code, thus avoiding the tedious and error-prone manual input. This method ensures fast and accurate connection, significantly improving operational efficiency and user experience.
[0018] In some embodiments, the controller is configured to display the second upload interface in response to the user's first operation on the first control, and is specifically configured to:
[0019] In response to the first operation of the user on the first control, obtaining a first result; the first result is used to indicate whether the terminal device and the display device are in the same local area network;
[0020] When the first result is used to represent that the terminal device and the display device are in the same local area network, the display is controlled to display the second uploading interface.
[0021] The above technical solution has the following beneficial effects or advantages: before the upload instruction of the transmitted file, it is necessary to obtain the device source of the file to be uploaded, and determine whether the terminal device corresponding to the device source is in the same local area network as the display device. If so, it is convenient for the display device to establish a communication connection with the terminal device in the future, providing a basis for file uploading.
[0022] In some embodiments, after the controller executes the step of displaying the first target upload interface on a display based on the upload instruction, the controller is further configured to:
[0023] After all the files to be uploaded are uploaded, the upload results of all the files to be uploaded are displayed in the first target pop-up window.
[0024] The above technical solution has the following beneficial effects or advantages: after all files that need to be uploaded are uploaded, the file upload results are displayed, so that users can clearly see the number of files uploaded successfully and the number of files that failed to upload. This intuitive feedback greatly improves the user experience.
[0025] In a second aspect, some embodiments of the present application provide a terminal device, including:
[0026] a display configured to display a terminal interface;
[0027] The communication device is configured to establish a communication connection with the display device; the mobile device is a device in the same local area network as the display device;
[0028] The controller is configured as:
[0029] receiving a first response message, where the first response message is generated after the terminal device successfully scans the QR code and is used to represent a response to the request for establishing connection permission;
[0030] Based on the first response message, controlling the display to display a file display interface, where the file display interface includes at least one file;
[0031] In response to a second selection operation of the user on the at least one file in the file display interface, displaying a thumbnail interface, the thumbnail interface including a first thumbnail for which thumbnail loading has been completed, the first thumbnail being a thumbnail corresponding to each of the files to be uploaded; the file to be uploaded being a file selected from the at least one file; the second selection operation being used to display the thumbnail interface;
[0032] After all the first thumbnails are loaded, a second target upload interface is displayed; the second target upload interface includes the upload progress of each file to be uploaded;
[0033] Obtaining a first position corresponding to a target file in the files to be uploaded in the second target upload interface; the target file is a file being uploaded in the files to be uploaded;
[0034] In the second target upload interface, the target file is moved from the first location to a first preset location.
[0035] The above technical solution has the following beneficial effects or advantages: by obtaining the first position of the target file being uploaded and dynamically sliding the target file to a preset position, the user can view the file upload progress in real time and intuitively. In this way, the user can view the file upload progress and the upload results corresponding to the file just uploaded in real time without additional operation, thereby providing a smoother user experience.
[0036] In some embodiments, after the controller performs the steps after all the first thumbnails are loaded, it is further configured to:
[0037] After all the first thumbnails are loaded, an upload instruction is generated; the upload instruction includes the files to be uploaded and the total number of the files to be uploaded;
[0038] The upload instruction is sent to the display device through the communication device.
[0039] The above technical solution has the following beneficial effects or advantages: when all first thumbnails are loaded, an upload instruction is automatically generated and sent to the display device, ensuring the smooth progress of the file upload process, making the entire file upload process smoother, more transparent and convenient.
[0040] In some embodiments, the controller is configured to display a thumbnail interface in response to a user selecting the at least one file, and is specifically configured to:
[0041] In a case where the length of the interface corresponding to the thumbnail of the file to be uploaded exceeds the length of the thumbnail interface, detecting a third position corresponding to the thumbnail being loaded in the thumbnail interface;
[0042] When the third position is at the second preset position, the interface corresponding to the thumbnail of the file to be uploaded is slid and displayed.
[0043] The above technical solution has the following beneficial effects or advantages: when the interface length corresponding to the thumbnail of the file to be uploaded exceeds the length of the thumbnail interface, the thumbnail interface will be automatically slid to ensure that the user can view the thumbnail of the file being loaded, avoiding the inability to display due to interface space limitations, thereby improving the user experience.
[0044] In some embodiments, after the controller executes the step of displaying the second target upload interface after all the first thumbnails are loaded, the controller is further configured to:
[0045] After all the files to be uploaded are uploaded, the display is controlled to display a third target upload interface, where the third target upload interface includes the upload result of each file to be uploaded.
[0046] The above technical solution has the following beneficial effects or advantages: After all pending files have been uploaded, a third upload interface is displayed, showing the final upload results. This immediate display of results upon completion enhances user engagement and satisfaction, ensuring that the entire file upload process is transparent and easy to understand, thereby significantly improving the user experience.
[0047] In a third aspect, some embodiments of the present application provide a file display method, including:
[0048] receiving an upload instruction sent by the terminal device through the communication device; the upload instruction includes the files to be uploaded and the total number of files to be uploaded;
[0049] Based on the upload instruction, the display is controlled to display a first target upload interface, where the first target upload interface includes a first target pop-up window, and the first target pop-up window includes the upload progress of all the files to be uploaded.
[0050] The above technical solution has the following beneficial effects or advantages: file transfer is achieved by establishing a communication connection between the terminal device and the display device within the same local area network. During the transfer process, the upload progress is displayed in real time on the display device interface, allowing the user to understand the transfer status (from the start to the completion of the upload), thereby improving the user experience. Furthermore, file transfer via the local area network can effectively ensure the stability of file transfer.
[0051] In a fourth aspect, some embodiments of the present application provide a file display method, comprising:
[0052] receiving a first response message, where the first response message is generated after the terminal device successfully scans the QR code and is used to represent a response to the request for establishing connection permission;
[0053] Based on the first response message, controlling the display to display a file display interface, where the file display interface includes at least one file;
[0054] In response to a second selection operation of the user on the at least one file in the file display interface, displaying a thumbnail interface, the thumbnail interface including a first thumbnail for which thumbnail loading has been completed, the first thumbnail being a thumbnail corresponding to each of the files to be uploaded; the file to be uploaded being a file selected from the at least one file; the second selection operation being used to display the thumbnail interface;
[0055] After all the first thumbnails are loaded, a second target upload interface is displayed; the second target upload interface includes the upload progress of each file to be uploaded;
[0056] Obtaining a first position corresponding to a target file in the files to be uploaded in the second target upload interface; the target file is a file being uploaded in the files to be uploaded;
[0057] In the second target upload interface, the target file is moved from the first location to a first preset location.
[0058] The above technical solution has the following beneficial effects or advantages: by obtaining the first position of the target file being uploaded and dynamically sliding the target file to a preset position, the user can view the file upload progress in real time and intuitively. In this way, the user can view the file upload progress and the upload results corresponding to the file just uploaded in real time without additional operation, thereby providing a smoother user experience. BRIEF DESCRIPTION OF THE DRAWINGS
[0059] Figure 1 A schematic diagram of an operation scenario between a display device and a control device provided in some embodiments of the present application;
[0060] Figure 2 A schematic diagram of the hardware configuration of a display device provided in some embodiments of the present application;
[0061] Figure 3 A schematic diagram of software configuration of a display device provided in some embodiments of the present application;
[0062] Figure 4 A schematic diagram of an interaction with a display device provided in some embodiments of the present application;
[0063] Figure 5 A first schematic diagram of a shortcut menu interface of a display device provided in some embodiments of the present application;
[0064] Figure 6 A second schematic diagram of a shortcut menu interface of a display device provided in some embodiments of the present application;
[0065] Figure 7 A first flow chart of a document display provided for some embodiments of the present application;
[0066] Figure 8 A first schematic diagram of a first upload interface of a display device provided in some embodiments of the present application;
[0067] Figure 9 A second schematic diagram of a first upload interface of a display device provided in some embodiments of the present application;
[0068] Figure 10 A third schematic diagram of a first upload interface of a display device provided in some embodiments of the present application;
[0069] Figure 11 A fourth schematic diagram of a first upload interface provided in some embodiments of the present application;
[0070] Figure 12 A second flow chart showing a document display provided in some embodiments of the present application;
[0071] Figure 13 A first schematic diagram of an interface of a mobile device provided in some embodiments of the present application;
[0072] Figure 14 A schematic diagram of a position sliding of a file to be uploaded provided in some embodiments of the present application;
[0073] Figure 15 A second schematic diagram of an interface of a mobile device provided in some embodiments of the present application;
[0074] Figure 16 A third flow chart illustrating a document provided for some embodiments of the present application. DETAILED DESCRIPTION
[0075] The following embodiments are described in detail, with examples illustrated in the accompanying drawings. When the following description refers to the drawings, identical numbers in different figures represent identical or similar elements unless otherwise indicated. The embodiments described in the following embodiments are not intended to represent all possible implementations consistent with the present application. They are merely examples of systems and methods consistent with certain aspects of the present application, as detailed in the claims.
[0076] It should be noted that the brief descriptions of terms in this application are only for the purpose of facilitating the understanding of the embodiments described below, and are not intended to limit the embodiments of this application. Unless otherwise specified, these terms should be understood according to their ordinary and usual meanings.
[0077] In the specification and claims of this application and the accompanying drawings, the terms "first," "second," "third," etc. are used to distinguish similar or similar objects or entities, and are not necessarily intended to limit a particular order or sequence, unless otherwise noted. It should be understood that the terms used in this manner are interchangeable under appropriate circumstances.
[0078] The terms "comprise," "include," and "have," and any variations thereof, are intended to cover but not exclude inclusion; for example, a product or device comprising a list of components is not necessarily limited to all the components expressly listed but may include other components not expressly listed or inherent to such product or device.
[0079] The term "module" refers to any known or later developed hardware, software, firmware, artificial intelligence, fuzzy logic, or combination of hardware and / or software code that is capable of performing the functionality associated with that element.
[0080] In the embodiments of the present application, the display device 200 generally refers to a device capable of displaying images and processing data. For example, the display device 200 includes but is not limited to a smart TV, a mobile device, a computer, a monitor, an advertising screen, a wearable device, a virtual reality device, an augmented reality device, etc.
[0081] Figure 1 This is a schematic diagram of an operation scenario between a display device and a control device provided in some embodiments of the present application. Figure 1 As shown in FIG, a user can operate the display device 200 through touch operation, the mobile device 300, and the control device 100. The control device 100 is used to receive operation instructions input by the user and convert the operation instructions into control instructions that the display device 200 can recognize and respond to. For example, the control device 100 can be a remote control, a stylus pen, a handle, etc.
[0082] Mobile device 300 can function as a control device, enabling human-computer interaction between a user and display device 200. Mobile device 300 can also function as a communication device, establishing a communication connection with display device 200 and exchanging data. In some embodiments, mobile device 300 can install software applications with display device 200, enabling connection and communication via network communication protocols, enabling one-to-one control operations and data communication. Audio and video content displayed on mobile device 300 can also be transmitted to display device 200 for synchronized display.
[0083] In some embodiments, the mobile device 300 or other electronic devices can also simulate the functions of the control device 100 by running an application program for controlling the display device 200 .
[0084] like Figure 1 As shown in FIG, the display device 200 also communicates data with the server 400 through various communication methods. The display device 200 may be allowed to communicate via a local area network (LAN), a wireless local area network (WLAN), and other networks.
[0085] The display device 200 may provide a broadcast receiving television function, and may also additionally provide an intelligent network television function with a computer support function, including but not limited to network television, smart TV, Internet Protocol television (IPTV), etc.
[0086] Figure 2 Some embodiments of this application provide Figure 1 2 is a block diagram of the hardware configuration of the display device 200.
[0087] In some embodiments, the display device 200 may include at least one of a tuner 210, a communication device 220, a detector 230, a device interface 240, a controller 250, a display 260, an audio output device 270, a memory, a power supply, and a user input interface.
[0088] In some embodiments, detector 230 is used to collect signals from the external environment or external interactions. For example, detector 230 may include a light receiver, such as a sensor for collecting ambient light intensity; or an image collector, such as a camera, for collecting external environmental scenes, user attributes, or user interaction gestures; or a sound collector, such as a microphone, for receiving external sounds.
[0089] In some embodiments, the display 260 includes a display component for presenting images and a driver component for driving image display. The display 260 is configured to receive image signals output from the controller 250 for display. For example, the display 260 can be used to display video content, image content, menu control interface components, and user control UI interfaces.
[0090] In some embodiments, the communication device 220 is a component used to communicate with an external device or server 400 according to various communication protocol types. The display device 200 can be provided with multiple communication devices 220 depending on the supported communication methods. For example, if the display device 200 supports wireless network communication, the display device 200 can be provided with a communication device 220 including WiFi functionality. If the display device 200 supports Bluetooth connection communication, the display device 200 needs to be provided with a communication device 220 including Bluetooth functionality.
[0091] The communication device 220 can establish a communication connection between the display device 200 and an external device or server 400 via a wireless or wired connection. A wired connection can connect the display device 200 to an external device via a data cable, an interface, or other components. A wireless connection can connect the display device 200 to an external device via a wireless signal or wireless network. The display device 200 can establish a connection with an external device directly or indirectly through a gateway, router, or connection device.
[0092] In some embodiments, the controller 250 may include at least one of a central processing unit (CPU), a video processor, an audio processor, a graphics processor, and a power processor, and first to nth interfaces for input / output. The controller 250 controls the operation of the display device and responds to user operations through various software control programs stored in a memory. The controller 250 controls the overall operation of the display device 200.
[0093] In some embodiments, the controller 250 and the tuner 210 may be located in different separate devices, that is, the tuner 210 may also be located in an external device of the main device where the controller 250 is located, such as an external set-top box.
[0094] In some embodiments, the user may input a user command through a graphical user interface (GUI) displayed on the display 260 , and the user input interface receives the user input command through the graphical user interface (GUI).
[0095] In some embodiments, the audio output device 270 may be a local speaker of the display device 200, or an external audio output device connected to the display device 200. For the external audio output device connected to the display device 200, the display device 200 may further be provided with an external audio output terminal, through which the audio output device may be connected to the display device 200 to output the sound of the display device 200.
[0096] In some embodiments, the user input interface 280 may be configured to receive instructions from a user.
[0097] To facilitate user interaction, in some embodiments, the display device 200 may run an operating system. The operating system is a computer program used to manage and control the hardware and software resources of the display device 200. The operating system can control the display device to provide a user interface. For example, the operating system can directly control the display device to provide a user interface, or it can provide a user interface by running an application program. The operating system also allows the user to interact with the display device 200.
[0098] It should be noted that the operating system may be a native operating system based on a specific operating platform, or a third-party operating system deeply customized based on a specific operating platform, or an independent operating system specially developed for the display device 200 .
[0099] The operating system can be divided into different modules or layers according to the functions implemented, e.g. Figure 3 As shown, in some embodiments, the system is divided into four layers, from top to bottom, namely, the application layer (referred to as "application layer"), the application framework layer (referred to as "framework layer"), the system library layer and the kernel layer.
[0100] In some embodiments, the application layer provides services and interfaces for applications, enabling the display device 200 to run applications and interact with the user based on the applications. The application layer can host at least one application, which can include built-in window programs, system settings programs, clock programs, and the like, or applications developed by third-party developers. In specific implementations, the application packages in the application layer are not limited to the examples above.
[0101] The framework layer provides applications with an application programming interface (API) and programming framework. The application framework layer includes predefined functions. The application framework layer acts as a processing center, determining the actions taken by applications in the application layer. Through the API, applications can access system resources and services during execution.
[0102] In some embodiments, the framework layer can provide a running environment for core application logic and manage the interaction between applications and system services. The ServerSocket class is used to create a server socket that listens to a network port, and then uses InputStream and OutputStream to handle the connection and data of the display device 200.
[0103] like Figure 3As shown, in the embodiment of the present application, the application framework layer includes a view system, managers, content providers, etc., wherein the view system can design and implement the interface and interaction of the application, and the view system includes lists, grids, text boxes, buttons, etc. The manager includes at least one of the following modules: an activity manager for interacting with all activities running in the system; a location manager for providing system services or applications with access to the system location service; a package manager for retrieving various information related to the application packages currently installed on the device; a notification manager for controlling the display and clearing of notification messages; and a window manager for managing icons, windows, toolbars, wallpapers, and desktop widgets on the user interface.
[0104] In some embodiments, the activity manager is used to manage the lifecycle of each application and common navigation back functions, such as controlling application exit, opening, and back. The window manager is used to manage all window programs, such as obtaining the display screen size, determining whether there is a status bar, locking the screen, taking screenshots, and controlling changes in display windows, such as shrinking, shaking, or distorting the display window.
[0105] In some embodiments, the system runtime layer can provide support for the framework layer. When the framework layer is used, the operating system will run the instruction library contained in the system runtime layer, such as the C / C++ instruction library, to implement the functions to be implemented by the framework layer. In the embodiment of the present application, the network connection status of the device, including Wi-Fi, mobile data, Bluetooth, etc., is managed through services such as ConnectivityService and NetworkPolicyManagerService. Functions such as network status query, network configuration and network usage statistics are provided.
[0106] In some embodiments, the kernel layer is a functional layer between the hardware and software of the display device 200. The kernel layer can implement functions such as hardware abstraction, multitasking, and memory management. Figure 3As shown, the kernel layer can be configured with hardware drivers. The kernel layer may include at least one of the following drivers: audio driver, display driver, Bluetooth driver, camera driver, WIFI driver, USB driver, HDMI driver, sensor driver (such as fingerprint sensor, temperature sensor, pressure sensor, etc.), and power driver. In the embodiment of the present application, the kernel layer is responsible for the implementation of the network protocol stack, including network protocols such as IP and TCP / UDP. It manages network interfaces, routing tables, IP address allocation, etc., to ensure that data packets can be correctly transmitted on the network.
[0107] It should be noted that the above example is only a simple division of the operating system functions and does not constitute a limitation on the specific operating system form of the display device 200 in the embodiment of the present application. Depending on factors such as the function of the display device and the type of operating system, the number of levels and specific level types contained in the operating system may be expressed in other forms.
[0108] In some embodiments, as Figure 4 As shown, the display device 200 and the mobile device 300 may respectively include a front-end display module, a back-end functional module and an interface communication module.
[0109] The front-end display module is used for visualization and user interaction and can be developed using HTML5. For example, the front-end display module can include a file upload display module that displays the upload progress of files in real time, allowing users to intuitively understand the status of file uploads. This module needs to work closely with the network communication module to calculate and update the upload progress bar based on the amount of uploaded data and the total amount of data.
[0110] The back-end functional modules implement various functions of the display device 200. For example, they include a network communication module and a file processing module. The file processing module is generally responsible for storing files for subsequent display on the front-end display module. The network communication module is used to establish a network connection between the mobile device and the display device, enabling file transfer via the local area network. It handles tasks such as establishing the network connection, sending and receiving data, and error handling to ensure that files are accurately uploaded from the mobile device 300 to the display device 200.
[0111] Among them, a network service (webservice) is built into the network communication module of the display device 200, and a service of mutual access function between the display device 200 and the mobile device 300 is implemented through the web service.
[0112] The interface communication module is used to realize the communication between the front-end display module and the back-end functional module. The front-end display module sends a request to the back-end functional module through the interface communication module, and the back-end functional module processes the request and returns the result to the front-end display module.
[0113] Based on the above display device 200, the display device 200 can respond to specific instructions input by the user to display a specific user interface. The user interface of the display device 200 includes a shortcut menu interface. The function options displayed in the shortcut menu interface are the functions of the display device 200. Compared with the main menu interface, the shortcut menu interface contains fewer function options, which makes it easier for users to quickly find the required functions. Figure 5 As shown, the shortcut menu interface includes function controls such as volume control, brightness adjustment, presentation menu, file sharing (file upload), menu / settings, etc.
[0114] To perform interactive control, a user can input control commands through the control device 100 associated with the display device 200, such as a remote control or a remote control simulated by the mobile device 300. Taking the control device 100 as an example, when a user inputs a control command, the user first presses a button on the control device 100. The control device 100 then generates a key command containing a key value for the key pressed by the user and sends the key command to the display device 200 via a wireless transmission method such as Bluetooth or infrared. In response to the received key command, the display device 200 parses the key value from the key command, queries the control command corresponding to the key value according to the key configuration table of the control system, and then executes the queried control command to respond to the command, thereby realizing the corresponding control function.
[0115] In some embodiments, the user interface of the display device 200 may further include a focus cursor. The focus cursor is used to mark a control using graphics, color changes, special effects, etc., so that the user can perform interactive actions based on the position of the focus cursor, and the control selected by the focus cursor can be controlled to respond to user interactive instructions. In other words, the focus cursor can be controlled by the user to move between different functional controls to select different functional items.
[0116] For example, the display device 200 can move the focus cursor in response to a focus movement instruction input by the user based on the shortcut menu interface. For example, when the shortcut menu interface includes a focus cursor and multiple function controls, the user can input a key instruction containing a movement key value to the display device 200, and the display device 200 can control the focus cursor to move in response to the key instruction after receiving the key instruction containing the movement key value, so that the focus cursor selects a different function control. Figure 6As shown, when the user moves the focus cursor to a function control, the corresponding "File Upload" function control is enlarged and displayed. Furthermore, in response to the user selecting a function control on the shortcut menu interface, display device 200 can control display 260 to display a file upload interface. The file upload interface is used to display the device type corresponding to the device source for file upload on display device 200.
[0117] In some embodiments, the display device 200, as a home media center, plays a central role in the home entertainment system, connecting and coordinating other media devices to display and play audio and video content. Currently, file transfers between the display device 200 and the terminal device 500 mostly rely on internet services, which typically have high requirements for the network environment. In unstable or poor network environments, transfer speeds can be significantly reduced, or even disconnected or failed. This not only affects file transfer efficiency but can also lead to file loss or corruption during the transfer process, further degrading the user experience. Furthermore, users typically only see simple "Upload Started" and "Upload Completed" notifications. This simplified feedback mechanism often fails to provide detailed information about the status or progress of the file transfer, leading to a lack of user understanding of the entire transfer process. For example, users cannot determine the current progress of the file upload, whether there have been any interruptions or delays, or whether the file has been fully transferred. This lack of detailed feedback not only prevents users from effectively tracking the real-time status of the file transfer, but also makes it difficult to take timely action when problems arise, further degrading the user experience.
[0118] In summary, when files are transferred between the display device 200 and the terminal device 500, Internet services are used for transmission and since the user can only see simple "upload start" and "upload completed", the user cannot track the real-time status of the file transfer. The combined effect of these two factors leads to a poor user experience.
[0119] In one embodiment, in order to solve the above problem, the display device 200 can be demonstrated according to the following file display method to solve the problem that the user cannot view the transfer status of the file transfer in real time when the file is transferred between the display device 200 and the terminal device 500. In order to meet the implementation of the file display method, the display device 200 includes a display 260, a communication device 220 and a controller 250. The display 260 is configured to display a user interface; the communication device 220 is configured to have established a communication connection with the terminal device. Figure 7 As shown, the controller 250 executes program steps corresponding to the file display method, including the following:
[0120] S1: In response to a click operation input by the user, the display is controlled to display an initial upload interface, the initial upload interface includes a second control; the click operation is used to provide the user with an operation for uploading a file; the second control is used to provide access to a first upload interface including a first pop-up window.
[0121] Combine Figure 6 and Figure 8 As shown in (a) of FIG. 1 , the display device 200 responds to the user moving the cursor to the shortcut menu interface. Figure 6 Click the "File Upload" function control shown in the figure to jump to the Figure 8 The initial upload interface 81 shown in (a) is shown in FIG. 1 , wherein the click operation is used to provide the user with an operation for uploading a file, and the second control is used to provide access to the first upload interface including the first pop-up window.
[0122] For ease of understanding, the embodiments of the present application are described using pictures as examples.
[0123] For example, the initial upload interface 81 includes a prompt indicating that the current display device 200 has 1 gigabyte of available space (Storage: 1G available), which can be used to store data or install applications; a second control (upload image control) 810; and at least one first image frame. The first image frame is an area for displaying the image to be uploaded, typically used to indicate the preview status or selected area of the image before uploading.
[0124] S2: In response to a first selection operation input by the user, the display is controlled to display a first upload interface, the first upload interface includes a first pop-up window, the first pop-up window includes a first control, the first control is used to provide the user with a source device for selecting the file to be uploaded, and the first selection operation is used to provide the user with an operation for uploading the file.
[0125] Continuing with the above example, Figure 8 As shown in (b) of the figure, further, in response to the user clicking on the second control (upload image control) 810, the initial upload interface 81 is updated to obtain the first upload interface 82. At this time, the first upload interface 82 includes a first pop-up window 821, which includes a first control. The first control is used to provide the user with a selection of the source device for the file to be uploaded. Exemplarily, the first pop-up window 821 includes two first controls, namely a first control 8211a for "Download from terminal device 500 (Upload from mobile)" and a first control 8211b for "Download from USB (Upload from USB)".
[0126] It should be noted that the number of the first controls is not specifically limited and can be Figure 8The two first controls displayed in the first pop-up window may also be multiple, and the specific number depends on the factory settings and is not specifically limited.
[0127] S3: In response to the user's first operation on the first control, a second upload interface is displayed, the second upload interface includes a second pop-up window, the second pop-up window includes a QR code, and the QR code includes the URL information of the display device; the first operation is used to represent the source device of the file to be uploaded selected by the user.
[0128] In one embodiment, S3 may include the following steps:
[0129] S301: In response to a first operation of a user on a first control, a first result is obtained; the first result is used to indicate whether the terminal device and the display device are in the same local area network.
[0130] A local area network (LAN) is a computer network established within a relatively small geographic area (such as a home or office), typically connecting electronic devices via wired or wireless connections. Electronic devices within a LAN, such as display device 200 and terminal device 500, can communicate with each other and share resources.
[0131] The terminal device 500 may be the mobile device 300 mentioned above, which is not specifically limited here.
[0132] The first result can be used as a criterion for determining whether the display device 200 and the terminal device 500 are in the same local area network. When a terminal device 500 in the same local area network as the display device 200 is obtained, it means that the display device 200 and the terminal device 500 are connected to the same local area network. For example, the display device 200 will continuously send broadcast messages. When an electronic device in the same local area network receives the broadcast message, it will send a response message to the display device 200. Based on the received response message, the display device 200 determines whether the electronic device is in the same local area network as itself.
[0133] There are many ways to place the display device 200 and the terminal device 500 in the same local area network. Two of the implementation methods are taken as examples below.
[0134] In one example, the display device 200 and the terminal device 500 are connected to the same router. For example, each router can include multiple Wi-Fi networks, such as Wi-Fi1 in the 2.4GHz band, Wi-Fi2 in the 5GHz band, and so on. Different Wi-Fi networks in the same local area network will not affect whether the devices are in the same local area network. For example, there is an existing router A, whose IP address is XXX. The display device 200 is connected to Wi-Fi1 in router A, and the mobile device 300 is also connected to Wi-Fi2 in router A. In another example, a hotspot is turned on by one of the display device 200 or the terminal device 500, and the other device joins the hotspot. The following is a specific explanation of the display device 200 turning on the hotspot. In this specific example, when the display device 200 turns on the hotspot, the display device 200 acts as a router and provides network services to the terminal device 500. At this time, the display device 200 provides Wi-Fi services, and the terminal device 500 becomes its client by connecting to this hotspot.
[0135] Exemplarily, the display device 200 can obtain a Wi-Fi manager instance through a method. Specifically, the display device 200 can call the "Context.getSystemService(Context.WIFI_SERVICE)" method to obtain a WifiManager instance. The "getSystemService" method in the "Context" class returns a system service instance of a specified type. In this example, "Context.WIFI_SERVICE" is a constant that represents the Wi-Fi management service. When "getSystemService" is called and "Context.WIFI_SERVICE" is passed in, it returns a "WifiManager" instance, allowing management and control of Wi-Fi connections. Among them, "WifiManager" is responsible for the management and control of Wi-Fi, such as operations such as connecting, scanning, configuring, and obtaining Wi-Fi status.
[0136] Furthermore, the display device 200 can configure Wi-Fi parameters through the "WifiManager". Specifically, create a "WifiConfiguration" object and set parameters such as the hotspot's network name (SSID), password, encryption type, etc. These parameters are used to configure the Wi-Fi connection or hotspot. Among them, the "WifiConfiguration" object is a class used to represent and configure a Wi-Fi network. It allows you to set the parameters required to connect to the Wi-Fi network. Through this object, you can set the detailed configuration of the Wi-Fi connection and then add it to the "WifiManager" to achieve the connection.
[0137] For example, common encryption types include WPA2_PSK.
[0138] Next, the display device 200 starts the Wi-Fi hotspot function. Specifically, the display device 200 calls the "setWifiEnabled(false)" method of "WifiManager" to turn off the current Wi-Fi connection (if connected). This is to avoid conflicts with existing Wi-Fi connections when enabling the Wi-Fi hotspot function. Turning off the current Wi-Fi connection can enable the display device 200 to switch the Wi-Fi hardware resources to hotspot mode, ensuring that the display device 200 can broadcast hotspot signals normally and provide network connections to the terminal device 500. The display device 200 then adds the configured hotspot network through the "addNetwork" method of "WifiManager" and enables the network using the "enableNetwork" method. Finally, the display device 200 calls the "setWifiEnabled(true)" method to turn on the Wi-Fi hotspot function, causing it to start broadcasting hotspot signals and provide network connections for the terminal device 500. Through these steps, the display device 200 will be able to successfully enable and manage the Wi-Fi hotspot function.
[0139] S302: When the first result indicates that the terminal device and the display device are in the same local area network, control the display to display a second upload interface.
[0140] The second upload interface includes a second pop-up window, the second pop-up window includes a QR code, and the QR code includes the URL information of the display device.
[0141] A QR code is a two-dimensional barcode that can contain URL information. When a QR code is used specifically to store a URL, it is often called a "URL QR code." Specifically, a Uniform Resource Locator (URL) is encoded into a QR code, allowing subsequent users to directly access the corresponding URL by scanning the QR code.
[0142] That is, after determining that the display device 200 and the terminal device 500 are in the same local area network, a second upload interface is displayed, wherein the second upload interface includes a second pop-up window, and the second pop-up window includes a QR code.
[0143] In one embodiment, S302 includes S3021 - S3022.
[0144] S3021: Start network services.
[0145] A network service is a service that enables electronic devices to communicate, exchange data, or provide specific functionality over a network. It can be any service running on a network that allows different electronic devices or applications to interact and collaborate. The network service can be built into the display device 200, which then provides an accessible web interface through the network service. Users can access the management page of the electronic device through a browser.
[0146] For example, the display device 200 can use a JAVA server and a database to create and start a network service, which listens for network requests through a specific port. A port is a communication entry point between a network service and an application. Web services typically use the TCP protocol and listen for requests on a specific port.
[0147] For example, the following code illustrates how to start a network service:
[0148] Server server=new Server(8080);
[0149] server.setHandler(new AbstractHandler(){
[0150] @Override
[0151] public void handle(String target,HttpServletRequest request,HttpServletResponseresponse,int dispatch)throws IOException,ServletException{
[0152] response.setContentType("text / html;charset=utf8");
[0153] response.setStatus(HttpServletResponse.SC_OK);
[0154] PrintWriter out=response.getWriter();
[0155] out.println("Upload Page");
[0156] }
[0157] });
[0158] server.start();
[0159] Among them, "Server server = new Server(8080);" means creating a Jetty Server instance and configuring it to listen on port 8080; "server.setHandler(new AbstractHandler(){" is setting the request processing logic, that is, using the "server.setHandler()" method to set a processor (AbstractHandler) to handle incoming requests (HTTP requests), and the "handle()" method of the processor defines the specific request processing logic; "response.setContentType("text / html; charset = utf8");" means setting the response content type to HTML and using UTF-8 character encoding; "response.setStatus(HttpServletResponse.SC_OK)" means setting the HTTP response status code to 200, indicating that the request is successful; "out.println("Upload Page")" means outputting a simple HTML page displaying "Upload Page"; "server.start();" means calling server.start() to start the server and start listening on port 8080.
[0160] S3022: Generate a QR code based on network services.
[0161] For example, after starting the network service, the URL is encoded into a QR code using an open source image processing library (Zebra Medical Imaging Project, ZXing library), which is mainly used to generate and parse barcodes, QR codes, etc.
[0162] For example, the following code illustrates how to generate a QR code:
[0163] String qrContent="http: / / 192.168.1.100:8080 / upload";
[0164] Bitmap qrCodeBitmap=QRCodeGenerator.generateQRCode(qrContent);
[0165] imageView.setImageBitmap(qrCodeBitmap);
[0166] Here, "String qrContent = "http: / / 192.168.1.100:8080 / upload";" defines a string "qrContent," which contains the content to be encoded into the QR code. The content is a URL, namely, http: / / 192.168.1.100:8080 / upload. "Bitmap qrCodeBitmap = QRCodeGenerator.generateQRCode(qrContent);" calls a method called "QRCodeGenerator.generateQRCode(qrContent)," which passes "qrContent" as a parameter and generates a QR code image (a Bitmap object). "imageView.setImageBitmap(qrCodeBitmap);" displays the generated QR code image in the "ImageView" control, a UI component used to display images.
[0167] S3023: Display a second upload interface including a QR code.
[0168] For example, in combination Figure 9 As shown in (a) in the figure, the second upload interface 83 includes a third pop-up window 831, which includes a QR code. In addition, the third pop-up window 831 also includes prompt text, such as "Scan and upload photos", "Please use your mobile phone to scan the QR code below and upload photos", "Correct your mobile phone in the same LAN as this device images that are too small or large may not be imported", etc.
[0169] It should be noted that, combined with Figure 9As shown in (b), if the network connection is abnormal, the second upload interface 83 will be updated to obtain the fourth upload interface 84, and the fourth upload interface 84 includes a connection pop-up window 841. Among them, the connection pop-up window 841 includes prompt information and selection controls. For example, selection control 8411 and selection control 8412, selection control 8411 is used to indicate "Connect now (Correct Now)". Selection control 8412 is used to indicate "Cancel connection (Cancel)", that is, exit the interface. Prompt information includes "Scan and upload photos (Scan and upload photos)", "QR code acquisition failed, please check your network connection (OR code acquisition failed please cheak your network connection)" and so on.
[0170] In one embodiment, the second upload interface 83 is composed of Figure 9 Update (a) to Figure 9 The fourth upload interface 84 in (b) can be implemented in various ways, which will be described in detail below.
[0171] Exemplarily, when the second upload interface 83 including the third pop-up window 831 is updated to the fourth upload interface 84 including the connection pop-up window 841, the second upload interface 83 including the third pop-up window 831 can be hidden and the fourth upload interface 84 including the connection pop-up window 841 can be displayed, or the fourth upload interface 84 including the connection pop-up window 841 can cover the second upload interface 83 of the third pop-up window 831, which is not specifically limited here.
[0172] It should be noted that the above-mentioned method can be used for the following methods similar to updating the second upload interface 83 to the fourth upload interface 84, and will not be described in detail below.
[0173] S303: Receive a first request through the communication device. The first request is generated after the terminal device successfully scans the QR code and is used to represent a permission request for establishing a connection.
[0174] In the embodiment of the present application, the communication device may be a network service, and further, the first request is accepted based on a fixed port of the network service.
[0175] Continuing with the above example, the display device 200 controls the port 8080 of the network service to receive a first request, wherein the first request is used to access the web page interface X corresponding to http: / / 192.168.1.100:8080 / upload.
[0176] S304: Based on the first request, generate a first response message and send it to the terminal device.
[0177] The first response message is used to represent a response to the request for establishing a connection permission.
[0178] Continuing with the above example, after receiving the first request, the display device 200 generates a response message, ie, a first response message, according to the content of the request and sends the generated first response message to the mobile device 300 .
[0179] S305: Based on the first request, establish a communication connection with the terminal device and control the display to display a third upload interface; the third upload interface includes a third pop-up window, the third pop-up window includes prompt information, and the prompt information includes information about waiting for file upload.
[0180] Following the above example, combined with Figure 9 (a) and Figure 10 As shown, the display device 200 displays the third upload interface 85 based on the first request. The third upload interface 85 includes a third pop-up window 851. The third pop-up window 851 is used to display a prompt message that the user is waiting to upload a file. In other words, in this embodiment of the application, it refers to a prompt message that the user is waiting to upload an image.
[0181] Illustratively, the display device 200 obtains a third upload interface 85 based on the first request, and the third upload interface 85 includes a third pop-up window 851. The third pop-up window 851 includes "Importing photos", "Waiting to upload from mobile phone device...", "Please do not exit this interface during the upload process", etc.
[0182] It should be noted that the order of steps S304 and S305 is not specifically limited.
[0183] S4: receiving an upload instruction sent by the terminal device through the communication device; the upload instruction includes the files to be uploaded and the total number of files to be uploaded.
[0184] Files to be uploaded can be of various types, including text files, image files, video files, and audio files. In other words, files to be uploaded can contain various types or contents, including but not limited to text files, image files, and video files. These file types can have different formats and uses. For example, text files can store plain text information, image files are typically used to store static images, and video files are used to store dynamic images and audio.
[0185] The upload instruction may include the files to be uploaded and the total number of files to be uploaded. In this embodiment, the upload instruction includes the uploaded pictures and the total number of uploaded pictures. For example, the upload instruction includes 10 pictures and the picture data corresponding to the 10 pictures.
[0186] There are various ways for the display device 200 to receive the upload instruction sent by the terminal device 500, and two of the implementation methods are exemplified below.
[0187] In one embodiment, the upload instruction includes a first upload instruction and at least one second upload instruction. Display device 200 receives the first upload instruction sent by mobile device 300, wherein the first upload instruction includes a "Ready to upload" prompt and the number of images to be uploaded. Next, display device 200 receives a second upload instruction sent by terminal device 500, wherein the second upload instruction includes the specific content of the image.
[0188] It should be noted that each picture corresponds to a second upload instruction.
[0189] For example, if 10 pictures need to be uploaded, the display device 200 receives the first upload instruction including "ready to upload" and "10 pictures" sent by the terminal device 500. Then, the display device 200 continues to receive the second upload instruction a sent by the terminal device 500, the second upload instruction a corresponding to the content of the first picture; the second upload instruction b, the second upload instruction b corresponding to the content of the second picture; the second upload instruction c, the second upload instruction c corresponding to the content of the third picture; the second upload instruction d, the second upload instruction d corresponding to the content of the fourth picture; the second upload instruction e, the second upload instruction e corresponding to the content of the fifth picture, and so on.
[0190] In another embodiment, the upload instruction includes at least one third upload instruction. The display device 200 receives the third upload instruction sent by the mobile device 300, wherein the third upload instruction includes the specific content of the uploaded image, the image sequence number, and the upload quantity corresponding to the image to be uploaded.
[0191] For example, if 10 pictures need to be uploaded, the display device 200 receives the third upload instruction sent by the terminal device 500. Specifically, the display device 200 receives the third upload instruction sent by the terminal device 500, which includes "the specific content of the first picture" and "the total number". For example, the upload instruction may include a third upload instruction x including "the specific content of the second picture" and "10 pictures", a third upload instruction v including "the specific content of the third picture" and "10 pictures", a third upload instruction n including "the specific content of the fourth picture" and "10 pictures", a third upload instruction m including "the specific content of the fifth picture" and "10 pictures", and so on.
[0192] It should be noted that, in order to save resources, when uploading an image for the first time, the third upload instruction may include "the specific content of the first image" and "10 images", while other upload instructions may only include the specific content of the images to be uploaded. Alternatively, the display device 200 receives the third upload instruction sent by the terminal device 500, which includes "the specific content of the first image" and "the total number of images to be sent". For example, the "total number of images to be sent" in the first and third upload instructions is 10, and the "total number of images to be sent" in the second and third upload instructions is 9, and so on, without specific limitation here.
[0193] S5: Based on the upload instruction, the display is controlled to display a first target upload interface, where the first target upload interface includes a first target pop-up window, and the first target pop-up window includes the upload progress of all files to be uploaded.
[0194] Figure 11 This is a fourth schematic diagram of a first upload interface provided in some embodiments of the present application.
[0195] like Figure 11 As shown in (a) in the figure, following the above example, the display device 200 displays the first target upload interface 86 based on the upload instruction. The first target upload interface 86 includes a first target pop-up window 861. The first target pop-up window 861 includes the upload progress and prompt information of all pictures, wherein the upload progress is in the form of a percentage. For example, assuming that the number of pictures to be uploaded is "10 photos", and the upload progress is at "the 8th photo", the progress displayed in the first target pop-up window 861 should be a progress bar of approximately 70%. The prompt information includes the upload progress and the total number of pictures to be uploaded, such as, the eighth picture is being uploaded, and there are a total of 10 pictures to be uploaded (8 photos imported / total 10 photos).
[0196] It should be noted that, if the time to upload the picture exceeds the preset time, the display device 200 will exit the uploading process and display a "toast" prompt to prompt the user "Something is wrong uploading, please try again".
[0197] In summary, when the display device 200 receives the uploaded file sent by the terminal device 500, it can transmit it through the local area network, which has better stability. In addition, during the transmission process, the progress of the file transfer can be displayed in real time to improve the user experience.
[0198] In addition, after the terminal device 500 completes uploading all the files to be uploaded, the display device 200 will also display the upload results to the user. The specific steps are shown in step S6 below:
[0199] S6: After all the files to be uploaded are uploaded, the upload results of all the files to be uploaded are displayed in the first target pop-up window.
[0200] like Figure 11 As shown in (b) of FIG, after all the files to be uploaded are uploaded, the display device 200 updates the fourth target upload interface 87. At this time, the content of the first target pop-up window 861 in the fourth target upload interface 87 is displayed as the upload result. If three of the ten uploaded photos fail to upload successfully, the third target pop-up window will display "Eight photos imported successful, two photos imported failed".
[0201] It should be noted that, in the first target pop-up window 861 displaying the upload result, the display device 200 can receive a return instruction sent by the control device 100 , exit the first target pop-up window 861 and display the photo list in the initial upload interface 81 .
[0202] In summary, the first target pop-up window 861 can intuitively reflect the file upload result, thereby improving user experience.
[0203] Corresponding to the above embodiment, the embodiment of the present application also provides another embodiment. In order to meet the implementation of the file display method, the mobile device 300 should include a display 260, a communication device 220 and a controller 250; wherein the display is configured to display the terminal interface; the communication device is configured to establish a communication connection with the display device. Figure 12 As shown, the controller 250 executes program steps corresponding to the file display method, including the following:
[0204] S7: In response to the scanning instruction input by the user, the QR code in the second pop-up window of the second upload interface in the display device is scanned to generate a first request. The first request is generated after the terminal device successfully scans the QR code and is used to represent a permission request to establish a connection.
[0205] Exemplarily, the mobile device 300 calls an application with a code scanning function in the main interface to scan the QR code in the second pop-up window 831 of the second upload interface 83 in the display device 200 to generate a first request.
[0206] S8: Send a first request to the network service of the display device.
[0207] Exemplarily, the mobile device 300 sends the generated first request item to the display device 200 , and the network service of the display device 200 receives the first request.
[0208] S9: Receive a first response message, where the first response message is generated after the terminal device successfully scans the QR code and is used to represent a response to the request for establishing connection authority.
[0209] For the specific content of the first response message, please refer to the above step S304 and will not be repeated here.
[0210] S10: Based on the first response message, control the display to display a file display interface, where the file display interface includes at least one file.
[0211] For example, for ease of explanation, the document is described using pictures as an example.
[0212] like Figure 13 As shown in (a) of FIG, after receiving the first response message, the terminal device 500 displays the file display interface 31 based on the first response message. The file display interface 31 includes at least one picture and an operation control 310. Specifically, the terminal device 500 can be based on “ <input type=‘file’> ” Select 10 pictures in the file display interface 31. Further, in response to the user clicking the operation control 310 in the file display interface 31, the 10 pictures that need to be uploaded are obtained.
[0213] The file display interface 31 is a local interface of the terminal device 500 , and is not a website interface corresponding to the website information accessed through a QR code.
[0214] It should be noted that the above-mentioned file display interface 31 includes an example description of the operation control 310, and may also not include the operation control. The terminal device 500 determines that the user has selected at least one picture through a preset time. Specifically, if the preset time is 3s, after the user selects 3 pictures, if he has not selected the next one after 3 seconds, the terminal device 500 determines that the user has completed the picture selection.
[0215] S11: In response to the user's second selection operation on at least one file in the file display interface, a thumbnail interface is displayed, where the thumbnail interface includes a first thumbnail for which thumbnail loading has been completed, where the first thumbnail corresponds to each file to be uploaded; the file to be uploaded is a file selected from at least one file, and the second selection operation is used to display the thumbnail interface.
[0216] In one embodiment, S11 includes S111 - S112 .
[0217] S111: In response to a second selection operation of the user on at least one file in the file display interface, displaying a thumbnail interface.
[0218] The thumbnail interface includes loaded thumbnails. Thumbnails are typically smaller than the full image. Their design goal is to reduce memory and storage space usage and increase loading speed. In some scenarios, users do not really need to view the specific content of the image, and the thumbnail is sufficient to provide a basic preview or identification.
[0219] The thumbnail interface is an interface under the website information, not an interface in the terminal device 500. Therefore, the terminal device 500 needs to read the pictures in the file display interface 31 through the "FileReader API".
[0220] Continuing with the above example, Figure 13 As shown in (b) of FIG, in response to the user's selection operation on at least one file in the file display interface 31, the terminal device 500 reads the 10 pictures selected in the file display interface 31 through the "'FlieReader' API", generates and displays the thumbnail interface 32. Figure 13 The thumbnails corresponding to the gray lines in (b) are thumbnails that have not been loaded. Figure 13 The thumbnails corresponding to the black lines in (b) are the thumbnails that have been loaded.
[0221] In order to improve user experience, during the process of displaying thumbnails in the thumbnail interface 32 , the thumbnail interface 32 may be dynamically scrolled according to the loading status of the thumbnails.
[0222] The following is a detailed description with reference to step S112.
[0223] S112: When the length of the interface corresponding to the thumbnail of the file to be uploaded exceeds the length of the thumbnail interface, detect the third position corresponding to the thumbnail being loaded in the thumbnail interface; when the third position is at the second preset position, slide and display the interface corresponding to the thumbnail of the file to be uploaded.
[0224] The thumbnail interface can be an interface that can be displayed by the terminal device 500, or it can be said to be an area corresponding to the display 260 of the terminal device 500, that is, a screen area. The interface corresponding to the thumbnail of the file to be uploaded can be simply understood as a long image. For example, in combination with Figure 13 As shown in (b), only 9 thumbnail display positions can be displayed in the thumbnail interface.
[0225] Continue to combine Figure 13As shown in (b), when the length of the interface corresponding to the thumbnail of the file to be uploaded exceeds the length of the thumbnail interface, the terminal device 500 obtains the third position corresponding to the thumbnail being loaded. When the third position is at the second preset position, the interface corresponding to the thumbnail of the file to be uploaded is slid and displayed.
[0226] Exemplarily, the second preset position may be a display position corresponding to the lower left corner in the thumbnail interface.
[0227] Among them, it should be noted that the sliding interface corresponding to the thumbnail of the file to be uploaded will be restricted. Specifically, if the length of the interface corresponding to the thumbnail of the file to be uploaded exceeds twice the length of the thumbnail interface, then when sliding the interface corresponding to the thumbnail of the file to be uploaded, it will slide adaptively according to the position of the currently loaded thumbnail, that is, slide the currently loaded thumbnail to the display position corresponding to the upper left corner of the thumbnail; if the length of the interface corresponding to the thumbnail of the file to be uploaded does not exceed twice the length of the thumbnail interface, slide the length of the interface corresponding to the thumbnail of the file to be uploaded to the bottom, that is, the bottom of the interface corresponding to the thumbnail of the file to be uploaded corresponds to the bottom of the thumbnail interface.
[0228] The following is an exemplary description with reference to the code. When the length of the interface corresponding to the thumbnail of the file to be uploaded exceeds the length of the thumbnail interface, the thumbnail interface 31 is controlled to scroll to the bottom.
[0229] if(thumbnailContainer.scrollHeight>window.innerHeight){
[0230] window.scrollTo({
[0231] top:thumbnailContainer.scrollHeight,
[0232] behavior:'smooth'
[0233] });
[0234] }
[0235] Among them, "thumbnailContainer.scrollHeight" refers to the total height of the thumbnail container, including the invisible part (that is, the full height of the content), which is the interface length corresponding to the thumbnail of the file to be uploaded. "window.innerHeight" refers to the screen height, that is, the length of the thumbnail interface. "window.scrollTo({" is a method used to scroll the window or page to a specified position, "top:thumbnailContainer.scrollHeight," means that the page will be scrolled to the bottom of the container to ensure that all the contents of the container (including the invisible part) can be displayed. "behavior:'smooth'" means to scroll the interface smoothly.
[0236] S12: After all first thumbnails are loaded, a second target upload interface is displayed; the second target upload interface includes the upload progress of each file to be uploaded.
[0237] For example, in combination Figure 13 As shown in (c), the terminal device 500 displays the second target upload interface 33 based on the upload instruction. If there are 10 pictures to be uploaded, the second target upload interface 33 includes 10 pictures, and the corresponding upload progress is displayed on each picture. The upload progress includes the pictures being uploaded, the pictures that have been uploaded, and the pictures waiting to be uploaded. The uploaded pictures include failed uploads or successful uploads. If the upload is successful, the second target upload interface 33 displays the "Upload Successful" mark; if the upload fails, the second target upload interface 33 displays the "Upload Failed" mark. For example, the "Upload Successful" mark can be "√", and the "Upload Failed" mark can be "!".
[0238] S13: Obtain a first position corresponding to a target file in the files to be uploaded in the second target upload interface; the target file is a file being uploaded in the files to be uploaded.
[0239] For example, if 10 pictures need to be uploaded, the mobile device 300 will obtain the position of the picture being uploaded (target file) in the second upload interface 33 in real time, that is, the first position. For example, if the third picture is uploaded at this time, the position corresponding to the third picture is the first position.
[0240] S14: Moving the target file from the first location to the first preset location in the second target upload interface.
[0241] Among them, the second target upload interface 33 is similar to the thumbnail interface 32. A certain number of thumbnail display positions corresponding to the files to be uploaded will be fixedly displayed in the second target upload interface 33. For example, the second target upload interface 33 displays 9 thumbnail display positions corresponding to the files to be uploaded.
[0242] In the second target upload interface 33, the "scrollIntoView()" method can be used to control the position of the target file, and the first position of the target file can be moved to the first preset position. The first preset position can be the second row of display positions of the thumbnails corresponding to the 9 files to be uploaded in the second target upload interface 33, that is, the positions corresponding to the fourth display position, the fifth display position and the sixth display position. Figure 14 As shown in (a) and (b) in FIG, if 10 pictures need to be uploaded, if the 7th picture is uploaded at this time, the first position corresponding to the 7th picture is in the second target upload interface 33 (as shown in FIG. Figure 14 (a) in FIG), based on the first position, the target file is displayed at the first preset position ( Figure 14 (as shown in (b)).
[0243] In addition, the second target upload interface 33 also includes a selection control 331. The selection control 331 is used to indicate "Cancel". For example, the terminal device 500 jumps to the abort interface 34 (eg, Figure 15 As shown in (a) in FIG. 3 ). The abort interface 34 further includes two selection controls, namely, a selection control 341 and a selection control 342. The selection control 341 is used to indicate “Continue Upload”, and the selection control 342 is used to indicate “Done”. The mobile device 300 can also jump to the completion interface 35 (as shown in FIG. 3 ) in response to the user's operation on the selection control 342. Figure 15 The completion interface 35 includes a selection control 351, and the selection control 351 is used to indicate "Exit".
[0244] In summary, the terminal device 500 accesses the network interface provided by the display device 200 through the QR code to dynamically upload files. During the upload process, the interface will automatically scroll to keep the currently uploaded file on the second line of the current screen, making it easier for users to obtain the upload status of historical uploaded files and improve the user experience.
[0245] In addition, after the mobile device 300 completes uploading the files to be uploaded, the terminal device 500 will also display the upload results to the user. The specific steps are shown in step S14 below:
[0246] S15: After all the files to be uploaded are uploaded, the display is controlled to display a third target upload interface, where the third target upload interface includes the upload result of each file to be uploaded.
[0247] like Figure 15 As shown in (c) in the figure, after all the files to be uploaded are uploaded, the second target upload interface 33 is updated, and the third target upload interface 36 is obtained and displayed. If three of the 10 uploaded pictures are not uploaded successfully, the third upload interface 36 will display the 3 unsuccessful uploads as "!" and the 8 successful uploads as "√". In addition, the third target upload interface 36 also includes two selection controls, namely the selection control 361 and the selection control 362. Among them, the selection control 361 is used to indicate "Continue Upload" and the selection control 372 is used to indicate "Done". The mobile device 300 can jump to the completion interface 35 (such as Figure 14 (as shown in (b) in the figure).
[0248] In summary, the third target upload interface 36 can intuitively reflect the file upload result, thereby improving user experience.
[0249] For ease of understanding, the present application embodiment also provides an example of interaction between a display device 200 and a mobile device 300. In this embodiment, in combination with Figure 16 As shown, the file display method includes the following steps:
[0250] The UI module of the display device 200 displays an initial upload interface in response to a start operation input by the user, wherein the first upload interface includes a first control.
[0251] The UI module generates a first instruction corresponding to the first operation in response to a first operation of the user on the first control, where the first instruction includes starting a network service.
[0252] The UI module sends the first instruction to the network service of the display device 200 .
[0253] The display device 200 starts the network service.
[0254] The web service generates a QR code.
[0255] Based on the QR code, the network service generates a second instruction including the QR code.
[0256] The network service sends a second instruction to the UI module.
[0257] The UI module displays a second upload interface based on the second instruction, where the second upload interface includes a QR code.
[0258] The terminal device 500 scans the QR code in the second upload interface in the display device 200 in response to the scanning instruction input by the user.
[0259] The terminal device 500 generates a first request.
[0260] The terminal device 500 sends a first request to the network service.
[0261] The network service sends a first request to the UI module.
[0262] The UI module generates a first response message based on the first request.
[0263] The UI module sends a first response message to the network service.
[0264] The network service sends a first response message to the terminal device 500 .
[0265] The terminal device 500 displays a file display interface based on the first response message, where the file display interface includes at least one file.
[0266] The terminal device 500 performs a selection operation on at least one file and displays a thumbnail interface.
[0267] When the length of the interface corresponding to the thumbnail of the file to be uploaded exceeds the length of the thumbnail interface, the terminal device 500 detects the third position corresponding to the thumbnail being loaded in the thumbnail interface.
[0268] When the third position is at the second preset position, the terminal device 500 slides and displays the interface corresponding to the thumbnail of the file to be uploaded.
[0269] After all the first thumbnails are loaded, the terminal device 500 displays the second target upload interface and generates an upload instruction.
[0270] The terminal device 500 sends an upload instruction to the network service.
[0271] The network service sends an upload instruction to the UI module.
[0272] The UI module displays a first target upload interface based on the upload instruction, wherein the first target upload interface includes all upload progress.
[0273] The UI module updates the first target upload interface to obtain a fourth target upload interface, wherein the fourth target upload interface includes an upload result.
[0274] After all the first thumbnails are loaded, the terminal device 500 displays the second target upload interface.
[0275] The terminal device 500 obtains the first position corresponding to the target file in the second target upload interface among the files to be uploaded.
[0276] The terminal device 500 moves the target file from the first location to the first preset location in the second upload interface.
[0277] After all the files to be uploaded are uploaded, the terminal device 500 displays a third target upload interface, which includes the upload results of the files to be uploaded.
[0278] The above specific contents can be referred to the above two embodiments and will not be described again here.
[0279] In this way, by establishing a communication connection between the mobile device and the display device under the same local area network, file transfer is achieved. The file upload progress is displayed in real time on the interface of the display device, so that the user can know the transfer status during the file transfer process, thereby improving the user experience.
[0280] Based on the above display device 200, some embodiments of the present application further provide a file display method, including:
[0281] receiving an upload instruction sent by the terminal device through the communication device; the upload instruction includes the files to be uploaded and the total number of files to be uploaded;
[0282] Based on the upload instruction, the display is controlled to display a first target upload interface, where the first target upload interface includes a first target pop-up window, and the first target pop-up window includes the upload progress of all the files to be uploaded.
[0283] The above technical solution has the following beneficial effects or advantages: file transfer is achieved by establishing a communication connection between a mobile device and a display device within the same local area network. The real-time display of the file upload progress on the display device interface allows the user to understand the transfer status and improve the user experience. Furthermore, file transfer via the local area network effectively ensures the stability of file transfer.
[0284] Based on the above-mentioned terminal device 500, some embodiments of this application further provide a file display method, including:
[0285] receiving a first response message, where the first response message is used to represent a response to the request for establishing connection permission;
[0286] Based on the first response message, displaying a file display interface on the display, where the file display interface includes at least one file;
[0287] In response to a user selecting the at least one file, displaying a thumbnail interface, the thumbnail interface including a first thumbnail for which thumbnail loading has been completed, the first thumbnail being a thumbnail corresponding to each of the files to be uploaded; the files to be uploaded being files selected from the at least one file;
[0288] After all the first thumbnails are loaded, a second upload interface is displayed; the second upload interface includes the upload progress of each file to be uploaded;
[0289] Obtaining a first position corresponding to a target file in the files to be uploaded in the second upload interface; the target file is a file being uploaded in the files to be uploaded;
[0290] In the second upload interface, the target file is moved from the first location to a first preset location.
[0291] The above technical solution has the following beneficial effects or advantages: Through the first response message, the location of the target file being uploaded can be accurately obtained and dynamically slid to a preset position in the first target interface, allowing the user to view the file upload progress in real time and intuitively. In this way, the user can view the file upload progress and the upload results corresponding to the file just uploaded in real time without additional operation, thereby providing a smoother user experience. Except for the file upload interface, the interfaces in the various embodiments of this specification are all URL interfaces.
[0292] The same and similar parts between the various embodiments in this specification can be referenced to each other and will not be described again in detail.
[0293] Those skilled in the art will clearly understand that the techniques in the embodiments of the present invention can be implemented using software plus a necessary general-purpose hardware platform. Based on this understanding, the technical solutions in the embodiments of the present invention, or the portion that contributes to the prior art, can be embodied in the form of a software product. This computer software product can be stored in a storage medium such as ROM / RAM, a magnetic disk, or an optical disk, and includes a number of instructions for enabling a computer device (which can be a personal computer, server, or network device, etc.) to execute the methods of various embodiments of the present invention or certain portions of the embodiments.
[0294] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present application, rather than to limit them. Although the present application 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 make equivalent replacements for some or all of the technical features therein. These modifications or replacements do not deviate the essence of the corresponding technical solutions from the scope of the technical solutions of the embodiments of the present application. For the convenience of explanation, the above description has been made in conjunction with specific implementation methods. However, the above exemplary discussion is not intended to be exhaustive or to limit the implementation methods to the specific forms disclosed above. Based on the above teachings, various modifications and variations can be obtained. The selection and description of the above implementation methods are intended to better explain the principles and practical applications, so that those skilled in the art can better use the implementation methods and various different variations of the implementation methods suitable for specific use considerations.
Claims
1. A display device, characterized in that: include: a display configured to display a user interface; A communication device configured to communicate with the terminal device; The mobile device is a device in the same local area network as the display device; The controller is configured as: receiving an upload instruction sent by the terminal device through the communication device; the upload instruction includes the files to be uploaded and the total number of files to be uploaded; Based on the upload instruction, the display is controlled to display a first target upload interface, where the first target upload interface includes a first target pop-up window, and the first target pop-up window includes the upload progress of all the files to be uploaded.
2. The display device according to claim 1, wherein Before the controller executes the step of receiving the upload instruction sent by the terminal device through the communication device, the controller further includes: In response to a first selection operation input by a user, controlling the display to display a first upload interface, the first upload interface including a first pop-up window, the first pop-up window including a first control, the first control being used to allow the user to select a source device for a file to be uploaded, the first selection operation being used to allow the user to perform a file upload operation; In response to a first operation of the user on the first control, a second upload interface is displayed, the second upload interface including a second pop-up window, the second pop-up window including a QR code, and the QR code including website information of the display device; the first operation is used to indicate the source device of the file to be uploaded selected by the user; receiving, by the communication device, a first request, where the first request is generated after the terminal device successfully scans the QR code and is used to represent a request for permission to establish a connection; Based on the first request, a communication connection is established with the terminal device and the display is controlled to display a third upload interface; the third upload interface includes a third pop-up window, the third pop-up window includes prompt information, and the prompt information includes information about waiting for file upload.
3. The display device according to claim 1, wherein The controller executes, in response to a first operation of the user on the first control, displaying a second upload interface, and is specifically configured to: In response to the first operation of the user on the first control, obtaining a first result; the first result is used to indicate whether the terminal device and the display device are in the same local area network; When the first result is used to represent that the terminal device and the display device are in the same local area network, the display is controlled to display the second uploading interface.
4. The display device according to claim 1 or 2, characterized in that After the controller executes the step of displaying the first target upload interface on the display based on the upload instruction, the controller is further configured to: After all the files to be uploaded are uploaded, the upload results of all the files to be uploaded are displayed in the first target pop-up window.
5. A terminal device, characterized in that: include: a display configured to display a terminal interface; a communication device configured to establish a communication connection with the display device; The mobile device is a device in the same local area network as the display device; The controller is configured as: receiving a first response message, where the first response message is generated after the terminal device successfully scans the QR code and is used to represent a response to the request for establishing connection permission; Based on the first response message, controlling the display to display a file display interface, where the file display interface includes at least one file; In response to a second selection operation of the user on the at least one file in the file display interface, displaying a thumbnail interface, wherein the thumbnail interface includes a first thumbnail for which thumbnail loading has been completed, the first thumbnail being a thumbnail corresponding to each of the files to be uploaded; The file to be uploaded is a file selected from the at least one file; the second selection operation is used to display the thumbnail interface; After all the first thumbnails are loaded, the second target upload interface is displayed; The second target upload interface includes the upload progress of each file to be uploaded; Obtaining a first position corresponding to a target file in the file to be uploaded in the second target upload interface; The target file is the file being uploaded among the files to be uploaded; In the second target upload interface, the target file is moved from the first location to a first preset location.
6. The terminal device according to claim 5, characterized in that After the controller executes the steps after all the first thumbnails are loaded, the controller is further configured to: After all the first thumbnails are loaded, an upload instruction is generated; the upload instruction includes the files to be uploaded and the total number of the files to be uploaded; The upload instruction is sent to the display device through the communication device.
7. The terminal device according to claim 5, characterized in that The controller is configured to display a thumbnail interface in response to a user's selection operation of the at least one file, and is specifically configured to: In a case where the length of the interface corresponding to the thumbnail of the file to be uploaded exceeds the length of the thumbnail interface, detecting a third position corresponding to the thumbnail being loaded in the thumbnail interface; When the third position is at the second preset position, the interface corresponding to the thumbnail of the file to be uploaded is slid and displayed.
8. The terminal device according to any one of claims 5 to 7, characterized in that: After the controller executes the step of displaying the second target upload interface after all the first thumbnails are loaded, the controller is further configured to: After all the files to be uploaded are uploaded, the display is controlled to display a third target upload interface, where the third target upload interface includes the upload result of each file to be uploaded.
9. A file display method, characterized in that: include: receiving an upload instruction sent by the terminal device through the communication device; the upload instruction includes the files to be uploaded and the total number of files to be uploaded; Based on the upload instruction, the display is controlled to display a first target upload interface, where the first target upload interface includes a first target pop-up window, and the first target pop-up window includes the upload progress of all the files to be uploaded.
10. A file display method, characterized in that: include: receiving a first response message, where the first response message is generated after the terminal device successfully scans the QR code and is used to represent a response to the request for establishing connection permission; Based on the first response message, controlling the display to display a file display interface, where the file display interface includes at least one file; In response to a second selection operation of the user on the at least one file in the file display interface, displaying a thumbnail interface, wherein the thumbnail interface includes a first thumbnail for which thumbnail loading has been completed, the first thumbnail being a thumbnail corresponding to each of the files to be uploaded; The file to be uploaded is a file selected from the at least one file; the second selection operation is used to display the thumbnail interface; After all the first thumbnails are loaded, the second target upload interface is displayed; The second target upload interface includes the upload progress of each file to be uploaded; Obtaining a first position corresponding to a target file in the file to be uploaded in the second target upload interface; The target file is the file being uploaded among the files to be uploaded; In the second target upload interface, the target file is moved from the first location to a first preset location.