KR102743249B1 - Electronic device and control method thereof - Google Patents

Abstract

A method for controlling an electronic device is disclosed. The method for controlling an electronic device according to the present disclosure includes: when a user command for displaying a UI (User Interface) is input, displaying a UI including a plurality of graphic elements; and when at least one of a size and a ratio of a display screen displaying the UI is changed, changing the size of the UI and displaying it; and the step of changing the size of the UI and displaying it displays at least one graphic element among the graphic elements included in the UI by adjusting its size to a different ratio from other graphic elements included in the UI.

Description

{Electronic device and control method thereof}

The present disclosure relates to an electronic device and a control method thereof, and more particularly, to an electronic device that displays a UI that changes according to the size or ratio of a display screen and a control method thereof.

Recently, various electronic devices are being developed due to the development of electronic technology. In particular, various electronic devices are being developed recently, such as ultra-large electronic devices, rollable electronic devices and foldable electronic devices whose display screen size can be changed, rotatable electronic devices, and modular electronic devices that can display multiple displays as a single screen.

Even though the screens of electronic devices are getting larger and the size and ratio of the screens are changing, in the past, there was an economic loss in that the UI had to be provided by enlarging it equally to the increased screen ratio or individually designing the UI to fit the display screen. Therefore, it was necessary to provide an optimal UI according to the size and ratio of the display screen.

The present disclosure was made in response to the aforementioned necessity, and an object of the present disclosure is to provide an electronic device and a control method thereof that identifies graphic elements that constitute a UI according to the size and ratio of a display screen and provides a UI in which the identified graphic elements are combined.

According to an embodiment of the present disclosure for achieving the above-described purpose, a method for controlling an electronic device includes: when a user command for displaying a UI is input, displaying a UI including a plurality of graphic elements; and when at least one of a size and a ratio of a display screen displaying the UI is changed, changing the size of the UI and displaying it; wherein the changing the size of the UI displays at least one graphic element among the graphic elements included in the UI by adjusting its size to a different ratio from that of other graphic elements included in the UI.

And, the UI includes a first type of graphic element and a second type of element, the first type of graphic element is displayed according to a preset size and ratio, and when the UI includes at least two of the second type of graphic elements, the at least two of the second type of graphic elements can be displayed according to a preset ratio to at least two of the second type of graphic elements included in the UI.

And, when at least one of the size and ratio of the display screen is changed, the size and ratio of the first type of graphic element included in the UI is not changed, and at least one of the size and ratio of each of the at least two second types of graphic elements included in the UI is changed and displayed while maintaining a preset ratio between the at least two second types of graphic elements included in the UI.

And, the UI further includes a third type of graphic element, and at least one of the size and ratio of the third type of graphic element can be changed and displayed according to the size of information included in the third type of graphic element.

And, when the size of the display screen decreases, the step of displaying the UI by deleting at least one of the graphic elements included in the UI; and when the size of the display screen increases, the step of displaying the UI by adding at least one of the plurality of graphic elements to the UI may be further included.

And, when a user command for changing the UI is input, the method may further include a step of displaying the UI by deleting at least one graphic element among the graphic elements included in the UI or adding at least one of the plurality of graphic elements to the UI.

And, the plurality of graphic elements are received from an external server, and if there is an update to the plurality of graphic elements, the step of receiving information about updated graphic elements from the external server; and the step of updating at least one graphic element among the graphic elements included in the UI based on the received information to display the UI may be further included.

And, if the electronic device is a device capable of displaying by combining a plurality of displays, the method may further include a step of identifying a size and ratio of a display screen changed according to a combination of at least one display, and changing and displaying at least one of the sizes and ratios of at least one of the graphic elements included in the UI based on the identified size and ratio.

And, if the display is rotatable, the method may further include a step of identifying a ratio of the display screen that has changed according to the rotation of the display, and changing and displaying at least one of the size and ratio of at least one graphic element among the graphic elements included in the UI based on the identified ratio.

Meanwhile, an electronic device according to an embodiment of the present disclosure for achieving the above object includes: a memory including at least one instruction; and a processor for controlling, by executing the at least one instruction, when a user command for displaying a UI (User Interface) is input, to display a UI including a plurality of graphic elements, and, when at least one of a size and a ratio of a display screen displaying the UI is changed, to change the size of the UI and display it; wherein, in controlling to change the size of the UI and display it, the processor controls to display at least one graphic element included in the UI by adjusting its size to a different ratio from other graphic elements included in the UI.

And, the UI includes a first type of graphic element and a second type of element, the first type of graphic element is displayed according to a preset size and ratio, and when the UI includes at least two of the second type of graphic elements, the at least two of the second type of graphic elements can be displayed according to a preset ratio to at least two of the second type of graphic elements included in the UI.

And, when at least one of the size and ratio of the display screen is changed, the size and ratio of the first type of graphic element included in the UI is not changed, and at least one of the size and ratio of each of the at least two second types of graphic elements included in the UI is changed and displayed while maintaining a preset ratio between the at least two second types of graphic elements included in the UI.

And, the UI may further include a third type of graphic element, and the third type of graphic element may be characterized in that at least one of the size and ratio of the third type of graphic element is changed and displayed according to the size of information included in the third type of graphic element.

And, the processor may be characterized in that, when the size of the display screen decreases, the UI is displayed by deleting at least one of the graphic elements included in the UI, and, when the size of the display screen increases, the UI is displayed by adding at least one of the plurality of graphic elements to the UI.

And, the processor may be characterized in that, when a user command for changing the UI is input, the processor controls the UI to be displayed by deleting at least one graphic element among the graphic elements included in the UI or adding at least one of the plurality of graphic elements to the UI.

And, the electronic device may further include a communication interface, and the plurality of graphic elements are received from an external server through the communication interface, and the processor may be characterized in that, when there is an update for the plurality of graphic elements, it receives information about updated graphic elements from the external server through the communication interface, and, based on the received information, controls to update at least one graphic element among the graphic elements included in the UI to display the UI.

And, the processor may be characterized in that, if the electronic device is a device capable of displaying by combining a plurality of displays, the processor identifies the size and ratio of the display screen changed according to the combination of at least one display, and controls to change and display at least one of the sizes and ratios of at least one of the graphic elements included in the UI based on the identified size and ratio.

And, if the display is rotatable, the method may be characterized by identifying a ratio of the display screen that has changed according to the rotation of the display, and controlling the display to change and display at least one of the size and ratio of at least one graphic element among the graphic elements included in the UI based on the identified ratio.

By means of various embodiments as described above, an optimal UI can be provided according to the size and ratio of the display screen.

FIG. 1 is a drawing for showing a UI according to the screen and ratio of a display according to one embodiment of the present disclosure.
FIG. 2 is a block diagram illustrating a configuration of an electronic device according to an embodiment of the present disclosure.
FIG. 3 is a diagram illustrating a method of creating a UI using graphic elements according to one embodiment of the present disclosure.
FIG. 4 is a diagram illustrating that the size of at least one graphic element included in a UI changes when the size of a display screen changes according to one embodiment of the present disclosure.
FIG. 5 is a diagram illustrating a method in which multiple electronic devices obtain graphic elements from an external server and display a UI according to one embodiment of the present disclosure.
FIG. 6 is a diagram illustrating a display method in which a plurality of electronic devices obtain update information on graphic elements from an external server and display updated graphic elements according to one embodiment of the present disclosure.
FIG. 7 is a drawing showing how the UI is displayed by changing the size and ratio of at least one graphic element depending on the type of each graphic element included in the UI.
FIG. 8 is a diagram illustrating a method for setting each graphic element included in a UI according to one embodiment of the present disclosure.
FIG. 9 is a flowchart for explaining a method for controlling an electronic device according to an embodiment of the present disclosure.
FIG. 10 is a block diagram illustrating a specific configuration of an electronic device according to an embodiment of the present disclosure.

The embodiments described below are provided as examples to help understand the present disclosure, and it should be understood that the present disclosure may be implemented in various ways, different from the embodiments described herein. However, in describing the present disclosure below, if it is determined that a specific description of a related known function or component may unnecessarily obscure the gist of the present disclosure, the detailed description and specific illustration thereof will be omitted. In addition, the attached drawings are not drawn to scale to help understand the disclosure, and the dimensions of some components may be exaggerated.

The terms used in this specification and claims are general terms selected in consideration of the functions of the present disclosure. However, these terms may vary depending on the intention of a person skilled in the art, legal or technical interpretation, and the emergence of new technologies. In addition, some terms are terms arbitrarily selected by the applicant. These terms may be interpreted as defined in this specification, and if there is no specific definition of a term, it may be interpreted based on the overall content of this specification and common technical knowledge in the relevant technical field.

In the description of the present disclosure, the order of each step should be understood as non-limiting, unless a preceding step must logically and temporally be performed before a succeeding step. That is, except for the exceptional cases as above, even if a process described as a succeeding step is performed before a process described as a preceding step, the essence of the disclosure is not affected, and the scope of rights should also be defined regardless of the order of the steps.

The expressions "first," "second," "first," or "second," etc., used in this document can describe various components, regardless of order and/or importance, and are only used to distinguish one component from another, but do not limit the components. For example, a first user device and a second user device can represent different user devices, regardless of order or importance. For example, without departing from the scope of the rights set forth in this document, a first component can be referred to as a second component, and similarly, a second component can also be referred to as a first component.

The terms "module," "unit," "part," etc., used in this document are terms used to refer to a component that performs at least one function or operation, and such a component may be implemented as hardware or software, or a combination of hardware and software. In addition, a plurality of "modules," "units," "parts," etc., may be integrated into at least one module or chip and implemented as at least one processor, except in cases where each of them needs to be implemented as a separate specific hardware.

In this specification, the expressions “have,” “can have,” “include,” or “may include” indicate the presence of a given feature (e.g., a component such as a number, function, operation, or part), and do not exclude the presence of additional features.

In addition, since this specification describes the components necessary for the description of each embodiment of the present disclosure, it is not necessarily limited thereto. Accordingly, some components may be changed or omitted, and other components may be added. In addition, they may be distributed and arranged in different independent devices.

Furthermore, embodiments of the present disclosure will be described in detail with reference to the accompanying drawings and the contents described in the accompanying drawings, but the present disclosure is not limited or restricted by the embodiments.

Hereinafter, the present disclosure will be described in more detail with reference to the attached drawings.

FIG. 1 is a drawing for showing a UI according to the screen and ratio of a display according to one embodiment of the present disclosure.

Electronic devices (100-1, 100-2, 100-3) according to one embodiment of the present disclosure may be implemented as various electronic devices such as a TV, a smart TV, a monitor, an electronic picture frame, an electronic blackboard, an electronic table, a notebook, a tablet PC, a desktop, a set-top box, etc., and FIG. 1 illustrates a case where a first electronic device (100-1), a second electronic device (100-2), and a third electronic device (100-3) are electronic devices including displays.

The electronic devices (100-1 to 100-3) can display a UI (User Interface) on the display. The UI according to the present disclosure can include various UIs such as an application execution UI, a menu UI, a lock UI, a setting UI, a standby UI, a UI for displaying an image, etc.

Referring to FIG. 1, a first UI (10) may be displayed on a first electronic device (100-1), and the first UI (10) may include a plurality of graphic elements. A graphic element according to the present disclosure may mean a component that constitutes a UI. For example, a graphic element may mean a graphic tool that constitutes a UI or a UI element. According to an embodiment of the present disclosure, a graphic tool may be composed of a simple graphic image such as a handle element (40-2) and a bar element (40-3) illustrated in FIG. 4. However, the present disclosure is not limited thereto, and the graphic element may further include content, an icon, text, and a widget. According to an embodiment of the present disclosure, a UI may be generated by combining at least two graphic elements among a plurality of graphic elements. That is, at least one of a size and a ratio of the graphic element may be adjusted according to a type specified for each graphic element, and may be included in the UI.

According to one embodiment of the present disclosure, when at least one of the size and ratio of the display screen is changed while the UI is being displayed on the display, the size of the UI may be changed and displayed. In addition, when the size of the UI is changed and displayed, at least one graphic element included in the UI may be displayed with its size adjusted at a different ratio from other graphic elements included in the UI. Specifically, the graphic element may include graphic elements of a first type, a second type, and a third type, and according to each type, at least one graphic element included in the UI may be displayed with its size adjusted at a different ratio from other graphic elements included in the UI. The first UI (10) of FIG. 1 may include a first graphic element (10-1), a second graphic element (10-2), and a third graphic element (10-3). According to the present disclosure, the first graphic element (10-1) may be a first type of graphic element, and the second graphic element (10-2) and the third graphic element (10-3) may be second type of graphic elements.

The first type of graphic element according to the present disclosure is displayed according to a preset size and ratio (e.g., a size of 6 x 8 pixels in width x height and a ratio of 3:4), and even if the size or ratio of the display screen is changed, the size and ratio of the first type of graphic element may not be changed.

And, when the UI according to the present disclosure includes at least two second type graphic elements, at least two second type elements may be displayed according to a preset ratio between the at least two second type elements included in the UI.

That is, in the first UI (10) of Fig. 1, the first graphic element (10-1) can be displayed according to a size (e.g., 5 pixels or 5 units) and ratio (e.g., width: height = 1:1) preset as a first type of graphic element.

And, the second graphic element (10-2) and the third graphic element (10-3) are graphic elements of the second type, and when the horizontal ratio of the second graphic element (10-2) and the third graphic element (10-3) is set to 3:7, the horizontal area ratio of the second graphic element (10-2) and the third graphic element (10-3) can be displayed as 3:7.

And, a second UI (20) may be displayed on a second electronic device (100-2) whose display screen size is increased in a horizontal area in the first electronic device (100-1). The second UI (20) may include a first graphic element (20-1), a second graphic element (20-2), and a third graphic element (20-3). The first graphic element (20-1) of the second UI (20) is a first type of graphic element, and may have the same size and ratio as the first graphic element (10-1) of the first UI (10-1). And, the second graphic element (20-1) and the third graphic element (20-3) of the second UI (20) are graphic elements of the second type, and the horizontal areas of the second graphic element (20-2) and the third graphic element (20-3) can be displayed in a size of 3:7, similar to the second graphic element (10-2) and the third graphic element (10-3) of the first UI (10-1). That is, the size ratio of the second graphic element (20-2) and the third graphic element (20-3) of the second UI (20) is the same as the size ratio of the second graphic element (10-2) and the third graphic element (10-3) of the first UI (10), but the size of each horizontal area can be increased and displayed.

And, a third UI (30) may be displayed on a third electronic device (100-3) in which the ratio of the display screen of the first electronic device (100-1) is maintained and the size of the display screen is increased. The third UI (30) may include a first graphic element (30-1), a second graphic element (30-2), and a third graphic element (30-3).

The first graphic element (30-1) of the third UI (30) is a first type of graphic element, and may have the same size and ratio as the first graphic element (10-1) of the first UI (10). In addition, the second graphic element (30-2) and the third graphic element (30-3) of the third UI (30) are second type of graphic elements, and the second graphic element (30-3) and the third graphic element (30-3) are displayed at a ratio of 3:7, which is the same horizontal area ratio as the second graphic element (10-2) and the third graphic element (10-3) of the first UI (10), and the overall ratio of the second graphic element (30-3) and the third graphic element (30-3) may also be maintained and displayed. However, the second graphic element (30-2) and the third graphic element (30-3) of the third UI (30) may increase in overall size compared to the second graphic element (10-2) and the third graphic element (10-3) of the first UI (10). That is, when the size of the display screen is changed and the size of the first UI (10) increases to the third UI (30), the first graphic element (30-1) included in the third UI (30) may be displayed with its size adjusted at a different ratio from that of the second graphic element (30-2) and the third graphic element (30-3).

In the above-described embodiment, it has been described that at least two elements of the second type are displayed according to a preset ratio among at least two elements of the second type included in the UI, but this is not limited thereto, and only one element of the second type may be included in the UI. In addition, a designated value having a size and ratio of a preset range may be set and displayed for one element of the second type, which will be described in detail later with reference to FIG. 8.

By various embodiments as described above, an optimal UI can be provided according to the size and ratio of the display screen of the electronic device (100-1 to 100-3) according to the present disclosure.

FIG. 2 is a block diagram illustrating a configuration of an electronic device according to an embodiment of the present disclosure.

Referring to FIG. 2, the electronic device (100) may include a memory (110) and a processor (120). Although not shown in the embodiment, appropriate hardware/software configurations that are obvious to those skilled in the art may be additionally included in the electronic device (100).

The memory (110) can store various programs and data required for the operation of the electronic device (100). Specifically, at least one instruction can be stored in the memory (110). The processor (120) can perform the operation of the electronic device (100) by executing the instruction stored in the memory (110).

Specifically, the memory (110) can store instructions or data related to at least one other component of the electronic device (100). In particular, the memory (110) can be implemented as a non-volatile memory, a volatile memory, a flash memory, a hard disk drive (HDD), a solid state drive (SSD), etc. The memory (110) is accessed by the processor (120), and data reading/writing/modifying/deleting/updating, etc. can be performed by the processor (120). The term “memory” in the present disclosure can include the memory (110), a ROM (not shown) in the processor (120), a RAM (not shown), or a memory card (not shown) (e.g., a micro SD card, a memory stick) mounted on the electronic device (100).

Additionally, a plurality of graphic elements for configuring the UI may be stored in the memory (110).

And, in the memory (110), when displaying a UI using a plurality of graphic elements, the types and detailed information of each graphic element displayed in the UI may be stored. Details on the types and detailed information of the graphic elements will be described later with reference to FIG. 8.

The processor (120) is a component for controlling the overall operation of the electronic device (100). For example, the processor (120) may control a plurality of hardware or software components connected to the processor (120) by driving an operating system and an application, and may perform various data processing and calculations. The processor (120) may be a central processing unit (CPU) or a graphics-processing unit (GPU), or both. The processor (120) may be implemented as at least one general processor, a digital signal processor, an application specific integrated circuit (ASIC), a system on chip (SoC), a microcomputer (MICOM), etc. The processor (120) may execute at least one computer-executable instruction stored in the memory (110).

When an event for displaying a UI occurs, the processor (120) can control the UI to be displayed on the display. In one embodiment of the present disclosure, if the electronic device (100) includes a display, if an event for displaying a UI occurs, the processor (120) can control the display to display the UI on the display. Alternatively, if the electronic device (100) does not include a display and can be connected to an external display device, if an event for displaying a UI occurs, the processor (120) can control the electronic device (100) to display the UI on the external display device.

Events for displaying a UI may include events such as an event in which a user command is input, an event in which a preset time arrives, an event in which an image displayed on a display is stopped or ended, etc. However, this is only an example, and the events for displaying a UI of the present disclosure are not limited to the examples described above.

When a user command for displaying a UI is input, the processor (120) can identify at least one of the size and ratio of the display screen. The user command for displaying the UI may include a user command for selecting a specific button provided in the electronic device (100) or a remote control for the electronic device (100), a user command for selecting a menu displayed on the display, or a command for selecting a menu displayed on a user terminal device such as a smart phone. When the user command as described above is input, the processor (120) can identify at least one of the size and ratio of the display screen. In addition, the display may be included in the electronic device (100), but is not limited thereto, and the electronic device (100) may be connected to an external display device, and the processor (120) can identify at least one of the size and ratio of the display screen of the external display device.

When at least one of the size and ratio of the display screen is identified, the processor (120) can identify at least one graphic element included in the UI displayed on the display screen among a plurality of graphic elements composing the UI based on at least one of the size or ratio of the identified display screen. Specifically, the electronic device (100) can identify a graphic element to be included in the UI among a plurality of graphic elements based on the size and ratio of the display screen.

A graphic element according to the present disclosure may mean a component that constitutes a UI. For example, a graphic element may mean a graphic tool that constitutes a UI or a UI element. According to an embodiment of the present disclosure, a graphic tool may be composed of a simple graphic image such as a handle element (40-2) and a bar element (40-3) illustrated in FIG. 4. However, the present disclosure is not limited thereto, and the graphic element may further include content, an icon, text, and a widget. In addition, at least one of the size and ratio of the graphic element may be adjusted according to each type specified for the graphic element, and the graphic element may be included in the UI.

As an example, referring to FIG. 3, a plurality of graphic elements may include a tooltip element (40-1) for displaying text, a handle element (40-2) that can be moved as a setting value such as a volume or screen brightness of an electronic device (100) is adjusted, a bar element (40-3) indicating an area in which the handle element (40-2) can move, a direction indication element (40-4) that allows a user to move the handle element (40-2) by touching or selecting it, a thumbnail element (40-5) in which a thumbnail image can be displayed, a pentagonal element (40-6), an arrow-shaped element (40-7), and a text element (40-8) for displaying text.

And, the processor (120) can identify at least one graphic element constituting the UI (40) for adjusting the setting values of the electronic device (100), such as the volume and screen brightness of FIG. 3, among the plurality of graphic elements (40-1 to 40-8). That is, the processor can identify the tooltip element (40-1), the handle element (40-2), the bar element (40-3), and the direction indication element (40-4) constituting the UI (40) among the plurality of graphic elements.

When at least one graphic element among a plurality of graphic elements constituting the UI is identified, the processor (120) may control to display a UI including the identified at least one graphic element on the display by adjusting at least one of the sizes and ratios of the identified at least one graphic element to correspond to at least one of the sizes and ratios of the display screen. Referring to FIG. 3, the processor (120) may control to display a UI (40) for adjusting setting values of the electronic device (100), such as volume and screen brightness, by adjusting the sizes and ratios of the identified graphic elements (40-1 to 40-4) to correspond to at least one of the sizes and ratios of the identified display screen. For example, the UI (40) of FIG. 3 may be displayed by adjusting the size of the bar element (40-3) according to the size of the display screen. In addition, when at least one of the sizes and ratios of the display screen is changed, the processor (120) may control to change the size of the UI to correspond to the changed display screen and display it. And, when controlling to change the size of the UI and display it, the processor (120) can control to display at least one graphic element among the graphic elements included in the UI by adjusting its size at a different ratio from other graphic elements included in the UI. Specifically, depending on the type of each graphic element included in the UI, the processor can control to display the UI by changing at least one of the size and ratio of at least one graphic element included in the UI. For example, referring to FIG. 4, if the size of the display screen increases while the existing UI (40) is being displayed, the processor (120) can control to display the UI (45) corresponding to the size of the display screen. That is, if the size of the display screen is increased so that the ratio of the horizontal area of the display screen is increased, the processor (120) can control to display the UI (45) including the bar element (45-3) that increases the size of the bar element (40-3) displayed on the existing UI (40). In FIG. 4, when the size and ratio of the display screen are changed, and the UI (45) with the changed size of the UI (40) is displayed, the size of the bar element (45-3) included in the UI (45) may increase compared to the bar element (40-3) included in the existing UI (40), but the sizes of the tooltip element, the handle element, and the direction indication element included in the UI (45) may be the same as the sizes of the tooltip element, the handle element, and the direction indication element included in the existing UI (40). That is, when at least one of the size and ratio of the display screen is changed, the processor (120) may control the display of the UI (45) by changing the size of the existing UI (40). And, when controlling to display the UI (45), the processor (120) can control to display the bar element (45-3) included in the UI (45) by adjusting its size at a different ratio from that of other graphic elements included in the UI (45).

And, in one embodiment according to the present disclosure, when the size of the display screen decreases, the processor (120) can control to display the UI by deleting at least one of the graphic elements included in the UI. In addition, when the size of the display screen increases, the processor can control to display at least one of the plurality of graphic elements by adding it to the UI.

And, in one embodiment according to the present disclosure, when a user command for changing the UI is input, the processor (120) can control to display the UI by deleting at least one graphic element among the graphic elements included in the UI or adding at least one of a plurality of graphic elements to the UI. That is, the graphic elements according to the present disclosure can be combined by the user, and a UI corresponding to the display environment can be generated without having to create a new design for each UI.

According to one embodiment of the present disclosure, the electronic device (100) can receive a plurality of graphic elements from an external server. Then, when there is an update for the plurality of graphic elements from the external server, the electronic device (100) can receive information about the updated graphic elements from the external server. Then, based on the received information, the processor (120) can control to update at least one graphic element among the graphic elements included in the UI and display the UI on the display. Details on receiving the plurality of graphic elements and the updated information from the external server will be described later with reference to FIGS. 5 and 6.

In one embodiment of the present disclosure, the graphic elements may include graphic elements of a first type, a second type, and a third type.

According to one embodiment of the present disclosure, a first type of graphic element is a graphic element that can be displayed in a UI according to a preset size and ratio, for example, a size and ratio that is preset by a user (e.g., a 3:4 ratio of width x height: 6 x 8 pixels) can be displayed. Further, according to one embodiment, even if the size and ratio of a display screen displaying the UI is changed, the size and ratio of the first type of graphic element may not be changed. According to one embodiment of the present disclosure, when an area in which a second type of graphic element is to be displayed is set in the UI and the size and ratio of the display screen displaying the UI is changed, the size and ratio of the second type of graphic element can be changed and displayed so as to correspond to the size and ratio of the entire UI. That is, according to one embodiment of the present disclosure, when a first type of graphic element and a second type of graphic element are included in a UI, and at least one of a size and a ratio of a display screen is changed, the first type of graphic element included in the UI may be resized at a different ratio from the second type of graphic element included in the UI, and the size of the UI may be changed and displayed.

According to one embodiment of the present disclosure, when at least two graphic elements of the second type are included in a UI, two graphic elements of the second type may be displayed according to a preset ratio of the at least two graphic elements of the second type. Then, when at least one of the size and ratio of a display screen displaying the UI is changed, at least one of the sizes and ratios of each of the at least two graphic elements of the second type may be changed and displayed while maintaining the preset ratio between the at least two graphic elements of the second type included in the UI. In the above-described embodiment, it has been described that at least two elements of the second type are displayed according to a preset ratio between the at least two elements of the second type included in the UI, but it is not limited thereto, and only one element of the second type may be included in the UI. In addition, a designated value having a preset range of size and ratio may be set and displayed for one element of the second type, which will be described in detail later with reference to FIG. 8. In addition, the third type of graphic element may be displayed with at least one of the size and ratio of the third type of graphic element changed according to the size of information included in the third type of graphic element. That is, according to one embodiment of the present disclosure, when a first type of graphic element, a second type of graphic element, and a third type of graphic element are included in a UI, if at least one of the size and ratio of a display screen is changed, the first type of graphic element included in the UI may be adjusted in size at a different ratio from the first and second types of graphic elements included in the UI, and the size of the UI may be changed and displayed. In addition, if at least one of the size and ratio of the display screen is changed, the second type of graphic element included in the UI may be adjusted in size at a different ratio from the first and third types of graphic elements included in the UI, and the size of the UI may be changed and displayed.

The types of graphic elements will be described later with reference to Figures 7 and 8.

In the case where the electronic device (100) according to one embodiment of the present disclosure is a device capable of displaying a single screen by combining multiple displays, the processor (120) can identify the size and ratio of the display screen changed according to the combination of at least one display. Then, the processor (120) can control to change and display at least one of the sizes and ratios of at least one graphic element among the graphic elements included in the UI based on the identified size and ratio of the display screen.

According to one embodiment of the present disclosure, if the display is rotatable, the processor (120) may identify a ratio of a display screen that has changed according to the rotation of the display. Then, the processor (120) may control to change at least one of a size and a ratio of at least one graphic element included in a UI and display the changed graphic element on the display based on the identified ratio of the display screen. For example, if a display screen with a ratio of 16:9 is rotated and changed to a display screen with a ratio of 9:16, the vertical ratio of at least one graphic element included in the UI may be increased and displayed.

As described above, the size and ratio of graphic elements can be changed to correspond to the size and ratio of the display screen, so that an optimal UI suitable for the size and ratio of the display screen can be displayed.

FIG. 5 is a diagram illustrating a method in which multiple electronic devices obtain graphic elements from an external server and display a UI according to one embodiment of the present disclosure.

Referring to FIG. 5, each electronic device (100-1 to 100-3) can receive a plurality of graphic elements from an external server (200) that manages graphic elements. Then, each electronic device (100-1 to 100-3) can display a UI (10-1 to 10-3) corresponding to the size and ratio of the display screen based on the received plurality of graphic elements. Specifically, the first electronic device (100-1) can receive a plurality of graphic elements from the external server (200) and display a UI (10-1) corresponding to the environment of the first electronic device (100-1). Then, the second electronic device (100-2) can receive a plurality of graphic elements from the external server (200) and display a UI (10-2) corresponding to the environment of the second electronic device (100-2). In addition, the third electronic device (100-3) may receive a plurality of graphic elements from an external server (200) and display a UI (10-3) corresponding to the environment of the third electronic device (100-3). Specifically, the size and ratio of at least one of the plurality of graphic elements may be changed according to the size and ratio of the display screen of the electronic device, the application environment of the electronic device, and the settings of the user of each electronic device, so that a UI corresponding to the environment of each electronic device may be displayed.

FIG. 6 is a diagram illustrating a display method in which a plurality of electronic devices obtain update information on graphic elements from an external server and display updated graphic elements according to one embodiment of the present disclosure.

Referring to FIG. 6, each of the first electronic device (100-1) to the third electronic device (100-3) may receive a plurality of graphic elements from an external server (200), and display a UI using at least one of the received plurality of graphic elements. Specifically, a UI corresponding to an environment of each of the first electronic device (100-1) to the third electronic device (100-3) may be displayed through a plurality of graphic elements.

And, if there is an update for at least one of a plurality of graphic elements in the external server (200), the external server (200) can transmit information about the updated graphic element to each of the first electronic device (100-1) to the third electronic device (100-3). An update for a graphic element may mean a change in the shape or color of the graphic element, and in the case of a graphic element including text, a change in the font or text size of the text, but is not limited thereto, and may include an update for all matters that can be changed in the graphic element.

In one embodiment of the present disclosure, when a first UI (10) including a first graphic element (10-1) is displayed on a first electronic device (100-1) and the first graphic element (10-1) is updated to a second graphic element (10-2) on an external server (200), the external server (200) can transmit information about the updated second graphic element (10-2) to the first electronic device (100-1) to the third electronic device (100-3).

And, when the first electronic device (100-1) receives information about the updated second graphic element (10-2) from the external server (200), the first electronic device (100-1) can display the second UI (15) in which the first graphic element (10-1) included in the first UI (10) is updated to the second graphic element (10-2).

And, when a third UI (20) that does not include a first graphic element (10-1) is displayed on a second electronic device (100-2), the second electronic device (100-2) may display the third UI (20) as is without updating it even if it receives information about the updated second graphic element (10-2).

As described above, when managed in units of graphic elements that constitute the UI, the electronic device only needs to change the graphic elements that have been changed in the existing UI, so there is no need to modify the entire UI in order to modify one graphic element.

FIG. 7 is a drawing showing how the UI is displayed by changing the size and ratio of at least one graphic element depending on the type of each graphic element included in the UI.

According to one embodiment of the present disclosure, when at least one of the size and ratio of the display screen is changed, the UI can be displayed by changing at least one of the size and ratio of at least one graphic element among the graphic elements included in the UI according to the type of each graphic element included in the UI.

According to one embodiment of the present disclosure, the graphic element may include a first type graphic element, a second type graphic element, and a third type graphic element. And, a UI including at least one type of the first type graphic element, the second type graphic element, and the third type graphic element may be displayed.

According to one embodiment of the present disclosure, a first type of graphic element is a graphic element that can be displayed in a UI according to a preset size and ratio, for example, a size and ratio can be preset by a user and displayed. In addition, even if the size and ratio of a display screen displaying the UI are changed, the size and ratio of the first type of graphic element may not be changed. That is, if the size and ratio of the first type of graphic element are preset once by a user, even if the size and ratio of the display screen are changed and the size of the entire UI is changed, the first type of graphic element can be displayed while maintaining the preset size and ratio. According to one embodiment of the present disclosure, by assigning a preset designated value (reserved value) to the first type of graphic element, the first type of graphic element can be displayed while maintaining the preset size and ratio. For example, referring to FIG. 7, a first graphic element (70-1) included in a first UI (70) can be a first type of graphic element. As an example, the first graphic element (70-1) may be a graphic element for displaying text or an image. The first graphic element (70-1) may have a value specified by the user, and may have a specified length in width and height. In addition, the color, transparency, etc. of the first graphic element (70-1) may be preset (e.g., white color, transparency 80%).

And, when the size of the display screen for displaying the first UI (70) is reduced, the second UI (80) with the reduced size of the entire first UI (70) can be displayed. Even when the second UI (80) with the reduced size of the entire UI is displayed, the first graphic element (80-1), which is a first type of graphic element included in the second UI (80), can be displayed while maintaining its size and ratio by a specified value.

According to one embodiment of the present disclosure, the UI may change its overall size or ratio in response to the degree of change in the size or ratio of the display screen. For example, if the size of the display screen is doubled, the UI may also be doubled. However, this is only one embodiment, and the degree of increase in the overall size of the UI due to the increase in the size of the display screen of the present disclosure is not limited to the above-described example.

And, when the size of the display screen for displaying the first UI (70) increases, the third UI (90) with the increased size of the entire first UI (70) can be displayed. Even when the third UI (90) with the increased size of the entire UI is displayed, the first graphic element (90-1), which is a first type of graphic element included in the third UI (90), can be displayed while maintaining its size and ratio by the specified value.

According to one embodiment of the present disclosure, when an area in which the second type graphic element is to be displayed is set within a UI and the size and ratio of a display screen displaying the UI are changed, the size and ratio of the second type graphic element can be changed and displayed to correspond to the size and ratio of the entire UI. Specifically, by specifying a value representing a ratio called a shared value to the second type graphic element, the size and ratio of the second type graphic element can be changed and displayed to correspond to the size and ratio of the entire UI. Specifically, when there is one second type graphic element in a UI, an area in which the second type graphic element is to be displayed can be set within the UI, and in this case, the shared value of one second type graphic element can be 1.

Alternatively, when there are two graphic elements of the second type in the UI, an area in which the two graphic elements of the second type are to be displayed may be set within the UI, in which case the sum of the shared values of the two graphic elements may be 1. Then, when the size and ratio of the display screen displaying the UI are changed and the size of the entire UI is changed, the size of the area in which the two graphic elements of the second type are to be displayed within the UI may be changed and displayed. Then, the two graphic elements of the second type may be displayed while maintaining the ratio of their respective set shared values.

For example, the first UI (70) of FIG. 7 may include a second graphic element (70-2) and a third graphic element (70-3), which are elements of the second type. In one embodiment, the second graphic element (70-2) and the third graphic element (70-3) may be graphic elements for displaying text. The second graphic element (70-2) and the third graphic element (70-3) may have their shared values set to 0.7 and 0.3, respectively, by the user. In this case, the second graphic element (70-2) and the third graphic element (70-3) may be displayed in an area remaining except for the areas of the first graphic element (70-1) and the fourth graphic element (70-4) included in the UI, and the second graphic element (70-2) and the third graphic element (70-3) may be displayed in the remaining area at a size ratio of 7:3.

And, when the size of the display displaying the first UI (70) is reduced and the second UI (80) with the reduced size of the first UI (70) is displayed on the display, the second graphic element (80-2) and the third graphic element (80-3) can be displayed at a size ratio of 7:3 in the remaining area except for the area including the first graphic element (80-1) and the fourth graphic element (80-4) in the second UI (80).

In addition, and when the size of the display displaying the first UI (70) is increased, and the third UI (90) whose size is increased from the first UI (70) is displayed on the display, the second graphic element (90-2) and the third graphic element (90-3) may be displayed with a size ratio of 7:3 in the remaining area except for the area including the first graphic element (90-1) and the fourth graphic element (90-4) in the third UI (90). In the above-described embodiment, it has been described that at least two elements of the second type are displayed according to a preset ratio between at least two elements of the second type included in the UI, but it is not limited thereto, and only one element of the second type may be included in the UI. In addition, a designated value having a preset range of size and ratio may be set and displayed for one element of the second type, and details will be described later with reference to FIG. 8. According to one embodiment of the present disclosure, a third type of graphic element may be identified in terms of the size of an area of the third type of graphic element by the size of information that may be included in an area of the third type of graphic element. That is, when the third type of graphic element is a graphic element for displaying text, the size of the third type of graphic element may increase as the number of texts displayed in the third type of graphic element increases. In addition, when the third type of graphic element is a graphic element for displaying an icon that may be selected by a user, the size of the third type of graphic element may change in terms of the number of icons included in the third type of graphic element.

For example, the first UI (70) of FIG. 7 may include a fourth graphic element (70-4) which is a third type of graphic element. The size and ratio of the fourth graphic element (70-4) do not change depending on changes in the display screen and ratio that display the UI, and the size or ratio may change depending on the size of the information included in the fourth graphic element (70-4). That is, when the sizes of the information included in the fourth graphic element in the first UI (70) and the third UI (90) in which the size of the entire UI is increased are the same, the sizes and ratios of the fourth graphic element (70-4) included in the first UI (70) and the fourth graphic element (90-4) included in the third UI (90) may be the same. In addition, when the size of information included in the fourth graphic element (80-4) included in the second UI (80) whose overall size is reduced in the first UI (70) is larger than the size of information included in the fourth graphic element (70-4) included in the first UI (70), the size of the fourth graphic element (80-4) included in the second UI (80) may be larger than the size of the fourth graphic element (70-4) included in the first UI (70).

By various embodiments as described above, even if the size or ratio of the screen of the display is changed and thus the size or ratio of the entire UI is changed, each graphic element included in the UI can be displayed according to each type so as to correspond to the size of the entire UI, so that it may be unnecessary to individually design the UI to match the screen and ratio of the display.

FIG. 8 is a diagram illustrating a method for setting each graphic element included in a UI according to one embodiment of the present disclosure.

Referring to FIG. 8, the UI (10) may include a first graphic element (10-1), a second graphic element (10-2), a third graphic element (10-3), and a fourth graphic element (10-4). In one embodiment, the first graphic element (10-1) and the fourth graphic element (10-4) are graphic elements for displaying text, the second graphic element (10-2) is an area graphic element for designating an area where the third graphic element (10-3) can be displayed, and the fourth graphic element (10-4) may be a cursor icon indicating a location where text is input by a user.

And, as an example of the present disclosure, the first graphic element (10-1) may be a first type of graphic element, and the second graphic element (10-2) and the third graphic element (10-3) may be second type of graphic elements. Since the fourth graphic element (10-4) is a cursor icon, its type may not be specified.

According to one embodiment of the present disclosure, the first graphic element (10-1), which is a first type of graphic element, may have a fixed size designated value. That is, referring to FIG. 8, the horizontal length of the first graphic element (10-1) may be fixed to 17 units, and the vertical length may be fixed to 6 units. In the case of a first type of graphic element having a fixed size designated value, even if the size or ratio of the UI (10) is changed, the size and ratio of the first type of graphic element may be displayed without changing. In addition, according to one embodiment of the present disclosure, properties such as color and transparency of the first graphic element (10-1) may also be designated.

And, the second graphic element (10-2), which is a second type of graphic element, may have a designated value having a preset range. That is, according to one embodiment of the present disclosure, the second type of graphic element may have a designated value having a preset range or may have a shared value.

That is, the horizontal size of the second graphic element (10-2) may be displayed according to a designated value having a preset range of 12 units to 64 units depending on the size of the entire UI (10), and the vertical size of the second graphic element (10-2) may be displayed according to a designated value having a preset range of 7 units to 9 units depending on the size of the entire UI (10). In addition, according to one embodiment of the present disclosure, the first graphic element (10-1) and the second graphic element (10-2) may be arranged with a spacing of 3 units. The spacing of 3 units is a fixed value, and may not be changed even if the size of the UI (10) is changed.

In addition, the third graphic element (10-3), which is a second type of graphic element, may be displayed in the remaining area of the second graphic element (10-2) except for 3 horizontal units and 3 vertical units from both ends. The spacing of 3 units is a fixed value, and may not change even if the size of the UI (10) changes.

According to one embodiment of the present disclosure, when there are a plurality of second type graphic elements included in a UI or a second type graphic element, a sum of shared values set for each of the plurality of second type graphic elements may be 1. And, when there is one second type graphic element included in a UI or a second type graphic element, a shared value set for one second type graphic element may be 1.

That is, since the second type of graphic element included in the second graphic element (10-2) is one third graphic element (10-3), the shared value of the third graphic element (10-3) can be 1.

In addition, according to one embodiment of the present disclosure, a second type of graphic element having a shared value may be included within a second type of graphic element having a designated value having a preset range. In one embodiment, when there are two second type of graphic elements having a shared value included within the second type of graphic element having a designated value having a preset range, the sum of the shared values of each of the two second type of graphic elements is 1 (e.g., 0.6:0.4), and as the size of the second type of graphic element having the designated value having the preset range is changed, the two second type of graphic elements may be changed in size while maintaining the ratio of their respective shared values (0.6:0.4).

In addition, when there is one second type graphic element having a shared value included in a second type graphic element having a designated value with a preset range, the one second type graphic element has a shared value of 1, and the size of the one second type graphic element can be changed as the size of the second type graphic element having the designated value with the preset range is changed. That is, the third graphic element (10-3) included in the second graphic element (10-2) having the designated value with the preset range has a shared value of 1, and its size and ratio can be changed and displayed as the size and ratio of the second graphic element (10-2) are changed.

And, the fourth graphic element (10-4), which is a cursor icon, has a horizontal size of 1 unit, and the vertical size can be changed according to the size of the third graphic element (10-3).

Through the various types of graphic elements described above, when the size or ratio of the entire UI is changed, each graphic element is displayed within a preset size range, so that a UI corresponding to the size and ratio of the display screen can be displayed without having to design the UI individually.

FIG. 9 is a flowchart for explaining a method for controlling an electronic device according to an embodiment of the present disclosure.

Referring to FIG. 9, first, the electronic device (100) can receive a user command for displaying a UI (S910). The user command for displaying the UI may include a user command for selecting a specific button provided on the electronic device (100) or a remote control for the electronic device (100), a user command for selecting a menu displayed on a display, or a command for selecting a menu displayed on a user terminal device such as a smart phone.

When a user command for displaying a UI is input, the electronic device (100) can identify at least one of the size and ratio of the display screen (S920). The size and ratio of the display screen may mean the size and ratio of a screen that displays content, an image, or a UI on the display, or an area that displays content, an image, or a UI on the display.

And, the electronic device (100) can identify at least one graphic element among the plurality of graphic elements constituting the UI based on at least one of the size and ratio of the identified display screen (S930). Specifically, the electronic device (100) can identify the graphic element to be included in the UI among the plurality of graphic elements based on the size and ratio of the display screen.

A graphic element according to the present disclosure may mean a component constituting a UI. For example, a graphic element may include content, an icon, text, a widget, and may also include a graphic item such as a simple shape. When at least one graphic element constituting a UI is identified, the electronic device may display the UI by adjusting at least one of the sizes and ratios of the identified at least one graphic element to correspond to at least one of the sizes and ratios of the display screen (S940). That is, a UI including at least one graphic element in a size and ratio corresponding to the size and ratio of the display screen may be displayed.

FIG. 10 is a block diagram illustrating a specific configuration of an electronic device according to an embodiment of the present disclosure.

Referring to FIG. 10, the electronic device (1000) may include a memory (1010), a processor (1020), a display (1030), a communication interface (1040), and an input interface (1050). Here, some configurations of the memory (1010) and the processor (1020) are the same as those illustrated in FIG. 2, and thus, duplicate descriptions are omitted.

The display (1030) can display a UI (User Interface) and graphic elements. For example, the UI can be various screens such as an application execution screen, a menu screen, a lock screen, a settings screen, a standby screen, etc.

In addition, the display (1030) can display various images. Here, the image is a concept including at least one of a still image or a moving image, and the display (1030) can display various images such as broadcast content, multimedia content, etc.

And, the ratio of the display (1030) screen can be implemented in various ratios including 21:9, 16:9, 4:1, 1:1, and 9:21. In the present disclosure, the “ratio of the display (1030) screen” can mean the ratio of the width and height (width: height) of the entire screen or the entire area displaying content, images, or UI.

In addition, the ratio of the display (1030) screen can be changed according to a user's input, and the display (1030) is implemented as at least one of a rollable display, a rotatable display, and a display that can be displayed by combining multiple displays, so that the ratio of the display (1030) screen can be changed according to the operation of the display.

And, the size of the display (1030) can be reduced or increased. Specifically, the display (1030) can be implemented as a foldable display in which the display (1030) can be folded, or a rollable display in which the display (1030) can be rolled. Alternatively, the size of the display can be changed, such as when multiple displays (1030) are connected or separated. In addition, the size of the screen of the display (1030) can be changed according to a user's input. For example, when the display (1030) is implemented as a rollable display, when a part of the display (1030) is rolled, the size of the entire display (1030) is the same, but the size of the displayable area of the screen of the display (1030) can be changed, and in this case, the size of the screen of the display (1030) can be viewed as changed.

As such, the display (1030) may be implemented as various types of displays, such as an LCD (Liquid Crystal Display Panel), an LED (light emitting diode), an OLED (Organic Light Emitting Diodes), an LCoS (Liquid Crystal on Silicon), a DLP (Digital Light Processing), etc. In addition, the display (1030) may also include a driving circuit, a backlight unit, etc., which may be implemented as a type of a-si TFT, an LTPS (low temperature poly silicon) TFT, an OTFT (organic TFT), etc.

Additionally, the display (1030) may be implemented as a touch screen by being combined with a touch panel. However, this is only one embodiment, and the display (1030) may be implemented in various ways.

The electronic device (1000) may include a communication interface (1040) for performing communication with an external device. The communication interface (1040) may include various communication modules for performing communication with an external device or an external server. Specifically, the communication interface (1040) may include at least one of a short-range wireless communication module (not shown) and a wireless LAN communication module (not shown). Here, the short-range wireless communication module (not shown) is a communication module that performs data communication wirelessly with an electronic device located at a short distance, and may be, for example, a Bluetooth module, a ZigBee module, an NFC (Near Field Communication) module, etc. In addition, the wireless LAN communication module (not shown) may be a module that performs communication by being connected to an external network according to a wireless communication protocol such as WiFi, IEEE, etc.

In addition, the communication interface (1040) may further include a mobile communication module that performs communication by connecting to a mobile communication network according to various mobile communication standards such as 3rd Generation (3G), 3rd Generation Partnership Project (3GPP), and Long Term Evoloution (LTE). In addition, the communication interface (1040) may include at least one of wired communication modules (not shown) such as Universal Serial Bus (USB), Institute of Electrical and Electronics Engineers (IEEE) 1394, and RS-232, and may include a broadcast receiving module that receives TV broadcasts.

In particular, the communication interface (1040) can receive a user command for controlling the electronic device (1000) from an electronic device such as a smart phone. For example, when a user command for determining the size or ratio of the display (1030) screen is input through the screen of the smart phone, the communication interface (1040) can receive a user command for determining the size or ratio of the display (1030) screen of the electronic device (1000) from the smart phone.

Additionally, the communication interface (1040) can receive a plurality of graphic elements from an external server. And, if there is an update for at least one of the plurality of graphic elements from the external server, the communication interface (1040) can receive information about the updated graphic element from the external server.

The electronic device (1000) can receive various broadcasting services, Internet services, etc. from the electronic device through the communication interface (140), communicate with surrounding smartphones, laptops, etc., and can be connected to media devices such as a sound bar.

The input interface (1050) can receive a user command for controlling the electronic device (100). In particular, the input interface (150) can include a touch panel for receiving a user touch using a user's hand or a stylus pen, a physical button for receiving a user operation, and the like. In addition, the input interface (1050) can be implemented by being included in an external device capable of wireless communication with the electronic device (1000). In one embodiment, the external device can be implemented as at least one of a remote control, a virtual keyboard, a smartphone, or a wearable device.

The input interface (1050) can receive a user command for outputting content or an image or a user command for displaying a UI. In addition, the input interface (1050) can be implemented as a microphone for receiving a command through a user's spoken voice. Specifically, when the user's spoken voice is directly input by the microphone, the processor (1020) can identify the user's command using an STT (Speech to Text) module (not shown).

And, the electronic device (1000) may include a motor (not shown) and a sensor (not shown). The motor (not shown) may be configured to roll the display (1030) when the display (1030) is implemented as a rollable. Or, the motor may be configured to rotate the display (1030) when the display (1030) is a rotatable display.

The sensor (not shown) may include various sensors such as a gyro sensor, a gesture sensor, an acceleration sensor, and a grip sensor, and the data collected from each sensor may be used to measure a user's viewing distance, detect the size of a rollable display, or detect the rotation direction of a rotatable display.

Meanwhile, the electronic device (1000) is not limited to the configuration described above in FIG. 10, and some configurations may be added or omitted depending on the type of the electronic device (1000).

The various embodiments described above may be implemented in software, hardware, or a combination thereof. In terms of hardware implementation, the embodiments described in the present disclosure may be implemented using at least one of Application Specific Integrated Circuits (ASICs), digital signal processors (DSPs), digital signal processing devices (DSPDs), programmable logic devices (PLDs), field programmable gate arrays (FPGAs), processors, controllers, micro-controllers, microprocessors, and other electrical units for performing functions. In particular, the various embodiments described above may be implemented by the processor (1020) of the electronic device (100). In terms of software implementation, embodiments such as the procedures and functions described in this document may be implemented as separate software modules. Each of the software modules may perform one or more functions and operations described in this document.

Various embodiments of the present disclosure may be implemented as software including commands that may be stored in a machine-readable storage media that can be read by a machine (e.g., a computer). The machine is a device that can call commands stored from the storage media and operate according to the called commands, and may include an electronic device (100) of the disclosed embodiments.

When these instructions are executed by the processor, the processor can perform a function corresponding to the instructions directly or by using other components under the control of the processor. The instructions can include codes generated or executed by a compiler or an interpreter. For example, the control method of the electronic device described above can be executed by executing the instructions stored in the storage medium by the processor. For example, when the instructions stored in the storage medium are executed by the processor of the device (or the electronic device), the steps of obtaining a list including at least one relay device for performing an initial connection with an external device and displaying it on a display, when one relay device from the list is selected, transmitting a connection request for the selected relay device to the selected relay device, when receiving connection approval information from the relay device, displaying a list for at least one external device capable of performing a connection by the relay device on the display, when one external device from the list for at least one external device is selected, receiving an authentication request for the selected external device from the selected external device, and when a user input is received in response to the authentication request, performing an initial connection with the selected external device can be performed.

A storage medium that can be read by the device may be provided in the form of a non-transitory storage medium. Here, 'non-transitory' means that the storage medium does not contain signals and is tangible, but does not distinguish whether data is stored semi-permanently or temporarily in the storage medium.

According to one embodiment, the method according to various embodiments disclosed in the present document may be provided as included in a computer program product. The computer program product may be traded between sellers and buyers as a commodity. The computer program product may be distributed in the form of a machine-readable storage medium (e.g., compact disc read only memory (CD-ROM)) or online through an application store (e.g., Play Store™, App Store™). In the case of online distribution, at least a part of the computer program product may be temporarily stored or temporarily generated in a storage medium such as a memory of a manufacturer's server, a server of an application store, or a relay server.

Each of the components (e.g., modules or programs) according to various embodiments may be composed of a single or multiple entities, and some of the corresponding sub-components described above may be omitted, or other sub-components may be further included in various embodiments. Alternatively or additionally, some of the components (e.g., modules or programs) may be integrated into a single entity, which may perform the same or similar functions performed by each of the corresponding components prior to integration. Operations performed by modules, programs or other components according to various embodiments may be executed sequentially, in parallel, iteratively or heuristically, or at least some of the operations may be executed in a different order, omitted, or other operations may be added.

Although the preferred embodiments of the present disclosure have been illustrated and described above, the present disclosure is not limited to the specific embodiments described above, and various modifications may be made by a person skilled in the art to which the present disclosure pertains without departing from the gist of the present disclosure as claimed in the claims, and such modifications should not be individually understood from the technical idea or prospect of the present disclosure.

100: Electronic devices
110: Processor
120: Memory

Claims (18)

In a method for controlling an electronic device,
When a user command for displaying a UI (User Interface) is input, a step of displaying a UI including a plurality of graphic elements; and
A step of changing the size of the UI and displaying it when at least one of the size and ratio of the display screen displaying the UI is changed;
The step of changing the size of the UI and displaying it comprises displaying at least one graphic element among the graphic elements included in the UI by adjusting its size to a different ratio from that of other graphic elements included in the UI.
The above UI includes a first type of graphic element and a second type of element,
The above first type of graphic element is displayed according to a preset size and ratio,
A control method in which, when the above UI includes at least two of the second type of graphic elements, the at least two second type of graphic elements are displayed according to a preset ratio of the at least two second type of graphic elements included in the UI.
delete In the first paragraph,
If at least one of the size and aspect ratio of the above display screen changes,
The size and proportion of the first type of graphic element included in the above UI are not changed,
A control method in which at least one of the sizes and ratios of each of at least two second types of graphic elements included in the UI is changed and displayed while maintaining a preset ratio between the at least two second types of graphic elements.
In the first paragraph,
The above UI further includes a third type of graphic element,
A control method in which the third type of graphic element is displayed by changing at least one of the size and ratio of the third type of graphic element according to the size of information included in the third type of graphic element.
In the first paragraph,
When the size of the display screen is reduced, a step of displaying the UI by deleting at least one of the graphic elements included in the UI; and
A control method comprising the step of displaying the UI by adding at least one of the plurality of graphic elements to the UI when the size of the display screen increases.
In the first paragraph,
A control method further comprising: a step of displaying the UI by deleting at least one graphic element among the graphic elements included in the UI or adding at least one of the plurality of graphic elements to the UI when a user command for changing the UI is input.
In the first paragraph,
The above multiple graphic elements are received from an external server,
When there is an update for the above plurality of graphic elements, a step of receiving information about updated graphic elements from an external server; and
A control method further comprising: a step of displaying the UI by updating at least one graphic element among the graphic elements included in the UI based on the received information;
In the first paragraph,
A control method further comprising: when the electronic device is a device capable of displaying by combining a plurality of displays, identifying a size and ratio of a display screen changed according to a combination of at least one display, and changing and displaying at least one of the sizes and ratios of at least one of the graphic elements included in the UI based on the identified size and ratio.
In the first paragraph,
A control method further comprising: a step of identifying a ratio of the display screen that has changed according to the rotation of the display when the display is rotatable, and changing and displaying at least one of the size and ratio of at least one graphic element included in the UI based on the identified ratio.
In electronic devices,
memory containing at least one instruction; and
By executing at least one instruction above, when a user command for displaying a UI (User Interface) is input, a UI including a plurality of graphic elements is displayed, and
A processor configured to control display of the UI by changing its size when at least one of the size and ratio of the display screen displaying the UI is changed;
The above processor controls the display by changing the size of the UI,
Controlling the display of at least one graphic element among the graphic elements included in the UI by adjusting its size to a different ratio from other graphic elements included in the UI;
The above UI includes a first type of graphic element and a second type of element,
The above first type of graphic element is displayed according to a preset size and ratio,
An electronic device in which at least two graphic elements of the second type are displayed according to a preset ratio of at least two graphic elements of the second type included in the UI, when the UI includes at least two graphic elements of the second type. delete delete delete delete delete delete delete delete

Images