KR20120005094A - Method for controlling scroll screen area of touch type mobile terminal and touch type mobile terminal having screen area scroll function - Google Patents

Method for controlling scroll screen area of touch type mobile terminal and touch type mobile terminal having screen area scroll function Download PDF

Info

Publication number
KR20120005094A
KR20120005094A KR1020100065665A KR20100065665A KR20120005094A KR 20120005094 A KR20120005094 A KR 20120005094A KR 1020100065665 A KR1020100065665 A KR 1020100065665A KR 20100065665 A KR20100065665 A KR 20100065665A KR 20120005094 A KR20120005094 A KR 20120005094A
Authority
KR
South Korea
Prior art keywords
screen
scroll
touch
application
area
Prior art date
Application number
KR1020100065665A
Other languages
Korean (ko)
Inventor
이지훈
이해성
Original Assignee
주식회사 엘지유플러스
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
Application filed by 주식회사 엘지유플러스 filed Critical 주식회사 엘지유플러스
Priority to KR1020100065665A priority Critical patent/KR20120005094A/en
Publication of KR20120005094A publication Critical patent/KR20120005094A/en

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input 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/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/03Arrangements for converting the position or the displacement of a member into a coded form
    • G06F3/041Digitisers, e.g. for touch screens or touch pads, characterised by the transducing means
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input 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/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction 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/0485Scrolling or panning
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input 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/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input 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/14Digital output to display device ; Cooperation and interconnection of the display device with other functional units

Landscapes

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

Abstract

PURPOSE: A screen area scroll controlling method of a touch type terminal and touch terminal having a screen area scroll function are provided to supply the convenience of a user to a user by implementing a scroll operation of a body area in a mobile web application on a web application screen of a desktop computer. CONSTITUTION: A mobile web application(30) displays a header, a body, and a footer area on an application screen. A touch discriminator(50) discriminates a scroll operation by touch and supplies the header to a middleware system(20). The middleware system captures the body area of a web page in an independent scroll area. If a scroll request is detected, the middleware system scrolls the screen of the body area corresponding to the scroll operation.

Description

터치식 단말기의 화면 영역 스크롤 제어 방법과 화면 영역 스크롤 기능을 갖춘 터치식 단말기{Method for Controlling Scroll Screen Area of Touch Type Mobile Terminal and Touch Type Mobile Terminal Having Screen Area Scroll Function}Method for Controlling Scroll Screen Area of Touch Type Mobile Terminal and Touch Type Mobile Terminal Having Screen Area Scroll Function}

본 발명은 터치식 화면 조작에 의해 화면 스크롤이 가능한 단말기에서 원하는 일부 화면 영역만을 단독적으로 스크롤할 수 있도록 하는 터치식 단말기의 화면 영역 스크롤 제어 방법과 화면 영역 스크롤 기능을 갖춘 터치식 단말기에 관한 것이다.The present invention relates to a screen area scroll control method of a touch type terminal and a touch type terminal having a screen area scroll function so that only a part of a desired screen area can be scrolled by a terminal capable of scrolling a screen by a touch screen operation.

주지된 바와 같이, 휴대용 이동통신 단말기에 있어서는 일반적인 음성 통화 및 메시지 데이터 통신만을 제한적으로 진행하던 것으로부터 진보하여 인터넷 회선 속도의 증가와 멀티미디어 기술의 발전에 따라 인터넷망을 통한 멀티미디어 웹정보의 유통이 활발하게 이루어지고 있고, 인터넷을 통한 보안 기술이 발전함에 따라, 보다 안전하고 개인적인 모바일 웹 서비스 기술이 개발되어 상용화되고 있는 추세이다. As is well known, the portable mobile communication terminal has progressed from the limited progress of general voice call and message data communication only, and the distribution of multimedia web information through the internet network is increasing with the increase of internet line speed and the development of multimedia technology. As the security technology through the Internet is developed, a more secure and personal mobile web service technology is developed and commercialized.

또한, 종래 이동 통신망을 사용하는 이동통신 단말기에서의 모바일 컨텐츠 환경은 각 이동 통신사에서 구축해 놓은 무선 포털에 접속하게 되면, 해당 이동 통신사와 파트너 계약에 의해 제공되는 제한적인 컨텐츠에 접근하여 컨텐츠 제공 서비스를 받을 수 있도록 하는 폐쇄망 구조로 이루어져 있었는 바, 최근에는 개방적인 모바일 컨텐츠 제공 환경을 제공할 수 있는 풀 브라우징(Full Browsing) 서비스가 개발되어 상용화되고 있다. In addition, when a mobile content environment in a mobile communication terminal using a conventional mobile communication network is connected to a wireless portal established by each mobile communication company, a content providing service is provided by accessing limited content provided by a partner agreement with the mobile communication company. It was composed of a closed network structure that can be received. Recently, a full browsing service that can provide an open mobile content providing environment has been developed and commercialized.

이러한 이동통신 단말기에서의 풀 브라우징 서비스를 포함한 모바일 웹 기술에 있어서는 단말기에 탑재되는 다양한 모바일 웹 어플리케이션 프로그램의 구동을 통해 가능하도록 되어 있는데, 이러한 모바일 웹 어플리케이션은 친구 관계를 형성한 사용자들간의 문자대화 및 파일 송수신이 가능한 인스턴트 메신저 서비스나, 트위터 서비스, 음악 및 영상 등과 같은 멀티미디어 컨텐츠를 검색하고 다운로드받을 수 있도록 하는 멀티미디어 데이터 제공 서비스 등과 같은 다양한 서비스 기능을 제공할 수 있도록 하고 있다. In the mobile web technology including the full browsing service in the mobile communication terminal, the mobile web application is enabled by driving various mobile web application programs mounted on the terminal. It provides various service functions such as an instant messenger service capable of transmitting and receiving files, a multimedia data providing service for searching and downloading multimedia contents such as a Twitter service, music, and video.

최근의 이동통신 단말기는 이러한 모바일 웹 어플리케이션의 화면을 대화면으로 구현할 수 있도록 하고, 보다 직관적인 화면 조작을 위해 터치 입력 소자가 화면 상에 구현된 터치식 단말기의 형태로 변모하고 있다. Recently, a mobile communication terminal can implement a screen of such a mobile web application on a large screen, and has been transformed into a touch terminal in which a touch input element is implemented on a screen for more intuitive screen manipulation.

이러한 터치식 단말기에서 구현되는 모바일 웹 어플리케이션에 의한 화면 구성은 어플리케이션의 타이틀이 표시되는 헤더(Header)와, 실질적인 어플리케이션 데이터의 내용이 표시되는 바디(Body), 어플리케이션에 대한 메뉴 조작 버튼이 표시되는 풋터(Footer) 영역으로 구분되는데, 현재의 어플리케이션 화면은 헤더와, 바디, 풋터가 모두 하나의 이미지로 캡쳐되어 있는 형태가 일반적이서서 사용자의 스크롤 조작에 따라 헤더, 바디, 풋터의 화면이 한꺼번에 스크롤되어 버리게 된다.The screen configuration by the mobile web application implemented in the touch terminal includes a header in which the title of the application is displayed, a body in which the actual content of the application data is displayed, and a footer in which a menu operation button for the application is displayed. It is divided into (Footer) area. In the current application screen, the header, body, and footer are all captured as one image. As the user scrolls, the screen of the header, body, and footer is scrolled at once. Discarded.

더욱이, 모바일 어플리케이션 화면의 전송측에서 헤더, 바디, 풋터를 각각 분리할 수 있도록 하는 환경을 갖는 어플리케이션 데이터를 제공하더라도, 현재의 단말기에서는 이러한 환경 구분 능력을 가지고 있지 않기 때문에 헤더, 바디, 풋터를 모두 하나의 이미지로 캡쳐하게 되므로, 일반적인 유선 통신 방식의 데스크탑 컴퓨터 단말에서 바디 영역의 데이터 화면 부분만을 스크롤 하는데 익숙한 사용자에게는 상당한 불편함이 따르게 된다는 문제점이 있다. Moreover, even if the transmitting side of the mobile application screen provides application data having an environment in which the header, body, and footer can be separated, the current terminal does not have such an environment distinguishing capability, Since it is captured as one image, there is a problem that a user who is used to scrolling only the data screen portion of the body area in a general wired communication desktop computer terminal has a considerable inconvenience.

따라서, 본 발명은 상기한 종래의 문제점들을 해결하기 위해 이루어진 것으로서, 그 목적은 터치식으로 화면 스크롤이 가능한 단말기에서 모바일 웹 어플리케이션의 화면 중에서 실질적인 데이터 내용을 갖는 I-프레임(I-Frame) 구성의 일부 화면 영역만을 단독적으로 스크롤시킬 수 있도록 하는 터치식 단말기의 화면 영역 스크롤 제어 방법과 화면 영역 스크롤 기능을 갖춘 터치식 단말기를 제공하는 것이다.Accordingly, the present invention has been made to solve the above-described problems, and an object thereof is to provide an I-frame configuration having substantial data contents among screens of a mobile web application in a touch screen scrollable terminal. The present invention provides a method for controlling a screen area scrolling of a touch type terminal capable of scrolling only a part of a screen area alone, and a touch type terminal having a screen area scrolling function.

상기한 목적을 달성하기 위한 본 발명의 방법에 따르면, 터치식 단말기에서 모바일 웹 어플리케이션의 화면에 대한 스크롤 구동을 제어하는 방법에 있어서, 상기 터치식 단말기의 미들웨어 시스템에서 모바일 웹 어플리케이션을 실행하여 데이터 통신에 의해 해당 어플리케이션 웹 페이지 데이터를 수신하면, 해당 어플리케이션 웹 페이지의 헤더(Header) 영역, 바디(Body) 영역, 풋터(Footer) 영역 중에서 바디 영역만이 단독적으로 스크롤 가능한 페이지 구조를 갖는지 판단하는 단계와, 상기 어플리케이션 웹 페이지의 바디 영역만이 단독적 스크롤 가능한 구조로 판별되면, 상기 헤더 영역 및 풋터 영역과는 별도로 바디 영역만을 이미지로 캡쳐하는 단계 및, 사용자의 터치 조작에 의한 스크롤 요구가 있으면, 상기 미들웨어 시스템에서 상기 헤더 및 풋터 영역의 화면이 고정 표시되도록 하는 상태에서, 사용자의 스크롤 조작 정도에 대응하여 상기 바디 영역의 화면만을 단독적으로 스크롤하는 제3단계를 포함하여 이루어진 것을 특징으로 하는 터치식 단말기의 화면 영역 스크롤 제어 방법을 제공한다.According to the method of the present invention for achieving the above object, in the method for controlling the scroll drive for the screen of the mobile web application in the touch terminal, by executing the mobile web application in the middleware system of the touch terminal data communication When receiving the application web page data by the step of determining whether only the body area of the header area, body area, footer area of the application web page has a scrollable page structure alone and Capturing only the body area as an image separately from the header area and the footer area if only the body area of the application web page is determined as a scrollable structure; and if there is a scroll request by a user's touch operation, the middleware The header and footer in the system And a third step of independently scrolling only the screen of the body region in response to the scroll manipulation of the user in a state where the reverse screen is fixedly displayed. to provide.

상기한 목적을 달성하기 위한 본 발명의 터치식 단말기에 따르면, 모바일 웹 어플리케이션의 화면에 대한 스크롤 기능을 갖춘 터치식 단말기에 있어서, 웹을 기반으로 미들웨어 시스템에 의해 구동되어, 해당 어플리케이션 웹 페이지 데이터의 헤더 영역, 바디 영역, 풋터 영역으로 구분된 어플리케이션 화면이 표시되도록 하는 적어도 하나의 모바일 웹 어플리케이션과, 터치 스크린의 사용자 터치 조작에 의한 스크롤 동작을 판별하여 미들웨어 시스템에 제공하는 터치 구동 판별부 및, 상기 모바일 웹 어플리케이션의 웹페이지 데이터에서 바디 영역이 단독적인 스크롤 가능 영역으로 판별된 웹 페이지에 대해서 상기 바디 영역만을 이미지로 캡쳐하고, 상기 터치 구동 판별부를 통해 사용자의 스크롤 요구가 감지되면 상기 헤더 및 풋터 영역의 화면이 고정 표시되도록 하는 상태에서 사용자의 스크롤 조작 정도에 대응하여 상기 바디 영역의 화면만이 단독적으로 스크롤되도록 하는 미들웨어 시스템을 포함하여 구성된 것을 특징으로 하는 화면 영역 스크롤 기능을 갖춘 터치식 단말기를 제공한다.According to the touch terminal of the present invention for achieving the above object, in the touch terminal having a scroll function for the screen of the mobile web application, driven by a middleware system based on the web, the application of the web page data At least one mobile web application for displaying an application screen divided into a header area, a body area, and a footer area, a touch driving determination unit for determining a scroll operation by a user's touch operation of a touch screen and providing the same to a middleware system; Only the body region is captured as an image of a web page whose body region is determined as an exclusive scrollable region in web page data of a mobile web application, and the header and footer region is detected when a user's scroll request is detected through the touch driving determination unit. The screen of According to an aspect of the present invention, there is provided a touch-type terminal having a screen area scrolling function, including a middleware system configured to scroll only the screen of the body area alone in response to a scroll manipulation degree of a user.

이상과 같이 본 발명에 따르면, 터치식 이동통신 단말기에서 모바일 웹 어플리케이션에 의해 구동되어 화면 상에 표시되는 헤더, 바디, 풋터의 구성을 갖는 어플리케이션 화면 중에서, I-프레임의 컨텐츠 표현 언어가 삽입된 바디 부분의 화면 영역만을 사용자의 스크롤 조작에 따라 단독적으로 스크롤될 수 있도록 함에 따라, 일반적인 데스크탑 컴퓨터 단말의 웹 어플리케이션 화면에서 실행될 수 있는 바디 영역만의 스크롤 조작을 이동통신 단말기의 모바일 웹 어플리케이션에서도 구현할 수 있으므로, 사용자에게 단말기 사용상의 큰 편의성을 제공할 수 있다는 효과를 갖게 된다. As described above, according to the present invention, a body in which a content expression language of an I-frame is inserted among application screens having a configuration of a header, a body, and a footer driven by a mobile web application and displayed on a screen in a touch type mobile communication terminal Since only the screen area of the portion can be scrolled independently according to the user's scrolling operation, the scrolling operation of only the body area that can be executed on the web application screen of the general desktop computer terminal can be implemented in the mobile web application of the mobile communication terminal. Therefore, the user can have a great convenience in using the terminal.

도 1은 본 발명에 따른 화면 영역 스크롤 기능을 갖춘 터치식 단말기에 대한 구성을 나타낸 도면,
도 2는 본 발명에 적용되는 모바일 웹 어플리케이션 화면의 구성예를 나타낸 도면,
도 3은 본 발명의 바람직한 실시예에 따라 웹 어플리케이션 화면의 바디 화면 영역만이 단독적으로 터치 조작에 의한 화면 스크롤이 이루어지는 상태를 예시적으로 나타낸 도면,
도 4는 본 발명에 따른 터치식 단말기의 화면 영역 스크롤 제어 방법의 동작을 설명하는 플로우차트이다.
1 is a view showing a configuration for a touch terminal with a screen area scrolling function according to the present invention;
2 is a view showing a configuration example of a mobile web application screen applied to the present invention,
FIG. 3 is a diagram illustrating a state in which screen scrolling is performed by touch operation alone in a body screen area of a web application screen according to an exemplary embodiment of the present invention.
4 is a flowchart illustrating an operation of a screen area scroll control method of a touch terminal according to the present invention.

이하, 상기한 바와 같이 구성된 본 발명에 대해 첨부도면을 참조하여 상세히 설명한다. Hereinafter, the present invention configured as described above will be described in detail with reference to the accompanying drawings.

도 1은 본 발명에 따른 화면 영역 스크롤 기능을 갖춘 터치식 단말기에 대한 구성을 나타낸 도면이다. 1 is a diagram illustrating a configuration of a touch terminal with a screen area scrolling function according to the present invention.

도 1에 도시된 바와 같이, 본 발명에 따른 화면 영역 스크롤 기능을 갖춘 터치식 단말기는, 오퍼레이팅 시스템(Operating System; OS)(10)과, 미들웨어 시스템(Middle Ware System)(20), 모바일 웹 어플리케이션 구성군(30), 터치 스크린(40), 터치 구동 판별부(50), 표시 구동부(60), 표시부(70)로 구성된다. As shown in FIG. 1, a touch terminal having a screen area scrolling function according to the present invention includes an operating system (OS) 10, a middle ware system 20, and a mobile web application. It consists of the configuration group 30, the touch screen 40, the touch drive determination part 50, the display drive part 60, and the display part 70. As shown in FIG.

상기 오퍼레이팅 시스템(10)은 해당 터치식 단말기의 전체 시스템 동작을 총괄적으로 운영하기 위한 운영 체제로서의 프로그램에 해당된다. The operating system 10 corresponds to a program as an operating system for collectively operating the entire system operation of the touch terminal.

상기 미들웨어 시스템(20)은 상기 오퍼레이팅 시스템(10)의 운영 체제 하에서 상기 모바일 웹 어플리케이션 구성군(30)에 포함된 모바일 웹 어플리케이션을 구동하기 위한 플랫폼의 역할을 수행하는 것으로서, 이는 사용자의 터치 구동에 따른 입력 조작 및 모바일 웹 어플리케이션의 데이터 송수신을 위한 유저인터페이스 기능을 수행하는 유저인터페이스 프레임 워크(22)와, 무선 인터넷의 인터넷 웹페이지 데이터를 비롯하여 상기 모바일 웹 어플리케이션의 웹ㅁ페이지 화면 데이터를 처리하기 위한 구동을 수행하는 웹 브라우저(24), 해당 단말기의 리소스 접근을 위한 자바스크립트(Java Script) 언어의 해석 및 구동 처리를 담당하는 자바스크립트 모듈(26), 모바일 웹 어플리케이션에 포함된 플러그인 기능을 활성화시켜서 플러그인 기능이 수행되도록 하는 플러그인 모듈(28)을 포함하여 구성된다. The middleware system 20 serves as a platform for running a mobile web application included in the mobile web application component group 30 under an operating system of the operating system 10, which is a function of driving a user's touch. A user interface framework 22 that performs a user interface function for input operation and data transmission and reception of a mobile web application, and web page data of the mobile web application, including Internet web page data of the wireless Internet. By activating the web browser (24) performing the operation, the JavaScript module (26) responsible for interpreting and driving the JavaScript language for accessing the resources of the terminal, the plug-in function included in the mobile web application To allow the plug-in It is configured to include a plug-in module 28.

상기 모바일 웹 어플리케이션 구성군(30)에는 다수의 모바일 웹 어플리케이션(A1∼An)을 포함하고 있는 바, 해당 모바일 웹 어플리케이션 프로그램으로는 인터넷 웹을 통한 데이터 송수신 및 멀티미디어 정보의 교환이 가능한 프로그램으로서, 예컨대 인스턴트 메신저 프로그램이나, 트위터 프로그램, 플래쉬 정보 재생 프로그램, 웹방송 재생 프로그램 등이 이에 해당된다. The mobile web application component group 30 includes a plurality of mobile web applications A1 to An. The mobile web application program is a program capable of transmitting and receiving data and exchanging multimedia information through the Internet web, for example. This includes an instant messenger program, a Twitter program, a flash information reproducing program, and a web broadcasting reproducing program.

상기 터치 스크린(40)은 상기 표시부(70)의 표시 화면 영역에 형성되어 있는 것으로서, 외부로부터의 사용자의 터치 조작 및 스크롤 조작에 의해 조작되는 화면 영역에 대한 전기적인 터치 구동 신호를 발생한다. The touch screen 40 is formed in the display screen area of the display unit 70 and generates an electric touch driving signal for the screen area operated by a user's touch operation and scroll operation from the outside.

상기 터치 구동 판별부(50)는 상기 터치 스크린(50)의 터치 구동 신호를 통해 해당 터치 스크린(40)이 조작되는 화면 영역 및 조작 형태를 판별하여 터치 판별 정보를 상기 미들웨어 시스템(20)에 제공한다. The touch driving determination unit 50 determines the screen area and operation type of the corresponding touch screen 40 through the touch driving signal of the touch screen 50 and provides the touch determination information to the middleware system 20. do.

상기 표시 구동부(60)는 상기 미들웨어 시스템(20)웹브라우저(24)를 통한 웹 어플리케이션의 구동 화면 또는 모바일 웹 어플리케이션의 자체 구동에 의한 표시 화면을 상기 표시부(70)에 화면 표시하기 위한 구동 동작을 수행한다. The display driver 60 performs a driving operation for displaying the driving screen of the web application through the middleware system 20 web browser 24 or the display screen by the self driving of the mobile web application on the display unit 70. To perform.

한편, 도 2는 본 발명에 적용되는 모바일 웹 어플리케이션 화면의 구성예를 나타낸 도면이다. On the other hand, Figure 2 is a view showing an example of the configuration of a mobile web application screen applied to the present invention.

도 2에 도시된 바와 같이, 모바일 웹 어플리케이션의 웹페이지 화면 구성은 헤더(Header) 영역과, 바디(Body) 영역, 풋터(Footer) 영역으로 구성되어 있는데, 실질적인 컨텐츠 데이터 내용은 바디 영역에 기재되어 있으며, 상기 웹 어플리케이션의 페이지 저작시에 I-프레임 구분 항목을 기재하도록 하고, 상기 미들웨어 시스템(20)에서 해당 페이지 데이터의 구분 항목을 인식하여 해당 웹 페이지의 바디 영역이 I-프레임으로 구성되는 지의 여부를 판별할 수 있게 된다. As shown in FIG. 2, the web page screen configuration of the mobile web application is composed of a header area, a body area, and a footer area. Substantial content data contents are described in the body area. In addition, I-frame division items are to be described when authoring the page of the web application, and the middleware system 20 recognizes the division items of the corresponding page data to determine whether the body region of the web page is composed of I-frames. It is possible to determine whether or not.

즉, I-프레임의 바디 영역을 갖는 모바일 웹 어플리케이션 웹 페이지의 페이지 구조는 하기한 표 1과 같이 이루어진다. That is, the page structure of the mobile web application web page having the body region of the I-frame is as shown in Table 1 below.


<html>
<head>

...

</head>
<body>
<div id = "content">
<iframe src="content_iframe.html"
name="content_iframe" width="100%" height="100%"
frameborder="no" scrolling="no"></iframe>


</div>
</body>
</html>

<html>
<head>

...

</ head>
<body>
<div id = "content">
<iframe src = "content_iframe.html"
name = "content_iframe" width = "100%" height = "100%"
frameborder = "no" scrolling = "no"></iframe>


</ div>
</ body>
</ html>

여기서, 상기 "<iframe src="content_iframe.html" name="content_iframe" width="100%" height="100%" frameborder="no" scrolling="no"></iframe>>"은 웹 어플리케이션 페이지 구조가 I-프레임 구조를 갖는다는 것을 표시하는 것으로서, 웹 어플리케이션의 저작을 수행하는 SDK(Standard Development Kit) 등과 같이 WYSISYG(What You See Is What You Get) 기반의 IDE 환경을 제공하는 저작 도구를 이용하여 I-프레임의 이미지 스크롤링 기능을 제공할 수 있는 템플랫을 선택함으로써, I-프레임 영역의 구성에 의한 바디 영역만의 이미지 스크롤이 가능한 웹 페이지를 제작할 수 있다. Where "<iframe src =" content_iframe.html "name =" content_iframe "width =" 100% "height =" 100% "frameborder =" no "scrolling =" no "> </ iframe >>" is a web application An authoring tool that provides an IDE environment based on What You See Is What You Get (WYSISYG), such as the SDK (Standard Development Kit) that authors web applications. By selecting a template that can provide an image scrolling function of the I-frame, a web page capable of scrolling an image of only the body region by the configuration of the I-frame region can be produced.

그에 따라, 상기 미들웨어 시스템(20)은 상기 모바일 웹 어플리케이션의 웹 페이지를 구성하는 바디 영역에서 I-프레임 구조를 읽어들여서 해당 웹 페이지가 바디 영역만을 단독적으로 스크롤 가능하다는 것을 판별하여 헤더, 바디, 풋터를 하나의 이미지로 캡쳐 하지 않고 바디 영역만을 분리한 이미지를 생성하게 되고, 사용자의 터치 스크린(40) 조작에 의한 바디 영역의 스크롤 요청이 있으면, 도 3에 도시된 바와 같이 헤더 영역 및 풋터 영역이 화면 상에 고정되어 있는 상태에서, 바디 영역만이 사용자의 스크롤 조작에 대응하여 스크롤링이 이루어지도록 한다. Accordingly, the middleware system 20 reads an I-frame structure from the body region constituting the web page of the mobile web application, and determines that the web page can only scroll the body region alone. Does not capture a single image, but generates an image that separates only the body region, and when a user requests a scrolling of the body region by manipulating the touch screen 40, the header region and the footer region as shown in FIG. In a state of being fixed on the screen, only the body region allows scrolling to be performed in response to a user's scrolling operation.

이어, 상기한 바와 같이 이루어진 본 발명의 동작에 대해 도 4의 플로우차트를 참조하여 상세히 설명한다. Next, the operation of the present invention made as described above will be described in detail with reference to the flowchart of FIG. 4.

먼저, 미들웨어 시스템(20)은 웹 브라우저(24)를 통하거나 해당 어플리케이션을 자체적으로 구동시켜서 다수의 모바일 웹 어플리케이션(A1∼An) 중에서 특정 모바일 웹 어플리케이션을 실행하게 되고(단계 S10), 무선 인터넷 통신을 통해서 해당 웹 어플리케이션에 따른 웹 페이지를 수신하게 된다(단계 S11).First, the middleware system 20 executes a specific mobile web application among the plurality of mobile web applications A1 to An through the web browser 24 or by driving the corresponding application itself (step S10). Through the web page according to the corresponding web application is received (step S11).

그 상태에서, 상기 미들웨어 시스템(20)은 상기 어플리케이션 웹 페이지를 구성하는 헤더, 바디, 풋터 중에서 바디 영역의 데이터 구조가 I-프레임으로 구성되어 바디 영역만의 단독적인 스크롤이 가능한 지의 여부를 판단한다(단계 S12).In this state, the middleware system 20 determines whether the data structure of the body region is composed of I-frames among headers, bodies, and footers constituting the application web page, so that only the body region can be scrolled alone. (Step S12).

상기 판단 결과, 상기 어플리케이션 웹 페이지의 바디 영역에 I-프레임 기능이 구성되어 있지 않다고 판단되면, 어플리케이션 웹 페이지의 헤더, 바디, 풋터를 하나의 이미지로 캡쳐하게 되고, 사용자의 터치 스크린(40) 조작에 의한 스크롤 요구가 있는 지를 판단하여(단계 S13), 스크롤 요구가 있으면 해당 어플리케이션 화면의 헤더, 바디, 풋터가 하나의 이미지 형태로 함께 스크롤 될 수 있도록 한다(단계 S14).As a result of the determination, if it is determined that the I-frame function is not configured in the body region of the application web page, the header, body, and footer of the application web page are captured as one image, and the user's touch screen 40 is manipulated. In step S13, if there is a scroll request, the header, body, and footer of the corresponding application screen can be scrolled together in the form of one image (step S14).

하지만, 상기 단계 S12의 판단 결과에 따라 상기 어플리케이션 웹 페이지의 바디 영역이 I-프레임의 구조를 가지고 있다고 판단되면, 웹 페이지에서 바디 영역만을 별도의 이미지로 캡쳐하여 생성하고, 사용자의 터치 스크린(40) 조작에 의한 스크롤 요구가 있는지를 판단한다(단계 S16).However, when it is determined that the body region of the application web page has an I-frame structure according to the determination result of step S12, only the body region of the web page is captured and generated as a separate image, and the user's touch screen 40 It is determined whether there is a scroll request by the operation (step S16).

상기 판단 결과, 터치 구동 판별부(50)를 통해서 상기 터치 스크린(40)의 사용자 조작에 의해 바디 영역의 스크롤 요구가 있다고 판단되면, 어플리케이션 화면의 헤더 및 풋터가 고정 표시된 상태에서, 상기 터치 구동 판별부(50)에서 판별한 스크롤 조작 정도에 대응하여 상기 어플리케이션 화면의 바디 영역만이 단독적으로 스크롤 될 수 있도록 한다(단계 S17).As a result of the determination, if it is determined that the scroll request of the body region is requested by the user operation of the touch screen 40 through the touch driving determination unit 50, the touch driving determination is performed while the header and the footer of the application screen are fixedly displayed. Only the body region of the application screen can be scrolled alone in correspondence with the scroll manipulation degree determined by the section 50 (step S17).

상기에서 본 발명의 특정한 실시예가 설명 및 도시되었지만, 본 발명이 당업자에 의해 다양하게 변형되어 실시될 가능성이 있는 것은 자명한 일이다. 이와 같은 변형된 실시예들은 본 발명의 기술적 사상이나 전망으로부터 개별적으로 이해되어져서는 안되며, 본 발명에 첨부된 청구범위 안에 속한다고 해야 할 것이다.While specific embodiments of the present invention have been described and illustrated above, it will be apparent that the present invention may be embodied in various modifications by those skilled in the art. Such modified embodiments should not be understood individually from the technical spirit or the prospect of the present invention, but should fall within the claims appended to the present invention.

10:오퍼레이팅 시스템, 20:미들웨어 시스템,
22:유저인터페이스 프레임워크, 24:웹 브라우저,
26:자바스크립트 모듈, 28:플러그인 모듈,
30:모바일 웹 어플리케이션 구성군, 40:터치 스크린,
50:터치 구동 판별부, 60:표시 구동부,
70:표시부.
10: operating system, 20: middleware system,
22: user interface framework, 24: web browser,
26: JavaScript module, 28: Plug-in module,
30: mobile web application components, 40: touch screen,
50: touch drive determination unit, 60: display drive unit,
70: display unit.

Claims (4)

터치식 단말기에서 모바일 웹 어플리케이션의 화면에 대한 스크롤 구동을 제어하는 방법에 있어서,
상기 터치식 단말기의 미들웨어 시스템에서 모바일 웹 어플리케이션을 실행하여 데이터 통신에 의해 해당 어플리케이션 웹 페이지 데이터를 수신하면, 해당 어플리케이션 웹 페이지의 헤더(Header) 영역, 바디(Body) 영역, 풋터(Footer) 영역 중에서 바디 영역만이 단독적으로 스크롤 가능한 페이지 구조를 갖는지 판단하는 제1단계와;
상기 어플리케이션 웹 페이지의 바디 영역만이 단독적 스크롤 가능한 구조로 판별되면, 상기 헤더 영역 및 풋터 영역과는 별도로 바디 영역만을 이미지로 캡쳐하는 제2단계; 및
사용자의 터치 조작에 의한 스크롤 요구가 있으면, 상기 미들웨어 시스템에서 상기 헤더 및 풋터 영역의 화면이 고정 표시되도록 하는 상태에서, 사용자의 스크롤 조작 정도에 대응하여 상기 바디 영역의 화면만을 단독적으로 스크롤하는 제3단계를 포함하여 이루어진 것을 특징으로 하는 터치식 단말기의 화면 영역 스크롤 제어 방법.
In the method for controlling the scroll drive for the screen of the mobile web application in the touch terminal,
When the mobile web application is executed in the middleware system of the touch terminal to receive the corresponding application web page data by data communication, a header area, a body area, and a footer area of the corresponding application web page are received. Determining whether only the body region has a scrollable page structure alone;
If only the body region of the application web page is determined to be a single scrollable structure, capturing only the body region as an image separately from the header region and the footer region; And
A third screen for scrolling only the screen of the body region in correspondence with the degree of scrolling of the user in a state in which the screen of the header and the footer region is fixedly displayed in the middleware system when a scroll request is requested by a user's touch manipulation; Screen area scroll control method of a touch terminal, characterized in that comprising a step.
제 1 항에 있어서,
상기 제1단계에서, 상기 미들웨어 시스템은 상기 어플리케이션 웹 페이지의 바디 영역이 I-프레임(I-Frame) 구조로 설정되어 있는지를 판별함에 의해, 해당 바디 영역의 단독적인 스크롤 여부를 판단하도록 이루어진 것을 특징으로 하는 터치식 단말기의 화면 영역 스크롤 제어 방법.
The method of claim 1,
In the first step, the middleware system determines whether the body region of the application web page is scrolled alone by determining whether the body region of the application web page is set to an I-frame structure. Screen area scroll control method of the touch terminal.
모바일 웹 어플리케이션의 화면에 대한 스크롤 기능을 갖춘 터치식 단말기에 있어서,
웹을 기반으로 미들웨어 시스템에 의해 구동되어, 해당 어플리케이션 웹 페이지 데이터의 헤더(Header) 영역, 바디(Body) 영역, 풋터(Footer) 영역으로 구분된 어플리케이션 화면이 표시되도록 하는 적어도 하나의 모바일 웹 어플리케이션과;
터치 스크린의 사용자 터치 조작에 의한 스크롤 동작을 판별하여 미들웨어 시스템에 제공하는 터치 구동 판별부; 및
상기 모바일 웹 어플리케이션의 웹페이지 데이터에서 바디 영역이 단독적인 스크롤 가능 영역으로 판별된 웹 페이지에 대해서 상기 바디 영역만을 이미지로 캡쳐하고, 상기 터치 구동 판별부를 통해 사용자의 스크롤 요구가 감지되면 상기 헤더 및 풋터 영역의 화면이 고정 표시되도록 하는 상태에서 사용자의 스크롤 조작 정도에 대응하여 상기 바디 영역의 화면만이 단독적으로 스크롤되도록 하는 미들웨어 시스템을 포함하여 구성된 것을 특징으로 하는 화면 영역 스크롤 기능을 갖춘 터치식 단말기.
In the touch terminal having a scroll function for the screen of the mobile web application,
At least one mobile web application driven by a middleware system based on the web to display an application screen divided into a header area, a body area, and a footer area of the corresponding application web page data; ;
A touch driving determination unit for determining a scroll operation by a user's touch operation of the touch screen and providing the scroll operation to a middleware system; And
Capturing only the body region as an image for the web page in which the body region is determined as the exclusive scrollable region in the web page data of the mobile web application, and if the user's scroll request is detected through the touch driving determination unit, the header and the footer And a middleware system configured to scroll only the screen of the body region alone in response to the scroll manipulation of the user in a state in which the screen of the region is fixedly displayed.
제 3 항에 있어서,
상기 미들웨어 시스템은 상기 어플리케이션 웹 페이지의 바디 영역이 I-프레임(I-Frame) 구조로 설정되어 있는지를 판별함에 의해, 해당 바디 영역의 단독적인 스크롤 여부를 판단하도록 된 것을 특징으로 하는 화면 영역 스크롤 기능을 갖춘 터치식 단말기.
The method of claim 3, wherein
The middleware system determines whether the body region of the application web page is scrolled alone by determining whether the body region of the application web page is set to an I-frame structure. Touch terminal equipped.
KR1020100065665A 2010-07-08 2010-07-08 Method for controlling scroll screen area of touch type mobile terminal and touch type mobile terminal having screen area scroll function KR20120005094A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
KR1020100065665A KR20120005094A (en) 2010-07-08 2010-07-08 Method for controlling scroll screen area of touch type mobile terminal and touch type mobile terminal having screen area scroll function

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
KR1020100065665A KR20120005094A (en) 2010-07-08 2010-07-08 Method for controlling scroll screen area of touch type mobile terminal and touch type mobile terminal having screen area scroll function

Publications (1)

Publication Number Publication Date
KR20120005094A true KR20120005094A (en) 2012-01-16

Family

ID=45611336

Family Applications (1)

Application Number Title Priority Date Filing Date
KR1020100065665A KR20120005094A (en) 2010-07-08 2010-07-08 Method for controlling scroll screen area of touch type mobile terminal and touch type mobile terminal having screen area scroll function

Country Status (1)

Country Link
KR (1) KR20120005094A (en)

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103529988A (en) * 2013-10-16 2014-01-22 Tcl通讯(宁波)有限公司 Mobile terminal touch screen multi-firmware setting method and system
US9372613B2 (en) 2013-01-30 2016-06-21 Samsung Electronics Co., Ltd. Scrolling method and electronic device thereof
KR20170078004A (en) 2015-12-29 2017-07-07 에스케이플래닛 주식회사 User equipment, control method thereof and computer readable medium having computer program recorded thereon

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US9372613B2 (en) 2013-01-30 2016-06-21 Samsung Electronics Co., Ltd. Scrolling method and electronic device thereof
CN103529988A (en) * 2013-10-16 2014-01-22 Tcl通讯(宁波)有限公司 Mobile terminal touch screen multi-firmware setting method and system
KR20170078004A (en) 2015-12-29 2017-07-07 에스케이플래닛 주식회사 User equipment, control method thereof and computer readable medium having computer program recorded thereon

Similar Documents

Publication Publication Date Title
US9788072B2 (en) Providing a search service convertible between a search window and an image display window
US9811510B2 (en) Method and apparatus for sharing part of web page
US8479096B2 (en) Content display device, television receiver, content display method, content display control program, and recording medium
KR101065644B1 (en) A method and a device for browsing information feeds
JP4991859B2 (en) Control method for remote computer control
US8438473B2 (en) Handling of touch events in a browser environment
KR101662726B1 (en) Method and apparatus for scrolling for electronic device
US10643021B2 (en) Method and device for processing web page content
CN104102419B (en) Page display method, device and terminal device
KR101873787B1 (en) Method for processing multi-touch input in touch screen terminal and device thereof
WO2016066092A1 (en) Multimedia playing controlling method and device, and storage medium
US20140344705A1 (en) Image-based and predictive browsing
EP2477113A1 (en) Processing user input events in a web browser
TWI460652B (en) Information browsing method and machine-readable medium storing computer program
US20120042265A1 (en) Information Processing Device, Information Processing Method, Computer Program, and Content Display System
WO2017084452A1 (en) Method and apparatus for processing tag page in graphical interface
WO2014206143A1 (en) Method, apparatus and device for displaying number of unread messages
JP5222717B2 (en) Display window selection method, display window selection program, and terminal device
US20140235297A1 (en) Portable electronic device, touch operation processing method, and program
KR20120005094A (en) Method for controlling scroll screen area of touch type mobile terminal and touch type mobile terminal having screen area scroll function
CN106843626A (en) A kind of content share method in instant video call
JP2012078925A (en) Information display device and information display program
WO2015111321A1 (en) Display control device, display control method and computer program
KR20130033229A (en) Method and apparatus for browsing web contents in mobile terminal
KR101800209B1 (en) System and method for contents scrap using wire terminal and wireless terminal, and wire terminal thereof

Legal Events

Date Code Title Description
A201 Request for examination
E902 Notification of reason for refusal
E902 Notification of reason for refusal
E601 Decision to refuse application