WO2025100697A1 - 플렉서블 디스플레이에서 콘텐트를 표시하는 전자 장치, 방법, 및 비-일시적 컴퓨터 판독 가능 기록 매체 - Google Patents

플렉서블 디스플레이에서 콘텐트를 표시하는 전자 장치, 방법, 및 비-일시적 컴퓨터 판독 가능 기록 매체 Download PDF

Info

Publication number
WO2025100697A1
WO2025100697A1 PCT/KR2024/012017 KR2024012017W WO2025100697A1 WO 2025100697 A1 WO2025100697 A1 WO 2025100697A1 KR 2024012017 W KR2024012017 W KR 2024012017W WO 2025100697 A1 WO2025100697 A1 WO 2025100697A1
Authority
WO
WIPO (PCT)
Prior art keywords
area
region
size
electronic device
content
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
PCT/KR2024/012017
Other languages
English (en)
French (fr)
Inventor
조수정
조형탁
김양욱
최봉학
이성훈
이소영
최미령
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Samsung Electronics Co Ltd
Original Assignee
Samsung Electronics Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Priority claimed from KR1020230186434A external-priority patent/KR20250066988A/ko
Application filed by Samsung Electronics Co Ltd filed Critical Samsung Electronics Co Ltd
Priority to US18/886,514 priority Critical patent/US20250148948A1/en
Publication of WO2025100697A1 publication Critical patent/WO2025100697A1/ko
Anticipated expiration legal-status Critical
Pending legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING OR CALCULATING; COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G—PHYSICS
    • G06—COMPUTING OR CALCULATING; COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04842—Selection of displayed objects or displayed text elements
    • G—PHYSICS
    • G06—COMPUTING OR CALCULATING; COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04845—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour

Definitions

  • Embodiments of the present disclosure relate to electronic devices, methods, and non-transitory computer-readable recording media for displaying content on a flexible display.
  • the flexible display can be freely bent, the flexible display can be rolled or unrolled inside the electronic device.
  • the size or area of the overall viewable display can be reduced, and also, when the flexible display rolled inside the electronic device is unrolled, the size or area of the overall viewable display can be increased.
  • the electronic device may include a housing including a first housing part and a second housing part movably engaged with the first housing part.
  • the electronic device may include a flexible display including a display area visible from a front side of the electronic device. A size of the display area may be expanded or reduced depending on movement of the second housing part.
  • the electronic device may include a memory storing instructions.
  • the electronic device may include a processor operatively connected to the flexible display and the memory. The instructions, when executed by the processor, may cause the electronic device to display a plurality of contents on the display area of the flexible display while the size of the display area has a first size.
  • the instructions when executed by the processor, may cause the electronic device to display first content related to content selected from the plurality of contents in a first region among the regions of the display area, based on an increase in the size of the display area from the first size to the second size: while the display area has the first size, the regions may be arranged with respect to one another.
  • the instructions when executed by the processor, may cause the electronic device to display at least a portion of second content and at least a portion of third content, respectively, in a second region and a third region adjacent to the first region and interposing the first region therebetween, the second region being disposed around the selected content.
  • the first region may be adjacent to the second region and the third region, and being between the second region and the third region. While the size of the display area is increasing to the second size, at least a portion of the second content and at least a portion of the third content may be displayed around the selected content that was displayed while the display area had the first size, respectively.
  • a method is disclosed.
  • the method can be performed in an electronic device, comprising a housing including a first housing part and a second housing part movably coupled to the first housing part, and a flexible display including a display area visible from a front surface of the electronic device.
  • the size of the display area can be expanded or reduced according to the movement of the second housing part.
  • the method can include an operation of displaying a plurality of contents on the display area of the flexible display while the size of the display area has a first size.
  • the method can include an operation of displaying, based on the expansion of the size of the display area from the first size to the second size: while the display area has the first size, a first content related to a content selected from among the plurality of contents on a first area among areas of the display area.
  • the areas can be arranged relative to each other.
  • the method can include an operation of displaying at least a portion of the second content and at least a portion of the third content, which are arranged around the selected content, on a second area and a third area adjacent to the first area and interposing the first area, respectively.
  • the first region may be adjacent to the second region and the third region, and may be between the second region and the third region. While the size of the display region is increasing to the second size, at least a portion of the second content and at least a portion of the third content may be displayed around the selected content that was displayed while the display region had the first size, respectively.
  • a non-transitory computer readable storage medium can store a program including instructions.
  • the instructions when executed by a processor of an electronic device, comprising a housing including a first housing part and a second housing part movably coupled to the first housing part, and a flexible display including a display area visible from a front side of the electronic device, wherein a size of the display area can be expanded or reduced according to movement of the second housing part, cause the electronic device to display a plurality of contents on the display area of the flexible display while the size of the display area has a first size.
  • the instructions when executed by the processor, cause the electronic device to display a first content related to a content selected from the plurality of contents on a first area of areas of the display area while the display area has the first size, based on the expansion of the display area from the first size to the second size.
  • the above regions can be arranged relative to one another.
  • the instructions, when executed by the processor, can cause the electronic device to display at least a portion of the second content and at least a portion of the third content, respectively, in a second region and a third region adjacent to the first region and interposing the first region, around the selected content.
  • the first region can be adjacent to the second region and the third region, and between the second region and the third region. While the size of the display region is increasing to the second size, the at least a portion of the second content and the at least a portion of the third content can be displayed around the selected content that was displayed while the display region had the first size, respectively.
  • FIG. 1 is a block diagram of an electronic device within a network environment according to various embodiments.
  • FIG. 2a is a top plan view of an exemplary electronic device within a first state.
  • FIG. 2b is a bottom view of an exemplary electronic device within the first state.
  • FIG. 2c is a plan view of an exemplary electronic device within the second state.
  • FIG. 2d is a bottom view of an exemplary electronic device within the second state.
  • Figure 3a is an exploded perspective view of an exemplary electronic device.
  • Figure 3b is an exploded perspective view of an exemplary electronic device.
  • FIG. 4a is a cross-sectional view of an exemplary electronic device in a first state.
  • FIG. 4b is a cross-sectional view of an exemplary electronic device in a second state.
  • Figure 5 is a schematic block diagram of an electronic device.
  • FIG. 6A is a diagram illustrating an example of a layout of a user interface (UI) displayed in a reduced state of an electronic device according to one embodiment.
  • UI user interface
  • FIG. 6b is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to one embodiment.
  • FIG. 6c is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to one embodiment.
  • FIG. 6d is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to one embodiment.
  • FIG. 7a is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to one embodiment.
  • FIG. 7b is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to one embodiment.
  • FIG. 7c is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to one embodiment.
  • FIG. 8 is a diagram illustrating an example of a change in the layout of a UI according to a change from a collapsed state to an expanded state of an electronic device according to one embodiment.
  • FIG. 9 is a diagram illustrating an example of a change in the layout of a UI according to a change from a collapsed state to an expanded state of an electronic device according to one embodiment.
  • FIG. 10 is a diagram illustrating an example of a change in the layout of a UI according to a change from a collapsed state to an expanded state of an electronic device according to one embodiment.
  • FIG. 11 is a diagram illustrating an example of a change in the layout of a UI according to a change from a collapsed state to an expanded state of an electronic device according to one embodiment.
  • FIG. 12 is a diagram illustrating an example of a change in the layout of a UI according to a change from a collapsed state to an expanded state of an electronic device according to one embodiment.
  • FIG. 13 is a flowchart illustrating the operation of an electronic device according to one embodiment.
  • FIG. 14 is a flowchart illustrating the operation of an electronic device according to one embodiment.
  • FIG. 15 is a flowchart illustrating the operation of an electronic device according to one embodiment.
  • FIG. 1 is a block diagram of an electronic device (101) within a network environment (100) according to various embodiments.
  • an electronic device (101) may communicate with an electronic device (102) via a first network (198) (e.g., a short-range wireless communication network) and/or may communicate with at least one of an electronic device (104) or a server (108) via a second network (199) (e.g., a long-range wireless communication network).
  • the electronic device (101) may communicate with the electronic device (104) via the server (108).
  • the electronic device (101) may include a processor (120), a memory (130), an input module (150), an audio output module (155), a display module (160), an audio module (170), a sensor module (176), an interface (177), a connection terminal (178), a haptic module (179), a camera module (180), a power management module (188), a battery (189), a communication module (190), a subscriber identification module (196), and/or an antenna module (197).
  • the electronic device (101) may omit at least one of these components (e.g., the connection terminal (178)), and/or may have one or more other components added.
  • some of these components e.g., the sensor module (176), the camera module (180), and/or the antenna module (197) may be integrated into a single component (e.g., the display module (160)).
  • the processor (120) may control at least one other component (e.g., a hardware or software component) of the electronic device (101) connected to the processor (120) by executing, for example, software (e.g., a program (140)), and may perform various data processing and/or operations.
  • the processor (120) may store commands and/or data received from other components (e.g., a sensor module (176) or a communication module (190)) in the volatile memory (132), process the commands and/or data stored in the volatile memory (132), and store result data in the nonvolatile memory (134).
  • the processor (120) may include a main processor (121) (e.g., a central processing unit and/or an application processor) and/or a secondary processor (123) (e.g., a graphics processing unit, a neural processing unit (NPU), an image signal processor, a sensor hub processor, and/or a communication processor) that may operate independently or together therewith.
  • a main processor (121) e.g., a central processing unit and/or an application processor
  • a secondary processor (123) e.g., a graphics processing unit, a neural processing unit (NPU), an image signal processor, a sensor hub processor, and/or a communication processor
  • the secondary processor (123) may be configured to use less power than the main processor (121) or to be specialized for a given function.
  • the secondary processor (123) may be implemented separately from the main processor (121) or as a part thereof.
  • the auxiliary processor (123) may control at least a portion of functions or states associated with at least one of the components of the electronic device (101) (e.g., the display module (160), the sensor module (176), and/or the communication module (190)), for example, on behalf of the main processor (121) while the main processor (121) is in an inactive (e.g., sleep) state, and/or together with the main processor (121) while the main processor (121) is in an active (e.g., application execution) state.
  • the auxiliary processor (123) e.g., an image signal processor or a communication processor
  • the auxiliary processor (123) may include a hardware structure specialized for processing artificial intelligence models.
  • the artificial intelligence models may be generated through machine learning. Such learning may be performed, for example, in the electronic device (101) itself on which the artificial intelligence model is executed, or may be performed through a separate server (e.g., server (108)).
  • the learning algorithm may include, for example, supervised learning, unsupervised learning, semi-supervised learning, and/or reinforcement learning, but is not limited to the examples described above.
  • the artificial intelligence model may include a plurality of artificial neural network layers.
  • the artificial neural network may be one of a deep neural network (DNN), a convolutional neural network (CNN), a recurrent neural network (RNN), a restricted Boltzmann machine (RBM), a deep belief network (DBN), a bidirectional recurrent deep neural network (BRDNN), deep Q-networks, or a combination of two or more of the above, but is not limited to the examples described above.
  • the artificial intelligence model may additionally or alternatively include a software structure.
  • the memory (130) can store various data used by at least one component (e.g., processor (120) and/or sensor module (176)) of the electronic device (101).
  • the data can include, for example, software (e.g., program (140)) and input data and/or output data for commands related thereto.
  • the memory (130) can include volatile memory (132) and/or nonvolatile memory (134).
  • the program (140) may be stored as software in memory (130) and may include, for example, an operating system (142), middleware (144), and/or an application (146).
  • the input module (150) can receive commands and/or data to be used in components of the electronic device (101) (e.g., processor (120)) from an external source (e.g., a user) of the electronic device (101).
  • the input module (150) can include, for example, a microphone, a mouse, a keyboard, keys (e.g., buttons), and/or a digital pen (e.g., a stylus pen).
  • the audio output module (155) can output an audio signal to the outside of the electronic device (101).
  • the audio output module (155) can include, for example, a speaker and/or a receiver.
  • the speaker can be used for general purposes such as multimedia playback and/or recording playback.
  • the receiver can be used to receive an incoming call. According to one embodiment, the receiver can be implemented separately from the speaker or as a part thereof.
  • the display module (160) can visually provide information to an external party (e.g., a user) of the electronic device (101).
  • the display module (160) can include, for example, a display, a holographic device, and/or a projector and a control circuit for controlling the devices.
  • the display module (160) can include a touch sensor configured to detect a touch, and/or a pressure sensor configured to measure a strength of a force generated by the touch.
  • the audio module (170) can convert sound into an electrical signal, or vice versa, convert an electrical signal into sound. According to one embodiment, the audio module (170) can obtain sound through the input module (150), and/or output sound through the sound output module (155), and/or an external electronic device (e.g., electronic device (102)) (e.g., speaker or headphone) directly or wirelessly connected to the electronic device (101).
  • an external electronic device e.g., electronic device (102)
  • speaker or headphone directly or wirelessly connected to the electronic device (101).
  • the sensor module (176) can detect an operating state (e.g., power and/or temperature) of the electronic device (101) and/or an external environmental state (e.g., user state) and generate an electrical signal and/or data value corresponding to the detected state.
  • the sensor module (176) can include, for example, a gesture sensor, a gyro sensor, a barometric pressure sensor, a magnetic sensor, an acceleration sensor, a grip sensor, a proximity sensor, a color sensor, an IR (infrared) sensor, a biometric sensor, a temperature sensor, a humidity sensor, and/or an illuminance sensor.
  • the interface (177) may support one or more designated protocols that may be used to directly or wirelessly connect the electronic device (101) with an external electronic device (e.g., the electronic device (102)).
  • the interface (177) may include, for example, a high definition multimedia interface (HDMI), a universal serial bus (USB) interface, an SD card interface, and/or an audio interface.
  • connection terminal (178) may include a connector through which the electronic device (101) may be physically connected to an external electronic device (e.g., the electronic device (102)).
  • the connection terminal (178) may include, for example, an HDMI connector, a USB connector, an SD card connector, and/or an audio connector (e.g., a headphone connector).
  • the haptic module (179) can convert an electrical signal into a mechanical stimulus (e.g., vibration or movement) or an electrical stimulus that a user can perceive through a tactile or kinesthetic sense.
  • the haptic module (179) can include, for example, a motor, a piezoelectric element, and/or an electrical stimulation device.
  • the camera module (180) can capture still images and moving images.
  • the camera module (180) can include one or more lenses, image sensors, image signal processors, and/or flashes.
  • the power management module (188) can manage power supplied to the electronic device (101).
  • the power management module (188) can be implemented as, for example, at least a part of a power management integrated circuit (PMIC).
  • PMIC power management integrated circuit
  • a battery (189) may power at least one component of the electronic device (101).
  • the battery (189) may include, for example, a non-rechargeable primary battery, a rechargeable secondary battery, and/or a fuel cell.
  • the communication module (190) may support establishment of a direct (e.g., wired) communication channel and/or a wireless communication channel between the electronic device (101) and an external electronic device (e.g., the electronic device (102), the electronic device (104), or the server (108)), and performance of communication through the established communication channel.
  • the communication module (190) may operate independently from the processor (120) (e.g., the application processor) and may include one or more communication processors that support direct (e.g., wired) communication or wireless communication.
  • the communication module (190) may include a wireless communication module (192) (e.g., a cellular communication module, a short-range wireless communication module, and/or a global navigation satellite system (GNSS) communication module) and/or a wired communication module (194) (e.g., a local area network (LAN) communication module, and/or a power line communication module).
  • a wireless communication module (192) e.g., a cellular communication module, a short-range wireless communication module, and/or a global navigation satellite system (GNSS) communication module
  • GNSS global navigation satellite system
  • a wired communication module (194) e.g., a local area network (LAN) communication module, and/or a power line communication module.
  • a corresponding communication module among these communication modules may communicate with an external electronic device (104) via a first network (198) (e.g., a short-range communication network such as Bluetooth, wireless fidelity (WiFi) direct, and/or infrared data association (IrDA)) and/or a second network (199) (e.g., a long-range communication network such as a legacy cellular network, a 5G network, a next-generation communication network, the Internet, and/or a computer network (e.g., a LAN or WAN)).
  • a first network (198) e.g., a short-range communication network such as Bluetooth, wireless fidelity (WiFi) direct, and/or infrared data association (IrDA)
  • a second network (199) e.g., a long-range communication network such as a legacy cellular network, a 5G network, a next-generation communication network, the Internet, and/or a computer network (e.g., a LAN or WAN)
  • the wireless communication module (192) may use subscriber information stored in the subscriber identification module (196) (e.g., an international mobile subscriber identity (IMSI)) to identify or authenticate the electronic device (101) within a communication network such as the first network (198) or the second network (199).
  • subscriber information stored in the subscriber identification module (196) e.g., an international mobile subscriber identity (IMSI)
  • IMSI international mobile subscriber identity
  • the wireless communication module (192) can support a 5G network after a 4G network and next-generation communication technology, for example, NR access technology (new radio access technology).
  • NR access technology new radio access technology
  • the NR access technology can support high-speed transmission of high-capacity data (eMBB (enhanced mobile broadband)), minimization of terminal power and connection of multiple terminals (mMTC (massive machine type communications)), and/or high reliability and low latency communications (URLLC (ultra-reliable and low-latency communications)).
  • eMBB enhanced mobile broadband
  • mMTC massive machine type communications
  • URLLC ultra-reliable and low-latency communications
  • the wireless communication module (192) can support, for example, a high-frequency band (e.g., mmWave band) to achieve a high data transmission rate.
  • a high-frequency band e.g., mmWave band
  • the wireless communication module (192) may support various technologies for securing performance in a high-frequency band, such as beamforming, massive multiple-input and multiple-output (MIMO), full dimensional MIMO (FD-MIMO), array antenna, analog beam-forming, and/or large scale antenna.
  • the wireless communication module (192) may support various requirements specified in the electronic device (101), an external electronic device (e.g., the electronic device (104)), and/or a network system (e.g., the second network (199)).
  • the wireless communication module (192) can support a peak data rate (e.g., 20 Gbps or more) for eMBB realization, a loss coverage (e.g., 664 dB or less) for mMTC realization, or a U-plane latency (e.g., 0.5 ms or less for downlink (DL) and uplink (UL) each, or 6 ms or less for round trip) for URLLC realization.
  • a peak data rate e.g., 20 Gbps or more
  • a loss coverage e.g., 664 dB or less
  • U-plane latency e.g., 0.5 ms or less for downlink (DL) and uplink (UL) each, or 6 ms or less for round trip
  • the antenna module (197) can transmit signals and/or power to and/or receive signals from the outside (e.g., external electronic devices).
  • the antenna module (197) can include an antenna including a radiator formed of a conductor and/or a conductive pattern formed on a substrate (e.g., a PCB).
  • the antenna module (197) can include a plurality of antennas (e.g., an array antenna). In this case, at least one antenna suitable for a communication method used in a communication network, such as the first network (198) or the second network (199), can be selected from the plurality of antennas by, for example, the communication module (190).
  • a signal or power can be transmitted or received between the communication module (190) and the external electronic device via the at least one selected antenna.
  • another component e.g., a radio frequency integrated circuit (RFIC)
  • RFIC radio frequency integrated circuit
  • the antenna module (197) may form a mmWave antenna module.
  • the mmWave antenna module may include a printed circuit board, an RFIC positioned on or adjacent a first side (e.g., a bottom side) of the printed circuit board and capable of supporting a designated high-frequency band (e.g., a mmWave band), and a plurality of antennas (e.g., an array antenna) positioned on or adjacent a second side (e.g., a top side or a side) of the printed circuit board and capable of transmitting or receiving signals in the designated high-frequency band.
  • a first side e.g., a bottom side
  • a plurality of antennas e.g., an array antenna
  • peripheral devices e.g., a bus, a general purpose input and output (GPIO), a serial peripheral interface (SPI), or a mobile industry processor interface (MIPI)
  • GPIO general purpose input and output
  • SPI serial peripheral interface
  • MIPI mobile industry processor interface
  • commands or data may be transmitted and/or received between the electronic device (101) and the electronic device (104) via a server (108) connected to the second network (199).
  • Each of the electronic device (102) and the electronic device (104) may be the same or a different type of device as the electronic device (101).
  • all or part of the operations executed in the electronic device (101) may be executed in one or more of the electronic device (102), the electronic device (104), and the server (108).
  • the electronic device (101) may, instead of or in addition to executing the function and/or service itself, request one or more external electronic devices to perform at least a part of the function or service.
  • One or more external electronic devices that receive the request may execute at least a part of the requested function or service, or an additional function or service related to the request, and transmit the result of the execution to the electronic device (101).
  • the electronic device (101) may provide the result, as is or additionally processed, as at least a part of a response to the request.
  • cloud computing, distributed computing, mobile edge computing (MEC), and/or client-server computing technologies may be used, for example.
  • the electronic device (101) may provide an ultra-low latency service by using distributed computing and/or mobile edge computing, for example.
  • the electronic device (104) may include an IoT (internet of things) device.
  • the server (108) may be an intelligent server using machine learning and/or a neural network.
  • the electronic device (104) and/or the server (108) may be included in the second network (199).
  • the electronic device (101) can be applied to intelligent services (e.g., smart home, smart city, smart car, or healthcare) based on 5G communication technology and IoT-related technology.
  • FIG. 2a is a top plan view of an exemplary electronic device (101) in a first state.
  • the electronic device (101) may, according to one embodiment, include a first housing part (210), a second housing part (220) movable relative to the first housing part (210) in a first direction (261) parallel to the y-axis or a second direction (262) parallel to the y-axis and opposite to the first direction (261), and a display (230) (e.g., the display module (160) of FIG. 1).
  • the electronic device (101) may be in the first state.
  • the second housing part (220) may be movable relative to the first housing part (210) in the first direction (261).
  • the second housing part (220) may not be movable relative to the first housing part (210) in the second direction (262).
  • the display (230) may provide a smaller display area than the display areas of another state (e.g., the second state).
  • the display area may correspond to the area (230a).
  • the area (230a) which is the display area
  • another area of the display (230) e.g., the area (230b) of FIG. 2C
  • the area (e.g., the area (230b) of FIG. 2C) may be included within the first housing part (210).
  • the area e.g., the area (230b) of FIG. 2C
  • the area may be covered by the first housing part (210).
  • the area may be rolled into the first housing part (210).
  • the area (230a) may not include a curved portion but may include a planar portion. However, it is not limited thereto.
  • the region (230a) may include a curved portion, extending from the planar portion and positioned within the edge portion, within the first state.
  • the first state may be referred to as a slide-in state or a closed state in that at least a portion of the second housing part (220) is positioned within the first housing part (210).
  • the first state may be referred to as a reduced state in that it provides the display area having the smallest size.
  • the present invention is not limited thereto.
  • the first housing part (210) may include a first image sensor (250-1) within the camera module (180, see FIG. 1) that is exposed through a portion of the area (230a) and faces a third direction (263) parallel to the z-axis.
  • the second housing part (220) may include one or more second image sensors within the camera module (180) that are exposed through a portion of the second housing part (220) and faces a fourth direction (264) parallel to the z-axis and opposite to the third direction (263).
  • the one or more second image sensors may be understood through the description of FIG. 2b.
  • FIG. 2b is a bottom view of an exemplary electronic device within the first state.
  • one or more second image sensors (250-2) disposed within the second housing part (220) may be positioned within a structure disposed within the first housing part (210) for the one or more second image sensors (250-2).
  • light from the outside of the electronic device (101) may be received by the one or more second image sensors (250-2) through the structure within the first state.
  • the one or more second image sensors (250-2) may be exposed through the structure within the first state.
  • the structure may be implemented in various ways.
  • the structure may be an opening or a notch.
  • the structure may be an opening (212a) in the plate (212) of the first housing part (210) that surrounds at least a portion of the second housing part (220).
  • the present invention is not limited thereto.
  • one or more second image sensors (250-2) included in the second housing part (220) may be covered by at least a portion of the plate (212) of the first housing part (210).
  • the first state can be changed to the second state.
  • the first state (or the second state) can be changed to the second state (or the first state) through one or more intermediate states between the first state and the second state.
  • the first state (or the second state) can be changed to the second state (or the first state) based on a predefined user input.
  • the first state (or the second state) can be changed to the second state (or the first state) in response to a user input to a physical button exposed through a part of the first housing part (210) or a part of the second housing part (220).
  • the first state (or the second state) can be changed to the second state (or the first state) in response to a touch input to an executable object displayed within the display area.
  • the first state (or the second state) can be changed to the second state (or the first state) in response to a touch input having a contact point on the display area and having a pressing strength greater than a reference strength.
  • the first state (or the second state) may be changed to the second state (or the first state) in response to a voice input received via a microphone of the electronic device (101).
  • the first state (or the second state) may be changed to the second state (or the first state) in response to an external force applied to the first housing part (210) and/or the second housing part (220) to move the second housing part (220) with respect to the first housing part (210).
  • the first state may be changed to the second state (or the first state) in response to a user input identified from an external electronic device (e.g., earbuds or a smart watch) connected to the electronic device (101).
  • an external electronic device e.g., earbuds or a smart watch
  • the present invention is not limited thereto.
  • FIG. 2c is a plan view of an exemplary electronic device within the second state.
  • the electronic device (101) may be in the second state.
  • the second housing part (220) may be movable relative to the first housing part (210) in the second direction (262).
  • the volume of the electronic device (101) may be reduced as the second housing part (220) of the housing moves in the second direction (262).
  • the second housing part (220) may not move relative to the first housing part (210) in the first direction (261).
  • the display (230) may provide the display area having the largest size.
  • the display area may correspond to an area (230c) including an area (230a) and an area (230b).
  • the area (230b) included within the first housing part (210) within the first state may be exposed within the second state.
  • at least a portion of the display (230) e.g., the area (230b)
  • the area (230a) may include a flat portion.
  • the present invention is not limited thereto.
  • the area (230a) may include a curved portion extending from the flat portion and positioned within an edge portion.
  • the region (230b) may include a planar portion, unlike the region (230a) within the first state.
  • this is not limited thereto.
  • the region (230b) may include a curved portion extending from the planar portion of the region (230b) and positioned within the edge portion.
  • the second state may be referred to as a slide-out state or an open state in that at least a portion of the second housing part (220) is positioned outside the first housing part (210).
  • the second state may be referred to as an expanded state in that it provides the display area having the largest size.
  • the present invention is not limited thereto.
  • the first image sensor (250-1) facing the third direction (263, e.g., toward the rear of the electronic device (101)) may be moved together with the area (230a) according to the movement of the second housing part (220) in the first direction (261) when the state of the electronic device (101) changes from the first state to the second state.
  • one or more second image sensors (250-2) facing the fourth direction (264, e.g., toward the front of the electronic device (101)) may be moved according to the movement of the second housing part (220) in the first direction (261) when the state of the electronic device (101) changes from the first state to the second state.
  • the relative positional relationship between one or more second image sensors (250-2) and the structure illustrated in the description of FIG. 2b may change according to the movement of one or more second image sensors (250-2).
  • the change in the relative positional relationship may be understood based on FIG. 2d.
  • FIG. 2d is a bottom view of an exemplary electronic device within the second state.
  • one or more second image sensors (250-2) may be positioned outside the structure.
  • one or more second image sensors (250-2) may be positioned outside the opening (212a) in the plate (212).
  • the one or more second image sensors (250-2) may be exposed within the second state.
  • the relative positional relationship within the second state may be different from the relative positional relationship within the first state.
  • one or more second image sensors (250-2) in the second state may be exposed, unlike one or more second image sensors (250-2) in the first state.
  • one or more second image sensors (250-2) in the first state may not be exposed through the plate (212) because there is no opening (212a), but may be covered by the first housing part (210) and/or may be covered by the plate (212).
  • the electronic device (101) may be in an intermediate state between the first state and the second state.
  • the size of the display area in the intermediate state may be larger than the size of the display area in the first state and smaller than the size of the display area in the second state.
  • the display area in the intermediate state may correspond to an area including a portion of the region (230a) and the region (230b).
  • a portion of the region (230b) may be exposed, and another portion (or a remaining portion) of the region (230b) may be covered by the first housing part (210) or rolled into the first housing part (210).
  • the embodiments are not limited thereto.
  • the size of the display area in the intermediate state may gradually increase.
  • the size of the display area within the intermediate state may gradually decrease.
  • the electronic device (101) may include structures for moving a second housing (e.g., a second housing part (220) of FIG. 2c) of the electronic device (101) relative to a first housing (e.g., a first housing part (210) of FIG. 2c) of the electronic device (101).
  • a second housing e.g., a second housing part (220) of FIG. 2c
  • a first housing e.g., a first housing part (210) of FIG. 2c
  • Figure 3a is an exploded perspective view of an exemplary electronic device.
  • Figure 3b is an exploded perspective view of an exemplary electronic device.
  • the electronic device (101) may include a first housing part (210), a second housing part (220), a display (230), and a driving unit (360).
  • the first housing part (210) may include a book cover (311), a plate (212), and a frame cover (313).
  • the book cover (311) may at least partially form a side portion of an outer surface of the electronic device (101).
  • the book cover (311) may at least partially form a rear portion of the outer surface.
  • the book cover (311) may include at least one opening (311a) for one or more second image sensors (250-2).
  • the book cover (311) may include a surface that supports the plate (212).
  • the book cover (311) may be coupled with the plate (212).
  • the book cover (311) may include a frame cover (313).
  • the book cover (311) may be coupled with the frame cover (313).
  • the plate (212) can at least partially form a rear portion of the outer surface.
  • the plate (212) can include at least one opening (212a) for one or more second image sensors (250-2).
  • the plate (212) can be disposed on the surface of the book cover (311).
  • the opening (212a) can be aligned with the opening (311a).
  • the frame cover (313) may be at least partially surrounded by the book cover (311).
  • the frame cover (313) can be at least partially wrapped by the display (230).
  • the frame cover (313) can be at least partially wrapped by the display (230), but the position of the frame cover (313) can be maintained independently of the movement of the display (230).
  • the frame cover (313) can be arranged with respect to at least some of the components of the display (230).
  • the frame cover (313) can include rails (313a) that provide (or guide) a path for movement of at least one component of the display (230).
  • the frame cover (313) can be coupled with at least one component of the electronic device (101).
  • the frame cover (313) can support a rechargeable battery (e.g., battery (319)).
  • the battery (319) can be supported through a recess or hole in a surface (313b) of the frame cover (313).
  • the frame cover (313) can be coupled with one end of a flexible printed circuit board (FPCB) (325) on a surface on the frame cover (313).
  • the other end of the FPCB (325) can be connected to a PCB (324) through at least one connector.
  • the PCB (324) can be electrically connected to another PCB that supplies power to the motor (361) through the FPCB (325).
  • the second housing part (220) may include a front cover (321) and a slide cover (322).
  • the front cover (321) may be at least partially wrapped by the display (230).
  • the front cover (321) may be coupled with at least a portion of an area (230a) of the display (230) that wraps the front cover (321), unlike the frame cover (313), such that the display (230) moves relative to the second housing part (220) that moves relative to the first housing part (210).
  • the front cover (321) may be coupled with at least one component of the electronic device (101).
  • the front cover (321) may be coupled with a printed circuit board (PCB) (324) including components of the electronic device (101).
  • the PCB (324) may include the processor (120) (see FIG. 1).
  • the front cover (321) may include one or more second image sensors (250-2).
  • the front cover (321) can be coupled with at least one structure of the electronic device (101) for a plurality of states including the first state and the second state.
  • the front cover (321) can fix the rack gear (363) of the driving unit (360).
  • the front cover (321) can be combined with a slide cover (322).
  • the slide cover (322) can be coupled with the front cover (321) to protect at least one component of the electronic device (101) coupled within the front cover (321) and/or at least one structure of the electronic device (101) coupled within the front cover (321).
  • the slide cover (322) can include a structure for the at least one component.
  • the slide cover (322) can include one or more openings (328) for one or more second image sensors (250-2).
  • the one or more openings (328) can be aligned with one or more second image sensors (250-2) disposed on the front cover (321).
  • the size of each of the one or more openings (328) can correspond to the size of each of the one or more second image sensors (250-2).
  • the display (230) may include a support member (331).
  • the support member (331) may include a plurality of bars.
  • the plurality of bars may be coupled to one another.
  • the drive unit (360) may include a motor (361), a pinion gear (362), and a rack gear (363).
  • the motor (361) may operate based on power from the battery (319). For example, the power may be provided to the motor (361) in response to a predefined user input.
  • the pinion gear (362) may be coupled to the motor (361) via a shaft.
  • the pinion gear (362) may be rotated based on the motion of the motor (361) transmitted via the shaft.
  • the rack gear (363) can be arranged relative to the pinion gear (362).
  • teeth of the rack gear (363) can mesh with teeth of the pinion gear (362).
  • the rack gear (363) can be moved in the first direction (261) or the second direction (262) depending on the rotation of the pinion gear (362).
  • the second housing part (220) can be moved in the first direction (261) and the second direction (262) by the rack gear (363) being moved depending on the rotation of the pinion gear (362) due to the operation of the motor (361).
  • the first state of the electronic device (101) can be changed to a state different from the first state (e.g., one or more intermediate states or the second state) through the movement of the second housing part (220) in the first direction (261).
  • the second state of the electronic device (101) can be changed to a state different from the second state (e.g., one or more intermediate states or the first state) through the movement of the second housing part (220) in the second direction (262).
  • the first state being changed to the second state by the driving unit (360) and the second state being changed to the first state by the driving unit (360) can be understood through FIGS. 4A and 4B.
  • Fig. 4a is a cross-sectional view of an exemplary electronic device in a first state.
  • Fig. 4b is a cross-sectional view of an exemplary electronic device in a second state.
  • the motor (361) can be operated based at least in part on the predefined user input received within the first state (490).
  • the pinion gear (362) can be rotated in the first rotational direction (411) based at least in part on the operation of the motor (361).
  • the rack gear (363) can be moved in the first direction (261) based at least in part on the rotation of the pinion gear (362) in the first rotational direction (411).
  • the second housing part (220) can be moved in the first direction (261) based at least in part on the movement of the rack gear (363) in the first direction (261).
  • the display (230) can be moved at least in part based on the movement of the rack gear (363) in the first direction (261).
  • the display (230) can be moved along the rails (313a).
  • the shape of at least a portion of the plurality of bars of the support member (331) of the display (230) can be changed when the first state (490) is changed to the second state (495).
  • the region (230b) of the display (230) may be moved according to the movement of the display (230).
  • the region (230b) may be moved through the space between the book cover (311) and the frame cover (313) when the first state (490) is changed to the second state (495) according to the predefined user input.
  • the region (230b) in the second state (495) may be exposed, unlike the region (230b) that is rolled into the space in the first state (490).
  • the front cover (321) within the second housing part (220) is coupled with the PCB (324) connected to the other end of the FPCB (325) and fixes the rack gear (363), so that the shape of the FPCB (325) can be changed when the state of the electronic device is changed from the first state (490) to the second state (495).
  • the motor (361) can be operated based at least in part on the predefined user input received within the second state (495).
  • the pinion gear (362) can be rotated in the second rotational direction (412) based at least in part on the operation of the motor (361).
  • the rack gear (363) can be moved in the second direction (262) based at least in part on the rotation of the pinion gear (362) in the second rotational direction (412).
  • the second housing part (220) can be moved in the second direction (262) based at least in part on the movement of the rack gear (363) in the second direction (262).
  • the display (230) can be moved at least in part based on the movement of the rack gear (363) in the second direction (262).
  • the display (230) can be moved along the rails (313a).
  • the shape of at least a portion of the plurality of bars of the support member (331) of the display (230) can be changed when the second state (495) is changed to the first state (490).
  • the plurality of bars of the support member (331) may bend as at least a portion of the display (230) bends, or the bars may be positioned, shaped, or spaced differently to support the bending.
  • the region (230b) of the display (230) may be moved according to the movement of the display (230).
  • the region (230b) may be moved through the space between the book cover (311) and the frame cover (313) when the second state (495) is changed to the first state (490) according to the predefined user input.
  • the region (230b) in the first state (490) may be rolled into the space, unlike the region (230b) that is exposed in the second state (495).
  • the front cover (321) within the second housing part (220) is coupled with the PCB (324) connected to the other end of the FPCB (325) and fixes the rack gear (363), so that the shape of the FPCB (325) can be changed when the second state (495) is changed to the first state (490).
  • FIGS. 2A to 4B illustrate an electronic device (101) in which the height of the display area is changed and the width of the display area is maintained when the first state (or the second state) is changed to the second state (or the first state) in the portrait mode, but this is for convenience of explanation.
  • the electronic device (101) may be implemented such that the height of the display area is maintained and the width of the display area is changed when the first state (or the second state) is changed to the second state (or the first state) in the portrait mode.
  • FIG. 5 is a schematic block diagram of an electronic device.
  • FIG. 6a is a diagram illustrating an example of a layout of a user interface (UI) displayed in a reduced state of an electronic device according to an embodiment.
  • FIG. 6b is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to an embodiment.
  • FIG. 6c is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to an embodiment.
  • FIG. 6d is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to an embodiment.
  • FIGS. 5, 6a, 6b, 6c, and 6d reference may be made to the components of the electronic device (101) and the structure of the electronic device (101) described with reference to FIGS. 1, 2a, 2b, 2c, 2d, 3a, 3b, 4a, and 4b.
  • the electronic device (101) may include a processor (120), a memory (130), a display (230), and a motor (361).
  • the processor (120) may display a screen including at least one object through the display (230).
  • the screen may include one or more regions.
  • each of the one or more regions may include at least one object.
  • each of the one or more regions may be referred to as a view group or a window.
  • the at least one object may include a UI element and/or content.
  • the at least one object may be referred to as a view or a frame.
  • the UI element may be an object that can be interacted with by a user (e.g., a check box, a button, an icon, a slider, a text field, a status bar, a navigation bar).
  • the content may include text, an image, and/or a video.
  • the processor (120) may display a screen in a display area of the display (230) (e.g., area (230a) of FIG. 2A) in the first state (or slide-in state).
  • a screen (610) including one or more regions may be displayed on the display (230).
  • a screen including one or more regions may be referred to as a window (or layer) (or view group) (or (view) container) that can be distinguished by at least one of a specified coordinate, size information, a separator, and a tag.
  • a window or layer
  • view group or (view) container
  • FIG. 6A one or more regions (e.g., region (611), region (613), and region (615)) within the screen (610) are illustrated as being arranged in a vertical direction, but this is merely an example.
  • one or more regions (e.g., region (611), region (613), and region (615)) within the screen (610) can be arranged according to various layouts (e.g., linear layout, relative layout, frame layout, constraint layout, grid layout, table layout).
  • each of the one or more regions (e.g., region (611), region (613), and region (615)) within the screen (610) can include at least one content.
  • the at least one content can include a visual object.
  • the visual object can include text, an image, and/or a video.
  • the first housing part (e.g., the first housing part (210) of FIG. 2A) and the second housing part (e.g., the second housing part (220) of FIG. 2A) may be changed between the first state and the second state by the power of the motor (361).
  • the present invention is not limited thereto.
  • the first housing part (210) and the second housing part (220) may be changed between the first state and the second state by an external force (e.g., a force pulled by a user or a force pushed by a user).
  • the size of the display area of the display (230) may be changed by changing between the first state and the second state. In one embodiment, as the size of the display area of the display (230) is changed, the processor (120) may update the screen to be displayed in the display area of the display (230).
  • the processor (120) may display a screen in a display area of the display (230) (e.g., area (230a), area (230b), or area (230c) of FIG. 2C) in the second state (or slide-out state).
  • a display area of the display (230) e.g., area (230a), area (230b), or area (230c) of FIG. 2C
  • the processor (120) may display an enlarged screen of one or more areas included in a screen of a first state on a display area (230c of FIG. 2c) of the display (230) in a second state.
  • one or more areas in the second state may be enlarged from one or more areas in the first state.
  • one or more areas in the second state may be enlarged by a ratio between a screen area in the first state and a screen area in the second state.
  • at least one more content may be displayed in the enlarged area in the second state than in the area in the first state.
  • a size of at least one content included in an enlarged area in the second state may be enlarged (e.g., enlarged by the ratio) to be larger than a size of at least one content included in an area in the first state, for example.
  • a screen (610) including one or more regions may be displayed on the display (230).
  • the screen (610) of example (603) of FIG. 6b may display at least one more region (e.g., region (617)) than the screen (610) of example (601) of FIG. 6a.
  • the screen (610) of example (603) of FIG. 6b may be larger than the screen (610) of example (601) of FIG. 6a.
  • the processor (120) may display a screen including an additional area in the area in the first state, in a display area of the display (230) (e.g., area (230a) and area (230b) of FIG. 2C) in the second state.
  • the additional area may be located above the areas in the first state. In one embodiment, the additional area may be located below the areas in the first state.
  • the display (230) may display a screen (610) including one or more regions (e.g., region (611), region (613), region (615)) and an additional screen (620) including one or more regions (e.g., region (621), region (623)).
  • the additional screen (620) of example (605) of FIG. 6C may be positioned below one or more regions (e.g., region (611), region (613), region (615)) of the screen (610).
  • the screen (610) of example (605) of FIG. 6C may have the same size as the screen (610) of example (601) of FIG. 6A.
  • the display (230) may display a screen (610) including one or more regions (e.g., region (611), region (613), region (615)) and a screen (630) including one or more regions (e.g., region (631), region (633)).
  • the screen (630) of example (607) of FIG. 6b may be positioned above one or more regions (e.g., region (611), region (613), region (615)) of the screen (610).
  • the screen (610) of example (607) of FIG. 6d may have the same size as the screen (610) of example (601) of FIG. 6a.
  • FIG. 7a is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to one embodiment.
  • FIG. 7a reference may be made to the components of the electronic device (101) and the structure of the electronic device (101) described with reference to FIGS. 1, 2a, 2b, 2c, 2d, 3a, 3b, 4a, 4b, 5, and 6a.
  • the electronic device (101) may obtain a user input (751) while displaying a screen (610) including one or more regions (e.g., region (611), region (613), region (615)) in a display area (e.g., region (230a) of FIG. 2a) in a first state (or slide-in state).
  • the user input (751) may include an input for selecting one content (e.g., content within region (613)) among the one or more regions (e.g., region (611), region (613), region (615)) displayed in the first state.
  • the user input (751) may include an input for requesting a change from the first state to the second state.
  • the user input (751) may include an input for selecting a content (e.g., content within the region (613)) and requesting a change to a second state.
  • a content e.g., content within the region (613)
  • the widths of the regions are illustrated as corresponding to the width of the region (230a) of the display (230), but this is merely an example.
  • the widths of the regions may be shorter than the width of the region (230a) of the display (230).
  • the display (230) may have two or more regions (e.g., region (611), region (613), region (615)) arranged in the width direction.
  • the designated region may be a region located in the middle of a plurality of regions when two or more regions (e.g., region (611), region (613), region (615)) are displayed in a display area of the first size.
  • the plurality of regions may be regions arranged along a direction in which the display area of the display (230) expands (e.g., the second direction (262) of FIG. 2A).
  • the selected region may be enlarged according to a ratio (or aspect ratio) of the selected region (e.g., region (613)). In one embodiment, the selected region (e.g., region (613)) may be enlarged according to a ratio (or aspect ratio) of content included in the selected region (e.g., region (613)). In one embodiment, the selected region (e.g., region (613)) may be enlarged according to a ratio (or aspect ratio) of one visual object (e.g., an image or video) included in the selected region (e.g., region (613)).
  • a ratio (or aspect ratio) of the selected region e.g., region (613)
  • one visual object e.g., an image or video
  • the ratio (or aspect ratio) of the selected region may be a ratio (or aspect ratio) specified by an application (146) (or middleware (144)) that generates a screen on which the selected region (e.g., region (613)) is displayed.
  • enlarging the selected area may mean enlarging to the maximum size that does not exceed the display area of the second state (e.g., area (230c) of FIG. 2c).
  • the height direction of the display (230) is longer than the width direction and the horizontal length of the selected area (e.g., area (613)) is longer than the vertical length
  • areas e.g., area (711), area (715)
  • areas corresponding to letter boxes may be generated above and/or below the area (713) where the enlarged area (e.g., area (613)) is displayed.
  • the letter box and/or the filler box may display areas (e.g., area (611) and area (615)) that are not selected among one or more areas (e.g., area (611), area (613), and area (615)) displayed in the first state.
  • the letter box and/or the filler box may display contents that are not displayed in the first state.
  • the edges can be edges surrounding the frame in which the selected region (e.g., region (613)) is placed.
  • the edges (e.g., edges (721), edges (725)) may be edges perpendicular to a direction in which a display area of the display (230) expands (e.g., a second direction (262) of FIG. 2A).
  • a display area of the display (230) expands
  • the edges (e.g., edges (721), edges (725)) may be edges extending in the width direction.
  • the present invention is not limited thereto.
  • edges may be edges extending in the height direction.
  • the edges (e.g., edges (721), edges (725)) of a selected area may be edges of a frame in which the selected area (e.g., area (613)) is placed.
  • the electronic device (101) may display a screen (610) arranged based on a selected area (e.g., area (613)) in a second state in response to a user input (751).
  • the screen (701) being arranged based on the selected area (e.g., area (613)) may mean that the area (613) displayed in the second state is displayed among other contents.
  • the selected area (e.g., area (613)) being displayed among other areas may mean that other contents are displayed in a letter box and/or pillar box generated as the selected area (e.g., area (613)) is enlarged.
  • the arrangement of the screen (701) based on the selected region may mean that the region (613) displayed in the second state is located at the center position (740) of the display region (e.g., region (230c) of FIG. 2c).
  • the arrangement of the screen (701) based on the selected region may mean that the center region (720) of the region (613) displayed in the second state includes the center position (740) of the region (230c).
  • the center position (740) of the region (230c) of the second state may include the center position of the major axis (735) of the region (230c).
  • the center position (740) of the region (230c) of the second state may include the center position of the minor axis (730) of the region (230c). In one embodiment, the center position (740) of the region (230c) of the second state may include a point where the center position of the major axis (735) of the region (230c) and the center position of the minor axis (730) of the region (230c) meet. In one embodiment, the region (613) displayed in the second state may have a larger size than the region (613) displayed in the first state.
  • the electronic device (101) may move the selected area (e.g., area (613)) to display the selected area among other contents while changing from the first state to the second state. In one embodiment, the electronic device (101) may move the selected area (e.g., area (613)) based on a direction in which the display area of the display (230) expands (e.g., the second direction (262) of FIG. 2A) while changing from the first state to the second state. In one embodiment, the electronic device (101) may move the selected area (e.g., area (613)) in the height direction (e.g., the first direction (261) of FIG. 2A) or in the opposite direction of the height direction (e.g., the second direction (262) of FIG.
  • a direction in which the display area of the display (230) expands e.g., the second direction (262) of FIG.
  • the electronic device (101) may move the selected area (e.g., area (613)) in the width direction or in the opposite direction of the width direction.
  • the electronic device (101) may move the selected area (e.g., area (613)) in a movement direction of the area (613) determined based on a positional relationship between the selected area (e.g., area (613)) and the center position (740) of the area (230c). For example, if the selected area (e.g., area (613)) is located above the center position (740) of the area (230c), the electronic device (101) may move the area (613) in a second direction (262) while changing from the first state to the second state.
  • the selected area e.g., area (613)
  • the electronic device (101) may move the selected area (e.g., area (613)) in a first direction (261) while changing from the first state to the second state.
  • the present invention is not limited thereto.
  • the electronic device (101) may move the selected area (e.g., area (613)) in a movement direction of the area (613) determined based on whether the selected area (e.g., area (613)) is located to the left or right of the center position (740) of the area (230c).
  • moving the selected region may include changing the display location of the region (613) while maintaining the size of the region (613). In one embodiment, moving the selected region (e.g., region (613)) may include changing the display location of the region (613) while enlarging the size of the region (613). In one embodiment, changing the display location of the selected region (e.g., region (613)) may mean that the area occupied by the region (613) within the region (230a) or the region (230c) of the display (230) is changed.
  • the electronic device (101) may display some areas (e.g., area (611) located above the selected area (e.g., area (613))) among the areas (e.g., area (611), area (615)) that are not selected in the first state, around the area (613) in the second state.
  • the area around the area (613) may be an area of a letter box and/or a pillar box.
  • the electronic device (101) may display some of the regions (e.g., the region (611) located above the selected region (e.g., the region (613))) among the regions that are not selected in the first state, on top of the region (613) in the second state. In one embodiment, the electronic device (101) may display some of the regions (e.g., the region (611)) among at least one region (e.g., the region (611)) displayed above the selected region (e.g., the region (613)) in the first state, on top of the region (613) in the second state.
  • the regions e.g., the region (611) located above the selected region (e.g., the region (613)
  • the electronic device (101) may display some of the regions (e.g., the region (611) located above the selected region (e.g., the region (613)) among the regions that are not selected in the first state, on top of the region (613) in the second state.
  • the electronic device (101) may display some of the regions
  • some of the regions (e.g., the region (611) located above the selected region (e.g., the region (613))) displayed above the region (613) in the second state may be content displayed directly above the region (613) in the first state.
  • some content displayed on top of the region (613) in the second state e.g., content in the region (611) positioned on top of the selected region (e.g., region (613))
  • the designated type of content may be a different type of content from the content included in the region (613).
  • the designated type of content may be content related to a profile.
  • the size of some of the regions (e.g., region (611)) displayed in the second state may change depending on the size of the selected region (e.g., region (613)) in the second state.
  • the size of some of the regions (e.g., region (611) positioned on top of the selected region (e.g., region (613))) displayed in the second state may be reduced compared to its size in the first state.
  • the area (611) displayed in the second state may include a portion of the content included in the area (611) displayed in the first state.
  • the size of a portion of an area displayed in the second state e.g., an area (611) positioned above a selected area (e.g., area (613))
  • the electronic device (101) may display some of the regions (e.g., the region (611), the region (615)) located below the selected region (e.g., the region (613))) among the regions that are not selected in the first state below the region (613) in the second state. In one embodiment, the electronic device (101) may display some of the regions (e.g., the region (615)) located below the selected region (e.g., the region (613)) among at least one region (e.g., the region (615)) displayed below the region (613) in the first state below the region (613) in the second state.
  • some of the regions (e.g., the region (615)) displayed below the region (613) in the second state may be content displayed directly below the region (613) in the first state.
  • some of the areas displayed under the area (613) in the second state e.g., areas (615) located under the selected area (e.g., area (613))
  • the size of some of the areas displayed under the second state e.g., areas (615) located under the selected area (e.g., area (613))
  • the area (615) displayed under the second state may include a part of the content included in the area (615) displayed under the first state.
  • the present invention is not limited thereto.
  • the size of some of the areas displayed under the second state e.g., areas (615) located under the selected area (e.g., area (613))
  • the electronic device (101) may not display other parts of the regions (e.g., region (611), region (615)) that are not selected in the first state in the second state. In one embodiment, the electronic device (101) may display at least one region that is not displayed in the first state in the periphery of region (613) in the second state. In one embodiment, the periphery of region (613) may be a region of a letter box and/or a pillar box.
  • the electronic device (101) may display an area that is not displayed in the first state in at least one area (e.g., area (230c)) in the second state, in response to a user input (751).
  • the electronic device (101) may display an area that is not displayed in the first state in the area (230c) in the second state, depending on a size of a selected area (e.g., area (613)) displayed in the area (230c). For example, when the area (613) moves upward as the change is made from the first state to the second state, at least one area may be further displayed below the area (613) in the second state. For example, when the area of the selected area (e.g., area (613)) moves downward as the change is made from the first state to the second state, at least one area may be further displayed above the area (613) in the second state.
  • a selected area e.g., area (613)
  • the electronic device (101) may display a selected region (613) from among the displayed regions (e.g., region (611), region (613), and region (615)) at a designated location in the enlarged display region based on a user's request for enlarging the display region of the display (230).
  • the electronic device (101) may provide a user-friendly layout by displaying the selected region (e.g., region (613)) at a designated location in the enlarged display region. Accordingly, additional user effort may not be required for enlarging and/or moving the location of content suitable for the user.
  • FIG. 7b is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to one embodiment.
  • Fig. 7b the components of the electronic device (101) and the structure of the electronic device (101) described with reference to Figs. 1, 2a, 2b, 2c, 2d, 3a, 3b, 4a, 4b, 5, and 6a may be referred to.
  • the contents described with reference to Fig. 7a may not be repeated in the description of Fig. 7b.
  • FIG. 7B illustrates an example of a layout of a UI displayed when a user selects an area located at the outer edge of a display area of a display (230).
  • an area located at the outer edge of a display area may mean that at least one side of the area touches a side perpendicular to a direction in which the display area extends (e.g., the second direction (262) of FIG. 2A).
  • the electronic device (101) may obtain a user input (753) while displaying a screen (601) including a screen (610) including one or more regions (e.g., region (611), region (613), region (615)) in a display area (e.g., region (230a) of FIG. 2a) in a first state (or slide-in state).
  • a screen including a screen (610) including one or more regions (e.g., region (611), region (613), region (615)) in a display area (e.g., region (230a) of FIG. 2a) in a first state (or slide-in state).
  • the electronic device (101) may, in response to a user input (753), display a screen (610) with an enlarged area (611) selected in a second state (or slide-out state).
  • the electronic device (101) can enlarge a selected region (e.g., region (611)) by moving at least one of the edges (e.g., edge (721), edge (723)) of the selected region (e.g., region (611)) while changing from a first state to a second state.
  • enlarging a boundary of the region (611) can include moving at least one of the edges (e.g., edge (721), edge (723)) of the selected region (e.g., region (611)).
  • the electronic device (101) may, in response to a user input (753), display a screen (610) arranged based on a selected area (e.g., area (611)) in a second state.
  • the arrangement of the selected screen (e.g., screen (610)) based on the selected area (e.g., area (611)) may mean that the area (611) displayed in the second state is displayed among other areas.
  • the display of the selected area (e.g., area (611)) among other areas may mean that other contents are displayed in a letter box and/or pillar box generated as the area (611) is enlarged.
  • the electronic device (101) may move the region (611) to display the selected region (e.g., region (611)) among other contents while changing from the first state to the second state.
  • the electronic device (101) may move the region (611) based on a direction in which the display region of the display (230) expands (e.g., the second direction (262) of FIG. 2A) while changing from the first state to the second state.
  • the electronic device (101) may gradually move the selected region (e.g., region (611)) downward while changing from the first state to the second state.
  • a new region (612) may be further displayed above the region (611).
  • the present invention is not limited thereto.
  • the electronic device (101) may gradually move the selected area (e.g., area (615)) upward while changing from a first state to a second state.
  • a new area may be displayed below the area (615).
  • the electronic device (101) may display at least one content in an area (612) generated by movement of an area (611) located at the periphery of a display area while changing from a first state to a second state.
  • the area (612) may be generated by moving away from an edge perpendicular to a direction in which a display area that at least one side of a frame of the content touches extends (e.g., the second direction (262) of FIG. 2a) while changing from the first state to the second state.
  • the electronic device (101) may, in response to a user input (753), display content that is not displayed in the first state in at least one area (e.g., area (612)) of the area (230c) in the second state.
  • the electronic device (101) may display a selected region (611) from among the displayed regions (e.g., region (611), region (613), region (615)) at a designated location in the enlarged display region based on a user's request for enlarging the display region of the display (230).
  • the electronic device (101) may allow the user to experience a smooth layout change by gradually moving the selected region (e.g., region (611)) to the designated location.
  • the electronic device (101) may not require additional user effort for enlarging and/or moving the location of content suitable for the user by gradually moving the selected region (e.g., region (611)) to the designated location.
  • FIG. 7c is a diagram illustrating an example of a layout of a UI displayed in an expanded state of an electronic device according to one embodiment.
  • Fig. 7c the components of the electronic device (101) and the structure of the electronic device (101) described with reference to Figs. 1, 2a, 2b, 2c, 2d, 3a, 3b, 4a, 4b, 5, and 6a may be referred to.
  • the contents described with reference to Fig. 7a or 7b may not be repeated in the description of Fig. 7c.
  • FIG. 7c illustrates an example of a layout of a UI arranged based on another region (e.g., region (614)) instead of the region (611) selected by the user in the display area of the display (230).
  • the other region e.g., region (614)
  • the other region may include content mapped to region (611).
  • the other region e.g., region (614)
  • the other region (614) may include content acquired from an external device (e.g., server (108), electronic device (102), or electronic device (103)) by user input (755) for region (611).
  • the electronic device (101) may obtain a user input (755) while displaying a screen (610) including one or more regions (e.g., region (611), region (613), region (615)) in a display area (e.g., region (230a) of FIG. 2a) in a first state (or slide-in state).
  • regions e.g., region (611), region (613), region (615)
  • a display area e.g., region (230a) of FIG. 2a
  • the electronic device (101) can identify content mapped to the area (611) in response to user input (755). In one embodiment, the electronic device (101) can identify content hyperlinked to the area (611) in response to user input (755). In one embodiment, the electronic device (101) can obtain content from an external device (e.g., a server (108), or the electronic device (102), or the electronic device (103)) in response to user input (755) for the area (611).
  • an external device e.g., a server (108), or the electronic device (102), or the electronic device (103)
  • the electronic device (101) may display an area (614) including content acquired in a second state (or slide-out state) in response to a user input (755).
  • the area (614) may be an enlarged area depending on a ratio of the acquired content.
  • the ratio of the area (614) may be a ratio specified by an application (146) (or middleware (144)) that generates a screen on which the area (614) is displayed.
  • the electronic device (101) can enlarge the region (614) by moving at least one of the edges of the region (614) (e.g., edge (725), edge (727)) while changing from the first state to the second state.
  • enlarging the boundary of the region (614) can include moving at least one of the edges of the region (614) (e.g., edge (725), edge (727)).
  • the electronic device (101) may, in response to a user input (755), display a screen (610) arranged based on a region (614) including acquired content in a second state.
  • the screen (610) being arranged based on the region (614) may mean that the region (614) displayed in the second state is displayed between other regions.
  • the region (614) being displayed between other regions may mean that regions where other content is displayed are located in letter boxes and/or pillar boxes generated as the region (614) is enlarged.
  • the arrangement of the screen (701) based on the area (614) including the acquired content may mean that the area (614) displayed in the second state is located at the center position (740) of the display area (e.g., area (230c) of FIG. 2c). In one embodiment, the arrangement of the screen (701) based on the area (614) including the acquired content may mean that the center area (720) of the area (614) displayed in the second state includes the center position (740) of the area (e.g., area (230c)).
  • the electronic device (101) can move the region (614) to display the region (614) among other regions while changing from the first state to the second state. In one embodiment, the electronic device (101) can move the region (614) based on a direction in which the display region of the display (230) expands (e.g., the second direction (262) of FIG. 2A) while changing from the first state to the second state. As in example (704) of FIG. 7C, the electronic device (101) can gradually expand the region (614) between a region (e.g., region (613)) and a region (615) while changing from the first state to the second state.
  • a region e.g., region (613)
  • the electronic device (101) can gradually expand the region (614) between two regions (e.g., region (613) and region (615)) facing each other along the direction in which the display region expands (e.g., the second direction (262) of FIG. 2A) while changing from the first state to the second state.
  • the electronic device (101) may display some of the regions (e.g., regions (613), (615)) among the regions that are not selected in the first state, around the region (614) in the second state.
  • the periphery of the region (614) may be an area of a letter box and/or a pillar box.
  • the electronic device (101) may display some areas (e.g., areas (e.g., areas (613))) among the areas (e.g., areas (613)) that are not selected in the first state above the area (614) in the second state. In one embodiment, the electronic device (101) may display some areas (e.g., areas (e.g., areas (613))) that are displayed above the area (614) selected in the first state above the area (614) in the second state. In one embodiment, the electronic device (101) may display some areas (e.g., areas (615)) among the areas (e.g., areas (613)) that are not selected in the first state below the area (614) in the second state. In one embodiment, the electronic device (101) may display a portion of an area (e.g., area (615)) displayed below an area (614) selected in a first state below an area (614) in a second state.
  • areas e.g., areas (613)
  • the electronic device (101) may display some areas (e
  • the electronic device (101) can display content acquired by a selected region (611) among the displayed regions (e.g., region (611), region (613), region (615)) at a designated location of the enlarged display region based on a user's request for enlargement of the display region of the display (230).
  • the electronic device (101) can gradually enlarge the region (614) including the content acquired by the selected region (e.g., region (611)) between the designated regions, thereby allowing the user to experience a smooth layout change.
  • the electronic device (101) can eliminate additional user effort for enlargement and/or location movement of content suitable for the user by gradually enlarging the region (614) between the designated regions.
  • FIG. 8 is a diagram illustrating an example of a change in the layout of a UI according to a change from a collapsed state to an expanded state of an electronic device according to one embodiment.
  • FIG. 8 reference may be made to the components of the electronic device (101) and the structure of the electronic device (101) described with reference to FIG. 1, FIG. 2a, FIG. 2b, FIG. 2c, FIG. 2d, FIG. 3a, FIG. 3b, FIG. 4a, FIG. 4b, FIG. 5, FIG. 6a, FIG. 7a, FIG. 7b, and FIG. 7c.
  • the electronic device (101) may obtain a user input (850) while displaying a screen including one or more regions (e.g., region (811), region (813), region (815), region (817), and region (819)) in a display area (e.g., region (230a) of FIG. 2a) in a first state (or slide-in state).
  • a status bar may be displayed in the region (811).
  • the regions (e.g., region (813), region (815), and region (817)) may display screens generated through one application.
  • the region (813) may display content summarizing weather information.
  • the region (815) may display content including hourly temperature information.
  • the area (817) may display content including hourly precipitation probability information.
  • the area (819) may display a navigation bar.
  • the screen (801) of FIG. 8 is illustrated as including a status bar and a navigation bar, this is only an example. Depending on the embodiment, in the first state, the screen displayed in the display area may not include a status bar and/or a navigation bar.
  • the electronic device (101) can identify content mapped to the area (815) in response to user input (850). In one embodiment, the electronic device (101) can identify content hyperlinked to the area (815) in response to user input (850). In one embodiment, the electronic device (101) can obtain content from an external device (e.g., server (108) or electronic device (102, 103)) in response to user input (850) for the area (815). In one embodiment, the content mapped to the area (815) can be content including radar weather information.
  • the electronic device (101) may display an area (816) including content acquired in a second state (or slide-out state) in response to a user input (850).
  • the area (816) may be an enlarged area according to a ratio of the acquired content.
  • the ratio of the area (816) may be a ratio specified by an application (146) (or middleware (144)) that generates a screen on which the area (816) is displayed.
  • the electronic device (101) can enlarge the region (816) by moving at least one of the edges of the region (816) (e.g., edge (721), edge (725)) while changing from the first state to the second state.
  • enlarging the boundary of the region (816) can include moving at least one of the edges of the region (816) (e.g., edge (721), edge (725)).
  • the electronic device (101) can enlarge upwardly the edge (721) that touches the upper edge (e.g., the edge (813)) among the edges (e.g., the edge (721), the edge (725)) of the area (816), and can enlarge downwardly the edge (725) that touches the lower edge (e.g., the edge (817)) among the edges (e.g., the edge (721), the edge (725)) of the area (816).
  • the electronic device (101) may, in response to a user input (850), display a screen (810) arranged based on an area (816) including acquired content in a second state.
  • the screen (810) being arranged based on the area (816) may mean that the area (816) displayed in the second state is displayed between other areas.
  • the area (816) being displayed between other areas may mean that areas where other content is displayed are located in letter boxes and/or pillar boxes generated as the area (816) is enlarged.
  • the electronic device (101) may, in response to a user input (850), display an area (816) including acquired content in an area (815) where the user input (850) was acquired.
  • the electronic device (101) may, while changing from a first state to a second state, gradually enlarge the area (816) between two areas (e.g., area (813) and area (817)) facing each other along a direction in which the display area expands (e.g., the second direction (262) of FIG. 2A).
  • the electronic device (101) may, in response to a user input (850), gradually enlarge a region (815) in which the user input (850) is obtained between two opposing regions (e.g., region (813) and region (817)), and then display region (816) instead of region (815) in a second state.
  • the electronic device (101) may apply a graphic effect specified to region (815) and/or region (816) to display region (816) instead of region (815).
  • the electronic device (101) may apply a fade out effect to region (815) and a fade in effect to region (816).
  • FIG. 9 is a diagram illustrating an example of a change in the layout of a UI according to a change from a collapsed state to an expanded state of an electronic device according to one embodiment.
  • FIG. 9 reference may be made to the components of the electronic device (101) and the structure of the electronic device (101) described with reference to FIG. 1, FIG. 2a, FIG. 2b, FIG. 2c, FIG. 2d, FIG. 3a, FIG. 3b, FIG. 4a, FIG. 4b, FIG. 5, FIG. 6a, FIG. 7a, FIG. 7b, and FIG. 7c.
  • the electronic device (101) may obtain a user input (950) while displaying a screen including one or more regions (e.g., region (911), region (913), region (915), region (917), and region (919)) in a display area (e.g., region (230a) of FIG. 2a) in a first state (or slide-in state).
  • the region (911) may display a status bar.
  • the regions (e.g., region (913), region (915), and region (917)) may display screens generated through one application (e.g., a messenger application).
  • the region (913) may display conversations on an image object.
  • the region (915) may display an image object.
  • the region (917) may display conversations under the image object.
  • the region (919) may display a navigation bar.
  • the screen (901) of FIG. 9 is illustrated as including a status bar and a navigation bar, this is only an example. According to an embodiment, in the first state, the screen displayed in the display region may not include a status bar and/or a navigation bar.
  • the image object included in the region (915) may include path information (e.g., a uniform resource locator (URL)) for obtaining content related to the image object.
  • URL uniform resource locator
  • the electronic device (101) can identify content mapped to an image object in the area (915) in response to a user input (950). In one embodiment, the electronic device (101) can identify content hyperlinked to an image object in the area (915) in response to a user input (950). In one embodiment, the electronic device (101) can obtain content from an external device (e.g., a server (108) or an electronic device (102, 103)) in response to a user input (950) for an image object in the area (915). In one embodiment, the content mapped to the area (915) can be an original image of the image object in the area (915). In one embodiment, the image object in the area (915) can be a thumbnail image of the original image. However, the present invention is not limited thereto.
  • the electronic device (101) may display an area (916) including content acquired in a second state (or slide-out state) in response to a user input (950).
  • the area (916) may be an enlarged area according to a ratio of the acquired content.
  • the ratio of the area (916) may be a ratio specified by an application (146) (or middleware (144)) that generates a screen on which the area (916) is displayed.
  • the electronic device (101) can enlarge the region (916) by moving at least one of the edges of the region (916) (e.g., edge (721), edge (725)) while changing from the first state to the second state.
  • enlarging the boundary of the region (916) can include moving at least one of the edges of the region (916) (e.g., edge (721), edge (725)).
  • the electronic device (101) can enlarge upwardly the edge (721) that touches the upper edge (e.g., the edge (913)) among the edges (e.g., the edge (721), the edge (725)) of the area (916), and can enlarge downwardly the edge (725) that touches the lower edge (e.g., the edge (917)) among the edges (e.g., the edge (721), the edge (725)) of the area (916).
  • the electronic device (101) may, in response to a user input (950), display a screen (910) arranged based on a region (916) including acquired content in a second state.
  • the screen (910) being arranged based on the region (916) may mean that the region (916) displayed in the second state is displayed between other regions.
  • the region (916) being displayed between other regions may mean that regions where other content is displayed are located in letter boxes and/or pillar boxes generated as the region (916) is enlarged.
  • the electronic device (101) may, in response to a user input (950), display an area (916) including acquired content in an area (915) where the user input (950) was acquired.
  • the electronic device (101) may, while changing from a first state to a second state, gradually enlarge the area (916) between two areas (e.g., area (913) and area (917)) facing each other along a direction in which the display area expands (e.g., the second direction (262) of FIG. 2A).
  • the electronic device (101) may, in response to a user input (950), gradually enlarge a region (915) in which the user input (950) is obtained between two opposing regions (e.g., region (913) and region (917)), and then display region (916) instead of region (915) in a second state.
  • the electronic device (101) may apply a graphic effect specified to region (915) and/or region (916) to display region (916) instead of region (915).
  • the electronic device (101) may apply a fade out effect to region (915) and a fade in effect to region (916).
  • FIG. 10 is a diagram illustrating an example of a change in the layout of a UI according to a change from a collapsed state to an expanded state of an electronic device according to one embodiment.
  • FIG. 10 reference may be made to the components of the electronic device (101) and the structure of the electronic device (101) described with reference to FIG. 1, FIG. 2a, FIG. 2b, FIG. 2c, FIG. 2d, FIG. 3a, FIG. 3b, FIG. 4a, FIG. 4b, FIG. 5, FIG. 6a, FIG. 7a, FIG. 7b, and FIG. 7c.
  • the electronic device (101) may obtain a user input (1050) while displaying a screen including one or more regions (e.g., region (1011), region (1013), region (1015), region (1017), and region (1019)) in a display area (e.g., region (230a) of FIG. 2A) in a first state (or slide-in state).
  • the region (1011) may display a status bar.
  • the regions (e.g., region (1013), region (1015), and region (1017)) may display screens generated through one application (e.g., a social network service (SNS) application).
  • SNS social network service
  • the region (1013) may display content of search information (e.g., #dog's daily life).
  • areas e.g., area (1015), area (1017)
  • area (1019) may display a navigation bar.
  • screen (1001) of FIG. 10 is illustrated as including a status bar and a navigation bar, this is merely an example. According to an embodiment, in the first state, the screen displayed in the display area may not include a status bar and/or a navigation bar.
  • the electronic device (101) may identify one of the contents included in the area (1017) in response to the user input (1050). In one embodiment, the electronic device (101) may identify the thumbnail image indicated by the user input (1050) among the thumbnail images included in the area (1017). In one embodiment, the thumbnail image indicated by the user input (1050) may be the content at the last position among the contents displayed on the screen.
  • the electronic device (101) may display an area (1016) including selected content in a second state (or slide-out state) in response to a user input (1050).
  • the area (1016) may be an enlarged area depending on a ratio of the selected content.
  • the ratio of the area (1016) may be a ratio specified by an application (146) (or middleware (144)) that generates a screen on which the area (1016) is displayed.
  • the electronic device (101) can enlarge the region (1016) by moving at least one of the edges (e.g., edge (721), edge (725)) of the region (1016) while changing from the first state to the second state.
  • enlarging the boundary of the region (1016) can include moving at least one of the edges (e.g., edge (721), edge (725)) of the region (1016).
  • the electronic device (101) can move the edges (e.g., edge (721), edge (725)) of the region (1016) upward.
  • the electronic device (101) may, in response to a user input (1050), display a screen (1010) arranged based on a region (1016) including selected content in a second state.
  • the screen (1010) being arranged based on the region (1016) may mean that the region (1016) displayed in the second state is displayed between other regions.
  • the region (1016) being displayed between other regions may mean that regions where other content is displayed are located in letter boxes and/or pillar boxes generated as the region (1016) is enlarged.
  • the electronic device (101) may display a new area (1018) below the area (1016) in the second state.
  • the new area (1018) may include subsequent contents of the selected content.
  • FIG. 10 it is illustrated that when the content of the last position is selected by the user input (1050), a new area (1018) including the next contents of the selected content is displayed, but this is only an example.
  • a new area including the previous contents of the selected content may be displayed on top of the selected content.
  • FIG. 11 is a diagram illustrating an example of a change in the layout of a UI according to a change from a collapsed state to an expanded state of an electronic device according to one embodiment.
  • FIG. 11 the components of the electronic device (101) and the structure of the electronic device (101) described with reference to FIG. 1, FIG. 2a, FIG. 2b, FIG. 2c, FIG. 2d, FIG. 3a, FIG. 3b, FIG. 4a, FIG. 4b, FIG. 5, FIG. 6a, FIG. 7a, FIG. 7b, FIG. 7c, and FIG. 10 may be referred to.
  • the contents described in FIG. 10 may not be repeated in the description of FIG. 11.
  • FIG. 11 can illustrate a situation where there are no subsequent contents of the selected content to be displayed in the new area (1118).
  • the electronic device (101) may obtain a user input (1150) while displaying a screen including one or more regions (e.g., region (1111), region (1113), region (1115), region (1117), and region (1119)) in a display region (e.g., region (230a) of FIG. 2a) in a first state (or slide-in state).
  • the region (1111) may display a status bar.
  • the regions (e.g., region (1113), region (1115), and region (1117)) may display screens generated through one application (e.g., SNS application).
  • the region (1113) may display content of search information (e.g., #puppy's daily life).
  • areas may display content including one or more thumbnail images.
  • area (1119) may display a navigation bar.
  • screen (1101) of FIG. 11 is illustrated as including a status bar and a navigation bar, this is merely an example. According to an embodiment, in the first state, the screen displayed in the display area may not include a status bar and/or a navigation bar.
  • the electronic device (101) may identify one of the contents included in the area (1117) in response to the user input (1150). In one embodiment, the electronic device (101) may identify the thumbnail image indicated by the user input (1150) among the thumbnail images included in the area (1117). In one embodiment, the thumbnail image indicated by the user input (1150) may be the content at the last position among the contents displayed on the screen.
  • the electronic device (101) may, in response to user input (1150), display an area (1116) containing content selected in a second state (or slide-out state).
  • the electronic device (101) can enlarge the region (1116) by moving at least one of the edges (e.g., edge (721), edge (725)) of the region (1116) while changing from the first state to the second state.
  • enlarging the boundary of the region (1116) can include moving at least one of the edges (e.g., edge (721), edge (725)) of the region (1116).
  • the electronic device (101) can move the edges (e.g., edge (721), edge (725)) of the region (1116) upward.
  • the electronic device (101) may, in response to a user input (1150), display a screen (1110) arranged based on an area (1116) containing selected content in a second state.
  • the electronic device (101) may display a new area (1118) below the area (1116) in the second state. In one embodiment, the electronic device (101) may determine whether there are subsequent contents of the selected content to be displayed in the new area (1118). In one embodiment, if there are no subsequent contents of the selected content to be displayed in the new area (1118), the electronic device (101) may display contents included in the area displayed in the first state (e.g., area (1117)) in the new area (1118). In one embodiment, if there are no subsequent contents of the selected content to be displayed in the new area (1118), the electronic device (101) may display the new area (1118) with a specified effect applied to contents included in the area displayed in the first state (e.g., area (1117)). In one embodiment, the specified effect may be, but is not limited to, a blur effect.
  • FIG. 12 is a diagram illustrating an example of a change in the layout of a UI according to a change from a collapsed state to an expanded state of an electronic device according to one embodiment.
  • FIG. 12 reference may be made to the components of the electronic device (101) and the structure of the electronic device (101) described with reference to FIG. 1, FIG. 2a, FIG. 2b, FIG. 2c, FIG. 2d, FIG. 3a, FIG. 3b, FIG. 4a, FIG. 4b, FIG. 5, FIG. 6a, FIG. 7a, FIG. 7b, and FIG. 7c.
  • the electronic device (101) may obtain a user input (1250) while displaying a screen including one or more regions (e.g., region (1211), region (1213), region (1215), region (1217), and region (1219)) in a display area (e.g., region (230a) of FIG. 2a) in a first state (or slide-in state).
  • the region (1211) may display a status bar.
  • the regions (e.g., region (1213), region (1215)) may display screens generated through one application (e.g., a map application).
  • the region (1213) may display a map.
  • the region (1215) may display content including a list of places.
  • the area (1219) may display a navigation bar.
  • the screen (1201) of FIG. 12 is illustrated as including a status bar and a navigation bar, this is only an example. Depending on the embodiment, in the first state, the screen displayed in the display area may not include a status bar and/or a navigation bar.
  • the electronic device (101) may identify one of the contents included in the region (1213) in response to the user input (1250). In one embodiment, the electronic device (101) may identify location information for a location indicated by the user input (1250) among the locations included in the region (1213). In one embodiment, the region (1213) in which the user input (1250) is identified may be a region at a first location among the regions displayed on the screen.
  • the electronic device (101) may display an area (1216) including selected content (e.g., location information) in a second state (or slide-out state) in response to a user input (1250).
  • the area (1216) may be an enlarged area according to a ratio of the selected content.
  • the ratio of the area (1216) may be a ratio specified by an application (146) (or middleware (144)) that generates a screen on which the area (1216) is displayed.
  • the electronic device (101) can enlarge the region (1216) by moving at least one of the edges (e.g., edge (721), edge (725)) of the region (1216) while changing from the first state to the second state.
  • enlarging the boundary of the region (1216) can include moving at least one of the edges (e.g., edge (721), edge (725)) of the region (1216).
  • the electronic device (101) can move the edges (e.g., edge (721), edge (725)) of the region (1216) upward.
  • the electronic device (101) may, in response to a user input (1250), display a screen (1210) arranged based on a region (1216) including selected content in a second state.
  • the screen (1210) being arranged based on the region (1216) may mean that the region (1216) displayed in the second state is displayed between other regions.
  • the region (1216) being displayed between other regions may mean that regions in which other content is displayed are located in letter boxes and/or pillar boxes generated as the region (1216) is enlarged.
  • the electronic device (101) may display some of the areas (e.g., the area (1215)) that are not selected in the first state under the area (1216) in the second state. In one embodiment, the electronic device (101) may display the area (1215) displayed under the area (1213) selected in the first state under the area (1216) in the second state. In one embodiment, the size of the area (1215) displayed in the second state may be reduced compared to that in the first state. In one embodiment, the area (1215) displayed in the second state may include a part of the content included in the area (1215) displayed in the first state (e.g., 'labeled location').
  • the electronic device (101) may display a new area (1218) over the area (1216) in the second state. In one embodiment, the electronic device (101) may determine whether there is content prior to the content of the area (1213) in which the user input (1250) is identified. In one embodiment, if there is no previous content to be displayed in the new area (1218), the electronic device (101) may display the content displayed in the first state in the new area (1218). In one embodiment, if there is no previous content of the selected content to be displayed in the new area (1218), the electronic device (101) may display the new area (1218) with a specified effect applied to the contents included in the area displayed in the first state (e.g., area (1213)). In one embodiment, the specified effect may be a blur effect, but is not limited thereto.
  • FIG. 13 is a flowchart illustrating the operation of an electronic device according to one embodiment.
  • FIG. 13 the components of the electronic device (101) and the structure of the electronic device (101) described with reference to FIG. 1, FIG. 2a, FIG. 2b, FIG. 2c, FIG. 2d, FIG. 3a, FIG. 3b, FIG. 4a, FIG. 4b, FIG. 5, FIG. 6a, FIG. 7a, FIG. 7b, and FIG. 7c may be referred to.
  • the electronic device (101) may identify a user input.
  • the electronic device (101) may identify an input for selecting one content (e.g., content within the region (613)) among one or more regions (e.g., region (611), region (613), region (615)) displayed in a first state.
  • the electronic device (101) may identify an input for changing from the first state (or slide-in state) to a second state in which a display region of the display (230) (e.g., region (230a) of FIG. 2A) is enlarged.
  • the display region (230a) may display a screen (610) including one or more regions (e.g., region (611), region (613), region (615)).
  • One or more regions may be arranged along a direction in which a display area of the display (230) extends (e.g., the second direction (262) of FIG. 2A).
  • a display area of the display (230) extends (e.g., the second direction (262) of FIG. 2A).
  • the present invention is not limited thereto.
  • one or more regions (e.g., region (611), region (613), region (615)) within the screen (610) may be arranged according to various layouts (e.g., linear layout, relative layout, frame layout, constraint layout, grid layout, table layout).
  • each of the one or more regions (e.g., region (611), region (613), region (615)) within the screen (610) may include at least one content.
  • the at least one content may include a visual object.
  • the visual object may include text, an image, and/or a video.
  • the identified user input may include an input for selecting content (e.g., content within region (613)) from one or more regions (e.g., region (611), region (613), region (615)) displayed in the first state.
  • the identified user input may include an input for requesting a change from the first state to a second state.
  • the identified user input may include an input for selecting content (e.g., content within region (613)) and requesting a change to the second state.
  • the electronic device (101) may identify reference content. In one embodiment, the electronic device (101) may determine whether reference content is identified based on the identified user input.
  • the electronic device (101) may identify the selected content as the reference content if the identified user input includes an input for selecting one of the content (e.g., content within the region (613)) among one or more regions (e.g., region (611), region (613), region (615)) displayed in the first state.
  • the electronic device (101) may identify the content located in a designated region (e.g., region (613) located in the center) among the one or more regions (e.g., region (611), region (613), region (615)) displayed in the first state as the reference content if the identified user input includes an input for requesting a change from the first state to the second state.
  • the operation of identifying the content located in the designated region (e.g., region (613) located in the center) as the reference content may be performed when a function for automatic identification is turned on.
  • the present invention is not limited thereto.
  • the electronic device (101) may perform operation 1330. In one embodiment, if the reference content is not identified, the electronic device (101) may perform operation 1340. In one embodiment, the reference content may not be identified if the user only requests enlargement of the area (230a) without input for selection of the content. In one embodiment, the reference content may not be identified if the user only requests enlargement of the area (230a) without input for selection of the content while the function for automatic identification is turned off.
  • the electronic device (101) may display content in a first manner.
  • the first manner may refer to a manner of positioning an area including the selected content in a center area among a plurality of areas arranged along a direction in which a display area of an area (230c) of a second state is expanded (e.g., the second direction (262) of FIG. 2A).
  • the electronic device (101) can enlarge an area including the selected content according to a ratio (or aspect ratio) of the selected content. In one embodiment, the electronic device (101) can enlarge an area including the selected content by enlarging a boundary of the area including the selected content while changing from a first state to a second state.
  • the electronic device (101) may position the area including the selected content at the center position (740) of the display area of the second state (e.g., area (230c) of FIG. 2c). In one embodiment, the electronic device (101) may move the area including the selected content to position the area including the selected content at the center position (740) of the display area of the second state (e.g., area (230c) of FIG. 2c) while changing from the first state to the second state.
  • the electronic device (101) may display some areas among the areas that are not selected in the first state around the area including the selected content in the second state.
  • the area around the area including the selected content may be an area of a letter box and/or a pillar box.
  • the electronic device (101) can display content in a second manner.
  • displaying content in a second manner may refer to enlarging a screen displayed in the first state along a direction in which a display area of the display (230) expands (e.g., the second direction (262) of FIG. 2A).
  • displaying content in a second manner may refer to displaying an additional screen on a screen displayed in the first state.
  • the additional screen may be displayed in a display area that is added as the display changes from the first state to the second state.
  • a screen displayed in the first state may be displayed in the second state in the same size. However, this is not limited thereto.
  • the electronic device (101) may display a linked content (e.g., executing a hyperlink) for the content selected in operation 1310 without changing to the second state.
  • a linked content e.g., executing a hyperlink
  • FIG. 14 is a flowchart illustrating the operation of an electronic device according to one embodiment.
  • FIG. 14 the components of the electronic device (101) and the structure of the electronic device (101) described with reference to FIGS. 1, 2a, 2b, 2c, 2d, 3a, 3b, 4a, 4b, 5, 6a, 7a, 7b, and 7c may be referred to. Operations 1410, 1420, 1430, and 1440 of FIG. 14 may be included in operation 1330 of FIG. 13.
  • the electronic device (101) may identify a location of reference content.
  • the reference content may be one content (e.g., content within an area (613)) identified by a user input.
  • the reference content when the user input includes an input requesting a change from a first state to a second state, the reference content may be content located in a designated area (e.g., an area (613) located in the center) among one or more areas (e.g., an area (611), an area (613), an area (615)) displayed in the first state.
  • a designated area e.g., an area (613) located in the center
  • areas e.g., an area (611), an area (613), an area (615) displayed in the first state.
  • the present invention is not limited thereto.
  • the electronic device (101) can determine whether the location of the reference content is a reference location.
  • the reference location may be a location of a center location (740) or an area including the center location (740) among a plurality of areas arranged along a direction in which a display area of the display (230) is extended in the area (230a) in the first state (e.g., the second direction (262) of FIG. 2a).
  • the electronic device (101) may perform operation 1430. In one embodiment, if the location of the reference content is not the reference location, the electronic device (101) may perform operation 1440.
  • the electronic device (101) may display content in a first manner.
  • the first manner may refer to a manner of positioning an area including the selected content in a center area among a plurality of areas arranged along a direction in which a display area of an area (230c) of a second state is expanded (e.g., the second direction (262) of FIG. 2A).
  • the electronic device (101) can enlarge an area including the selected content according to a ratio (or aspect ratio) of the selected content. In one embodiment, the electronic device (101) can enlarge an area including the selected content by enlarging a boundary of the area including the selected content while changing from a first state to a second state.
  • the electronic device (101) may display some areas among the areas that are not selected in the first state around the area including the selected content in the second state.
  • the area around the area including the selected content may be an area of a letter box and/or a pillar box.
  • the electronic device (101) can change the location of the reference content.
  • the electronic device (101) may position the area including the selected content at the center position (740) of the display area of the second state (e.g., area (230c) of FIG. 2c). In one embodiment, the electronic device (101) may move the area including the selected content to position the area including the selected content at the center position (740) of the display area of the second state (e.g., area (230c) of FIG. 2c) while changing from the first state to the second state.
  • operations 1430 and 1440 are illustrated as separate operations, but this is only an example. Operations 1430 and 1440 may be performed simultaneously.
  • the electronic device (101) may enlarge the size of an area including the selected content while moving the area including the selected content to a central position (740).
  • FIG. 15 is a flowchart illustrating the operation of an electronic device according to one embodiment.
  • FIG. 15 reference may be made to the components of the electronic device (101) and the structure of the electronic device (101) described with reference to FIG. 1, FIG. 2a, FIG. 2b, FIG. 2c, FIG. 2d, FIG. 3a, FIG. 3b, FIG. 4a, FIG. 4b, FIG. 5, FIG. 6a, FIG. 7a, FIG. 7b, and FIG. 7c.
  • the electronic device (101) may identify an application policy of the reference content.
  • the application policy may be a policy set by an application that displays the reference content for the reference content.
  • the policy may include a display method, a display ratio, and/or a layout of the reference content.
  • the electronic device (101) can determine whether a ratio is set. In one embodiment, the electronic device (101) can determine whether a ratio related to the display of the reference content is set in the application policy. In one embodiment, if a ratio related to the display of the reference content is set in the application policy, the electronic device (101) can perform operation 1530. In one embodiment, if a ratio related to the display of the reference content is not set in the application policy, the electronic device (101) can perform operation 1550.
  • the electronic device (101) may display content enlarged at an identified ratio.
  • displaying content enlarged at an identified ratio may mean displaying the content at a maximum size that does not exceed a display area of the second state (e.g., area (230c) of FIG. 2c).
  • the electronic device (101) may identify a specified ratio.
  • the electronic device (101) may identify a ratio (or aspect ratio) specified for the reference content in the operating system (or middleware). Thereafter, the electronic device (101) may perform operation 1540.
  • the electronic device (101) may include a housing including a first housing part (210) and a second housing part (220) movably engaged with the first housing part (210) along one axis.
  • the electronic device (101) may include a display (230) (e.g., a flexible display) in which a size of a display area visible from a front side of the electronic device is expanded or reduced in the first direction (261) and the second direction (262) according to movement of the second housing part (220).
  • the electronic device (101) may include a memory (130) that stores instructions.
  • the electronic device (101) may include a processor (120) operatively connected with the display (230) and the memory (130).
  • a first area e.g., area (613)
  • areas e.g., area (611), area (613), area (615)
  • the above instructions when executed by the processor (120), may cause the electronic device to display at least a portion of the second content and at least a portion of the third content, respectively, which are arranged around the selected content in a second area (e.g., area (611)) and a third area (e.g., area (615)) adjacent to the first area (e.g., area (613)) along the uniaxial direction and interposing the first area (e.g., area (613)), as the size of the display area expands from the first size to the second size in the first area ().
  • a second area e.g., area (611)
  • a third area e.g., area (615) adjacent to the first area (e.g., area (613)
  • the first area e.g., area (613)
  • the first area (e.g., area (613)) where the first content is displayed may be larger than the area where the selected content is displayed in the display area of the first size.
  • the first area (e.g., area (613)) where the first content is displayed can be enlarged from the area where the selected content is displayed in the display area of the first size.
  • the above first content can be obtained from an external electronic device based on the selection of the above selected content.
  • the above instructions when executed by the processor (120), may cause the electronic device to obtain a user input (751).
  • the above instructions when executed by the processor (120), may cause the electronic device to select a content corresponding to a location obtained by the user input (751) from among the plurality of contents.
  • the instructions when executed by the processor (120), may cause the electronic device to obtain a user input (751) requesting an enlargement of the size of the display area from the first size to the second size in the first direction (261) and the second direction (262).
  • the instructions when executed by the processor (120), may cause the electronic device to select content located in a designated area among the plurality of contents displayed in other areas separated along the one-axis direction in the display area of the first size.
  • the first region (e.g., region (613)) of the first content may include a center position of the display region of the second size.
  • the above instructions when executed by the processor (120), may cause the electronic device to move at least a portion of the second content and at least a portion of the third content, which are arranged around the selected content, respectively, while the size of the display area is expanded from the first size to the second size, such that the first area (e.g., area (613)) is positioned between the second area (e.g., area (611)) and the third area (e.g., area (615)).
  • the first area e.g., area (613)
  • the second area e.g., area (611)
  • the third area e.g., area (615)
  • the above plurality of contents may include one or more visual objects.
  • the aspect ratio of the first area (e.g., area (613)) where the first content is displayed may correspond to the aspect ratio of the image object.
  • the lengths of the above two regions (e.g., region (611) and region (615)) in the uniaxial direction may be equal to each other.
  • the second content may include a portion of any one of the plurality of contents displayed in the display area of the first size.
  • the second content can be distinguished from a plurality of contents displayed in the display area of the first size.
  • the second region (e.g., region (611)) and the third region (e.g., region (615)) corresponding to the second content and the third content, respectively, can be distinguished from each other along the uniaxial direction.
  • the first region (e.g., region (613)) can be expanded between the two different regions (e.g., between region (611), region (613), and region (615)).
  • One of the two above different regions may include a center position of the display region of the first size.
  • the instructions when executed by the processor (120), may cause the electronic device to display the selected content in the first area (e.g., area (613)) while the size of the display area is expanded from the first size to the second size in the first direction (261) and the second direction (262).
  • the instructions when executed by the processor (120), may cause the electronic device to change the content displayed in the first area (e.g., area (613)) from the selected content to the first content in response to the size of the display area in the first direction (261) and the second direction (262) having the second size.
  • the method can be performed in an electronic device including a housing including a first housing part (210) and a second housing part (220) movably engaged with the first housing part (210) so as to be movable along one axis, and a display (230) (e.g., a flexible display) in which a size of a display area visible from a front side of the electronic device is expanded or reduced in the first direction (261) and the second direction (262) according to movement of the second housing part (220).
  • the method can include an operation of displaying a plurality of contents on the display area of the display (230) while the size of the display area has the first size.
  • the method may include an operation of displaying first content related to content selected from among the plurality of contents in a first region (e.g., region (613)) among regions (e.g., region (611), region (613), region (615)) distinguished along the one-axis direction in the display region of the second size as the size of the display region is expanded from the first size to the second size in the first direction (261) and the second direction (262).
  • a first region e.g., region (613)
  • regions e.g., region (611), region (613), region (615)
  • the method may include: an operation of displaying at least a part of the second content and at least a part of the third content, which are arranged around the selected content, in a second area (e.g., area (611)) and a third area (e.g., area (615)) adjacent to the first area (e.g., area (613)) along the one-axis direction and interposing the first area (e.g., area (613)) as the size of the display area is expanded from the first size to the second size in the first direction (261) and the second direction (262), respectively.
  • a second area e.g., area (611)
  • a third area e.g., area (615) adjacent to the first area (e.g., area (613)
  • interposing the first area e.g., area (613)
  • the method may include an operation of obtaining a user input (751) requesting an enlargement of the size of the display area from the first size to the second size in the first direction (261) and the second direction (262).
  • the method may include an operation of selecting a content located in a designated area among the plurality of contents displayed in other areas separated along the one-axis direction in the display area of the first size.
  • the method may include an operation of moving at least a portion of the second content and at least a portion of the third content, which are arranged around the selected content, while the size of the display area is expanded from the first size to the second size, such that the first area (e.g., area (613)) is positioned between the second area (e.g., area (611)) and the third area (e.g., area (615)).
  • first area e.g., area (613)
  • the third area e.g., area (615)
  • the second region (e.g., region (611)) and the third region (e.g., region (615)) corresponding to the second content and the third content, respectively, can be distinguished from each other along the uniaxial direction.
  • the first region (e.g., region (613)) can be expanded between the two different regions (e.g., between region (611), region (613), and region (615)).
  • a non-transitory computer readable storage medium as described above can store a program including instructions.
  • the instructions when executed by a processor (120) of an electronic device including a housing including a first housing part (210) and a second housing part (220) movably engaged with the first housing part (210) along one axis, and a display (230) (e.g., a flexible display) whose display area visible from a front side of the electronic device is enlarged or reduced in the first direction (261) and the second direction (262) according to movement of the second housing part (220), can cause the electronic device to display a plurality of contents on the display area while the display area of the display (230) has the first size.
  • a display e.g., a flexible display
  • the above instructions when executed by the processor, may cause the electronic device to display first content related to content selected from among the plurality of contents in a first region (e.g., region (613)) among regions (e.g., region (611), region (613), region (615)) distinguished along the uniaxial direction in the display region of the second size as the size of the display region expands from the first size to the second size in the first direction (261) and the second direction (262).
  • a first region e.g., region (613)
  • regions e.g., region (611), region (613), region (615)
  • the above instructions when executed by the processor, may cause the electronic device to display at least a portion of the second content and at least a portion of the third content, respectively, in a second area (e.g., area (611)) and a third area (e.g., area (615)) adjacent to the first area (e.g., area (613)) and interposing the first area (e.g., area (613)) along the one-axis direction, as the size of the display area increases from the first size to the second size in the first direction (261) and the second direction (262), and disposed around the selected content.
  • a second area e.g., area (611)
  • a third area e.g., area (615) adjacent to the first area (e.g., area (613)
  • interposing the first area e.g., area (613)
  • the instructions when executed by the processor (120), may cause the electronic device to obtain a user input (751) requesting an enlargement of the size of the display area from the first size to the second size in the first direction (261) and the second direction (262).
  • the instructions when executed by the processor (120), may cause the electronic device to select content located in a designated area among the plurality of contents displayed in other areas separated along the one-axis direction in the display area of the first size.
  • the above instructions when executed by the processor (120), may cause the electronic device to move at least a portion of the second content and at least a portion of the third content, which are arranged around the selected content, respectively, while the size of the display area is expanded from the first size to the second size, such that the first area (e.g., area (613)) is positioned between the second area (e.g., area (611)) and the third area (e.g., area (615)).
  • the first area e.g., area (613)
  • the second area e.g., area (611)
  • the third area e.g., area (615)
  • the second region (e.g., region (611)) and the third region (e.g., region (615)) corresponding to the second content and the third content, respectively, can be distinguished from each other along the uniaxial direction.
  • the first region (e.g., region (613)) can be expanded between the two different regions (e.g., between region (611), region (613), and region (615)).
  • the electronic devices according to various embodiments disclosed in this document may be devices of various forms.
  • the electronic devices may include, for example, portable communication devices (e.g., smartphones), computer devices, portable multimedia devices, portable medical devices, cameras, wearable devices, or home appliance devices.
  • portable communication devices e.g., smartphones
  • computer devices portable multimedia devices
  • portable medical devices e.g., cameras
  • wearable devices e.g., smart watch devices
  • home appliance devices e.g., smartphones
  • the electronic devices according to embodiments of this document are not limited to the above-described devices.
  • first, second, or first or second may be used merely to distinguish one component from another, and do not limit the components in any other respect (e.g., importance or order).
  • a component e.g., a first component
  • another e.g., a second component
  • functionally e.g., a third component
  • module used in various embodiments of this document may include a unit implemented in hardware, software or firmware, and may be used interchangeably with terms such as logic, logic block, component, or circuit, for example.
  • a module may be an integrally configured component or a minimum unit of the component or a part thereof that performs one or more functions.
  • a module may be implemented in the form of an application-specific integrated circuit (ASIC).
  • ASIC application-specific integrated circuit
  • Various embodiments of the present document may be implemented as software (e.g., a program (140)) including one or more instructions stored in a storage medium (e.g., an internal memory (136) or an external memory (138)) readable by a machine (e.g., an electronic device (101)).
  • a processor e.g., a processor (120)
  • the machine e.g., an electronic device (101)
  • the one or more instructions may include code generated by a compiler or code executable by an interpreter.
  • the machine-readable storage medium may be provided in the form of a non-transitory storage medium.
  • 'non-transitory' simply means that the storage medium is a tangible device and does not contain signals (e.g. electromagnetic waves), and the term does not distinguish between cases where data is stored semi-permanently or temporarily on the storage medium.
  • 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 a seller and a buyer as a commodity.
  • the computer program product may be distributed in the form of a machine-readable storage medium (e.g., a compact disc read only memory (CD-ROM)), or may be distributed online (e.g., downloaded or uploaded) via an application store (e.g., Play StoreTM) or directly between two user devices (e.g., smart phones).
  • an application store e.g., Play StoreTM
  • at least a part of the computer program product may be temporarily stored or temporarily generated in a machine-readable storage medium, such as a memory of a manufacturer's server, a server of an application store, or an intermediary server.
  • each component e.g., a module or a program of the above-described components may include a single or multiple entities, and some of the multiple entities may be separately arranged in other components.
  • one or more components or operations of the above-described corresponding components may be omitted, or one or more other components or operations may be added.
  • the multiple components e.g., a module or a program
  • the integrated component may perform one or more functions of each of the multiple components identically or similarly to those performed by the corresponding component of the multiple components before the integration.
  • the operations performed by the module, program, or other component may be executed sequentially, in parallel, repeatedly, or heuristically, or one or more of the operations may be executed in a different order, omitted, or one or more other operations may be added.

Landscapes

  • Engineering & Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

전자 장치는, 플렉서블 디스플레이의 표시 영역의 크기가 제1 크기를 가지는 동안, 상기 표시 영역에, 복수의 콘텐트들을 표시하고, 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 기반하여: 상기 표시 영역이 제1 크기를 가지는 동안, 상기 디스플레이 영역의 영역들 중 제1 영역에 상기 복수의 콘텐트들 중에서 선택된 콘텐트와 관련된 제1 콘텐트를 표시하고, 상기 영역들은 서로에 대하여 배열되고, 및 상기 제1 영역에 대하여 이웃하고, 상기 제1 영역을 사이에 두는 제2 영역 및 제3 영역에 상기 선택된 콘텐트의 주변에 배치되는 제2 콘텐트 적어도 일부와 제3 콘텐트의 적어도 일부를 각각 표시하도록 구성될 수 있다. 상기 제1 영역은, 상기 제2 영역 및 상기 제3 영역에 대하여 이웃하고, 상기 제2 영역 및 상기 제3 영역 사이에 있을 수 있다.

Description

플렉서블 디스플레이에서 콘텐트를 표시하는 전자 장치, 방법, 및 비-일시적 컴퓨터 판독 가능 기록 매체
본 개시의 실시 예들은, 플렉서블 디스플레이에서 콘텐트를 표시하는 전자 장치, 방법, 및 비-일시적 컴퓨터 판독 가능 기록 매체에 관한 것이다.
최근, 플렉서블 디스플레이(flexible display)들을 포함하는 전자 장치가 등장하고 있다. 플렉서블 디스플레이가 자유롭게 구부려질 수 있음으로 인해 전자 장치 내부에 플렉서블 디스플레이가 감겨지거나, 또는 풀릴 수 있다. 전자 장치 내부에 플렉서블 디스플레이가 감겨지면서 전체 볼 수 있는 디스플레이의 크기 또는 면적이 줄어들 수 있고, 또한 전자 장치 내부에 감긴 플렉서블 디스플레이가 풀리면서 전체 볼 수 있는 디스플레이의 크기 또는 면적이 증가할 수 있다.
전자 장치가 개시된다. 상기 전자 장치는, 제1 하우징 파트 및 이동 가능하도록 상기 제1 하우징 파트와 결합된(movably engaged) 제2 하우징 파트를 포함하는 하우징을 포함할 수 있다. 상기 전자 장치는, 상기 전자 장치의 전면에서 보이는 표시 영역을 포함하는 플렉서블 디스플레이를 포함할 수 있다. 상기 표시 영역의 크기는, 상기 제2 하우징 파트의 이동에 따라 확대되거나 축소될 수 있다. 상기 전자 장치는, 인스트럭션들을 저장하는 메모리를 포함할 수 있다. 상기 전자 장치는, 상기 플렉서블 디스플레이 및 상기 메모리와 작동적으로 연결된 프로세서를 포함할 수 있다. 상기 인스트럭션들은 상기 프로세서에 의해 실행 시, 상기 전자 장치가, 상기 플렉서블 디스플레이의 상기 표시 영역의 크기가 제1 크기를 가지는 동안, 상기 표시 영역에, 복수의 콘텐트들을 표시하도록 야기할 수 있다. 상기 인스트럭션들은 상기 프로세서에 의해 실행 시, 상기 전자 장치가, 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 기반하여: 상기 표시 영역이 제1 크기를 가지는 동안, 상기 디스플레이 영역의 영역들 중 제1 영역에 상기 복수의 콘텐트들 중에서 선택된 콘텐트와 관련된 제1 콘텐트를 표시하도록 야기할 수 있다. 상기 영역들은 서로에 대하여 배열될 수 있다. 상기 인스트럭션들은 상기 프로세서에 의해 실행 시, 상기 전자 장치가, 상기 제1 영역에 대하여 이웃하고, 상기 제1 영역을 사이에 두는 제2 영역 및 제3 영역에 상기 선택된 콘텐트의 주변에 배치되는 제2 콘텐트 적어도 일부와 제3 콘텐트의 적어도 일부를 각각 표시하도록 야기할 수 있다. 상기 제1 영역은, 상기 제2 영역 및 상기 제3 영역에 대하여 이웃하고, 상기 제2 영역 및 상기 제3 영역 사이에 있을 수 있다. 상기 표시 영역의 상기 크기가 상기 제2 크기로 증가하고 있는 동안, 상기 제2 콘텐트의 상기 적어도 일부와 상기 제3 콘텐트의 상기 적어도 일부는 각각, 상기 표시 영역이 상기 제1 크기를 가지는 동안 표시되었던 선택된 콘텐트 주변에 표시될 수 있다.
방법이 개시된다. 상기 방법은, 제1 하우징 파트 및 이동 가능하도록 상기 제1 하우징 파트와 결합된 제2 하우징 파트를 포함하는 하우징, 및 상기 전자 장치의 전면에서 보이는 표시 영역을 포함하는 플렉서블 디스플레이를 포함하는, 전자 장치에서 수행될 수 있다. 상기 표시 영역의 크기는, 상기 제2 하우징 파트의 이동에 따라 확대되거나 축소될 수 있다. 상기 방법은, 상기 플렉서블 디스플레이의 상기 표시 영역의 크기가 제1 크기를 가지는 동안, 상기 표시 영역에, 복수의 콘텐트들을 표시하는 동작을 포함할 수 있다. 상기 방법은, 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 기반하여: 상기 표시 영역이 제1 크기를 가지는 동안, 상기 디스플레이 영역의 영역들 중 제1 영역에 상기 복수의 콘텐트들 중에서 선택된 콘텐트와 관련된 제1 콘텐트를 표시하는 동작을 포함할 수 있다. 상기 영역들은 서로에 대하여 배열될 수 있다. 상기 방법은, 상기 제1 영역에 대하여 이웃하고, 상기 제1 영역을 사이에 두는 제2 영역 및 제3 영역에 상기 선택된 콘텐트의 주변에 배치되는 제2 콘텐트 적어도 일부와 제3 콘텐트의 적어도 일부를 각각 표시하는 동작을 포함할 수 있다. 상기 제1 영역은, 상기 제2 영역 및 상기 제3 영역에 대하여 이웃하고, 상기 제2 영역 및 상기 제3 영역 사이에 있을 수 있다. 상기 표시 영역의 상기 크기가 상기 제2 크기로 증가하고 있는 동안, 상기 제2 콘텐트의 상기 적어도 일부와 상기 제3 콘텐트의 상기 적어도 일부는 각각, 상기 표시 영역이 상기 제1 크기를 가지는 동안 표시되었던 선택된 콘텐트 주변에 표시될 수 있다.
비-일시적 컴퓨터 판독 가능 기록 매체(non-transitory computer readable storage medium)가 개시된다. 상기 비-일시적 컴퓨터 판독 가능 기록 매체는, 인스트럭션들을 포함하는 프로그램을 저장할 수 있다. 상기 인스트럭션들은, 제1 하우징 파트 및 이동 가능하도록 상기 제1 하우징 파트와 결합된 제2 하우징 파트를 포함하는 하우징, 및 상기 전자 장치의 전면에서 보이는 표시 영역을 포함하는 플렉서블 디스플레이를 포함하고, 상기 표시 영역의 크기가, 상기 제2 하우징 파트의 이동에 따라 확대되거나 축소될 수 있는 전자 장치의 프로세서에 의해 실행될 시, 상기 전자 장치가, 상기 플렉서블 디스플레이의 상기 표시 영역의 크기가 제1 크기를 가지는 동안, 상기 표시 영역에, 복수의 콘텐트들을 표시하도록 야기할 수 있다. 상기 인스트럭션들은, 상기 프로세서에 의해 실행될 시, 상기 전자 장치가, 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 기반하여: 상기 표시 영역이 제1 크기를 가지는 동안, 상기 디스플레이 영역의 영역들 중 제1 영역에 상기 복수의 콘텐트들 중에서 선택된 콘텐트와 관련된 제1 콘텐트를 표시하도록 야기할 수 있다. 상기 영역들은 서로에 대하여 배열될 수 있다. 상기 인스트럭션들은, 상기 프로세서에 의해 실행될 시, 상기 전자 장치가, 상기 제1 영역에 대하여 이웃하고, 상기 제1 영역을 사이에 두는 제2 영역 및 제3 영역에 상기 선택된 콘텐트의 주변에 배치되는 제2 콘텐트 적어도 일부와 제3 콘텐트의 적어도 일부를 각각 표시하도록 야기할 수 있다. 상기 제1 영역은, 상기 제2 영역 및 상기 제3 영역에 대하여 이웃하고, 상기 제2 영역 및 상기 제3 영역 사이에 있을 수 있다. 상기 표시 영역의 상기 크기가 상기 제2 크기로 증가하고 있는 동안, 상기 제2 콘텐트의 상기 적어도 일부와 상기 제3 콘텐트의 상기 적어도 일부는 각각, 상기 표시 영역이 상기 제1 크기를 가지는 동안 표시되었던 선택된 콘텐트 주변에 표시될 수 있다.
도 1은, 다양한 실시예들에 따른, 네트워크 환경 내의 전자 장치의 블록도이다.
도 2a는 제1 상태 내의 예시적인 전자 장치의 평면도(top plan view)이다.
도 2b는 제1 상태 내의 예시적인 전자 장치의 저면도(bottom view)이다.
도 2c는 제2 상태 내의 예시적인 전자 장치의 평면도이다.
도 2d는 제2 상태 내의 예시적인 전자 장치의 저면도이다.
도 3a는 예시적인 전자 장치의 분해 사시도(exploded perspective view)이다.
도 3b는 예시적인 전자 장치의 분해 사시도이다.
도 4a는, 제1 상태 내의 예시적인 전자 장치의 단면도(cross-sectional view)이다.
도 4b는, 제2 상태 내의 예시적인 전자 장치의 단면도이다.
도 5는 전자 장치의 개략적인 블록도이다.
도 6a는 일 실시 예에 따른, 전자 장치의 축소 상태에서 표시되는 UI(user interface)의 레이아웃의 일 예를 도시하는 도면이다.
도 6b는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다.
도 6c는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다.
도 6d는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다.
도 7a는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다.
도 7b는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다.
도 7c는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다.
도 8은 일 실시 예에 따른, 전자 장치의 축소 상태에서 확장 상태로의 변경에 따른 UI의 레이아웃의 변화의 일 예를 도시하는 도면이다.
도 9는 일 실시 예에 따른, 전자 장치의 축소 상태에서 확장 상태로의 변경에 따른 UI의 레이아웃의 변화의 일 예를 도시하는 도면이다.
도 10은 일 실시 예에 따른, 전자 장치의 축소 상태에서 확장 상태로의 변경에 따른 UI의 레이아웃의 변화의 일 예를 도시하는 도면이다.
도 11은 일 실시 예에 따른, 전자 장치의 축소 상태에서 확장 상태로의 변경에 따른 UI의 레이아웃의 변화의 일 예를 도시하는 도면이다.
도 12는 일 실시 예에 따른, 전자 장치의 축소 상태에서 확장 상태로의 변경에 따른 UI의 레이아웃의 변화의 일 예를 도시하는 도면이다.
도 13은 일 실시 예에 따른, 전자 장치의 동작을 예시하는 흐름도이다.
도 14는 일 실시 예에 따른, 전자 장치의 동작을 예시하는 흐름도이다.
도 15는 일 실시 예에 따른, 전자 장치의 동작을 예시하는 흐름도이다.
도 1은, 다양한 실시예들에 따른, 네트워크 환경(100) 내의 전자 장치(101)의 블록도이다.
도 1을 참조하면, 네트워크 환경(100)에서 전자 장치(101)는 제1 네트워크(198)(예: 근거리 무선 통신 네트워크)를 통하여 전자 장치(102)와 통신하거나, 및/또는 제2 네트워크(199)(예: 원거리 무선 통신 네트워크)를 통하여 전자 장치(104) 또는 서버(108) 중 적어도 하나와 통신할 수 있다. 일실시예에 따르면, 전자 장치(101)는 서버(108)를 통하여 전자 장치(104)와 통신할 수 있다. 일실시예에 따르면, 전자 장치(101)는 프로세서(120), 메모리(130), 입력 모듈(150), 음향 출력 모듈(155), 디스플레이 모듈(160), 오디오 모듈(170), 센서 모듈(176), 인터페이스(177), 연결 단자(178), 햅틱 모듈(179), 카메라 모듈(180), 전력 관리 모듈(188), 배터리(189), 통신 모듈(190), 가입자 식별 모듈(196), 및/또는 안테나 모듈(197)을 포함할 수 있다. 어떤 실시예에서는, 전자 장치(101)에는, 이 구성요소들 중 적어도 하나(예: 연결 단자(178))가 생략되거나, 및/또는 하나 이상의 다른 구성요소가 추가될 수 있다. 어떤 실시예에서는, 이 구성요소들 중 일부들(예: 센서 모듈(176), 카메라 모듈(180), 및/또는 안테나 모듈(197))은 하나의 구성요소(예: 디스플레이 모듈(160))로 통합될 수 있다.
프로세서(120)는, 예를 들면, 소프트웨어(예: 프로그램(140))를 실행하여 프로세서(120)에 연결된 전자 장치(101)의 적어도 하나의 다른 구성요소(예: 하드웨어 또는 소프트웨어 구성요소)를 제어할 수 있고, 다양한 데이터 처리 및/또는 연산을 수행할 수 있다. 일실시예에 따르면, 데이터 처리 및/또는 연산의 적어도 일부로서, 프로세서(120)는 다른 구성요소(예: 센서 모듈(176) 또는 통신 모듈(190))로부터 수신된 명령 및/또는 데이터를 휘발성 메모리(132)에 저장하고, 휘발성 메모리(132)에 저장된 명령 및/또는 데이터를 처리하고, 결과 데이터를 비휘발성 메모리(134)에 저장할 수 있다. 일실시예에 따르면, 프로세서(120)는 메인 프로세서(121)(예: 중앙 처리 장치 및/또는 어플리케이션 프로세서) 및/또는 이와는 독립적으로 또는 함께 운영 가능한 보조 프로세서(123)(예: 그래픽 처리 장치, 신경망 처리 장치(NPU: neural processing unit), 이미지 시그널 프로세서, 센서 허브 프로세서, 및/또는 커뮤니케이션 프로세서)를 포함할 수 있다. 예를 들어, 전자 장치(101)가 메인 프로세서(121) 및 보조 프로세서(123)를 포함하는 경우, 보조 프로세서(123)는 메인 프로세서(121)보다 저전력을 사용하거나, 지정된 기능에 특화되도록 설정될 수 있다. 보조 프로세서(123)는 메인 프로세서(121)와 별개로, 또는 그 일부로서 구현될 수 있다.
보조 프로세서(123)는, 예를 들면, 메인 프로세서(121)가 인액티브(예: 슬립) 상태에 있는 동안 메인 프로세서(121)를 대신하여, 및/또는 메인 프로세서(121)가 액티브(예: 어플리케이션 실행) 상태에 있는 동안 메인 프로세서(121)와 함께, 전자 장치(101)의 구성요소들 중 적어도 하나의 구성요소(예: 디스플레이 모듈(160), 센서 모듈(176), 및/또는 통신 모듈(190))과 관련된 기능 또는 상태들의 적어도 일부를 제어할 수 있다. 일실시예에 따르면, 보조 프로세서(123)(예: 이미지 시그널 프로세서 또는 커뮤니케이션 프로세서)는 기능적으로 관련 있는 다른 구성요소(예: 카메라 모듈(180) 또는 통신 모듈(190))의 일부로서 구현될 수 있다. 일실시예에 따르면, 보조 프로세서(123)(예: 신경망 처리 장치)는 인공지능 모델의 처리에 특화된 하드웨어 구조를 포함할 수 있다. 인공지능 모델은 기계 학습을 통해 생성될 수 있다. 이러한 학습은, 예를 들어, 인공지능 모델이 수행되는 전자 장치(101) 자체에서 수행될 수 있고, 별도의 서버(예: 서버(108))를 통해 수행될 수도 있다. 학습 알고리즘은, 예를 들어, 지도형 학습(supervised learning), 비지도형 학습(unsupervised learning), 준지도형 학습(semi-supervised learning) 및/또는 강화 학습(reinforcement learning)을 포함할 수 있으나, 전술한 예에 한정되지 않는다. 인공지능 모델은, 복수의 인공 신경망 레이어들을 포함할 수 있다. 인공 신경망은 심층 신경망(DNN: deep neural network), CNN(convolutional neural network), RNN(recurrent neural network), RBM(restricted boltzmann machine), DBN(deep belief network), BRDNN(bidirectional recurrent deep neural network), 심층 Q-네트워크(deep Q-networks) 또는 상기 중 둘 이상의 조합 중 하나일 수 있으나, 전술한 예에 한정되지 않는다. 인공지능 모델은 하드웨어 구조 이외에, 추가적으로 또는 대체적으로, 소프트웨어 구조를 포함할 수 있다.
메모리(130)는, 전자 장치(101)의 적어도 하나의 구성요소(예: 프로세서(120) 및/또는 센서 모듈(176))에 의해 사용되는 다양한 데이터를 저장할 수 있다. 데이터는, 예를 들어, 소프트웨어(예: 프로그램(140)) 및, 이와 관련된 명령에 대한 입력 데이터 및/또는 출력 데이터를 포함할 수 있다. 메모리(130)는, 휘발성 메모리(132) 및/또는 비휘발성 메모리(134)를 포함할 수 있다.
프로그램(140)은 메모리(130)에 소프트웨어로서 저장될 수 있으며, 예를 들면, 운영 체제(142), 미들 웨어(144) 및/또는 어플리케이션(146)을 포함할 수 있다.
입력 모듈(150)은, 전자 장치(101)의 구성요소(예: 프로세서(120))에 사용될 명령 및/또는 데이터를 전자 장치(101)의 외부(예: 사용자)로부터 수신할 수 있다. 입력 모듈(150)은, 예를 들면, 마이크, 마우스, 키보드, 키(예: 버튼), 및/또는 디지털 펜(예: 스타일러스 펜)을 포함할 수 있다.
음향 출력 모듈(155)은 음향 신호를 전자 장치(101)의 외부로 출력할 수 있다. 음향 출력 모듈(155)은, 예를 들면, 스피커 및/또는 리시버를 포함할 수 있다. 스피커는 멀티미디어 재생 및/또는 녹음 재생과 같이 일반적인 용도로 사용될 수 있다. 리시버는 착신 전화를 수신하기 위해 사용될 수 있다. 일실시예에 따르면, 리시버는 스피커와 별개로, 또는 그 일부로서 구현될 수 있다.
디스플레이 모듈(160)은 전자 장치(101)의 외부(예: 사용자)로 정보를 시각적으로 제공할 수 있다. 디스플레이 모듈(160)은, 예를 들면, 디스플레이, 홀로그램 장치, 및/또는 프로젝터 및 해당 장치를 제어하기 위한 제어 회로를 포함할 수 있다. 일실시예에 따르면, 디스플레이 모듈(160)은 터치를 감지하도록 설정된 터치 센서, 및/또는 상기 터치에 의해 발생되는 힘의 세기를 측정하도록 설정된 압력 센서를 포함할 수 있다.
오디오 모듈(170)은 소리를 전기 신호로 변환시키거나, 반대로 전기 신호를 소리로 변환시킬 수 있다. 일실시예에 따르면, 오디오 모듈(170)은, 입력 모듈(150)을 통해 소리를 획득하거나, 및/또는 음향 출력 모듈(155), 및/또는 전자 장치(101)와 직접 또는 무선으로 연결된 외부 전자 장치(예: 전자 장치(102))(예: 스피커 또는 헤드폰)를 통해 소리를 출력할 수 있다.
센서 모듈(176)은 전자 장치(101)의 작동 상태(예: 전력 및/또는 온도), 및/또는 외부의 환경 상태(예: 사용자 상태)를 감지하고, 감지된 상태에 대응하는 전기 신호 및/또는 데이터 값을 생성할 수 있다. 일실시예에 따르면, 센서 모듈(176)은, 예를 들면, 제스처 센서, 자이로 센서, 기압 센서, 마그네틱 센서, 가속도 센서, 그립 센서, 근접 센서, 컬러 센서, IR(infrared) 센서, 생체 센서, 온도 센서, 습도 센서, 및/또는 조도 센서를 포함할 수 있다.
인터페이스(177)는 전자 장치(101)가 외부 전자 장치(예: 전자 장치(102))와 직접 또는 무선으로 연결되기 위해 사용될 수 있는 하나 이상의 지정된 프로토콜들을 지원할 수 있다. 일실시예에 따르면, 인터페이스(177)는, 예를 들면, HDMI(high definition multimedia interface), USB(universal serial bus) 인터페이스, SD카드 인터페이스, 및/또는 오디오 인터페이스를 포함할 수 있다.
연결 단자(178)는, 그를 통해서 전자 장치(101)가 외부 전자 장치(예: 전자 장치(102))와 물리적으로 연결될 수 있는 커넥터를 포함할 수 있다. 일실시예에 따르면, 연결 단자(178)는, 예를 들면, HDMI 커넥터, USB 커넥터, SD 카드 커넥터, 및/또는 오디오 커넥터(예: 헤드폰 커넥터)를 포함할 수 있다.
햅틱 모듈(179)은 전기적 신호를 사용자가 촉각 또는 운동 감각을 통해서 인지할 수 있는 기계적인 자극(예: 진동 또는 움직임) 또는 전기적인 자극으로 변환할 수 있다. 일실시예에 따르면, 햅틱 모듈(179)은, 예를 들면, 모터, 압전 소자, 및/또는 전기 자극 장치를 포함할 수 있다.
카메라 모듈(180)은 정지 영상 및 동영상을 촬영할 수 있다. 일실시예에 따르면, 카메라 모듈(180)은 하나 이상의 렌즈들, 이미지 센서들, 이미지 시그널 프로세서들, 및/또는 플래시들을 포함할 수 있다.
전력 관리 모듈(188)은 전자 장치(101)에 공급되는 전력을 관리할 수 있다. 일실시예에 따르면, 전력 관리 모듈(188)은, 예를 들면, PMIC(power management integrated circuit)의 적어도 일부로서 구현될 수 있다.
배터리(189)는 전자 장치(101)의 적어도 하나의 구성요소에 전력을 공급할 수 있다. 일실시예에 따르면, 배터리(189)는, 예를 들면, 재충전 불가능한 1차 전지, 재충전 가능한 2차 전지 및/또는 연료 전지를 포함할 수 있다.
통신 모듈(190)은 전자 장치(101)와 외부 전자 장치(예: 전자 장치(102), 전자 장치(104), 또는 서버(108)) 간의 직접(예: 유선) 통신 채널 및/또는 무선 통신 채널의 수립, 및 수립된 통신 채널을 통한 통신 수행을 지원할 수 있다. 통신 모듈(190)은 프로세서(120)(예: 어플리케이션 프로세서)와 독립적으로 운영되고, 직접(예: 유선) 통신 또는 무선 통신을 지원하는 하나 이상의 커뮤니케이션 프로세서를 포함할 수 있다. 일실시예에 따르면, 통신 모듈(190)은 무선 통신 모듈(192)(예: 셀룰러 통신 모듈, 근거리 무선 통신 모듈, 및/또는 GNSS(global navigation satellite system) 통신 모듈) 및/또는 유선 통신 모듈(194)(예: LAN(local area network) 통신 모듈, 및/또는 전력선 통신 모듈)을 포함할 수 있다. 이들 통신 모듈 중 해당하는 통신 모듈은 제1 네트워크(198)(예: 블루투스, WiFi(wireless fidelity) direct 및/또는 IrDA(infrared data association)와 같은 근거리 통신 네트워크) 및/또는 제2 네트워크(199)(예: 레거시 셀룰러 네트워크, 5G 네트워크, 차세대 통신 네트워크, 인터넷, 및/또는 컴퓨터 네트워크(예: LAN 또는 WAN)와 같은 원거리 통신 네트워크)를 통하여 외부의 전자 장치(104)와 통신할 수 있다. 이런 여러 종류의 통신 모듈들은 하나의 구성요소(예: 단일 칩)로 통합되거나, 또는 서로 별도의 복수의 구성요소들(예: 복수 칩들)로 구현될 수 있다. 무선 통신 모듈(192)은 가입자 식별 모듈(196)에 저장된 가입자 정보(예: 국제 모바일 가입자 식별자(IMSI))를 이용하여 제1 네트워크(198) 또는 제2 네트워크(199)와 같은 통신 네트워크 내에서 전자 장치(101)를 확인 또는 인증할 수 있다.
무선 통신 모듈(192)은 4G 네트워크 이후의 5G 네트워크 및 차세대 통신 기술, 예를 들어, NR 접속 기술(new radio access technology)을 지원할 수 있다. NR 접속 기술은 고용량 데이터의 고속 전송(eMBB(enhanced mobile broadband)), 단말 전력 최소화와 다수 단말의 접속(mMTC(massive machine type communications)), 및/또는 고신뢰도와 저지연(URLLC(ultra-reliable and low-latency communications))을 지원할 수 있다. 무선 통신 모듈(192)은, 예를 들어, 높은 데이터 전송률 달성을 위해, 고주파 대역(예: mmWave 대역)을 지원할 수 있다. 무선 통신 모듈(192)은 고주파 대역에서의 성능 확보를 위한 다양한 기술들, 예를 들어, 빔포밍(beamforming), 거대 배열 다중 입출력(massive MIMO(multiple-input and multiple-output)), 전차원 다중입출력(FD-MIMO(full dimensional MIMO)), 어레이 안테나(array antenna), 아날로그 빔형성(analog beam-forming), 및/또는 대규모 안테나(large scale antenna)와 같은 기술들을 지원할 수 있다. 무선 통신 모듈(192)은 전자 장치(101), 외부 전자 장치(예: 전자 장치(104)) 및/또는 네트워크 시스템(예: 제2 네트워크(199))에 규정되는 다양한 요구사항을 지원할 수 있다. 일실시예에 따르면, 무선 통신 모듈(192)은 eMBB 실현을 위한 Peak data rate(예: 20Gbps 이상), mMTC 실현을 위한 손실 Coverage(예: 664dB 이하), 또는 URLLC 실현을 위한 U-plane latency(예: 다운링크(DL) 및 업링크(UL) 각각 0.5ms 이하, 또는 라운드 트립 6ms 이하)를 지원할 수 있다.
안테나 모듈(197)은 신호 및/또는 전력을 외부(예: 외부의 전자 장치)로 송신하거나, 및/또는 외부로부터 수신할 수 있다. 일실시예에 따르면, 안테나 모듈(197)은 서브스트레이트(예: PCB) 위에 형성된 도전체 및/또는 도전성 패턴으로 이루어진 방사체를 포함하는 안테나를 포함할 수 있다. 일실시예에 따르면, 안테나 모듈(197)은 복수의 안테나들(예: 어레이 안테나)을 포함할 수 있다. 이런 경우, 제1 네트워크(198) 또는 제2 네트워크(199)와 같은 통신 네트워크에서 사용되는 통신 방식에 적합한 적어도 하나의 안테나가, 예를 들면, 통신 모듈(190)에 의하여 상기 복수의 안테나들로부터 선택될 수 있다. 신호 또는 전력은 상기 선택된 적어도 하나의 안테나를 통하여 통신 모듈(190)과 외부의 전자 장치 간에 송신되거나 수신될 수 있다. 어떤 실시예에 따르면, 방사체 이외에 다른 부품(예: RFIC(radio frequency integrated circuit))이 추가로 안테나 모듈(197)의 일부로 형성될 수 있다.
다양한 실시예에 따르면, 안테나 모듈(197)은 mmWave 안테나 모듈을 형성할 수 있다. 일실시예에 따르면, mmWave 안테나 모듈은 인쇄 회로 기판, 상기 인쇄 회로 기판의 제1 면(예: 아래 면)에 또는 그에 인접하여 배치되고 지정된 고주파 대역(예: mmWave 대역)을 지원할 수 있는 RFIC, 및 상기 인쇄 회로 기판의 제2 면(예: 윗 면 또는 측 면)에 또는 그에 인접하여 배치되고 상기 지정된 고주파 대역의 신호를 송신 또는 수신할 수 있는 복수의 안테나들(예: 어레이 안테나)을 포함할 수 있다.
상기 구성요소들 중 적어도 일부는 주변 기기들간 통신 방식(예: 버스, GPIO(general purpose input and output), SPI(serial peripheral interface), 또는 MIPI(mobile industry processor interface))을 통해 서로 연결되고 신호(예: 명령 또는 데이터)를 상호간에 교환할 수 있다.
일실시예에 따르면, 명령 또는 데이터는 제2 네트워크(199)에 연결된 서버(108)를 통해서 전자 장치(101)와 전자 장치(104)간에 송신 및/또는 수신될 수 있다. 전자 장치(102), 및 전자 장치(104) 각각은 전자 장치(101)와 동일한 또는 다른 종류의 장치일 수 있다. 일실시예에 따르면, 전자 장치(101)에서 실행되는 동작들의 전부 또는 일부는 전자 장치(102), 전자 장치(104), 및 서버(108) 중 하나 이상에서 실행될 수 있다. 예를 들면, 전자 장치(101)가 어떤 기능이나 서비스를 자동으로, 또는 사용자 또는 다른 장치로부터의 요청에 반응하여 수행해야 할 경우에, 전자 장치(101)는 기능 및/또는 서비스를 자체적으로 실행시키는 대신에 또는 추가적으로, 하나 이상의 외부의 전자 장치들에게 그 기능 또는 그 서비스의 적어도 일부를 수행하라고 요청할 수 있다. 상기 요청을 수신한 하나 이상의 외부의 전자 장치들은 요청된 기능 또는 서비스의 적어도 일부, 또는 상기 요청과 관련된 추가 기능 또는 서비스를 실행하고, 그 실행의 결과를 전자 장치(101)로 전달할 수 있다. 전자 장치(101)는 상기 결과를, 그대로 또는 추가적으로 처리하여, 상기 요청에 대한 응답의 적어도 일부로서 제공할 수 있다. 이를 위하여, 예를 들면, 클라우드 컴퓨팅, 분산 컴퓨팅, 모바일 에지 컴퓨팅(MEC: mobile edge computing), 및/또는 클라이언트-서버 컴퓨팅 기술이 이용될 수 있다. 전자 장치(101)는, 예를 들어, 분산 컴퓨팅 및/또는 모바일 에지 컴퓨팅을 이용하여 초저지연 서비스를 제공할 수 있다. 다른 실시예에 있어서, 전자 장치(104)는 IoT(internet of things) 기기를 포함할 수 있다. 서버(108)는 기계 학습 및/또는 신경망을 이용한 지능형 서버일 수 있다. 일실시예에 따르면, 전자 장치(104) 및/또는 서버(108)는 제2 네트워크(199) 내에 포함될 수 있다. 전자 장치(101)는 5G 통신 기술 및 IoT 관련 기술을 기반으로 지능형 서비스(예: 스마트 홈, 스마트 시티, 스마트 카, 또는 헬스 케어)에 적용될 수 있다.
도 2a는 제1 상태 내의 예시적인 전자 장치(101)의 평면도(top plan view)이다.
도 2a를 참조하면, 전자 장치(101)는, 일 실시예에 따르면, 제1 하우징 파트(210), y축에 평행한 제1 방향(261) 또는 y축에 평행하고 제1 방향(261)에 반대인 제2 방향(262)으로 제1 하우징 파트(210)에 대하여 이동가능한 제2 하우징 파트(220), 및 디스플레이(230)(예: 도 1의 상기 디스플레이 모듈(160))를 포함할 수 있다.
예를 들면, 전자 장치(101)는, 상기 제1 상태 내에서 있을 수 있다. 예를 들면, 상기 제1 상태 내에서, 제2 하우징 파트(220)은 제1 방향(261)으로 제1 하우징 파트(210)에 대하여 이동 가능할 수 있다. 예를 들면, 상기 제1 상태 내에서, 제2 하우징 파트(220)은, 제1 하우징 파트(210)에 대하여 제2 방향(262)으로 이동 가능하지 않을 수 있다.
예를 들면, 상기 제1 상태 내에서, 디스플레이(230)는, 다른 상태(예: 제2 상태)의 표시 영역보다 작은 표시 영역을 제공할 수 있다. 예를 들면, 상기 제1 상태 내에서, 상기 표시 영역은, 영역(230a)에 대응할 수 있다. 예를 들면, 상기 제1 상태 내에서, 상기 표시 영역인 영역(230a)과 다른 디스플레이(230)의 영역(예: 도 2c의 영역(230b))은 제1 하우징 파트(210) 내에 포함될 수 있다. 예를 들면, 상기 제1 상태 내에서, 상기 영역(예: 도 2c의 영역(230b))은, 제1 하우징 파트(210)에 의해 가려질 수 있다. 예를 들면, 상기 제1 상태 내에서, 상기 영역은, 제1 하우징 파트(210) 안으로 말릴 수 있다. 예를 들면, 상기 제1 상태 내에서, 영역(230a)은, 곡면 부분(curved portion)을 포함하지 않고, 평면 부분(planar portion)을 포함할 수 있다. 하지만, 이에 제한되지 않는다. 예를 들면, 영역(230a)은, 상기 제1 상태 내에서, 상기 평면 부분으로부터 연장되고, 엣지(edge) 부분 내에서 위치되는, 곡면 부분을 포함할 수도 있다.
예를 들면, 상기 제1 상태는, 제2 하우징 파트(220)의 적어도 일부가 제1 하우징 파트(210) 내에 위치된다는 측면에서 슬라이드-인 상태 또는 닫힌 상태로 참조될 수 있다. 예를 들면, 상기 제1 상태는, 가장 작은 사이즈를 가지는 상기 표시 영역을 제공한다는 측면에서, 축소 상태로 참조될 수 있다. 하지만, 이에 제한되지 않는다.
예를 들면, 제1 하우징 파트(210)은, 영역(230a)의 일부를 통해 노출되고, z축에 평행한 제3 방향(263)을 향하는, 카메라 모듈(180, 도 1 참조) 내의 제1 이미지 센서(250-1)를 포함할 수 있다. 예를 들면, 제2 하우징 파트(220)은, 제2 하우징 파트(220)의 일부를 통해 노출되고, z축에 평행하고 제3 방향(263)에 반대인 제4 방향(264)을 향하는, 카메라 모듈(180) 내의 하나 이상의 제2 이미지 센서들을 포함할 수 있다. 예를 들면, 상기 하나 이상의 제2 이미지 센서들은, 도 2b의 설명을 통해 이해될 수 있다.
도 2b는 제1 상태 내의 예시적인 전자 장치의 저면도(bottom view)이다.
도 2b를 참조하면, 상기 제1 상태 내에서, 제2 하우징 파트(220) 내에 배치된 하나 이상의 제2 이미지 센서들(250-2)은, 하나 이상의 제2 이미지 센서들(250-2)을 위해 제1 하우징 파트(210) 내에 배치된 구조 안에(within) 위치될 수 있다. 예를 들면, 전자 장치(101)의 외부로부터의 광은, 상기 제1 상태 내에서, 상기 구조를 통해 하나 이상의 제2 이미지 센서들(250-2)에 수신될 수 있다. 예를 들면, 하나 이상의 제2 이미지 센서들(250-2)은, 상기 제1 상태 내에서 상기 구조 안에 위치되기 때문에, 하나 이상의 제2 이미지 센서들(250-2)은, 상기 제1 상태 내에서 상기 구조를 통해 노출될 수 있다. 예를 들면, 상기 구조는, 다양하게 구현될 수 있다. 예를 들면, 상기 구조는, 개구 또는 노치일 수 있다. 예를 들면, 상기 구조는, 제2 하우징 파트(220)의 적어도 일부를 감싸는 제1 하우징 파트(210)의 플레이트(212) 내의 개구(212a)일 수 있다. 하지만, 이에 제한되지 않는다. 예를 들면, 상기 제1 상태 내에서, 제2 하우징 파트(220) 내에 포함된 하나 이상의 제2 이미지 센서들(250-2)은, 제1 하우징 파트(210)의 플레이트(212)의 적어도 일부에 의해 가려질 수 있다.
일 실시예에 따르면, 상기 제1 상태는, 상기 제2 상태로 변경될 수 있다.
예를 들면, 상기 제1 상태(또는 상기 제2 상태)는, 상기 제1 상태와 상기 제2 상태 사이의 하나 이상의 중간 상태들을 통해, 상기 제2 상태(또는 상기 제1 상태)로 변경될 수 있다.
예를 들면, 상기 제1 상태(또는 상기 제2 상태)는, 미리 정의된 사용자 입력에 기반하여, 상기 제2 상태(또는 상기 제1 상태)로 변경될 수 있다. 예를 들면, 상기 제1 상태(또는 상기 제2 상태)는, 제1 하우징 파트(210)의 일부 또는 제2 하우징 파트(220)의 일부를 통해 노출된 물리적 버튼에 대한 사용자 입력에 응답하여, 상기 제2 상태(또는 상기 제1 상태)로 변경될 수 있다. 예를 들면, 상기 제1 상태(또는 상기 제2 상태)는, 상기 표시 영역 내에서 표시된, 실행가능한 객체에 대한 터치 입력에 응답하여, 상기 제2 상태(또는 상기 제1 상태)로 변경될 수 있다. 예를 들면, 상기 제1 상태(또는 상기 제2 상태)는, 상기 표시 영역 상에서 접촉점을 가지고 기준 강도 이상의 누름 강도를 가지는 터치 입력에 응답하여, 상기 제2 상태(또는 상기 제1 상태)로 변경될 수 있다. 예를 들면, 상기 제1 상태(또는 상기 제2 상태)는, 전자 장치(101)의 마이크로폰을 통해 수신된 음성 입력에 응답하여, 상기 제2 상태(또는 상기 제1 상태)로 변경될 수 있다. 예를 들면, 상기 제1 상태(또는 상기 제2 상태)는, 제1 하우징 파트(210)에 대하여 제2 하우징 파트(220)을 이동하기 위해 제1 하우징 파트(210) 및/또는 제2 하우징 파트(220)에 적용된 외력(force)에 응답하여, 상기 제2 상태(또는 상기 제1 상태)로 변경될 수 있다. 예를 들면, 상기 제1 상태(또는 상기 제2 상태)는, 전자 장치(101)와 연결된 외부 전자 장치(예: 이어버드(earbuds) 또는 스마트 워치(smart watch))에서 식별된 사용자 입력에 응답하여, 상기 제2 상태(또는 상기 제1 상태)로 변경될 수 있다. 하지만, 이에 제한되지 않는다.
상기 제2 상태는, 도 2c 및 도 2d의 설명을 통해 이해될 수 있다.
도 2c는 제2 상태 내의 예시적인 전자 장치의 평면도이다.
도 2c를 참조하면, 전자 장치(101)는, 상기 제2 상태 내에서 있을 수 있다. 예를 들면, 상기 제2 상태 내에서, 제2 하우징 파트(220)는 제2 방향(262)으로 제1 하우징 파트(210)에 대하여 이동가능할 수 있다. 예를 들면, 상기 제2 상태 내에서, 하우징의 제2 하우징 파트(220)가 제2 방향(262)으로 이동됨에 따라 전자 장치(101)의 볼륨이 축소될 수 있다. 예를 들면, 상기 제2 상태 내에서, 제2 하우징 파트(220)는, 제1 하우징 파트(210)에 대하여 제1 방향(261)으로 이동되지 않을 수 있다.
일 실시예에 따르면, 상기 제2 상태 내에서, 디스플레이(230)는, 가장 큰 사이즈를 가지는 상기 표시 영역을 제공할 수 있다. 예를 들면, 상기 제2 상태 내에서, 상기 표시 영역은, 영역(230a) 및 영역(230b)을 포함하는 영역(230c)에 대응할 수 있다. 예를 들면, 상기 제1 상태 내에서 제1 하우징 파트(210) 내에 포함되었던 영역(230b)은, 상기 제2 상태 내에서 노출될 수 있다. 일 실시예에 따르면 제1 상태에서 제2 하우징 파트(220)가 제1 방향(261)으로 이동함에 따라 상기 디스플레이(230)의 적어도 일부 영역(예: 영역(230b))은 사용자가 볼 수 있도록 외부로 노출될 수 있다. 예를 들면, 상기 제2 상태 내에서, 영역(230a)은, 평면 부분을 포함할 수 있다. 하지만, 이에 제한되지 않는다. 예를 들면, 영역(230a)은, 상기 평면 부분으로부터 연장되고, 엣지 부분 내에서 위치되는 곡면 부분을 포함할 수도 있다. 일 실시예에 따라, 상기 제2 상태 내에서, 영역(230b)은, 상기 제1 상태 내에서의 영역(230a)과 달리, 평면 부분을 포함할 수 있다. 하지만, 이에 제한되지 않는다. 예를 들면, 영역(230b)은, 영역(230b)의 상기 평면 부분으로부터 연장되고, 엣지 부분 내에서 위치되는 곡면 부분을 포함할 수도 있다.
일 실시예에 따라, 상기 제2 상태는, 제2 하우징 파트(220)의 적어도 일부가 제1 하우징 파트(210)의 외부에 위치된다는 측면에서 슬라이드-아웃 상태 또는 열린 상태로 참조될 수 있다. 예를 들면, 상기 제2 상태는, 가장 큰 사이즈를 가지는 상기 표시 영역을 제공한다는 측면에서, 확장 상태로 참조될 수 있다. 하지만, 이에 제한되지 않는다.
일 실시 예에서, 제3 방향(263, 예: 전자 장치(101)의 후면 방향)을 향하는 제1 이미지 센서(250-1)는, 전자 장치(101)의 상태가 상기 제1 상태로부터 상기 제2 상태로 변경될 시, 제1 방향(261)로의 제2 하우징 파트(220)의 이동에 따라, 영역(230a)과 함께 이동될 수 있다. 예를 들면, 제4 방향(264, 예: 전자 장치(101)의 전면 방향)을 향하는 하나 이상의 제2 이미지 센서들(250-2)은, 전자 장치(101)의 상태가 상기 제1 상태로부터 상기 제2 상태로 변경될 시, 제1 방향(261)로의 제2 하우징 파트(220)의 이동에 따라, 이동될 수 있다. 예를 들면, 하나 이상의 제2 이미지 센서들(250-2)과 도 2b의 설명을 통해 예시된 상기 구조 사이의 상대적 위치 관계는, 하나 이상의 제2 이미지 센서들(250-2)의 상기 이동에 따라, 변경될 수 있다. 예를 들면, 상기 상대적 위치 관계의 상기 변경은, 도 2d에 기반하여 이해될 수 있다.
도 2d는 제2 상태 내의 예시적인 전자 장치의 저면도이다.
도 2d를 참조하면, 상기 제2 상태 내에서, 하나 이상의 제2 이미지 센서들(250-2)은, 상기 구조 밖에 위치될 수 있다. 예를 들면, 상기 제2 상태 내에서, 하나 이상의 제2 이미지 센서들(250-2)은, 플레이트(212) 내의 개구(212a) 밖에 위치될 수 있다. 예를 들면, 하나 이상의 제2 이미지 센서들(250-2)은 상기 제2 상태 내에서 개구(212a) 밖에 위치되기 때문에, 하나 이상의 제2 이미지 센서들(250-2)은 상기 제2 상태 내에서 노출될 수 있다. 예를 들면, 하나 이상의 제2 이미지 센서들(250-2)은, 상기 제2 상태 내에서 상기 구조 밖에 위치되기 때문에, 상기 제2 상태 내에서의 상기 상대적 위치 관계는, 상기 제1 상태 내에서의 상기 상대적 위치 관계와 다를 수 있다.
일 실시 예에서, 전자 장치(101)가 개구(212a)와 같은 상기 구조를 포함하지 않는 경우, 상기 제2 상태 내에서의 하나 이상의 제2 이미지 센서들(250-2)은, 상기 제1 상태 내에서의 하나 이상의 제2 이미지 센서들(250-2)과 달리, 노출될 수 있다. 예를 들어, 제1 상태 내에서 하나 이상의 제2 이미지 센서들(250-2)는 개구(212a)가 없기 때문에 플레이트(212)를 통해서 노출되지 않고, 제1 하우징 파트(210)에 의하여 가려지거나, 및/또는 플레이트(212)에 의하여 가려질 수 있다.
실시 예들에 따라, 전자 장치(101)는, 상기 제1 상태 및 상기 제2 상태 사이의 중간 상태 내에서 있을 수 있다. 일 실시예에 따르면, 상기 중간 상태 내에서의 상기 표시 영역의 사이즈는, 상기 제1 상태 내에서의 상기 표시 영역의 사이즈보다 크고, 상기 제2 상태 내에서의 상기 표시 영역의 사이즈보다 작을 수 있다. 일 실시예에 따르면, 상기 중간 상태 내에서의 상기 표시 영역은, 영역(230a) 및 영역(230b)의 일부를 포함하는 영역에 대응할 수 있다. 예를 들면, 상기 중간 상태 내에서, 영역(230b)의 일부는 노출되고, 영역(230b)의 다른 일부(또는 남은 일부)는, 제1 하우징 파트(210)에 의해 가려지거나 제1 하우징 파트(210) 안으로 말릴 수 있다. 하지만, 실시 예들이 이에 제한되지 않는다. 일 실시예에 따르면, 제2 하우징 파트(220)가 제1 방향(261)으로 이동함에 따라, 상기 중간 상태 내에서의 상기 표시 영역의 사이즈는 점점 커질 수 있다. 일 실시예에 따르면, 제2 하우징 파트(220)가 제2 방향(262)으로 이동함에 따라, 상기 중간 상태 내에서의 상기 표시 영역의 사이즈는 점점 작아질 수 있다.
다시 도 1을 참조하면, 전자 장치(101)는, 전자 장치(101)의 제1 하우징(예: 도 2c의 제1 하우징 파트(210))에 대하여 전자 장치(101)의 제2 하우징(예: 도 2c의 제2 하우징 파트(220))을 이동하기 위한 구조들을 포함할 수 있다. 예를 들면, 상기 구조들은, 도 3a 및 도 3b의 설명을 통해 이해될 수 있다.
도 3a는 예시적인 전자 장치의 분해 사시도(exploded perspective view)이다. 도 3b는 예시적인 전자 장치의 분해 사시도이다.
도 3a 및 도 3b를 참조하면, 전자 장치(101)는, 제1 하우징 파트(210), 제2 하우징 파트(220), 디스플레이(230), 및 구동부(360)를 포함할 수 있다.
일 실시예에 따라, 제1 하우징 파트(210)은, 북 커버(311), 플레이트(212), 및 프레임 커버(313)를 포함할 수 있다.
일 실시예에 따라, 북 커버(311)는, 전자 장치(101)의 외면의 측면 부분을 적어도 부분적으로(at least partially) 형성할 수 있다. 예를 들면, 북 커버(311)는, 상기 외면의 후면 부분을 적어도 부분적으로 형성할 수 있다. 예를 들면, 북 커버(311)는, 하나 이상의 제2 이미지 센서들(250-2)을 위한 적어도 하나의 개구(311a)를 포함할 수 있다. 예를 들면, 북 커버(311)는, 플레이트(212)를 지지하는 면을 포함할 수 있다. 예를 들면, 북 커버(311)는, 플레이트(212)와 결합될 수 있다. 예를 들면, 북 커버(311)는, 프레임 커버(313)를 포함할 수 있다. 예를 들면, 북 커버(311)는, 프레임 커버(313)와 결합될 수 있다.
일 실시예에 따르면, 플레이트(212)는, 상기 외면의 후면 부분을 적어도 부분적으로 형성할 수 있다. 예를 들면, 플레이트(212)는, 하나 이상의 제2 이미지 센서들(250-2)을 위한 적어도 하나의 개구(212a)를 포함할 수 있다. 예를 들면, 플레이트(212)는, 북 커버(311)의 상기 면 상에 배치될 수 있다. 예를 들면, 개구(212a)는, 개구(311a)와 정렬될 수 있다.
일 실시예에 따르면, 프레임 커버(313)는, 북 커버(311)에 의해 적어도 부분적으로 감싸질(surrounded) 수 있다.
일 실시예에 따르면, 프레임 커버(313)는, 디스플레이(230)에 의해 적어도 부분적으로 감싸질 수 있다. 예를 들면, 프레임 커버(313)는, 디스플레이(230)에 의해 적어도 부분적으로 감싸지지만, 프레임 커버(313)의 위치는, 디스플레이(230)의 이동과 독립적으로, 유지될 수 있다. 예를 들면, 프레임 커버(313)는, 디스플레이(230)의 구성요소들 중 적어도 일부와 관련하여, 배열될(arranged) 수 있다. 예를 들면, 프레임 커버(313)는, 디스플레이(230)의 적어도 하나의 구성요소의 이동의 경로를 제공하는(또는 가이드하는) 레일들(313a)을 포함할 수 있다.
일 실시예에 따르면, 프레임 커버(313)는, 전자 장치(101)의 적어도 하나의 구성요소와 결합될 수 있다. 예를 들면, 프레임 커버(313)는, 재충전가능한(rechargeable) 배터리(예: 배터리(319))를 지지할 수 있다. 예를 들면, 배터리(319)는, 프레임 커버(313)의 면(313b) 내의 리세스(recess) 또는 홀(hole)을 통해 지지될 수 있다. 예를 들면, 프레임 커버(313)는, 프레임 커버(313) 상의 면 상에서, FPCB(flexible printed circuit board)(325)의 일 단과 결합될 수 있다. 일 실시예에 따르면, FPCB(325)의 다른 단은, 적어도 하나의 커넥터를 통해 PCB(324)와 연결될 수 있다. 예를 들면, PCB(324)는, FPCB(325)를 통해서, 모터(361)로 전력을 공급하는 다른 PCB와 전기적으로 연결될 수 있다.
일 실시예에 따르면, 프레임 커버(313)는, 상기 제1 상태 및 상기 제2 상태를 포함하는 복수의 상태들을 위한 전자 장치(101)의 적어도 하나의 구조와 결합될 수 있다. 예를 들면, 프레임 커버(313)는, 구동부(360)의 모터(361)를 고정시킬(fasten) 수 있다.
일 실시예에 따르면, 제2 하우징 파트(220)은, 프런트 커버(321) 및 슬라이드 커버(322)를 포함할 수 있다.
일 실시예에 따르면, 프런트 커버(321)는, 디스플레이(230)에 의해 적어도 부분적으로 감싸질 수 있다. 예를 들면, 프런트 커버(321)는, 디스플레이(230)가 제1 하우징 파트(210)에 대하여 이동되는 제2 하우징 파트(220)에 따라 이동되도록, 프레임 커버(313)와 달리, 프런트 커버(321)를 감싸는 디스플레이(230)의 영역(230a)의 적어도 일부와 결합될 수 있다.
일 실시예에 따르면, 프런트 커버(321)는, 전자 장치(101)의 적어도 하나의 구성요소와 결합될 수 있다. 예를 들면, 프런트 커버(321)는, 전자 장치(101)의 구성요소들을 포함하는 PCB(printed circuit board)(324)와 결합될 수 있다. 예를 들면, PCB(324)는, 프로세서(120)(도1 참조)를 포함할 수 있다. 예를 들면, 프런트 커버(321)는, 하나 이상의 제2 이미지 센서들(250-2)을 포함할 수 있다.
일 실시예에 따르면, 프런트 커버(321)는, 상기 제1 상태 및 상기 제2 상태를 포함하는 복수의 상태들을 위한 전자 장치(101)의 적어도 하나의 구조와 결합될 수 있다. 예를 들면, 프런트 커버(321)는, 구동부(360)의 랙 기어(363)를 고정시킬 수 있다.
일 실시예에 따르면, 프런트 커버(321)는, 슬라이드 커버(322)와 결합될 수 있다.
일 실시예에 따르면, 슬라이드 커버(322)는, 프런트 커버(321) 내에 결합된 전자 장치(101)의 적어도 하나의 구성요소 및/또는 프런트 커버(321) 내에 결합된 전자 장치(101)의 적어도 하나의 구조를 보호하기 위해, 프런트 커버(321)와 결합될 수 있다. 예를 들면, 슬라이드 커버(322)는, 상기 적어도 하나의 구성요소를 위한 구조를 포함할 수 있다. 예를 들면, 슬라이드 커버(322)는, 하나 이상의 제2 이미지 센서들(250-2)을 위한 하나 이상의 개구들(328)을 포함할 수 있다. 예를 들면, 하나 이상의 개구들(328)은, 프런트 커버(321) 상에 배치된 하나 이상의 제2 이미지 센서들(250-2)과 정렬될 수 있다. 예를 들면, 하나 이상의 개구들(328) 각각의 사이즈는, 하나 이상의 제2 이미지 센서들(250-2) 각각의 사이즈에 대응할 수 있다.
일 실시예에 따르면, 디스플레이(230)는, 지지 부재(331)를 포함할 수 있다. 예를 들면, 지지 부재(331)는, 복수의 바들을 포함할 수 있다. 예를 들면, 상기 복수의 바들은, 서로 결합될 수 있다.
일 실시예에 따르면, 구동부(360)는, 모터(361), 피니언 기어(362), 및 랙 기어(363)를 포함할 수 있다.
일 실시예에 따르면, 모터(361)는, 배터리(319)로부터의 전력에 기반하여, 동작할 수 있다. 예를 들면, 상기 전력은, 상기 미리 정의된 사용자 입력에 응답하여, 모터(361)에게 제공될 수 있다.
일 실시예에 따르면, 피니언 기어(362)는, 모터(361)와 샤프트를 통해 결합될 수 있다. 예를 들면, 피니언 기어(362)는, 상기 샤프트를 통해 전달되는 모터(361)의 상기 동작에 기반하여, 회전될 수 있다.
일 실시예에 따르면, 랙 기어(363)는, 피니언 기어(362)와 관련하여 배열될 수 있다. 예를 들면, 랙 기어(363)의 이들(teeth)은 피니언 기어(362)의 이들과 맞물릴 수 있다. 예를 들면, 랙 기어(363)는, 피니언 기어(362)의 회전에 따라, 제1 방향(261) 또는 제2 방향(262)으로 이동될 수 있다. 예를 들면, 제2 하우징 파트(220)은, 모터(361)의 상기 동작으로 인한 피니언 기어(362)의 상기 회전에 따라 이동되는 랙 기어(363)에 의해, 제1 방향(261) 및 제2 방향(262)으로 이동될 수 있다. 예를 들면, 전자 장치(101)의 상기 제1 상태는, 제1 방향(261)으로의 제2 하우징 파트(220)의 상기 이동을 통해, 상기 제1 상태와 다른 상태(예: 상기 하나 이상의 중간 상태들 또는 상기 제2 상태)로 변경될 수 있다. 예를 들면, 전자 장치(101)의 상기 제2 상태는, 제2 방향(262)으로의 제2 하우징 파트(220)의 상기 이동을 통해, 상기 제2 상태와 다른 상태(예: 상기 하나 이상의 중간 상태들 또는 상기 제1 상태)로 변경될 수 있다. 예를 들면, 상기 제1 상태가 구동부(360)에 의해 상기 제2 상태로 변경되는 것 및 상기 제2 상태가 구동부(360)에 의해 상기 제1 상태로 변경되는 것은, 도 4a 및 도 4b를 통해 이해될 수 있다.
도 4a는, 제1 상태 내의 예시적인 전자 장치의 단면도(cross-sectional view)이다. 도 4b는, 제2 상태 내의 예시적인 전자 장치의 단면도이다.
도 4a 및 도 4b를 참조하면, 모터(361)는, 제1 상태(490) 내에서 수신되는 상기 미리 정의된 사용자 입력에 적어도 일부 기반하여, 동작될 수 있다. 예를 들면, 피니언 기어(362)는, 모터(361)의 상기 동작에 적어도 일부 기반하여, 제1 회전 방향(411)으로 회전될 수 있다. 예를 들면, 랙 기어(363)는, 제1 회전 방향(411)으로의 피니언 기어(362)의 상기 회전에 적어도 일부 기반하여, 제1 방향(261)으로 이동될 수 있다. 예를 들면, 제2 하우징 파트(220) 내의 프런트 커버(321)는 랙 기어(363)를 고정시키기 때문에, 제2 하우징 파트(220)은, 제1 방향(261)으로의 랙 기어(363)의 상기 이동에 적어도 일부 기반하여, 제1 방향(261)으로 이동될 수 있다. 예를 들면, 제2 하우징 파트(220) 내의 프런트 커버(321)는, 디스플레이(230)의 영역(230a)의 적어도 일부와 결합되고, 랙 기어(363)를 고정시키기 때문에, 디스플레이(230)는, 제1 방향(261)으로의 랙 기어(363)의 상기 이동에 적어도 일부 기반하여, 이동될 수 있다. 예를 들면, 디스플레이(230)는, 레일들(313a)을 따라(along) 이동될 수 있다. 예를 들면, 디스플레이(230)의 지지 부재(331)의 상기 복수의 바들의 적어도 일부의 형상은, 제1 상태(490)가 상기 제2 상태(495)로 변경될 시, 변경될 수 있다.
일 실시 예에서, 디스플레이(230)의 영역(230b)는, 디스플레이(230)의 상기 이동에 따라, 이동될 수 있다. 예를 들면, 영역(230b)은, 제1 상태(490)가 상기 미리 정의된 사용자 입력에 따라 제2 상태(495)로 변경될 시, 북 커버(311)와 프레임 커버(313) 사이의 공간을 통해 이동될 수 있다. 예를 들면, 제2 상태(495) 내에서의 영역(230b)은, 제1 상태(490) 내에서 상기 공간 안으로 말려진(rolled into) 영역(230b)과 달리, 노출될 수 있다.
일 실시 예에서, 제2 하우징 파트(220) 내의 프런트 커버(321)는, FPCB(325)의 상기 다른 단과 연결된 PCB(324)와 결합되고, 랙 기어(363)를 고정시키기 때문에, FPCB(325)의 형상은, 전자 장치의 상태가 제1 상태(490)에서 제2 상태(495)로 변경될 시, 변경될 수 있다.
모터(361)는, 제2 상태(495) 내에서 수신되는 상기 미리 정의된 사용자 입력에 적어도 일부 기반하여, 동작될 수 있다. 예를 들면, 피니언 기어(362)는, 모터(361)의 상기 동작에 적어도 일부 기반하여, 제2 회전 방향(412)으로 회전될 수 있다. 예를 들면, 랙 기어(363)는, 제2 회전 방향(412)으로의 피니언 기어(362)의 상기 회전에 적어도 일부 기반하여, 제2 방향(262)으로 이동될 수 있다. 예를 들면, 제2 하우징 파트(220) 내의 프런트 커버(321)는 랙 기어(363)를 고정시키기 때문에, 제2 하우징 파트(220)는, 제2 방향(262)으로의 랙 기어(363)의 상기 이동에 적어도 일부 기반하여, 제2 방향(262)으로 이동될 수 있다. 예를 들면, 제2 하우징 파트(220) 내의 프런트 커버(321)는, 디스플레이(230)의 영역(230a)의 적어도 일부와 결합되고, 랙 기어(363)를 고정시키기 때문에, 디스플레이(230)는, 제2 방향(262)으로의 랙 기어(363)의 상기 이동에 적어도 일부 기반하여, 이동될 수 있다. 예를 들면, 디스플레이(230)는, 레일들(313a)을 따라(along) 이동될 수 있다. 예를 들면, 디스플레이(230)의 지지 부재(331)의 상기 복수의 바들의 적어도 일부의 형상은, 제2 상태(495)가 제1 상태(490)로 변경될 시, 변경될 수 있다. 예를 들어 제2 상태(495)에서 제2 하우징 파트(220)가 제2 방향(262)으로 이동함에 따라, 지지 부재(331)의 상기 복수의 바들은 디스플레이(230)의 적어도 일부 영역이 휘어짐에 따라 바들도 휘어지거나, 또는 휘어짐을 지지하도록 위치, 형태 또는 간격이 변경될 수 있다.
일 실시예에 따라, 디스플레이(230)의 영역(230b)는, 디스플레이(230)의 상기 이동에 따라, 이동될 수 있다. 예를 들면, 영역(230b)은, 제2 상태(495)가 상기 미리 정의된 사용자 입력에 따라 제1 상태(490)로 변경될 시, 북 커버(311)와 프레임 커버(313) 사이의 공간을 통해 이동될 수 있다. 예를 들면, 제1 상태(490) 내에서의 영역(230b)은, 제2 상태(495) 내에서 노출되는 영역(230b)과 달리, 상기 공간 안으로 말려질(rolled into) 수 있다.
일 실시예에 따라, 제2 하우징 파트(220) 내의 프런트 커버(321)는, FPCB(325)의 상기 다른 단과 연결된 PCB(324)와 결합되고, 랙 기어(363)를 고정시키기 때문에, FPCB(325)의 형상은, 제2 상태(495)가 제1 상태(490)로 변경될 시, 변경될 수 있다.
도 2a 내지 도 4b는, 포트레이트 모드(portrait mode) 내에서 상기 제1 상태(또는 상기 제2상태)가 상기 제2 상태(또는 상기 제1 상태)로 변경될 시 상기 표시 영역의 높이(height)가 변경되고 상기 표시 영역의 폭(width)이 유지되는 전자 장치(101)를 도시하고 있으나, 이는 설명의 편의를 위한 것이다. 예를 들면, 전자 장치(101)는, 상기 포트레이트 모드 내에서 상기 제1 상태(또는 상기 제2상태)가 상기 제2 상태(또는 상기 제1 상태)로 변경될 시, 상기 표시 영역의 높이가 유지되고 상기 표시 영역의 폭이 변경되는 것으로, 구현될 수 있다.
도 5는 전자 장치의 개략적인 블록도이다. 도 6a는 일 실시 예에 따른, 전자 장치의 축소 상태에서 표시되는 UI(user interface)의 레이아웃의 일 예를 도시하는 도면이다. 도 6b는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다. 도 6c는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다. 도 6d는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다.
도 5, 도 6a, 도 6b, 도 6c, 및 도 6d의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 및 도 4b를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다.
도 5를 참조하면, 전자 장치(101)는 프로세서(120), 메모리(130), 디스플레이(230), 및 모터(361)를 포함할 수 있다.
일 실시 예에서, 프로세서(120)는, 디스플레이(230)를 통해 적어도 하나의 객체를 포함하는 화면을 표시할 수 있다. 일 실시 예에서, 화면은 하나 이상의 영역들을 포함할 수 있다. 일 실시 예에서, 하나 이상의 영역들 각각에는 적어도 하나의 객체가 포함될 수 있다. 일 실시 예에서, 하나 이상의 영역들 각각은 뷰 그룹(view group), 또는 윈도우로 지칭될 수 있다. 일 실시 예에서, 적어도 하나의 객체는 UI 요소 및/또는 콘텐트를 포함할 수 있다. 일 실시 예에서, 적어도 하나의 객체는 뷰, 또는 프레임으로 지칭될 수 있다. 일 실시 예에서, UI 요소는 사용자와 인터랙션 가능한 객체(예: 체크 박스, 버튼, 아이콘, 슬라이더, 텍스트 필드, 상태 바, 네비게이션 바)일 수 있다. 일 실시 예에서, 콘텐트는, 텍스트, 이미지, 및/또는 영상을 포함할 수 있다.
일 실시 예에서, 프로세서(120)는, 제1 상태(또는, 슬라이드-인 상태)에서, 디스플레이(230)의 표시 영역(예: 도 2a의 영역(230a))에 화면을 표시할 수 있다.
도 6a의 예시(601)를 참조하면, 전자 장치(101)의 제1 상태(또는, 슬라이드-인 상태)에서, 디스플레이(230)에는, 하나 이상의 영역들(예: 영역(611), 영역(613), 및 영역(615))을 포함하는 화면(610)이 표시될 수 있다. 하나 이상의 영역들이 포함되는 화면은 지정된 좌표, 크기 정보, 구분자, 태그 중 적어도 하나에 의해 구별 가능한 윈도우(또는, 레이어)(또는, 뷰 그룹)(또는, (뷰) 컨테이너)로 지칭될 수 있다. 도 6a에서는, 화면(610) 내의 하나 이상의 영역들(예: 영역(611), 영역(613), 및 영역(615))이 세로 방향으로 배열된 것으로 예시되었으나, 이는 예시일 뿐이다. 일 실시 예에서, 화면(610) 내의 하나 이상의 영역들(예: 영역(611), 영역(613), 및 영역(615))은, 다양한 레이아웃(예: linear layout, relative layout, frame layout, constraint layout, grid layout, table layout)에 따라 배치될 수 있다. 일 실시 예에서, 화면(610) 내의 하나 이상의 영역들(예: 영역(611), 영역(613), 및 영역(615)) 각각에는 적어도 하나의 콘텐트가 포함될 수 있다. 일 실시 예에서, 적어도 하나의 콘텐트는 시각적 객체를 포함할 수 있다. 일 실시 예에서, 시각적 객체는, 텍스트, 이미지, 및/또는 영상을 포함할 수 있다.
일 실시 예에서, 제1 하우징 파트(예: 도 2a의 제1 하우징 파트(210))와 제2 하우징 파트(예: 도 2a의 제2 하우징 파트(220))는 모터(361)의 동력에 의해 제1 상태와 제2 상태 간에 변경될 수 있다. 하지만, 이에 제한되지 않는다. 예를 들면, 제1 하우징 파트(210)와 제2 하우징 파트(220)는 외력(예: 사용자가 잡아당기는 힘, 또는 사용자가 밀어 넣는 힘)에 의해 제1 상태와 제2 상태 간에 변경될 수 있다.
일 실시 예에서, 제1 상태와 제2 상태 간의 변경에 의해, 디스플레이(230)의 표시 영역의 크기는 변경될 수 있다. 일 실시 예에서, 디스플레이(230)의 표시 영역의 크기가 변경됨에 따라, 프로세서(120)는, 디스플레이(230)의 표시 영역에 표시할 화면을 갱신할 수 있다.
일 실시 예에서, 프로세서(120)는, 제2 상태(또는, 슬라이드-아웃 상태)에서, 디스플레이(230)의 표시 영역(예: 도 2c의 영역(230a), 영역(230b), 또는 영역(230c))에 화면을 표시할 수 있다.
일 실시 예에서, 프로세서(120)는, 제1 상태의 화면에 포함된 하나 이상의 영역들이 확대된 화면을 제2 상태에서, 디스플레이(230)의 표시 영역(도 2c의 230c)에 표시할 수 있다. 일 실시 예에서, 제2 상태에서의 하나 이상의 영역들은, 제1 상태에서의 하나 이상의 영역들로부터 확대될 수 있다. 일 실시 예에서, 제2 상태에서의 하나 이상의 영역들은, 제1 상태에서의 화면 영역과 제2 상태에서의 화면 영역 간의 비율만큼 확대될 수 있다. 일 실시 예에서, 제2 상태에서의 확대된 영역에서는, 제1 상태에서의 영역보다 적어도 하나의 콘텐트가 더 표시될 수 있다. 하지만 이에 제한되지 않는다. 일 실시 예에서, 제2 상태에서의 확대된 영역에 포함된 적어도 하나의 콘텐트의 크기는, 예컨대 제1 상태에서의 영역에 포함된 적어도 하나의 콘텐트의 크기보다 크도록 확대(예컨대, 상기 비율만큼 확대)될 수 있다.
도 6b의 예시(603)를 참조하면, 전자 장치(101)의 제2 상태(또는, 슬라이드-아웃 상태)에서, 디스플레이(230)에는, 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615), 영역(617))을 포함하는 화면(610)이 표시될 수 있다. 도 6b의 예시(603)의 화면(610)에는, 도 6a의 예시(601)의 화면(610)보다, 적어도 하나의 영역(예: 영역(617))이 더 표시될 수 있다. 도 6b의 예시(603)의 화면(610)은, 도 6a의 예시(601)의 화면(610)보다 클 수 있다.
일 실시 예에서, 프로세서(120)는, 제1 상태에서의 영역에 추가적인 영역을 포함하는 화면을 제2 상태에서, 디스플레이(230)의 표시 영역(예: 도 2c의 영역(230a) 및 영역(230b))에 표시할 수 있다. 일 실시 예에서, 추가적인 영역은, 제1 상태에서의 영역들의 위에 위치할 수 있다. 일 실시 예에서, 추가적인 영역은, 제1 상태에서의 영역들의 아래에 위치할 수 있다.
도 6c의 예시(605)를 참조하면, 전자 장치(101)의 제2 상태에서, 디스플레이(230)에는, 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615))을 포함하는 화면(610) 및 하나 이상의 영역들(예: 영역(621), 영역(623))을 포함하는 추가 화면(620)이 표시될 수 있다. 도 6c의 예시(605)의 추가 화면(620)은 화면(610)의 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615))의 아래에 위치할 수 있다. 도 6c의 예시(605)의 화면(610)은, 도 6a의 예시(601)의 화면(610)과 동일한 크기를 가질 수 있다.
도 6d의 예시(607)를 참조하면, 전자 장치(101)의 제2 상태에서, 디스플레이(230)에는, 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615))을 포함하는 화면(610) 및 하나 이상의 영역들(예: 영역(631), 영역(633))을 포함하는 화면(630)이 표시될 수 있다. 도 6b의 예시(607)의 화면(630)은 화면(610)의 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615))의 위에 위치할 수 있다. 도 6d의 예시(607)의 화면(610)은, 도 6a의 예시(601)의 화면(610)과 동일한 크기를 가질 수 있다.
상술한 바와 같이, 전자 장치(101)가 제1 상태에서 제2 상태로 변경됨에 따라, 레이아웃의 변경 없이 화면에 포함된 하나 이상의 영역들의 크기를 확대하거나, 또는 화면에 포함된 하나 이상의 영역들의 개수를 변경시키는 경우, 사용자의 의도와 다른 화면이 제2 상태에서 표시될 수 있다. 따라서, 사용자의 의도에 따라, 제2 상태에서 레이아웃의 변경 없이 생성된 화면, 또는 레이아웃의 변경과 함께 생성된 화면 중에서 선택된 화면을 표시하기 위한 방안의 제공이 요구될 수 있다. 이하에서, 도 7a 내지 도 12를 참조하여, 전자 장치(101)가 레이아웃의 변경과 함께 생성된 화면을 표시하기 위한 동작을 설명한다.
도 7a는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다.
도 7a의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5 및 도 6a를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다.
일 실시 예에서, 도 7a의 예시(601)를 참조하면, 전자 장치(101)는, 제1 상태(또는, 슬라이드-인 상태)에서, 표시 영역(예: 도 2a의 영역(230a))에 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615))을 포함하는 화면(610)을 표시하는 동안, 사용자 입력(751)을 획득할 수 있다. 일 실시 예에서, 사용자 입력(751)은, 제1 상태에서 표시되는 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615)) 중 하나의 콘텐트(예: 영역(613) 내의 콘텐트)를 선택하기 위한 입력을 포함할 수 있다. 일 실시 예에서, 사용자 입력(751)은, 제1 상태에서 제2 상태로의 변경을 요청하는 입력을 포함할 수 있다. 일 실시 예에서, 사용자 입력(751)은, 하나의 콘텐트(예: 영역(613) 내의 콘텐트)를 선택하고, 제2 상태로의 변경을 요청하는 입력을 포함할 수 있다. 도 7a에서는, 영역들(예: 영역(611), 영역(613), 영역(615))의 폭이 디스플레이(230)의 영역(230a)의 폭에 대응하는 것으로 도시되었으나, 이는 예시일 뿐이다. 영역들(예: 영역(611), 영역(613), 영역(615))의 폭은 디스플레이(230)의 영역(230a)의 폭보다 짧을 수 있다. 일 실시 예에서, 디스플레이(230)에는 폭 방향으로 둘 이상의 영역들(예: 영역(611), 영역(613), 영역(615))이 배열될 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(751)에 응답하여, 제2 상태(또는, 슬라이드-아웃 상태)에서 선택된 영역(613)이 확대된 화면(610)을 표시할 수 있다. 일 실시 예에서, 선택된 영역(예: 영역613))은 둘 이상의 영역들(예: 영역(611), 영역(613), 영역(615)) 중 상기 사용자 입력(751)이 획득된 위치의 영역일 수 있다. 일 실시 예에서, 선택된 영역(예: 영역613))은 둘 이상의 영역들(예: 영역(611), 영역(613), 영역(615)) 중 상기 사용자 입력(751)이 획득될 때, 지정된 영역에 위치하는 영역일 수 있다. 일 실시 예에서, 지정된 영역은, 둘 이상의 영역들(예: 영역(611), 영역(613), 영역(615))이 제1 크기의 표시 영역에서 표시될 때의 복수의 영역들 중 가운데에 위치하는 영역일 수 있다. 일 실시 예에서, 복수의 영역들은, 디스플레이(230)의 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 따라 배열된 영역들일 수 있다.
일 실시 예에서, 선택된 영역(예: 영역(613))은 선택된 영역(예: 영역(613))의 비율(또는, 종횡비)에 따라, 확대될 수 있다. 일 실시 예에서, 선택된 영역(예: 영역(613))은 선택된 영역(예: 영역(613))에 포함된 콘텐트의 비율(또는, 종횡비)에 따라, 확대될 수 있다. 일 실시 예에서, 선택된 영역(예: 영역(613))은 선택된 영역(예: 영역(613))에 포함된 하나의 시각적 객체(예: 이미지 또는 영상)의 비율(또는, 종횡비)에 따라, 확대될 수 있다. 일 실시 예에서, 선택된 영역(예: 영역(613))의 비율(또는, 종횡비)은 선택된 영역(예: 영역(613))이 표시되는 화면을 생성하는 어플리케이션(146)(또는, 미들 웨어(144))이 지정한 비율(또는, 종횡비)일 수 있다. 여기에서, 선택된 영역(예: 영역(613))의 비율에 따라, 선택된 영역(예: 영역(613))을 확대함은, 제2 상태의 표시 영역(예: 도 2c의 영역(230c))을 벗어나지 않는 최대의 크기로 확대함을 의미할 수 있다. 예를 들면, 디스플레이(230)의 높이 방향의 길이가 폭 방향의 길이보다 길고, 선택된 영역(예: 영역(613))의 가로 길이가 세로 길이보다 긴 경우, 확대된 영역(예: 영역(613))이 제2 상태의 표시 영역(230c)에 표시됨에 따라, 영역(230c)에는 확대된 영역(예: 영역(613))이 표시되는 영역(713)의 위 및/또는 아래에 레터 박스에 해당하는 영역들(예: 영역(711), 영역(715))이 생성될 수 있다. 예를 들면, 디스플레이(230)의 높이 방향의 길이가 폭 방향의 길이보다 길고, 선택된 영역(예: 영역(613))의 세로 길이가 가로 길이보다 긴 경우, 확대된 영역(예: 영역(613))이 제2 상태의 영역(230c)에 표시됨에 따라, 영역(230c)에는 확대된 영역(예: 영역(613))이 표시되는 영역(713)의 왼쪽 및/또는 오른쪽에 필러 박스에 해당하는 영역들이 생성될 수 있다. 일 실시 예에서, 레터 박스 및/또는 필러 박스에는, 제1 상태에서 표시되는 하나 이상의 영역들(예: 영역(611), 영역(613), 및 영역(615)) 중 선택되지 않은 영역들(예: 영역(611), 및 영역(615))이 표시될 수 있다. 일 실시 예에서, 레터 박스 및/또는 필러 박스에는, 제1 상태에서 표시되지 않은 콘텐트들이 표시될 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 영역(예: 영역(613))의 경계를 확대함으로써, 선택된 영역(예: 영역(613))을 확대할 수 있다. 일 실시 예에서, 선택된 영역(예: 영역(613))의 경계를 확대함은, 선택된 영역(예: 영역(613))의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴을 포함할 수 있다. 일 실시 예에서, 선택된 영역(예: 영역(613))의 변들(예: 변(721), 변(725))은 선택된 영역(예: 영역(613))이 배치되는 프레임의 변일 수 있다. 일 실시 예에서, 변들(예: 변(721), 변(725))은 선택된 영역(예: 영역(613))이 배치되는 프레임을 둘러싸는 변들일 수 있다. 일 실시 예에서, 변들(예: 변(721), 변(725))은 디스플레이(230)의 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 수직한 변일 수 있다. 예를 들면, 제1 상태에서 제2 상태로 변경하는 동안, 디스플레이(230)의 표시 영역의 높이가 변경되는 경우, 변들(예: 변(721), 변(725))은 폭 방향으로 연장되는 변일 수 있다. 하지만 이에 제한되지 않는다. 예를 들면, 제1 상태에서 제2 상태로 변경하는 동안, 디스플레이(230)의 표시 영역의 폭이 변경되는 경우, 변들(예: 변(721), 변(725))은 높이 방향으로 연장되는 변일 수 있다. 일 실시 예에서, 선택된 영역(예: 영역(613))의 변들(예: 변(721), 변(725))은 선택된 영역(예: 영역(613))이 배치되는 프레임의 변일 수 있다.
일 실시 예에서, 도 7a의 예시(701)를 참조하면, 전자 장치(101)는, 사용자 입력(751)에 응답하여, 선택된 영역(예: 영역(613))에 기반하여 배열된 화면(610)을 제2 상태에서 표시할 수 있다. 일 실시 예에서, 화면(701)이 선택된 영역(예: 영역(613))을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(613)이 다른 콘텐트들 사이에서 표시됨을 의미할 수 있다. 일 실시 예에서, 선택된 영역(예: 영역(613))이 다른 영역들 사이에서 표시됨은, 선택된 영역(예: 영역(613))이 확대됨에 따라 생성되는 레터 박스 및/또는 필러 박스에 다른 콘텐트들이 표시됨을 의미할 수 있다.
일 실시 예에서, 화면(701)이 선택된 영역(예: 영역(613))을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(613)이 표시 영역(예: 도 2c의 영역(230c))의 중심 위치(740)에 위치함을 의미할 수 있다. 일 실시 예에서, 화면(701)이 선택된 영역(예: 영역(613))을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(613)의 중심 영역(720)이 영역(230c)의 중심 위치(740)를 포함함을 의미할 수 있다. 일 실시 예에서, 제2 상태의 영역(230c)의 중심 위치(740)는, 영역(230c)의 장축(735)의 중심 위치를 포함할 수 있다. 일 실시 예에서, 제2 상태의 영역(230c)의 중심 위치(740)는, 영역(230c)의 단축(730)의 중심 위치를 포함할 수 있다. 일 실시 예에서, 제2 상태의 영역(230c)의 중심 위치(740)는, 영역(230c)의 장축(735)의 중심 위치와 영역(230c)의 단축(730)의 중심 위치가 만나는 지점을 포함할 수 있다. 일 실시 예에서, 제2 상태에서 표시되는 영역(613)은, 제1 상태에서 표시되는 영역(613)의 크기보다 확대된 크기를 가질 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 영역(예: 영역(613))을 다른 콘텐트들 사이에서 표시하기 위해, 선택된 영역(예: 영역(613))을 이동시킬 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 디스플레이(230)의 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 기반하여 선택된 영역(예: 영역(613))을 이동시킬 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 디스플레이(230)의 표시 영역의 높이가 변경되는 경우, 선택된 영역(예: 영역(613))을 높이 방향(예: 도 2a의 제1 방향(261)) 또는 높이 방향의 반대 방향(예: 도 2a의 제2 방향(262))으로 이동시킬 수 있다. 하지만 이에 제한되지 않는다. 예를 들면, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 디스플레이(230)의 표시 영역의 폭이 변경되는 경우, 선택된 영역(예: 영역(613))을 폭 방향 또는 폭 방향의 반대 방향으로 이동시킬 수 있다.
일 실시 예에서, 전자 장치(101)는, 선택된 영역(예: 영역(613))과 영역(230c)의 중심 위치(740) 간의 위치 관계에 기반하여 결정되는 영역(613)의 이동 방향으로, 선택된 영역(예: 영역(613))을 이동시킬 수 있다. 예를 들면, 선택된 영역(예: 영역(613))이 영역(230c)의 중심 위치(740)보다 위에 위치하는 경우, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 영역(613)을 제2 방향(262)으로 이동시킬 수 있다. 예를 들면, 선택된 영역(예: 영역(613))이 영역(230c)의 중심 위치(740)보다 아래에 위치하는 경우, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 영역(예: 영역(613))을 제1 방향(261)로 이동시킬 수 있다. 하지만 이에 제한되지 않는다. 예를 들면, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 디스플레이(230)의 표시 영역의 폭이 변경되는 경우, 선택된 영역(예: 영역(613))이 영역(230c)의 중심 위치(740)의 왼쪽 또는 오른쪽에 위치하느냐에 따라 결정되는 영역(613)의 이동 방향으로, 선택된 영역(예: 영역(613))을 이동시킬 수 있다.
일 실시 예에서, 선택된 영역((예: 영역(613))의 이동은, 영역(613)의 크기를 유지하면서 영역(613)의 표시 위치를 변경하는 것을 포함할 수 있다. 일 실시 예에서, 선택된 영역(예: 영역(613))의 이동은, 영역(613)의 크기를 확대하면서 영역(613)의 표시 위치를 변경하는 것을 포함할 수 있다. 일 실시 예에서, 선택된 영역(예: 영역(613))의 표시 위치를 변경함은, 디스플레이(230)의 영역(230a) 또는 영역(230c) 내에서 영역(613)이 점유하는 영역이 변경됨을 의미할 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택되지 않은 영역들(예: 영역(611), 영역(615)) 중 일부 영역(예: 선택된 영역(예: 영역(613))의 위에 위치하는 영역(611))을 제2 상태에서 영역(613)의 주변에 표시할 수 있다. 일 실시 예에서, 영역(613)의 주변은 레터 박스 및/또는 필러 박스의 영역일 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택되지 않은 영역들(예: 영역(611), 영역(615)) 중 일부 영역(예: 선택된 영역(예: 영역(613))의 위에 위치하는 영역(611))을 제2 상태에서 영역(613)의 위에 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택된 영역(예: 영역(613))의 위에서 표시되는 적어도 하나의 영역(예: 영역(611)) 중 일부 영역(예: 선택된 영역(예: 영역(613))의 위에 위치하는 영역(611))을 제2 상태에서 영역(613)의 위에 표시할 수 있다. 일 실시 예에서, 제2 상태에서 영역(613)의 위에서 표시되는 일부 영역(예: 선택된 영역(예: 영역(613))의 위에 위치하는 영역(611))는 제1 상태에서 영역(613)의 바로 위에 표시된 콘텐트일 수 있다. 일 실시 예에서, 제2 상태에서 영역(613)의 위에서 표시되는 일부 콘텐트(예: 선택된 영역(예: 영역(613))의 위에 위치하는 영역(611) 내의 콘텐트)는 제1 상태에서 영역(613)의 위에 표시된 콘텐트들 중 지정된 종류의 콘텐트일 수 있다. 일 실시 예에서, 지정된 종류의 콘텐트는, 영역(613)에 포함된 콘텐트와 다른 종류의 콘텐트일 수 있다. 일 실시 예에서, 지정된 종류의 콘텐트는, 프로필과 관련된 콘텐트일 수 있다. 일 실시 예에서, 제2 상태에서 표시되는 일부 영역(예: 영역(611))의 크기는 선택된 영역(예: 영역(613))의 제2 상태에서의 크기에 따라 변경될 수 있다. 예를 들면, 제2 상태에서 표시되는 일부 영역(예: 선택된 영역(예: 영역(613))의 위에 위치하는 영역(611))의 크기는 제1 상태에서의 크기보다 줄어들 수 있다. 일 실시 예에서, 제2 상태에서 표시되는 영역(611)에는 제1 상태에서 표시되는 영역(611)에 포함된 콘텐츠의 일부가 포함될 수 있다. 하지만 이에 제한되지 않는다. 예를 들면, 제2 상태에서 표시되는 일부 영역(예: 선택된 영역(예: 영역(613))의 위에 위치하는 영역(611))의 크기는 제1 상태에서의 크기와 동일하거나 또는 커질 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택되지 않은 영역들(예: 영역(611), 영역(615)) 중 일부 영역(예: 선택된 영역(예: 영역(613))의 아래에 위치하는 영역(615))을 제2 상태에서 영역(613)의 아래에 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택된 영역(예: 영역(613))의 아래에서 표시되는 적어도 하나의 영역(예: 영역(615)) 중 일부 영역(예: 선택된 영역(예: 영역(613))의 아래에 위치하는 영역(615))을 제2 상태에서 영역(613)의 아래에 표시할 수 있다. 일 실시 예에서, 제2 상태에서 영역(613)의 아래에서 표시되는 일부 영역(예: 영역(615))은 제1 상태에서 영역(613)의 바로 아래에 표시된 콘텐트일 수 있다. 일 실시 예에서, 제2 상태에서 영역(613)의 아래에서 표시되는 일부 영역(예: 선택된 영역(예: 영역(613))의 아래에 위치하는 영역(615))은 제1 상태에서 영역(예: 영역(613))의 아래에 표시된 콘텐트들 중 지정된 종류의 콘텐트일 수 있다. 예를 들면, 제2 상태에서 표시되는 일부 영역(예: 선택된 영역(예: 영역(613))의 아래에 위치하는 영역(615))의 크기는 제1 상태에서의 크기보다 줄어들 수 있다. 일 실시 예에서, 제2 상태에서 표시되는 영역(615)에는 제1 상태에서 표시되는 영역(615)에 포함된 콘텐츠의 일부가 포함될 수 있다. 하지만 이에 제한되지 않는다. 예를 들면, 제2 상태에서 표시되는 일부 영역(예: 선택된 영역(예: 영역(613))의 아래에 위치하는 영역(615))의 크기는 제1 상태에서의 크기와 동일하거나 또는 커질 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택되지 않은 영역들(예: 영역(611), 영역(615)) 중 다른 일부 영역을 제2 상태에서 표시하지 않을 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 표시되지 않은 적어도 하나의 영역을 제2 상태에서 영역(613)의 주변에 표시할 수 있다. 일 실시 예에서, 영역(613)의 주변은 레터 박스 및/또는 필러 박스의 영역일 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(751)에 응답하여, 제1 상태에서 표시되지 않는 영역을 적어도 하나의 제2 상태에서의 영역(예: 영역(230c))에서 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는 선택된 영역(예: 영역(613))이 영역(230c)에서 표시되는 크기에 따라, 제1 상태에서 표시되지 않는 영역을 제2 상태에서의 영역(230c)에서 표시할 수 있다. 예를 들면, 제1 상태에서 제2 상태로 변경됨에 따라, 영역(613)이 위로 이동되는 경우, 제2 상태에서 적어도 하나의 영역이 영역(613)의 아래에 더 표시될 수 있다. 예를 들면, 제1 상태에서 제2 상태로 변경됨에 따라, 선택된 영역(예: 영역(613))의 영역이 아래로 이동되는 경우, 제2 상태에서 적어도 하나의 영역이 영역(613)의 위에 더 표시될 수 있다.
상술한 바와 같은, 전자 장치(101)는, 사용자의 디스플레이(230)의 표시 영역의 확대를 위한 요청에 기반하여, 표시되는 영역(예: 영역(611), 영역(613), 영역(615)) 중에서 선택된 영역(613)을 확대된 표시 영역의 지정된 위치에서 표시할 수 있다. 전자 장치(101)는, 선택된 영역(예: 영역(613))을 확대된 표시 영역의 지정된 위치에서 표시함으로써, 사용자에게 친화적인 레이아웃을 제공할 수 있다. 이에 따라, 사용자에게 적합한 콘텐츠의 확대 및/또는 위치 이동을 위한 추가적인 사용자의 노력이 요구되지 않을 수 있다.
도 7b는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다.
도 7b의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5 및 도 6a를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다. 도 7a를 참조하여 설명된 내용들은 도 7b에 대한 설명에서 반복되지 않을 수 있다.
도 7a와 비교하여 도 7b는, 사용자가 디스플레이(230)의 표시 영역의 외곽에 위치한 영역을 선택함에 따라 표시되는 UI의 레이아웃의 일 예를 도시한다. 일 실시 예에서, 영역이 표시 영역의 외곽에 위치함은, 영역의 적어도 한 변이 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 수직한 변과 맞닿음을 의미할 수 있다.
일 실시 예에서, 도 7b의 예시(601)를 참조하면, 전자 장치(101)는, 제1 상태(또는, 슬라이드-인 상태)에서, 표시 영역(예: 도 2a의 영역(230a))에 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615))을 포함하는 화면(610)을 포함하는 화면(601)을 표시하는 동안, 사용자 입력(753)을 획득할 수 있다.
일 실시 예에서, 도 7b의 예시(703)를 참조하면, 전자 장치(101)는, 사용자 입력(753)에 응답하여, 제2 상태(또는, 슬라이드-아웃 상태)에서 선택된 영역(611)이 확대된 화면(610)을 표시할 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 영역(예: 영역(611))의 변들(예: 변(721), 변(723)) 중 적어도 하나의 변을 이동시킴으로써, 선택된 영역(예: 영역(611))을 확대할 수 있다. 일 실시 예에서, 영역(611)의 경계를 확대함은, 선택된 영역(예: 영역(611))의 변들(예: 변(721), 변(723)) 중 적어도 하나의 변을 이동시킴을 포함할 수 있다.
일 실시 예에서, 도 7b의 예시(703)를 참조하면, 전자 장치(101)는, 사용자 입력(753)에 응답하여, 선택된 영역(예: 영역(611))에 기반하여 배열된 화면(610)을 제2 상태에서 표시할 수 있다. 일 실시 예에서, 선택된 화면(예: 화면(610))이 선택된 영역(예: 영역(611))을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(611)이 다른 영역들 사이에서 표시됨을 의미할 수 있다. 일 실시 예에서, 선택된 영역(예: 영역(611))이 다른 영역들 사이에서 표시됨은, 영역(611)이 확대됨에 따라 생성되는 레터 박스 및/또는 필러 박스에 다른 콘텐트들이 표시됨을 의미할 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 영역(예: 영역(611))을 다른 콘텐트들 사이에서 표시하기 위해, 영역(611)을 이동시킬 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 디스플레이(230)의 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 기반하여 영역(611)을 이동시킬 수 있다. 도 7b의 예시(702)와 같이, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 영역(예: 영역(611))을 점진적으로 아래로 이동시킬 수 있다. 선택된 영역(예: 영역(611))을 점진적으로 아래로 이동시킴에 따라, 영역(611) 위에 새로운 영역(612)이 더 표시될 수 있다. 하지만 이에 제한되지 않는다. 예를 들면, 사용자 입력(753)에 의해 영역(615)이 선택된 경우, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 영역(예: 영역(615))을 점진적으로 위로 이동시킬 수 있다. 영역(615)을 점진적으로 위로 이동시킴에 따라, 영역(615) 아래에 새로운 영역이 더 표시될 수 있다.
일 실시 예에서, 도 7b의 예시(702)를 참조하면, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 표시 영역의 외곽에 위치하는 영역(611)의 이동에 따라 생성되는 영역(612)에 적어도 하나의 콘텐트를 표시할 수 있다. 일 실시 예에서, 영역(612)은, 제1 상태에서 제2 상태로 변경하는 동안, 콘텐트의 프레임의 적어도 한 변이 맞닿은 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 수직한 변으로부터 떨어짐으로써 생성될 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(753)에 응답하여, 제1 상태에서 표시되지 않는 콘텐트를 적어도 하나의 제2 상태에서의 영역(230c)의 영역(예: 영역(612))에서 표시할 수 있다.
상술한 바와 같은, 전자 장치(101)는, 사용자의 디스플레이(230)의 표시 영역의 확대를 위한 요청에 기반하여, 표시되는 영역(예: 영역(611), 영역(613), 영역(615)) 중에서 선택된 영역(611)을 확대된 표시 영역의 지정된 위치에서 표시할 수 있다. 전자 장치(101)는, 선택된 영역(예: 영역(611))을 지정된 위치로 점진적으로 이동시킴으로써, 사용자에게 부드러운 레이아웃의 변화를 느끼게 할 수 있다. 또한, 전자 장치(101)는, 선택된 영역(예: 영역(611))을 지정된 위치로 점진적으로 이동시킴으로써, 사용자에게 적합한 콘텐츠의 확대 및/또는 위치 이동을 위한 추가적인 사용자의 노력을 요구하지 않을 수 있다.
도 7c는 일 실시 예에 따른, 전자 장치의 확장 상태에서 표시되는 UI의 레이아웃의 일 예를 도시하는 도면이다.
도 7c의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5 및 도 6a를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다. 도 7a 또는 도 7b를 참조하여 설명된 내용들은 도 7c에 대한 설명에서 반복되지 않을 수 있다.
도 7b와 비교하여 도 7c는, 사용자가 디스플레이(230)의 표시 영역에 선택된 영역(611) 대신 다른 영역(예: 영역(614))을 기준으로 배열된 UI의 레이아웃의 일 예를 도시한다. 일 실시 예에서, 다른 영역(예: 영역(614))은, 영역(611)에 맵핑된 컨텐츠를 포함할 수 있다. 일 실시 예에서, 다른 영역(예: 영역(614))은, 영역(611)에 하이퍼링크된 컨텐츠를 포함할 수 있다. 일 실시 예에서, 다른 영역(614)은, 영역(611)에 대한 사용자 입력(755)에 의해, 외부 장치(예: 서버(108), 또는 전자 장치(102), 또는 전자 장치(103))로부터 획득된 컨텐츠를 포함할 수 있다.
일 실시 예에서, 도 7c의 예시(601)를 참조하면, 전자 장치(101)는, 제1 상태(또는, 슬라이드-인 상태)에서, 표시 영역(예: 도 2a의 영역(230a))에 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615))을 포함하는 화면(610)을 표시하는 동안, 사용자 입력(755)을 획득할 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(755)에 응답하여, 영역(611)에 맵핑된 콘텐트를 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 사용자 입력(755)에 응답하여, 영역(611)에 하이퍼링크된 콘텐트를 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 영역(611)에 대한 사용자 입력(755)에 응답하여, 외부 장치(예: 서버(108), 또는 전자 장치(102), 또는 전자 장치(103))로부터 컨텐츠를 획득할 수 있다.
일 실시 예에서, 도 7c의 예시(705)를 참조하면, 전자 장치(101)는, 사용자 입력(755)에 응답하여, 제2 상태(또는, 슬라이드-아웃 상태)에서 획득된 콘텐트를 포함하는 영역(614)을 표시할 수 있다. 일 실시 예에서, 영역(614)은 획득된 콘텐트의 비율에 따라, 확대된 영역일 수 있다. 일 실시 예에서, 영역(614)의 비율은 영역(614)이 표시되는 화면을 생성하는 어플리케이션(146)(또는, 미들 웨어(144))이 지정한 비율일 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 영역(614)의 변들(예: 변(725), 변(727)) 중 적어도 하나의 변을 이동시킴으로써, 영역(614)을 확대할 수 있다. 일 실시 예에서, 영역(614)의 경계를 확대함은, 영역(614)의 변들(예: 변(725), 변(727)) 중 적어도 하나의 변을 이동시킴을 포함할 수 있다.
일 실시 예에서, 도 7c의 예시(705)를 참조하면, 전자 장치(101)는, 사용자 입력(755)에 응답하여, 획득된 콘텐트를 포함하는 영역(614)에 기반하여 배열된 화면(610)을 제2 상태에서 표시할 수 있다. 일 실시 예에서, 화면(610)이 영역(614)을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(614)이 다른 영역들 사이에서 표시됨을 의미할 수 있다. 일 실시 예에서, 영역(614)이 다른 영역들 사이에서 표시됨은, 영역(614)이 확대됨에 따라 생성되는 레터 박스 및/또는 필러 박스에 다른 콘텐트들이 표시된 영역들이 위치함을 의미할 수 있다.
일 실시 예에서, 화면(701)이 획득된 콘텐트를 포함하는 영역(614)을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(614)이 표시 영역(예: 도 2c의 영역(230c))의 중심 위치(740)에 위치함을 의미할 수 있다. 일 실시 예에서, 화면(701)이 획득된 콘텐트를 포함하는 영역(614)을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(614)의 중심 영역(720)이 영역(예: 영역(230c))의 중심 위치(740)를 포함함을 의미할 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 영역(614)을 다른 영역들 사이에서 표시하기 위해, 영역(614)을 이동시킬 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 디스플레이(230)의 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 기반하여 영역(614)을 이동시킬 수 있다. 도 7c의 예시(704)와 같이, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 영역(614)을 영역(예: 영역(613))과 영역(615) 사이에서 점진적으로 확대할 수 있다. 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))을 따라 서로 마주하는 두 영역들(예: 영역(613), 영역(615)) 사이에서 영역(614)을 점진적으로 확대할 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택되지 않은 영역들(예: 영역(613), 영역(615)) 중 일부 영역들(예: 영역(예: 영역(613), 영역(615)))을 제2 상태에서 영역(614)의 주변에 표시할 수 있다. 일 실시 예에서, 영역(614)의 주변은 레터 박스 및/또는 필러 박스의 영역일 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택되지 않은 영역들(예: 영역(613), 영역(615)) 중 일부 영역(예: 영역(예: 영역(613)))을 제2 상태에서 영역(614)의 위에 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택된 영역(614)의 위에서 표시되는 일부 영역(예: 영역(예: 영역(613)))을 제2 상태에서 영역(614)의 위에 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택되지 않은 영역들(예: 영역(613), 영역(615)) 중 일부 영역(예: 영역(615))을 제2 상태에서 영역(614)의 아래에 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택된 영역(614)의 아래에서 표시되는 일부 영역(예: 영역(615))을 제2 상태에서 영역(614)의 아래에 표시할 수 있다.
상술한 바와 같은, 전자 장치(101)는, 사용자의 디스플레이(230)의 표시 영역의 확대를 위한 요청에 기반하여, 표시되는 영역(예: 영역(611), 영역(613), 영역(615)) 중에서 선택된 영역(611)에 의해 획득되는 콘텐트를 확대된 표시 영역의 지정된 위치에서 표시할 수 있다. 전자 장치(101)는, 선택된 영역(예: 영역(611))에 의해 획득되는 콘텐트를 포함하는 영역(614)을 지정된 영역들 사이에서 점진적으로 확대시킴으로써, 사용자에게 부드러운 레이아웃의 변화를 느끼게 할 수 있다. 또한, 전자 장치(101)는, 영역(614)을 지정된 영역들 사이에서 점진적으로 확대시킴으로써, 사용자에게 적합한 콘텐츠의 확대 및/또는 위치 이동을 위한 추가적인 사용자의 노력을 요구하지 않을 수 있다.
도 8은 일 실시 예에 따른, 전자 장치의 축소 상태에서 확장 상태로의 변경에 따른 UI의 레이아웃의 변화의 일 예를 도시하는 도면이다.
도 8의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5, 도 6a, 도 7a, 도 7b, 및 도 7c를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다.
일 실시 예에서, 도 8의 예시(801)를 참조하면, 전자 장치(101)는, 제1 상태(또는, 슬라이드-인 상태)에서, 표시 영역(예: 도 2a의 영역(230a))에 하나 이상의 영역들(예: 영역(811), 영역(813), 영역(815), 영역(817), 영역(819))을 포함하는 화면을 표시하는 동안, 사용자 입력(850)을 획득할 수 있다. 일 실시 예에서, 영역(811)에는, 상태 바가 표시될 수 있다. 일 실시 예에서, 영역들(예: 영역(813), 영역(815), 영역(817))은, 하나의 어플리케이션을 통해 생성되는 화면이 표시될 수 있다. 일 실시 예에서, 영역(813)은 날씨 정보를 요약한 콘텐트가 표시될 수 있다. 일 실시 예에서, 영역(815)은 시간별 기온 정보를 포함하는 콘텐트가 표시될 수 있다. 일 실시 예에서, 영역(817)은 시간별 강수 확률 정보를 포함하는 콘텐트가 표시될 수 있다. 일 실시 예에서, 영역(819)은 네비게이션 바가 표시될 수 있다. 도 8의 화면(801)에는, 상태 바 및 네비게이션 바가 포함되는 것으로 도시되었으나, 이는 예시일 뿐이다. 실시 예에 따라, 제1 상태에서, 표시 영역에 표시되는 화면에는 상태 바 및/또는 네비게이션 바가 포함되지 않을 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(850)에 응답하여, 영역(815)에 맵핑된 콘텐트를 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 사용자 입력(850)에 응답하여, 영역(815)에 하이퍼링크된 콘텐트를 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 영역(815)에 대한 사용자 입력(850)에 응답하여, 외부 장치(예: 서버(108), 또는 전자 장치(102, 103))로부터 컨텐츠를 획득할 수 있다. 일 실시 예에서, 영역(815)에 맵핑된 콘텐트는 레이더 기상 정보를 포함하는 콘텐트일 수 있다.
일 실시 예에서, 도 8의 예시(805)를 참조하면, 전자 장치(101)는, 사용자 입력(850)에 응답하여, 제2 상태(또는, 슬라이드-아웃 상태)에서 획득된 콘텐트를 포함하는 영역(816)을 표시할 수 있다. 일 실시 예에서, 영역(816)은 획득된 콘텐트의 비율에 따라, 확대된 영역일 수 있다. 일 실시 예에서, 영역(816)의 비율은 영역(816)이 표시되는 화면을 생성하는 어플리케이션(146)(또는, 미들 웨어(144))이 지정한 비율일 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 영역(816)의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴으로써, 영역(816)을 확대할 수 있다. 일 실시 예에서, 영역(816)의 경계를 확대함은, 영역(816)의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴을 포함할 수 있다. 예를 들면, 전자 장치(101)는, 영역(816)의 변들(예: 변(721), 변(725)) 중 위의 영역(예: 영역(813))과 맞닿은 변(721)을 위로 확대하고, 영역(816)의 변들(예: 변(721), 변(725)) 중 아래의 영역(예: 영역(817))과 맞닿은 변(725)을 아래로 확대할 수 있다.
일 실시 예에서, 도 8의 예시(805)를 참조하면, 전자 장치(101)는, 사용자 입력(850)에 응답하여, 획득된 콘텐트를 포함하는 영역(816)에 기반하여 배열된 화면(810)을 제2 상태에서 표시할 수 있다. 일 실시 예에서, 화면(810)이 영역(816)을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(816)이 다른 영역들 사이에서 표시됨을 의미할 수 있다. 일 실시 예에서, 영역(816)이 다른 영역들 사이에서 표시됨은, 영역(816)이 확대됨에 따라 생성되는 레터 박스 및/또는 필러 박스에 다른 콘텐트들이 표시된 영역들이 위치함을 의미할 수 있다.
일 실시 예에서, 도 8의 예시(805)를 참조하면, 전자 장치(101)는, 사용자 입력(850)에 응답하여, 사용자 입력(850)이 획득된 영역(815)에 획득된 콘텐트를 포함하는 영역(816)을 표시할 수 있다. 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))을 따라 서로 마주하는 두 영역들(예: 영역(813), 영역(817)) 사이에서 영역(816)을 점진적으로 확대할 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(850)에 응답하여, 사용자 입력(850)이 획득된 영역(815)을 서로 마주하는 두 영역들(예: 영역(813), 영역(817)) 사이에서 점진적으로 확대한 후, 제2 상태에서 영역(815) 대신 영역(816)을 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 영역(815) 대신 영역(816)을 표시하기 위해, 영역(815) 및/또는 영역(816)에 지정된 그래픽 효과를 적용할 수 있다. 예를 들면, 전자 장치(101)는, 영역(815)에 페이드 아웃 효과를 적용하고, 영역(816)에 페이드 인 효과를 적용할 수 있다.
도 9는 일 실시 예에 따른, 전자 장치의 축소 상태에서 확장 상태로의 변경에 따른 UI의 레이아웃의 변화의 일 예를 도시하는 도면이다.
도 9의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5, 도 6a, 도 7a, 도 7b, 및 도 7c를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다.
일 실시 예에서, 도 9의 예시(901)를 참조하면, 전자 장치(101)는, 제1 상태(또는, 슬라이드-인 상태)에서, 표시 영역(예: 도 2a의 영역(230a))에 하나 이상의 영역들(예: 영역(911), 영역(913), 영역(915), 영역(917), 영역(919))을 포함하는 화면을 표시하는 동안, 사용자 입력(950)을 획득할 수 있다. 일 실시 예에서, 영역(911)은, 상태 바가 표시될 수 있다. 일 실시 예에서, 영역들(예: 영역(913), 영역(915), 영역(917))은, 하나의 어플리케이션(예: 메신저 어플리케이션)을 통해 생성되는 화면이 표시될 수 있다. 일 실시 예에서, 영역(913)은 이미지 객체 위의 대화들이 표시될 수 있다. 일 실시 예에서, 영역(915)은 이미지 객체가 표시될 수 있다. 일 실시 예에서, 영역(917)은 이미지 객체 아래의 대화들이 표시될 수 있다. 일 실시 예에서, 영역(919)은 네비게이션 바가 표시될 수 있다. 도 9의 화면(901)에는, 상태 바 및 네비게이션 바가 포함되는 것으로 도시되었으나, 이는 예시일 뿐이다. 실시 예에 따라, 제1 상태에서, 표시 영역에 표시되는 화면에는 상태 바 및/또는 네비게이션 바가 포함되지 않을 수 있다. 일 실시 예에서, 영역(915)에 포함된 이미지 객체는 이미지 객체와 관련된 콘텐트를 획득하기 위한 경로 정보(예: URL(uniform resource locator))가 포함될 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(950)에 응답하여, 영역(915)의 이미지 객체에 맵핑된 콘텐트를 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 사용자 입력(950)에 응답하여, 영역(915)의 이미지 객체에 하이퍼링크된 콘텐트를 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 영역(915)의 이미지 객체에 대한 사용자 입력(950)에 응답하여, 외부 장치(예: 서버(108), 또는 전자 장치(102, 103))로부터 컨텐츠를 획득할 수 있다. 일 실시 예에서, 영역(915)에 맵핑된 콘텐트는 영역(915)의 이미지 객체의 원본 이미지일 수 있다. 일 실시 예에서, 영역(915)의 이미지 객체는 원본 이미지의 썸네일 이미지일 수 있다. 하지만 이에 제한되지 않는다.
일 실시 예에서, 도 9의 예시(905)를 참조하면, 전자 장치(101)는, 사용자 입력(950)에 응답하여, 제2 상태(또는, 슬라이드-아웃 상태)에서 획득된 콘텐트를 포함하는 영역(916)을 표시할 수 있다. 일 실시 예에서, 영역(916)은 획득된 콘텐트의 비율에 따라, 확대된 영역일 수 있다. 일 실시 예에서, 영역(916)의 비율은 영역(916)이 표시되는 화면을 생성하는 어플리케이션(146)(또는, 미들 웨어(144))이 지정한 비율일 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 영역(916)의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴으로써, 영역(916)을 확대할 수 있다. 일 실시 예에서, 영역(916)의 경계를 확대함은, 영역(916)의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴을 포함할 수 있다. 예를 들면, 전자 장치(101)는, 영역(916)의 변들(예: 변(721), 변(725)) 중 위의 영역(예: 영역(913))과 맞닿은 변(721)을 위로 확대하고, 영역(916)의 변들(예: 변(721), 변(725)) 중 아래의 영역(예: 영역(917))과 맞닿은 변(725)을 아래로 확대할 수 있다.
일 실시 예에서, 도 9의 예시(905)를 참조하면, 전자 장치(101)는, 사용자 입력(950)에 응답하여, 획득된 콘텐트를 포함하는 영역(916)에 기반하여 배열된 화면(910)을 제2 상태에서 표시할 수 있다. 일 실시 예에서, 화면(910)이 영역(916)을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(916)이 다른 영역들 사이에서 표시됨을 의미할 수 있다. 일 실시 예에서, 영역(916)이 다른 영역들 사이에서 표시됨은, 영역(916)이 확대됨에 따라 생성되는 레터 박스 및/또는 필러 박스에 다른 콘텐트들이 표시된 영역들이 위치함을 의미할 수 있다.
일 실시 예에서, 도 9의 예시(905)를 참조하면, 전자 장치(101)는, 사용자 입력(950)에 응답하여, 사용자 입력(950)이 획득된 영역(915)에 획득된 콘텐트를 포함하는 영역(916)을 표시할 수 있다. 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))을 따라 서로 마주하는 두 영역들(예: 영역(913), 영역(917)) 사이에서 영역(916)을 점진적으로 확대할 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(950)에 응답하여, 사용자 입력(950)이 획득된 영역(915)을 서로 마주하는 두 영역들(예: 영역(913), 영역(917)) 사이에서 점진적으로 확대한 후, 제2 상태에서 영역(915) 대신 영역(916)을 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 영역(915) 대신 영역(916)을 표시하기 위해, 영역(915) 및/또는 영역(916)에 지정된 그래픽 효과를 적용할 수 있다. 예를 들면, 전자 장치(101)는, 영역(915)에 페이드 아웃 효과를 적용하고, 영역(916)에 페이드 인 효과를 적용할 수 있다.
도 10은 일 실시 예에 따른, 전자 장치의 축소 상태에서 확장 상태로의 변경에 따른 UI의 레이아웃의 변화의 일 예를 도시하는 도면이다.
도 10의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5, 도 6a, 도 7a, 도 7b, 및 도 7c를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다.
일 실시 예에서, 도 10의 예시(1001)를 참조하면, 전자 장치(101)는, 제1 상태(또는, 슬라이드-인 상태)에서, 표시 영역(예: 도 2a의 영역(230a))에 하나 이상의 영역들(예: 영역(1011), 영역(1013), 영역(1015), 영역(1017), 영역(1019))을 포함하는 화면을 표시하는 동안, 사용자 입력(1050)을 획득할 수 있다. 일 실시 예에서, 영역(1011)은, 상태 바가 표시될 수 있다. 일 실시 예에서, 영역들(예: 영역(1013), 영역(1015), 영역(1017))은, 하나의 어플리케이션(예: SNS(social network service) 어플리케이션)을 통해 생성되는 화면이 표시될 수 있다. 일 실시 예에서, 영역(1013)에는 검색 정보(예: #강아지 일상)의 콘텐트가 표시될 수 있다. 일 실시 예에서, 영역들(예: 영역(1015), 영역(1017))은 하나 이상의 썸네일 이미지들을 포함하는 콘텐트가 표시될 수 있다. 일 실시 예에서, 영역(1019)은 네비게이션 바가 표시될 수 있다. 도 10의 화면(1001)에는, 상태 바 및 네비게이션 바가 포함되는 것으로 도시되었으나, 이는 예시일 뿐이다. 실시 예에 따라, 제1 상태에서, 표시 영역에 표시되는 화면에는 상태 바 및/또는 네비게이션 바가 포함되지 않을 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(1050)에 응답하여, 영역(1017)에 포함된 콘텐트들 중 하나를 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 영역(1017)에 포함된 썸네일 이미지들 중 사용자 입력(1050)이 나타내는 썸네일 이미지를 식별할 수 있다. 일 실시 예에서, 사용자 입력(1050)이 나타내는 썸네일 이미지는, 화면에 표시된 콘텐트들 중 마지막 위치의 콘텐트일 수 있다.
일 실시 예에서, 도 10의 예시(1005)를 참조하면, 전자 장치(101)는, 사용자 입력(1050)에 응답하여, 제2 상태(또는, 슬라이드-아웃 상태)에서 선택된 콘텐트를 포함하는 영역(1016)을 표시할 수 있다. 일 실시 예에서, 영역(1016)은 선택된 콘텐트의 비율에 따라, 확대된 영역일 수 있다. 일 실시 예에서, 영역(1016)의 비율은 영역(1016)이 표시되는 화면을 생성하는 어플리케이션(146)(또는, 미들 웨어(144))이 지정한 비율일 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 영역(1016)의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴으로써, 영역(1016)을 확대할 수 있다. 일 실시 예에서, 영역(1016)의 경계를 확대함은, 영역(1016)의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴을 포함할 수 있다. 예를 들면, 전자 장치(101)는, 영역(1016)의 변들(예: 변(721), 변(725))들을 위로 이동시킬 수 있다.
일 실시 예에서, 도 10의 예시(1005)를 참조하면, 전자 장치(101)는, 사용자 입력(1050)에 응답하여, 선택된 콘텐트를 포함하는 영역(1016)에 기반하여 배열된 화면(1010)을 제2 상태에서 표시할 수 있다. 일 실시 예에서, 화면(1010)이 영역(1016)을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(1016)이 다른 영역들 사이에서 표시됨을 의미할 수 있다. 일 실시 예에서, 영역(1016)이 다른 영역들 사이에서 표시됨은, 영역(1016)이 확대됨에 따라 생성되는 레터 박스 및/또는 필러 박스에 다른 콘텐트들이 표시된 영역들이 위치함을 의미할 수 있다.
일 실시 예에서, 전자 장치(101)는, 제2 상태에서 영역(1016) 아래에 새로운 영역(1018)을 표시할 수 있다. 일 실시 예에서, 새로운 영역(1018)에는, 선택된 콘텐트의 다음번 콘텐트들이 포함될 수 있다.
도 10에서는, 사용자 입력(1050)에 의해 마지막 위치의 콘텐트가 선택됨에 따라, 선택된 콘텐트의 다음번 콘텐트들이 포함되는 새로운 영역(1018)이 표시되는 것으로 예시하였으나, 이는 예시일 뿐이다. 실시 예에 따라, 사용자 입력(1050)에 의해 첫 번째 위치의 콘텐트가 선택됨에 따라, 선택된 콘텐트의 이전의 콘텐트들이 포함되는 새로운 영역이 선택된 콘텐트의 위에 표시될 수 있다.
도 11은 일 실시 예에 따른, 전자 장치의 축소 상태에서 확장 상태로의 변경에 따른 UI의 레이아웃의 변화의 일 예를 도시하는 도면이다.
도 11의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5, 도 6a, 도 7a, 도 7b, 도 7c, 및 도 10을 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다. 도 10에서 설명된 내용들은 도 11에 대한 설명에서 반복되지 않을 수 있다.
도 10과 비교하여, 도 11은, 새로운 영역(1118)에 표시할 선택된 콘텐트의 다음번 콘텐트들이 존재하지 않는 상황을 예시할 수 있다.
일 실시 예에서, 도 11의 예시(1101)를 참조하면, 전자 장치(101)는, 제1 상태(또는, 슬라이드-인 상태)에서, 표시 영역(예: 도 2a의 영역(230a))에 하나 이상의 영역들(예: 영역(1111), 영역(1113), 영역(1115), 영역(1117), 영역(1119))을 포함하는 화면을 표시하는 동안, 사용자 입력(1150)을 획득할 수 있다. 일 실시 예에서, 영역(1111)은, 상태 바가 표시될 수 있다. 일 실시 예에서, 영역들(예: 영역(1113), 영역(1115), 영역(1117))은, 하나의 어플리케이션(예: SNS 어플리케이션)을 통해 생성되는 화면이 표시될 수 있다. 일 실시 예에서, 영역(1113)에는 검색 정보(예: #강아지 일상)의 콘텐트가 표시될 수 있다. 일 실시 예에서, 영역들(예: 영역(1115), 영역(1117))은 하나 이상의 썸네일 이미지들을 포함하는 콘텐트가 표시될 수 있다. 일 실시 예에서, 영역(1119)은 네비게이션 바가 표시될 수 있다. 도 11의 화면(1101)에는, 상태 바 및 네비게이션 바가 포함되는 것으로 도시되었으나, 이는 예시일 뿐이다. 실시 예에 따라, 제1 상태에서, 표시 영역에 표시되는 화면에는 상태 바 및/또는 네비게이션 바가 포함되지 않을 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(1150)에 응답하여, 영역(1117)에 포함된 콘텐트들 중 하나를 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 영역(1117)에 포함된 썸네일 이미지들 중 사용자 입력(1150)이 나타내는 썸네일 이미지를 식별할 수 있다. 일 실시 예에서, 사용자 입력(1150)이 나타내는 썸네일 이미지는, 화면에 표시된 콘텐트들 중 마지막 위치의 콘텐트일 수 있다.
일 실시 예에서, 도 11의 예시(1105)를 참조하면, 전자 장치(101)는, 사용자 입력(1150)에 응답하여, 제2 상태(또는, 슬라이드-아웃 상태)에서 선택된 콘텐트를 포함하는 영역(1116)을 표시할 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 영역(1116)의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴으로써, 영역(1116)을 확대할 수 있다. 일 실시 예에서, 영역(1116)의 경계를 확대함은, 영역(1116)의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴을 포함할 수 있다. 예를 들면, 전자 장치(101)는, 영역(1116)의 변들(예: 변(721), 변(725))들을 위로 이동시킬 수 있다.
일 실시 예에서, 도 10의 예시(1105)를 참조하면, 전자 장치(101)는, 사용자 입력(1150)에 응답하여, 선택된 콘텐트를 포함하는 영역(1116)에 기반하여 배열된 화면(1110)을 제2 상태에서 표시할 수 있다.
일 실시 예에서, 전자 장치(101)는, 제2 상태에서 영역(1116) 아래에 새로운 영역(1118)을 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 새로운 영역(1118)에서 표시할 선택된 콘텐트의 다음번 콘텐트들이 존재하는지를 판별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 새로운 영역(1118)에서 표시할 선택된 콘텐트의 다음번 콘텐트들이 존재하지 않는 경우, 새로운 영역(1118)에 제1 상태에서 표시된 영역(예: 영역(1117))에 포함된 콘텐트들을 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 새로운 영역(1118)에서 표시할 선택된 콘텐트의 다음번 콘텐트들이 존재하지 않는 경우, 새로운 영역(1118)을 제1 상태에서 표시된 영역(예: 영역(1117))에 포함된 콘텐트들에 지정된 효과를 적용한 상태로 표시할 수 있다. 일 실시 예에서, 지정된 효과는 블러 효과일 수 있다. 하지만 이에 제한되지 않는다.
도 12는 일 실시 예에 따른, 전자 장치의 축소 상태에서 확장 상태로의 변경에 따른 UI의 레이아웃의 변화의 일 예를 도시하는 도면이다.
도 12의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5, 도 6a, 도 7a, 도 7b, 및 도 7c를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다.
일 실시 예에서, 도 12의 예시(1201)를 참조하면, 전자 장치(101)는, 제1 상태(또는, 슬라이드-인 상태)에서, 표시 영역(예: 도 2a의 영역(230a))에 하나 이상의 영역들(예: 영역(1211), 영역(1213), 영역(1215), 영역(1217), 영역(1219))을 포함하는 화면을 표시하는 동안, 사용자 입력(1250)을 획득할 수 있다. 일 실시 예에서, 영역(1211)은, 상태 바가 표시될 수 있다. 일 실시 예에서, 영역들(예: 영역(1213), 영역(1215))은, 하나의 어플리케이션(예: 지도 어플리케이션)을 통해 생성되는 화면이 표시될 수 있다. 일 실시 예에서, 영역(1213)은 지도가 표시될 수 있다. 일 실시 예에서, 영역(1215)은 장소들에 대한 목록을 포함하는 콘텐트가 표시될 수 있다. 일 실시 예에서, 영역(1219)은 네비게이션 바가 표시될 수 있다. 도 12의 화면(1201)에는, 상태 바 및 네비게이션 바가 포함되는 것으로 도시되었으나, 이는 예시일 뿐이다. 실시 예에 따라, 제1 상태에서, 표시 영역에 표시되는 화면에는 상태 바 및/또는 네비게이션 바가 포함되지 않을 수 있다.
일 실시 예에서, 전자 장치(101)는, 사용자 입력(1250)에 응답하여, 영역(1213)에 포함된 콘텐트들 중 하나를 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 영역(1213)에 포함된 위치들 중 사용자 입력(1250)이 나타내는 위치에 대한 위치 정보를 식별할 수 있다. 일 실시 예에서, 사용자 입력(1250)이 식별되는 영역(1213)은, 화면에 표시된 영역들 중 첫 번째 위치의 영역일 수 있다.
일 실시 예에서, 도 12의 예시(1205)를 참조하면, 전자 장치(101)는, 사용자 입력(1250)에 응답하여, 제2 상태(또는, 슬라이드-아웃 상태)에서 선택된 콘텐트(예: 위치 정보)를 포함하는 영역(1216)을 표시할 수 있다. 일 실시 예에서, 영역(1216)은 선택된 콘텐트의 비율에 따라, 확대된 영역일 수 있다. 일 실시 예에서, 영역(1216)의 비율은 영역(1216)이 표시되는 화면을 생성하는 어플리케이션(146)(또는, 미들 웨어(144))이 지정한 비율일 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 영역(1216)의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴으로써, 영역(1216)을 확대할 수 있다. 일 실시 예에서, 영역(1216)의 경계를 확대함은, 영역(1216)의 변들(예: 변(721), 변(725)) 중 적어도 하나의 변을 이동시킴을 포함할 수 있다. 예를 들면, 전자 장치(101)는, 영역(1216)의 변들(예: 변(721), 변(725))들을 위로 이동시킬 수 있다.
일 실시 예에서, 도 12의 예시(1205)를 참조하면, 전자 장치(101)는, 사용자 입력(1250)에 응답하여, 선택된 콘텐트를 포함하는 영역(1216)에 기반하여 배열된 화면(1210)을 제2 상태에서 표시할 수 있다. 일 실시 예에서, 화면(1210)이 영역(1216)을 기준으로 배열됨은, 제2 상태에서 표시되는 영역(1216)이 다른 영역들 사이에서 표시됨을 의미할 수 있다. 일 실시 예에서, 영역(1216)이 다른 영역들 사이에서 표시됨은, 영역(1216)이 확대됨에 따라 생성되는 레터 박스 및/또는 필러 박스에 다른 콘텐트들이 표시된 영역들이 위치함을 의미할 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택되지 않은 영역들(예: 영역(1215)) 중 일부 영역(예: 영역(1215))을 제2 상태에서 영역(1216)의 아래에 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택된 영역(1213)의 아래에서 표시되는 영역(1215)을 제2 상태에서 영역(1216)의 아래에 표시할 수 있다. 일 실시 예에서, 제2 상태에서 표시되는 영역(1215)의 크기는 제1 상태에서의 크기보다 줄어들 수 있다. 일 실시 예에서, 제2 상태에서 표시되는 영역(1215)에는 제1 상태에서 표시되는 영역(1215)에 포함된 콘텐츠의 일부(예: '라벨이 지정된 장소')가 포함될 수 있다.
일 실시 예에서, 전자 장치(101)는, 제2 상태에서 영역(1216) 위에 새로운 영역(1218)을 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 사용자 입력(1250)이 식별된 영역(1213)의 콘텐트 이전의 콘텐트가 존재하는지를 판별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 새로운 영역(1218)에서 표시할 이전의 콘텐트가 존재하지 않는 경우, 새로운 영역(1218)에 제1 상태에서 표시된 콘텐트를 표시할 수 있다. 일 실시 예에서, 전자 장치(101)는, 새로운 영역(1218)에서 표시할 선택된 콘텐트의 이전의 콘텐트들이 존재하지 않는 경우, 새로운 영역(1218)을 제1 상태에서 표시된 영역(예: 영역(1213))에 포함된 콘텐트들에 지정된 효과를 적용한 상태로 표시할 수 있다. 일 실시 예에서, 지정된 효과는 블러 효과일 수 있다. 하지만 이에 제한되지 않는다.
도 13은 일 실시 예에 따른, 전자 장치의 동작을 예시하는 흐름도이다.
도 13의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5, 도 6a, 도 7a, 도 7b, 및 도 7c를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다.
도 13을 참조하면, 동작 1310에서, 전자 장치(101)는, 사용자 입력을 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 표시되는 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615)) 중 하나의 콘텐트(예: 영역(613) 내의 콘텐트)를 선택하기 위한 입력을 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태(또는, 슬라이드-인 상태)에서, 디스플레이(230)의 표시 영역(예: 도 2a의 영역(230a))을 확대한 제2 상태로의 변경을 위한 입력을 식별할 수 있다. 일 실시 예에서, 표시 영역(230a)에는, 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615))을 포함하는 화면(610)이 표시될 수 있다. 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615))은, 디스플레이(230)의 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 따라 배열될 수 있다. 하지만 이에 제한되지 않는다. 일 실시 예에서, 화면(610) 내의 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615))은, 다양한 레이아웃(예: linear layout, relative layout, frame layout, constraint layout, grid layout, table layout)에 따라 배치될 수 있다. 일 실시 예에서, 화면(610) 내의 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615)) 각각에는 적어도 하나의 콘텐트가 포함될 수 있다. 일 실시 예에서, 적어도 하나의 콘텐트는 시각적 객체를 포함할 수 있다. 일 실시 예에서, 시각적 객체는, 텍스트, 이미지, 및/또는 영상을 포함할 수 있다.
일 실시 예에서, 식별된 사용자 입력은, 제1 상태에서 표시되는 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615)) 중 하나의 콘텐트(예: 영역(613) 내의 콘텐트)를 선택하기 위한 입력을 포함할 수 있다. 일 실시 예에서, 식별된 사용자 입력은, 제1 상태에서 제2 상태로의 변경을 요청하는 입력을 포함할 수 있다. 일 실시 예에서, 식별된 사용자 입력은, 하나의 콘텐트(예: 영역(613) 내의 콘텐트)를 선택하고, 제2 상태로의 변경을 요청하는 입력을 포함할 수 있다.
동작 1320에서, 전자 장치(101)는, 기준 컨텐츠를 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 식별된 사용자 입력에 기반하여 기준 컨텐츠가 식별되는지를 판별할 수 있다.
일 실시 예에서, 전자 장치(101)는, 식별되는 사용자 입력이 제1 상태에서 표시되는 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615)) 중 하나의 콘텐트(예: 영역(613) 내의 콘텐트)를 선택하기 위한 입력을 포함하는 경우, 선택된 콘텐트를 기준 컨텐츠로 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 식별되는 사용자 입력이 제1 상태에서 제2 상태로의 변경을 요청하는 입력을 포함하는 경우, 제1 상태에서 표시되는 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615)) 중 지정된 영역(예: 가운데 위치하는 영역(613)에 위치하는 콘텐트를 기준 컨텐츠로 식별할 수 있다. 지정된 영역(예: 가운데 위치하는 영역(613)에 위치하는 콘텐트를 기준 컨텐츠로 식별하는 동작은, 자동 식별에 대한 기능이 온(turn on)인 경우 수행될 수 있다. 하지만 이에 제한되지 않는다.
일 실시 예에서, 기준 콘텐트가 식별되는 경우, 전자 장치(101)는, 동작 1330을 수행할 수 있다. 일 실시 예에서, 기준 콘텐트가 식별되지 않는 경우, 전자 장치(101)는, 동작 1340을 수행할 수 있다. 일 실시 예에서, 기준 콘텐트는 사용자가 콘텐트의 선택을 위한 입력 없이 영역(230a)의 확대만을 요청한 경우에 식별되지 않을 수 있다. 일 실시 예에서, 기준 콘텐트는 자동 식별에 대한 기능을 오프(turn off)한 상태에서 사용자가 콘텐트의 선택을 위한 입력 없이 영역(230a)의 확대만을 요청한 경우에 식별되지 않을 수 있다.
동작 1330에서, 전자 장치(101)는, 제1 방식으로 컨텐츠를 표시할 수 있다. 일 실시 예에서, 제1 방식은, 선택된 콘텐트를 포함하는 영역을 제2 상태의 영역(230c)의 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 따라 배열된 복수의 영역들 중 가운데 영역에 위치시키는 방식을 지칭될 수 있다.
일 실시 예에서, 전자 장치(101)는, 선택된 콘텐트를 포함하는 영역을 선택된 콘텐트의 비율(또는, 종횡비)에 따라, 확대될 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 콘텐트를 포함하는 영역의 경계를 확대함으로써, 선택된 콘텐트를 포함하는 영역을 확대할 수 있다.
일 실시 예에서, 전자 장치(101)는, 선택된 콘텐트를 포함하는 영역을 제2 상태의 표시 영역(예: 도 2c의 영역(230c))의 중심 위치(740)에 위치시킬 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 콘텐트를 포함하는 영역을 제2 상태의 표시 영역(예: 도 2c의 영역(230c))의 중심 위치(740)에 위치시키기 위해, 선택된 콘텐트를 포함하는 영역을 이동시킬 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택되지 않은 영역들 중 일부 영역을 제2 상태에서 선택된 콘텐트를 포함하는 영역의 주변에 표시할 수 있다. 일 실시 예에서, 선택된 콘텐트를 포함하는 영역의 주변은 레터 박스 및/또는 필러 박스의 영역일 수 있다.
동작 1340에서, 전자 장치(101)는, 제2 방식으로 컨텐츠를 표시할 수 있다.
일 실시 예에서, 제2 방식으로 컨텐츠를 표시함은, 제1 상태에서 표시되는 화면을, 디스플레이(230)의 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 따라 확대함을 지칭할 수 있다.
일 실시 예에서, 제2 방식으로 컨텐츠를 표시함은, 제1 상태에서 표시되는 화면에 추가 화면을 표시함을 지칭할 수 있다. 추가 화면은, 제1 상태에서 제2 상태로 변경됨에 따라 추가되는 표시 영역에 표시될 수 있다. 일 실시 예에서, 제1 상태에서 표시되는 화면은, 동일한 크기로 제2 상태에서 표시될 수 있다. 하지만 이에 제한되지 않는다.
일 실시 예에서, 전자 장치(101)의 설정에 따라, 전자 장치(101)는 제2 상태로 변경없이, 동작 1310에서 선택된 콘텐트에 대한 연결 콘텐트(예: 하이퍼링크(hyperlink) 실행)를 표시할 수 있다.
도 14는 일 실시 예에 따른, 전자 장치의 동작을 예시하는 흐름도이다.
도 14의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5, 도 6a, 도 7a, 도 7b, 및 도 7c를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다. 도 14의 동작들 1410, 1420, 1430, 및 1440은 도 13의 동작 1330에 포함될 수 있다.
도 14를 참조하면, 동작 1410에서, 전자 장치(101)는, 기준 컨텐츠의 위치를 식별할 수 있다. 일 실시 예에서, 기준 컨텐츠는, 사용자 입력에 의해 식별되는 하나의 콘텐트(예: 영역(613) 내의 콘텐트)일 수 있다. 일 실시 예에서, 사용자 입력이 제1 상태에서 제2 상태로의 변경을 요청하는 입력을 포함하는 경우, 기준 컨텐츠는, 제1 상태에서 표시되는 하나 이상의 영역들(예: 영역(611), 영역(613), 영역(615)) 중 지정된 영역(예: 가운데 위치하는 영역(613)에 위치하는 콘텐트일 수 있다. 하지만 이에 제한되지 않는다.
동작 1420에서, 전자 장치(101)는, 기준 컨텐츠의 위치가 기준 위치인지를 판별할 수 있다. 일 실시 예에서, 기준 위치는, 제1 상태에서 영역(230a)에 디스플레이(230)의 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 따라 배열된 복수의 영역들 중 중심 위치(740) 또는 중심 위치(740)를 포함하는 영역의 위치일 수 있다.
일 실시 예에서, 기준 컨텐츠의 위치가 기준 위치인 경우, 전자 장치(101)는 동작 1430을 수행할 수 있다. 일 실시 예에서, 기준 컨텐츠의 위치가 기준 위치가 아닌 경우, 전자 장치(101)는 동작 1440을 수행할 수 있다.
동작 1430에서, 전자 장치(101)는, 제1 방식으로 컨텐츠를 표시할 수 있다. 일 실시 예에서, 제1 방식은, 선택된 콘텐트를 포함하는 영역을 제2 상태의 영역(230c)의 표시 영역이 확장되는 방향(예: 도 2a의 제2 방향(262))에 따라 배열된 복수의 영역들 중 가운데 영역에 위치시키는 방식을 지칭될 수 있다.
일 실시 예에서, 전자 장치(101)는, 선택된 콘텐트를 포함하는 영역을 선택된 콘텐트의 비율(또는, 종횡비)에 따라, 확대될 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 콘텐트를 포함하는 영역의 경계를 확대함으로써, 선택된 콘텐트를 포함하는 영역을 확대할 수 있다.
일 실시 예에서, 전자 장치(101)는, 제1 상태에서 선택되지 않은 영역들 중 일부 영역을 제2 상태에서 선택된 콘텐트를 포함하는 영역의 주변에 표시할 수 있다. 일 실시 예에서, 선택된 콘텐트를 포함하는 영역의 주변은 레터 박스 및/또는 필러 박스의 영역일 수 있다.
동작 1440에서, 전자 장치(101)는, 기준 컨텐츠의 위치를 변경할 수 있다.
일 실시 예에서, 전자 장치(101)는, 선택된 콘텐트를 포함하는 영역을 제2 상태의 표시 영역(예: 도 2c의 영역(230c))의 중심 위치(740)에 위치시킬 수 있다. 일 실시 예에서, 전자 장치(101)는, 제1 상태에서 제2 상태로 변경하는 동안, 선택된 콘텐트를 포함하는 영역을 제2 상태의 표시 영역(예: 도 2c의 영역(230c))의 중심 위치(740)에 위치시키기 위해, 선택된 콘텐트를 포함하는 영역을 이동시킬 수 있다.
도 14에서는, 동작 1430과 동작 1440이 별개의 동작인 것으로 예시되었으나, 이는 예시일 뿐이다. 동작 1430과 동작 1440은 동시에 수행될 수 있다. 예를 들면, 전자 장치(101)는, 선택된 콘텐트를 포함하는 영역을 중심 위치(740)로 이동시키면서, 선택된 콘텐트를 포함하는 영역의 크기를 확대할 수 있다.
도 15는 일 실시 예에 따른, 전자 장치의 동작을 예시하는 흐름도이다.
도 15의 설명을 위해, 도 1, 도 2a, 도 2b, 도 2c, 도 2d, 도 3a, 도 3b, 도 4a, 도 4b, 도 5, 도 6a, 도 7a, 도 7b, 및 도 7c를 참조하여 설명된 전자 장치(101)의 구성 요소들, 및 전자 장치(101)의 구조가 참조될 수 있다.
도 15를 참조하면, 동작 1510에서, 전자 장치(101)는, 기준 컨텐츠의 어플리케이션 정책을 식별할 수 있다. 일 실시 예에서, 어플리케이션 정책은, 기준 컨텐츠를 표시하는 어플리케이션이 기준 컨텐츠에 대하여 설정한 정책일 수 있다. 예를 들어, 정책은 기준 컨텐츠의 표시 방법, 표시 비율, 및/또는 레이아웃을 포함할 수 있다.
동작 1520에서, 전자 장치(101)는, 비율이 설정되어 있는지를 판별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 어플리케이션 정책에서 기준 컨텐츠의 표시와 관련된 비율이 설정되어 있는지를 판별할 수 있다. 일 실시 예에서, 어플리케이션 정책에서 기준 컨텐츠의 표시와 관련된 비율이 설정된 경우, 전자 장치(101)는, 동작 1530을 수행할 수 있다. 일 실시 예에서, 어플리케이션 정책에서 기준 컨텐츠의 표시와 관련된 비율이 설정되지 않은 경우, 전자 장치(101)는, 동작 1550을 수행할 수 있다.
동작 1530에서, 전자 장치(101)는, 설정된 비율을 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 어플리케이션 정책에 따라 기준 컨텐츠에 대하여 설정된 비율(또는, 종횡비)을 식별할 수 있다.
동작 1540에서, 전자 장치(101)는, 식별된 비율로 확대된 컨텐츠를 표시할 수 있다. 여기에서, 식별된 비율로 확대된 컨텐츠를 표시함은, 제2 상태의 표시 영역(예: 도 2c의 영역(230c))을 벗어나지 않는 최대의 크기로 컨텐츠를 표시함을 의미할 수 있다.
동작 1550에서, 전자 장치(101)는, 지정된 비율을 식별할 수 있다. 일 실시 예에서, 전자 장치(101)는, 운영 체제(또는, 미들 웨어)에서 기준 컨텐츠에 대하여 지정한 비율(또는, 종횡비)을 식별할 수 있다. 이후, 전자 장치(101)는 동작 1540을 수행할 수 있다.
상술한 바와 같은, 전자 장치(101)는, 제1 하우징 파트(210) 및 일 축에 따라 이동 가능하도록 상기 제1 하우징 파트(210)와 결합된(movably engaged) 제2 하우징 파트(220)를 포함하는 하우징을 포함할 수 있다. 상기 전자 장치(101)는, 상기 제2 하우징 파트(220)의 이동에 따라 상기 전자 장치의 전면에서 보이는 표시 영역의 크기가 상기 제1 방향(261), 및 제2 방향(262)으로 확대되거나 축소되는 디스플레이(230)(예: 플렉서블 디스플레이)를 포함할 수 있다. 상기 전자 장치(101)는, 인스트럭션들을 저장하는 메모리(130)를 포함할 수 있다. 상기 전자 장치(101)는, 상기 디스플레이(230) 및 상기 메모리(130)와 작동적으로 연결된 프로세서(120)를 포함할 수 있다. 상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 디스플레이(230)의 상기 표시 영역의 크기가 제1 크기를 가지는 동안, 상기 표시 영역에, 복수의 콘텐트들을 표시하도록 야기할 수 있다. 상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 따라: 상기 제2 크기의 상기 표시 영역에 상기 일 축 방향을 따라 구분되는 영역들(예: 영역(611), 영역(613), 영역(615)) 중 제1 영역(예: 영역(613))에 상기 복수의 콘텐트들 중에서 선택된 콘텐트와 관련된 제1 콘텐트를 표시하도록 야기할 수 있다. 상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 영역()으로 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 따라: 상기 일 축 방향을 따라 상기 제1 영역(예: 영역(613))에 대하여 이웃하고, 상기 제1 영역(예: 영역(613))을 사이에 두는 제2 영역(예: 영역(611)) 및 제3 영역(예: 영역(615))에 상기 선택된 콘텐트의 주변에 배치되는 제2 콘텐트의 적어도 일부와 제3 콘텐트의 적어도 일부를 각각 표시하도록 야기할 수 있다.
상기 제1 콘텐트가 표시되는 상기 제1 영역(예: 영역(613))은, 상기 제1 크기의 상기 표시 영역에서 상기 선택된 콘텐트가 표시된 영역보다 클 수 있다.
상기 제1 콘텐트가 표시되는 상기 제1 영역(예: 영역(613))은, 상기 제1 크기의 상기 표시 영역에서 상기 선택된 콘텐트가 표시된 영역으로부터 확대될 수 있다.
상기 제1 콘텐트는 상기 선택된 콘텐트가 선택됨에 기반하여, 외부 전자 장치로부터 획득될 수 있다.
상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 사용자 입력(751)을 획득하도록 야기할 수 있다. 상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 복수의 콘텐트들 중 상기 사용자 입력(751)에 획득되는 위치에 대응하는 콘텐트를 선택하도록 야기할 수 있다.
상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 상기 제2 크기로 상기 표시 영역의 상기 크기의 확대를 요청하는 사용자 입력(751)을 획득하도록 야기할 수 있다. 상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 크기의 상기 표시 영역에서 상기 일 축 방향을 따라 구분되는 다른 영역들에 표시되는 상기 복수의 콘텐트들 중 지정된 영역에 위치하는 콘텐트를 선택하도록 야기할 수 있다.
상기 제1 콘텐트의 상기 제1 영역(예: 영역(613))은 상기 제2 크기의 상기 표시 영역의 중심 위치를 포함할 수 있다.
상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 크기에서 상기 제2 크기로 상기 표시 영역의 상기 크기가 확대되는 동안, 상기 선택된 콘텐트의 주변에 배치되는 상기 제2 콘텐트의 적어도 일부 및 상기 제3 콘텐트의 적어도 일부를, 상기 제1 영역(예: 영역(613))이 상기 제2 영역(예: 영역(611)) 및 상기 제3 영역(예: 영역(615)) 사이에 위치하도록, 각각 이동시키도록 야기할 수 있다.
상기 복수의 콘텐트들은, 하나 이상의 시각적 객체를 포함할 수 있다.
상기 선택된 콘텐트가 하나의 이미지 객체인 경우, 상기 제1 콘텐트가 표시되는 상기 제1 영역(예: 영역(613))의 종횡비는 상기 이미지 객체의 종횡비에 대응할 수 있다.
상기 두 개의 영역들(예: 영역(611), 영역(615))의 상기 일 축 방향으로의 길이는 서로 동일할 수 있다.
상기 제2 콘텐트는, 상기 제1 크기의 상기 표시 영역에서 표시된 복수의 콘텐트들 중 어느 하나의 콘텐트의 일부를 포함할 수 있다.
상기 제2 콘텐트는, 상기 제1 크기의 상기 표시 영역에서 표시된 복수의 콘텐트들과 구분될 수 있다.
상기 제2 콘텐트 및 상기 제3 콘텐트에 각각 대응하는 제2 영역(예: 영역(611)) 및 제3 영역(예: 영역(615))은 서로 상기 일 축 방향을 따라 구분될 수 있다. 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 따라, 상기 제1 영역(예: 영역(613))은, 상기 두 개의 상기 다른 영역들 사이에서(예: 영역(611), 영역(613), 영역(615) 사이에서)) 확대될 수 있다.
상기 두 개의 상기 다른 영역들 중(예: 영역(611), 영역(613), 영역(615) 사이에서)) 하나의 영역은, 상기 제1 크기의 상기 표시 영역의 중심 위치를 포함할 수 있다.
상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 상기 제2 크기로 상기 표시 영역의 상기 크기가 확대되는 동안, 상기 제1 영역(예: 영역(613))에 상기 선택된 콘텐트를 표시하도록 야기할 수 있다. 상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 방향(261), 및 제2 방향(262)으로 상기 표시 영역의 상기 크기가 상기 제2 크기를 가짐에 응답하여, 상기 제1 영역(예: 영역(613))에 표시되는 콘텐트를 상기 선택된 콘텐트에서 상기 제1 콘텐트로 변경하도록 야기할 수 있다.
상술한 바와 같은, 방법은, 제1 하우징 파트(210) 및 일 축에 따라 이동 가능하도록 상기 제1 하우징 파트(210)와 결합된(movably engaged) 제2 하우징 파트(220)를 포함하는 하우징, 및 상기 제2 하우징 파트(220)의 이동에 따라 상기 전자 장치의 전면에서 보이는 표시 영역의 크기가 상기 제1 방향(261), 및 제2 방향(262)으로 확대되거나 축소되는 디스플레이(230)(예: 플렉서블 디스플레이)를 포함하는, 전자 장치에서 수행될 수 있다. 상기 방법은, 상기 디스플레이(230)의 상기 표시 영역의 크기가 제1 크기를 가지는 동안, 상기 표시 영역에, 복수의 콘텐트들을 표시하는 동작을 포함할 수 있다. 상기 방법은, 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 따라: 상기 제2 크기의 상기 표시 영역에 상기 일 축 방향을 따라 구분되는 영역들(예: 영역(611), 영역(613), 영역(615)) 중 제1 영역(예: 영역(613))에 상기 복수의 콘텐트들 중에서 선택된 콘텐트와 관련된 제1 콘텐트를 표시하는 동작을 포함할 수 있다. 상기 방법은, 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 따라: 상기 일 축 방향을 따라 상기 제1 영역(예: 영역(613))에 대하여 이웃하고, 상기 제1 영역(예: 영역(613))을 사이에 두는 제2 영역(예: 영역(611)) 및 제3 영역(예: 영역(615))에 상기 선택된 콘텐트의 주변에 배치되는 제2 콘텐트 적어도 일부와 제3 콘텐트의 적어도 일부를 각각 표시하는 동작을 포함할 수 있다.
상기 방법은, 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 상기 제2 크기로 상기 표시 영역의 상기 크기의 확대를 요청하는 사용자 입력(751)을 획득하는 동작을 포함할 수 있다. 상기 방법은, 상기 제1 크기의 상기 표시 영역에서 상기 일 축 방향을 따라 구분되는 다른 영역들에 표시되는 상기 복수의 콘텐트들 중 지정된 영역에 위치하는 콘텐트를 선택하는 동작을 포함할 수 있다.
상기 방법은, 상기 제1 크기에서 상기 제2 크기로 상기 표시 영역의 상기 크기가 확대되는 동안, 상기 선택된 콘텐트의 주변에 배치되는 상기 제2 콘텐트의 적어도 일부 및 상기 제3 콘텐트의 적어도 일부를, 상기 제1 영역(예: 영역(613))이 상기 제2 영역(예: 영역(611)) 및 상기 제3 영역(예: 영역(615)) 사이에 위치하도록, 각각 이동시키는 동작을 포함할 수 있다.
상기 제2 콘텐트 및 상기 제3 콘텐트에 각각 대응하는 제2 영역(예: 영역(611)) 및 제3 영역(예: 영역(615))은 서로 상기 일 축 방향을 따라 구분될 수 있다. 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 따라, 상기 제1 영역(예: 영역(613))은, 상기 두 개의 상기 다른 영역들 사이에서(예: 영역(611), 영역(613), 영역(615) 사이에서) 확대될 수 있다.
상술한 바와 같은, 비-일시적 컴퓨터 판독 가능 기록 매체(non-transitory computer readable storage medium)는 인스트럭션들을 포함하는 프로그램을 저장할 수 있다. 상기 인스트럭션들은, 제1 하우징 파트(210) 및 일 축에 따라 이동 가능하도록 상기 제1 하우징 파트(210)와 결합된(movably engaged) 제2 하우징 파트(220)를 포함하는 하우징, 및 상기 제2 하우징 파트(220)의 이동에 따라 상기 전자 장치의 전면에서 보이는 표시 영역의 크기가 상기 제1 방향(261), 및 제2 방향(262)으로 확대되거나 축소되는 디스플레이(230)(예: 플렉서블 디스플레이)를 포함하는 전자 장치의 프로세서(120)에 의해 실행될 시, 상기 전자 장치가, 상기 디스플레이(230)의 상기 표시 영역의 크기가 제1 크기를 가지는 동안, 상기 표시 영역에, 복수의 콘텐트들을 표시하도록 야기할 수 있다. 상기 인스트럭션들은, 상기 프로세서에 의해 실행될 시, 상기 전자 장치가, 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 따라: 상기 제2 크기의 상기 표시 영역에 상기 일 축 방향을 따라 구분되는 영역들(예: 영역(611), 영역(613), 영역(615)) 중 제1 영역(예: 영역(613))에 상기 복수의 콘텐트들 중에서 선택된 콘텐트와 관련된 제1 콘텐트를 표시하도록 야기할 수 있다. 상기 인스트럭션들은, 상기 프로세서에 의해 실행될 시, 상기 전자 장치가, 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 따라: 상기 일 축 방향을 따라 상기 제1 영역(예: 영역(613))에 대하여 이웃하고, 상기 제1 영역(예: 영역(613))을 사이에 두는 제2 영역(예: 영역(611)) 및 제3 영역(예: 영역(615))에 상기 선택된 콘텐트의 주변에 배치되는 제2 콘텐트 적어도 일부와 제3 콘텐트의 적어도 일부를 각각 표시하도록 야기할 수 있다.
상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 상기 제2 크기로 상기 표시 영역의 상기 크기의 확대를 요청하는 사용자 입력(751)을 획득하도록 야기할 수 있다. 상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 크기의 상기 표시 영역에서 상기 일 축 방향을 따라 구분되는 다른 영역들에 표시되는 상기 복수의 콘텐트들 중 지정된 영역에 위치하는 콘텐트를 선택하도록 야기할 수 있다.
상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 크기에서 상기 제2 크기로 상기 표시 영역의 상기 크기가 확대되는 동안, 상기 선택된 콘텐트의 주변에 배치되는 상기 제2 콘텐트의 적어도 일부 및 상기 제3 콘텐트의 적어도 일부를, 상기 제1 영역(예: 영역(613))이 상기 제2 영역(예: 영역(611)) 및 상기 제3 영역(예: 영역(615)) 사이에 위치하도록, 각각 이동시키도록 야기할 수 있다.
상기 제2 콘텐트 및 상기 제3 콘텐트에 각각 대응하는 제2 영역(예: 영역(611)) 및 제3 영역(예: 영역(615))은 서로 상기 일 축 방향을 따라 구분될 수 있다. 상기 제1 방향(261), 및 제2 방향(262)으로 상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 따라, 상기 제1 영역(예: 영역(613))은, 상기 두 개의 상기 다른 영역들 사이에서(예: 영역(611), 영역(613), 영역(615) 사이에서) 확대될 수 있다.
본 문서에 개시된 다양한 실시예들에 따른 전자 장치는 다양한 형태의 장치가 될 수 있다. 전자 장치는, 예를 들면, 휴대용 통신 장치(예: 스마트폰), 컴퓨터 장치, 휴대용 멀티미디어 장치, 휴대용 의료 기기, 카메라, 웨어러블 장치, 또는 가전 장치를 포함할 수 있다. 본 문서의 실시예에 따른 전자 장치는 전술한 기기들에 한정되지 않는다.
본 문서의 예시적인 실시예들 및 이에 사용된 용어들은 본 문서를 특정한 실시예들로 한정하려는 것이 아니며, 본 문서의 범주가 해당 실시예의 다양한 변경, 균등물, 및/또는 대체물을 포함하는 것으로 이해되어야 한다. 도면의 설명과 관련하여, 유사한 또는 관련된 구성요소에 대해서는 유사한 참조 부호가 사용될 수 있다. 아이템에 대응하는 명사의 단수 형은 관련된 문맥상 명백하게 다르게 지시하지 않는 한, 상기 아이템 한 개 또는 복수 개를 포함할 수 있다. 본 문서에서, "A 또는 B", "A 및 B 중 적어도 하나", "A 또는 B 중 적어도 하나", "A, B 또는 C", "A, B 및 C 중 적어도 하나", 및 "A, B, 또는 C 중 적어도 하나"와 같은 문구들 각각은 그 문구들 중 해당하는 문구에 함께 나열된 항목들 중 어느 하나, 또는 그들의 모든 가능한 조합을 포함할 수 있다. "제1", "제2", 또는 "첫째" 또는 "둘째"와 같은 용어들은 단순히 해당 구성요소를 다른 해당 구성요소와 구분하기 위해 사용될 수 있으며, 해당 구성요소들을 다른 측면(예: 중요성 또는 순서)에서 한정하지 않는다. 어떤(예: 제1) 구성요소가 다른(예: 제2) 구성요소에, "기능적으로" 또는 "통신적으로"라는 용어와 함께 또는 이런 용어 없이, "커플드" 또는 "커넥티드"라고 언급된 경우, 그것은 상기 어떤 구성요소가 상기 다른 구성요소에 직접적으로(예: 유선으로), 무선으로, 또는 제3 구성요소를 통하여 연결될 수 있다는 것을 의미한다.
본 문서의 다양한 실시예들에서 사용된 용어 "모듈"은 하드웨어, 소프트웨어 또는 펌웨어로 구현된 유닛을 포함할 수 있으며, 예를 들면, 로직, 논리 블록, 부품, 또는 회로와 같은 용어와 상호 호환적으로 사용될 수 있다. 모듈은, 일체로 구성된 부품 또는 하나 또는 그 이상의 기능을 수행하는, 상기 부품의 최소 단위 또는 그 일부가 될 수 있다. 예를 들면, 일실시예에 따르면, 모듈은 ASIC(application-specific integrated circuit)의 형태로 구현될 수 있다.
본 문서의 다양한 실시예들은 기기(machine)(예: 전자 장치(101)) 의해 읽을 수 있는 저장 매체(storage medium)(예: 내장 메모리(136) 또는 외장 메모리(138))에 저장된 하나 이상의 명령어들을 포함하는 소프트웨어(예: 프로그램(140))로서 구현될 수 있다. 예를 들면, 기기(예: 전자 장치(101))의 프로세서(예: 프로세서(120))는, 저장 매체로부터 저장된 하나 이상의 명령어들 중 적어도 하나의 명령을 호출하고, 그것을 실행할 수 있다. 이것은 기기가 상기 호출된 적어도 하나의 명령어에 따라 적어도 하나의 기능을 수행하도록 운영되는 것을 가능하게 한다. 상기 하나 이상의 명령어들은 컴파일러에 의해 생성된 코드 또는 인터프리터에 의해 실행될 수 있는 코드를 포함할 수 있다. 기기로 읽을 수 있는 저장 매체는, 비일시적(non-transitory) 저장 매체의 형태로 제공될 수 있다. 여기서, '비일시적'은 저장 매체가 실재(tangible)하는 장치이고, 신호(signal)(예: 전자기파)를 포함하지 않는다는 것을 의미할 뿐이며, 이 용어는 데이터가 저장 매체에 반영구적으로 저장되는 경우와 임시적으로 저장되는 경우를 구분하지 않는다.
일실시예에 따르면, 본 문서에 개시된 다양한 실시예들에 따른 방법은 컴퓨터 프로그램 제품(computer program product)에 포함되어 제공될 수 있다. 컴퓨터 프로그램 제품은 상품으로서 판매자 및 구매자 간에 거래될 수 있다. 컴퓨터 프로그램 제품은 기기로 읽을 수 있는 저장 매체(예: CD-ROM(compact disc read only memory))의 형태로 배포되거나, 또는 어플리케이션 스토어(예: 플레이 스토어™)를 통해 또는 두 개의 사용자 장치들(예: 스마트 폰들) 간에 직접, 온라인으로 배포(예: 다운로드 또는 업로드)될 수 있다. 온라인 배포의 경우에, 컴퓨터 프로그램 제품의 적어도 일부는 제조사의 서버, 어플리케이션 스토어의 서버, 또는 중계 서버의 메모리와 같은 기기로 읽을 수 있는 저장 매체에 적어도 일시 저장되거나, 임시적으로 생성될 수 있다.
다양한 실시예들에 따르면, 상기 기술한 구성요소들의 각각의 구성요소(예: 모듈 또는 프로그램)는 단수 또는 복수의 개체를 포함할 수 있으며, 복수의 개체 중 일부는 다른 구성요소에 분리 배치될 수도 있다. 다양한 실시예들에 따르면, 전술한 해당 구성요소들 중 하나 이상의 구성요소들 또는 동작들이 생략되거나, 또는 하나 이상의 다른 구성요소들 또는 동작들이 추가될 수 있다. 대체적으로 또는 추가적으로, 복수의 구성요소들(예: 모듈 또는 프로그램)은 하나의 구성요소로 통합될 수 있다. 이런 경우, 통합된 구성요소는 상기 복수의 구성요소들 각각의 구성요소의 하나 이상의 기능들을 상기 통합 이전에 상기 복수의 구성요소들 중 해당 구성요소에 의해 수행되는 것과 동일 또는 유사하게 수행할 수 있다. 다양한 실시예들에 따르면, 모듈, 프로그램 또는 다른 구성요소에 의해 수행되는 동작들은 순차적으로, 병렬적으로, 반복적으로, 또는 휴리스틱하게 실행되거나, 상기 동작들 중 하나 이상이 다른 순서로 실행되거나, 생략되거나, 또는 하나 이상의 다른 동작들이 추가될 수 있다.

Claims (15)

  1. 전자 장치에 있어서,
    제1 하우징 파트(210) 및 이동 가능하도록 상기 제1 하우징 파트(210)와 결합된(movably engaged) 제2 하우징 파트(220)를 포함하는 하우징,
    상기 전자 장치의 전면에서 보이는 표시 영역을 포함하는 플렉서블 디스플레이(230), 상기 표시 영역의 크기는, 상기 제2 하우징 파트(220)의 이동에 따라 확대되거나 축소되고,;
    인스트럭션들을 저장하는 메모리(130); 및
    상기 플렉서블 디스플레이(230) 및 상기 메모리(130)와 작동적으로 연결된 프로세서(120)를 포함하고,
    상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가,
    상기 플렉서블 디스플레이(230)의 상기 표시 영역의 크기가 제1 크기를 가지는 동안, 상기 표시 영역에, 복수의 콘텐트들을 표시하고,
    상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 기반하여:
    상기 표시 영역이 제1 크기를 가지는 동안, 상기 디스플레이 영역의 영역들(611, 613, 615) 중 제1 영역(613)에 상기 복수의 콘텐트들 중에서 선택된 콘텐트와 관련된 제1 콘텐트를 표시하고, 상기 영역들(611, 613, 615)은 서로에 대하여 배열되고,
    영역들(611, 613, 615) 중 제2 영역(611) 및 제3 영역(613)에, 제2 콘텐트의 적어도 일부와 제3 콘텐트의 적어도 일부를 각각 표시하도록 야기하고,
    상기 제1 영역은, 상기 제2 영역(611) 및 상기 제3 영역(615)에 대하여 이웃하고, 상기 제2 영역(611) 및 상기 제3 영역(615) 사이에 있고,
    상기 표시 영역의 상기 크기가 상기 제2 크기로 증가하고 있는 동안, 상기 제2 콘텐트의 상기 적어도 일부와 상기 제3 콘텐트의 상기 적어도 일부는 각각, 상기 표시 영역이 상기 제1 크기를 가지는 동안 표시되었던 선택된 콘텐트 주변에 표시되는,
    전자 장치.
  2. 청구항 1에 있어서,
    상기 표시 영역의 상기 크기가 상기 제2 크기로 증가하고 있는 동안, 상기 제1 콘텐트가 표시되는 상기 제1 영역(613)은, 상기 표시 영역이 상기 제1 크기를 가지는 동안 상기 표시 영역에서 상기 선택된 콘텐트가 표시된 영역보다 큰
    전자 장치.
  3. 청구항 1에 있어서,
    상기 표시 영역의 상기 크기가 상기 제2 크기로 증가하고 있는 동안, 상기 제1 콘텐트가 표시되는 상기 제1 영역(613)은, 상기 표시 영역이 상기 제1 크기를 가지는 동안 상기 표시 영역에서 상기 선택된 콘텐트가 표시된 영역으로부터 확대되는,
    전자 장치.
  4. 청구항 1에 있어서,
    상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가, 상기 제1 콘텐트를 상기 선택된 콘텐트가 선택됨에 기반하여, 외부 전자 장치로부터 획득하도록 야기하는
    전자 장치.
  5. 청구항 1에 있어서,
    상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가,
    사용자 입력(751)을 획득하고,
    상기 복수의 콘텐트들 중 상기 사용자 입력(751)이 획득된 위치에 대응하는 콘텐트를 선택하도록 야기하는,
    전자 장치.
  6. 청구항 1에 있어서,
    상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가,
    상기 제1 크기에서 상기 제2 크기로 상기 표시 영역의 상기 크기의 확대를 요청하는 사용자 입력(751)을 획득하고,
    상기 표시 영역이 상기 제1 크기를 가지는 동안, 상기 복수의 콘텐트들 중 지정된 영역에 위치하는 콘텐트를 선택하도록 야기하고,
    상기 표시 영역이 상기 제1 크기를 가지는 동안, 상기 복수의 콘텐트들은, 상기 표시 영역의 각 영역들에서 표시되고,
    상기 각 영역들은 서로에 대하여 배열되는,
    전자 장치.
  7. 청구항 1에 있어서,
    상기 제1 영역(613)은 상기 표시 영역이 상기 제2 크기를 가지는 동안, 상기 표시 영역의 중심 위치를 포함하는,
    전자 장치.
  8. 청구항 1에 있어서,
    상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가,
    상기 제1 크기에서 상기 제2 크기로 상기 표시 영역의 상기 크기가 확대되는 동안, 상기 선택된 콘텐트의 주변에 각각 배치되는 상기 제2 콘텐트의 적어도 일부 및 상기 제3 콘텐트의 적어도 일부를, 상기 제1 영역(613)이 상기 제2 영역(611) 및 상기 제3 영역(615) 사이에 있도록, 각각 이동시키도록 야기하는,
    전자 장치.
  9. 청구항 1에 있어서,
    상기 복수의 콘텐트들은, 하나 이상의 시각적 객체를 포함하는,
    전자 장치.
  10. 청구항 9에 있어서,
    상기 선택된 콘텐트가 이미지 객체이고, 및 상기 제1 콘텐트가 표시되는 상기 제1 영역(613)의 종횡비는 상기 이미지 객체의 종횡비와 동일한,
    전자 장치.
  11. 청구항 1에 있어서,
    상기 제2 콘텐트는, 상기 표시 영역이 상기 제1 크기를 가지는 동안, 상기 표시 영역에서 표시된 복수의 콘텐트들 중 하나의 콘텐트의 일부를 포함하는,
    전자 장치.
  12. 청구항 1에 있어서,
    상기 인스트럭션들은 상기 프로세서(120)에 의해 실행 시, 상기 전자 장치가,
    상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 따라, 상기 제1 영역(613)을, 상기 두 개의 상기 다른 영역들(611, 613, 615) 사이에서 확대하도록 야기하는,
    전자 장치.
  13. 제1 하우징 파트(210) 및 이동 가능하도록 상기 제1 하우징 파트(210)와 결합된(movably engaged) 제2 하우징 파트(220)를 포함하는 하우징, 및 상기 전자 장치의 전면에서 보이는 표시 영역을 포함하는 플렉서블 디스플레이(230)를 포함하고, 상기 표시 영역의 크기가, 상기 제2 하우징 파트(220)의 이동에 따라 확대되거나 축소되는, 전자 장치에서 수행되는 방법에 있어서,
    상기 플렉서블 디스플레이(230)의 상기 표시 영역의 크기가 제1 크기를 가지는 동안, 상기 표시 영역에, 복수의 콘텐트들을 표시하는 동작, 및
    상기 표시 영역이 제1 크기를 가지는 동안, 상기 디스플레이 영역의 영역들(611, 613, 615) 중 제1 영역(613)에 상기 복수의 콘텐트들 중에서 선택된 콘텐트와 관련된 제1 콘텐트를 표시하는 동작, 상기 영역들(611, 613, 615)은 서로에 대하여 배열되고, 및
    영역들(611, 613, 615) 중 제2 영역(611) 및 제3 영역(613)에, 제2 콘텐트의 적어도 일부와 제3 콘텐트의 적어도 일부를 각각 표시하는 동작을 포함하고,
    상기 제1 영역은, 상기 제2 영역(611) 및 상기 제3 영역(615)에 대하여 이웃하고, 상기 제2 영역(611) 및 상기 제3 영역(615) 사이에 있고,
    상기 표시 영역의 상기 크기가 상기 제2 크기로 증가하고 있는 동안, 상기 제2 콘텐트의 상기 적어도 일부와 상기 제3 콘텐트의 상기 적어도 일부는 각각, 상기 표시 영역이 상기 제1 크기를 가지는 동안 표시되었던 선택된 콘텐트 주변에 표시되는
    방법.
  14. 청구항 13에 있어서,
    상기 제1 크기에서 상기 제2 크기로 상기 표시 영역의 상기 크기의 확대를 요청하는 사용자 입력(751)을 획득하는 동작, 및
    상기 표시 영역이 상기 제1 크기를 가지는 동안, 상기 복수의 콘텐트들 중 지정된 영역에 위치하는 콘텐트를 선택하는 동작을 포함하고,
    상기 표시 영역이 상기 제1 크기를 가지는 동안, 상기 복수의 콘텐트들은, 상기 표시 영역의 각 영역들에서 표시되고,
    상기 각 영역들은 서로에 대하여 배열되는
    방법.
  15. 비-일시적 컴퓨터 판독 가능 기록 매체(non-transitory computer readable storage medium)에 있어서,
    인스트럭션들을 포함하는 프로그램을 저장하고,
    상기 인스트럭션들은, 제1 하우징 파트(210) 및 이동 가능하도록 상기 제1 하우징 파트(210)와 결합된(movably engaged) 제2 하우징 파트(220)를 포함하는 하우징, 및 상기 전자 장치의 전면에서 보이는 표시 영역을 포함하는 플렉서블 디스플레이(230)를 포함하고, 상기 표시 영역의 크기가, 상기 제2 하우징 파트(220)의 이동에 따라 확대되거나 축소되는 전자 장치의 프로세서(120)에 의해 실행될 시, 상기 전자 장치가,
    상기 플렉서블 디스플레이(230)의 상기 표시 영역의 크기가 제1 크기를 가지는 동안, 상기 표시 영역에, 복수의 콘텐트들을 표시하고,
    상기 제1 크기에서 제2 크기로 상기 표시 영역의 크기가 확대됨에 기반하여:
    상기 표시 영역이 제1 크기를 가지는 동안, 상기 디스플레이 영역의 영역들(611, 613, 615) 중 제1 영역(613)에 상기 복수의 콘텐트들 중에서 선택된 콘텐트와 관련된 제1 콘텐트를 표시하고, 상기 영역들(611, 613, 615)은 서로에 대하여 배열되고,
    영역들(611, 613, 615) 중 제2 영역(611) 및 제3 영역(613)에, 제2 콘텐트의 적어도 일부와 제3 콘텐트의 적어도 일부를 각각 표시하도록 야기하고,
    상기 제1 영역은, 상기 제2 영역(611) 및 상기 제3 영역(615)에 대하여 이웃하고, 상기 제2 영역(611) 및 상기 제3 영역(615) 사이에 있고,
    상기 표시 영역의 상기 크기가 상기 제2 크기로 증가하고 있는 동안, 상기 제2 콘텐트의 상기 적어도 일부와 상기 제3 콘텐트의 상기 적어도 일부는 각각, 상기 표시 영역이 상기 제1 크기를 가지는 동안 표시되었던 선택된 콘텐트 주변에 표시되는,
    비-일시적 컴퓨터 판독 가능 기록 매체.
PCT/KR2024/012017 2023-11-07 2024-08-12 플렉서블 디스플레이에서 콘텐트를 표시하는 전자 장치, 방법, 및 비-일시적 컴퓨터 판독 가능 기록 매체 Pending WO2025100697A1 (ko)

Priority Applications (1)

Application Number Priority Date Filing Date Title
US18/886,514 US20250148948A1 (en) 2023-11-07 2024-09-16 Electronic device, method, and non-transitory computer readable storage medium for displaying content on flexible display

Applications Claiming Priority (4)

Application Number Priority Date Filing Date Title
KR20230153167 2023-11-07
KR10-2023-0153167 2023-11-07
KR1020230186434A KR20250066988A (ko) 2023-11-07 2023-12-19 플렉서블 디스플레이에서 콘텐트를 표시하는 전자 장치, 방법, 및 비-일시적 컴퓨터 판독 가능 기록 매체
KR10-2023-0186434 2023-12-19

Related Child Applications (1)

Application Number Title Priority Date Filing Date
US18/886,514 Continuation US20250148948A1 (en) 2023-11-07 2024-09-16 Electronic device, method, and non-transitory computer readable storage medium for displaying content on flexible display

Publications (1)

Publication Number Publication Date
WO2025100697A1 true WO2025100697A1 (ko) 2025-05-15

Family

ID=95695475

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/KR2024/012017 Pending WO2025100697A1 (ko) 2023-11-07 2024-08-12 플렉서블 디스플레이에서 콘텐트를 표시하는 전자 장치, 방법, 및 비-일시적 컴퓨터 판독 가능 기록 매체

Country Status (1)

Country Link
WO (1) WO2025100697A1 (ko)

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR20170005557A (ko) * 2015-07-06 2017-01-16 엘지전자 주식회사 변형 가능한 디스플레이 장치 및 그의 동작 방법
US20180018033A1 (en) * 2015-04-07 2018-01-18 Boe Technology Group Co., Ltd. Display device
KR20190141518A (ko) * 2018-06-14 2019-12-24 삼성전자주식회사 디스플레이 영역의 크기 변경이 가능한 플렉시블 디스플레이를 포함하는 전자 장치 및 그 제어 방법
KR20210033784A (ko) * 2019-09-19 2021-03-29 삼성전자주식회사 사용자 입력에 따라 사용자 인터페이스를 변경하는 전자 장치 및 방법
KR20230139275A (ko) * 2022-03-25 2023-10-05 삼성전자주식회사 플렉서블 디스플레이의 표시 영역의 사이즈의 변경과 관련된 적응적 제어를 위한 전자 장치, 방법, 및 비일시적 컴퓨터 판독가능 저장 매체

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20180018033A1 (en) * 2015-04-07 2018-01-18 Boe Technology Group Co., Ltd. Display device
KR20170005557A (ko) * 2015-07-06 2017-01-16 엘지전자 주식회사 변형 가능한 디스플레이 장치 및 그의 동작 방법
KR20190141518A (ko) * 2018-06-14 2019-12-24 삼성전자주식회사 디스플레이 영역의 크기 변경이 가능한 플렉시블 디스플레이를 포함하는 전자 장치 및 그 제어 방법
KR20210033784A (ko) * 2019-09-19 2021-03-29 삼성전자주식회사 사용자 입력에 따라 사용자 인터페이스를 변경하는 전자 장치 및 방법
KR20230139275A (ko) * 2022-03-25 2023-10-05 삼성전자주식회사 플렉서블 디스플레이의 표시 영역의 사이즈의 변경과 관련된 적응적 제어를 위한 전자 장치, 방법, 및 비일시적 컴퓨터 판독가능 저장 매체

Similar Documents

Publication Publication Date Title
WO2022025450A1 (ko) 슬라이딩 가능한 전자 장치 및 이의 제어 방법
WO2022114848A1 (ko) 플렉서블 전자 장치 및 카메라 뷰 화면 운용 방법
WO2022203285A1 (ko) 이미지 안정화 어셈블리를 포함하는 카메라 모듈 및 상기 카메라 모듈을 포함하는 전자 장치
WO2022086068A1 (ko) 전자 장치 및 전자 장치의 동작 방법
WO2023204439A1 (ko) 플렉서블 디스플레이를 포함하는 전자 장치 및 전자 장치의 동작 방법
WO2024196117A1 (ko) 스타일러스 펜의 입력을 처리하는 전자 장치와 이의 동작 방법
WO2023017954A1 (ko) 플렉서블 디스플레이를 포함하는 전자 장치 및 이의 제어 방법
WO2022103040A1 (ko) 플렉서블 디스플레이를 포함하는 전자 장치와 이의 동작 방법
WO2023191303A1 (ko) 플렉서블 디스플레이를 포함하는 전자 장치 및 이의 제어 방법
WO2023182651A1 (ko) 스피커 조립체를 이용한 접지 구조를 포함하는 전자 장치
WO2025100697A1 (ko) 플렉서블 디스플레이에서 콘텐트를 표시하는 전자 장치, 방법, 및 비-일시적 컴퓨터 판독 가능 기록 매체
WO2025121669A1 (ko) 전자 장치 및 전자 장치에서 홈 화면의 편집을 위한 방법
WO2024210693A1 (ko) 실행 화면들의 표시를 제어하는 전자 장치, 이의 동작 방법 및 기록 매체
WO2024063432A1 (ko) 전자 장치의 어플리케이션 실행 화면 제어 방법 및 그 전자 장치
WO2022154536A1 (ko) 전자 장치 및 이를 이용한 키 입력 회로에서 검출되는 터치 인터랙션에 기반하여 어플리케이션의 기능 제어 방법
WO2025089769A1 (ko) 전자 장치 및 이미지 편집 방법
WO2024117558A1 (ko) 플렉서블 디스플레이를 포함하는 전자 장치 및 이의 제어 방법
WO2025009887A1 (ko) 플렉서블 전자 장치
WO2024215035A2 (ko) 코일과 자성체를 포함하는 전자 장치
WO2025018561A1 (ko) 회전된 화면을 표시하는 전자 장치, 방법, 및 비-일시적 컴퓨터 판독 가능 기록 매체
WO2023182654A1 (ko) 사용자 입력을 식별하기 위한 전자 장치 및 방법
WO2025121933A1 (ko) 전자 장치 및 이를 이용한 스크롤 바 표시 방법
WO2024049270A1 (ko) 슬라이더블 디스플레이를 포함하는 전자 장치와 이의 동작 방법
WO2024191041A1 (ko) 롤러블 디스플레이를 포함하는 전자 장치 및 상기 전자 장치의 제어 방법
WO2025095326A1 (ko) 슬라이더블 전자 장치 및 그의 방법

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 24888893

Country of ref document: EP

Kind code of ref document: A1