JP2019510309A - Method and apparatus for reusing ListCell in hybrid applications - Google Patents
Method and apparatus for reusing ListCell in hybrid applications Download PDFInfo
- Publication number
- JP2019510309A JP2019510309A JP2018546452A JP2018546452A JP2019510309A JP 2019510309 A JP2019510309 A JP 2019510309A JP 2018546452 A JP2018546452 A JP 2018546452A JP 2018546452 A JP2018546452 A JP 2018546452A JP 2019510309 A JP2019510309 A JP 2019510309A
- Authority
- JP
- Japan
- Prior art keywords
- listcell
- prototype
- content
- template
- listcells
- 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.)
- Granted
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/36—Software reuse
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/20—Software design
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/31—Programming languages or programming paradigms
- G06F8/312—List processing, e.g. LISP programming language
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02W—CLIMATE CHANGE MITIGATION TECHNOLOGIES RELATED TO WASTEWATER TREATMENT OR WASTE MANAGEMENT
- Y02W30/00—Technologies for solid waste management
- Y02W30/50—Reuse, recycling or recovery technologies
- Y02W30/82—Recycling of waste of electrical or electronic equipment [WEEE]
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Computing Systems (AREA)
- Databases & Information Systems (AREA)
- Data Mining & Analysis (AREA)
- Human Computer Interaction (AREA)
- Stored Programmes (AREA)
- User Interface Of Digital Computer (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
- Digital Computer Display Output (AREA)
Abstract
本願の目的は、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法及び装置を提供することである。ＬｉｓｔＣｅｌｌのプロトタイプがフロントエンドにて定義される。ＬｉｓｔＣｅｌｌのプロトタイプは、ネイティブエンドにてコピーされる。ネイティブエンドは、現在のリスト提示位置に基づいて不可視のＬｉｓｔＣｅｌｌを再利用する。そのため、ＬｉｓｔＣｅｌｌのプロトタイプをフロントエンドにて定義でき、プロトタイプに基づいてネイティブエンドにてＬｉｓｔＣｅｌｌを自由に創出し、レンダリングし、再利用することができる。したがって、ハイブリッド開発においてＬｉｓｔＣｅｌｌの定義付けの柔軟性を維持できるだけでなく、ＬｉｓｔＣｅｌｌをネイティブエンドにて再利用することができ、それにより、大きなリストの提示及び操作性能が大幅に向上する。An object of the present application is to provide a method and apparatus for reusing ListCell in hybrid applications. A ListCell prototype is defined in the front end. The ListCell prototype is copied at the native end. The native end reuses the invisible ListCell based on the current list presentation position. Therefore, a ListCell prototype can be defined at the front end, and a ListCell can be freely created, rendered, and reused at the native end based on the prototype. Therefore, not only can the flexibility of defining ListCell be maintained in hybrid development, but ListCell can be reused in the native end, thereby greatly improving the presentation and operation performance of a large list.
Description
本願は、コンピュータ分野に関し、特に、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法及び装置に関する。 The present application relates to the computer field, and in particular to a method and apparatus for reusing ListCell in hybrid applications.
ハイブリッド開発は、フロントエンド開発とネイティブ開発の両方を用いて行う、プログラムの開発である。フロントエンド開発は、ＪａｖａＳｃｒｉｐｔ（登録商標）、ＨＴＭＬ、及びＣＳＳなどの技術に基づいて行う、ウェブページ及びウェブアプリケーションの開発である。ネイティブ開発は、スマートデバイス、例えば携帯電話、のローカルオペレーティングシステムのネイティブ機能に基づいて行うプログラミングである。例えば、ｉＯＳ及びＡｎｄｒｏｉｄ（登録商標）などのシステムに基づいて行うネイティブインターフェース開発である。Ｒｅａｃｔは、Ｆａｃｅｂｏｏｋ（登録商標）により製作されたＪＳフレームワークであり、フロントエンド開発を標準化するための構築システムである。Ｒｅａｃｔ Ｎａｔｉｖｅは、Ｆａｃｅｂｏｏｋ（登録商標）によってＲｅａｃｔ標準に基づいて立ち上げられたもので、フロントエンド技術を用いてネイティブアプリケーションを開発できる技術実施フレームワークである。 Hybrid development is program development using both front-end development and native development. Front-end development is the development of web pages and web applications based on technologies such as JavaScript (registered trademark), HTML, and CSS. Native development is programming performed based on the native functions of the local operating system of a smart device, such as a mobile phone. For example, native interface development is performed based on a system such as iOS and Android (registered trademark). React is a JS framework produced by Facebook (registered trademark), and is a construction system for standardizing front-end development. React Native was established based on the React standard by Facebook (registered trademark), and is a technology implementation framework that can develop native applications using front-end technology.
ハイブリッド開発は、現行のモバイルアプリケーションにとってよく知られた開発様式である。この開発様式においては、インターフェース及びサービスを開発するためにフロントエンドウェブページ開発技術が用いられ、様々なＯＳのネイティブ能力を提供するためにネイティブ開発が用いられ、その結果得られたアプリケーションは、フロントエンドの動的能力とネイティブのエクスペリエンス効果を奏することができる。ＬｉｓｔＶｉｅｗは、アプリケーションの最も一般的な提示形式であり、リスト形式のコンテンツ（内容）を含むページを提示するために用いられ、リスト内の同一又は類似の構造を持つ多数（複数）のＬｉｓｔＣｅｌｌを提示し、通常、様々なＬｉｓｔＣｅｌｌの包含をサポートすることができる。ＬｉｓｔＣｅｌｌの提示構造は基本的に同一であり、提示対象の情報のコンテンツのみが異なる。ＬｉｓｔＣｅｌｌは、ＬｉｓｔＶｉｅｗの各行又は各サブセルに提示されるコンテンツである。画面の表示領域は限られているので、画面が同時に提示できるのは、ＬｉｓｔＶｉｅｗの一部のＬｉｓｔＣｅｌｌのコンテンツに過ぎない。他の一部のＬｉｓｔＣｅｌｌは、上下にスクロールすることによってのみ画面表示領域内でスクロールでき、これに応じ、一部のＬｉｓｔＶｉｅｗはスクロールして表示領域から外れる。したがって、画面上でユーザが見ることができるＬｉｓｔＣｅｌｌは常に限定されている。しかし、現在のフロントエンド技術において、フロントエンドは、Ｎａｔｉｖｅ（ネイティブ）を起動してインスタンスを創出し、全てのＬｉｓｔＣｅｌｌに対してレンダリングを実施する必要がある。その結果、実施された多くが無駄になる。Ｒｅａｃｔ Ｎａｔｉｖｅ上での既存のＬｉｓｔＶｉｅｗ実施ソリューションを図１に示す。ＬｉｓｔＣｅｌｌはフロントエンドレイヤにて定義されるため、Ｒｅａｃｔ Ｎａｔｉｖｅフレームワークが行えるのは、ＬｉｓｔＶｉｅｗの全体構造をネイティブレイヤにマッピングすることだけである。したがって、ＬｉｓｔＶｉｅｗが１００個のＬｉｓｔＣｅｌｌを有している場合、ネイティブレイヤでは１００個のＬｉｓｔＣｅｌｌが創出され、１００個のＬｉｓｔＣｅｌｌが配置され、レンダリングされる。これは、メモリと時間の両方を消費する。 Hybrid development is a well-known development style for current mobile applications. In this development style, front-end web page development technology is used to develop interfaces and services, and native development is used to provide the native capabilities of various OSs. End dynamic ability and native experience effect. ListView is the most common presentation format for applications and is used to present pages that contain list content (contents) and presents multiple (multiple) ListCells with the same or similar structure in the list In general, it can support the inclusion of various ListCells. The ListCell presentation structure is basically the same, and only the content of the information to be presented is different. ListCell is content presented in each row or each subcell of ListView. Since the display area of the screen is limited, it is only ListList content that is part of ListView that can be presented simultaneously. Some other ListCells can be scrolled in the screen display area only by scrolling up and down, and in response to this, some ListView scrolls out of the display area. Therefore, the ListCell that the user can see on the screen is always limited. However, in the current front-end technology, the front-end needs to start Native (native) to create an instance and perform rendering for all ListCells. As a result, much done is wasted. An existing ListView implementation solution on React Native is shown in FIG. Since ListCell is defined in the front end layer, the React Native framework can only map the entire structure of ListView to the native layer. Therefore, when ListView has 100 ListCells, 100 ListCells are created in the native layer, and 100 ListCells are arranged and rendered. This consumes both memory and time.
リストスクロール工程において、表示可能領域の外へ移動されたＬｉｓｔＣｅｌｌを再利用して表示可能領域へ移動すべきＬｉｓｔＣｅｌｌを提示できる。そのため、新たなＬｉｓｔＣｅｌｌの創出及び配置に要するメモリ及び時間を削減して性能を向上させることができる。現行のハイブリッド技術では、ＬｉｓｔＶｉｅｗ開発において、構造レイアウトとＬｉｓｔＣｅｌｌクラスとはフロントエンドにて定義され、フロントエンドはネイティブレイヤを起動してＬｉｓｔＣｅｌｌインスタンスを創出する。したがって、フロントエンドのＤＯＭレンダリング機構の制約により、ＤＯＭの再構築には多額のコストが必要になることから、ネイティブレイヤは、ＬｉｓｔＣｅｌｌを効率的に再利用できない。 In the list scroll process, it is possible to present the ListCell to be moved to the displayable area by reusing the ListCell moved to the outside of the displayable area. Therefore, it is possible to improve the performance by reducing the memory and time required for creating and arranging a new ListCell. In the current hybrid technology, in the ListView development, the structure layout and the ListCell class are defined in the front end, and the front end activates a native layer to create a ListCell instance. Therefore, due to the limitations of the DOM rendering mechanism of the front end, a large amount of cost is required for reconstructing the DOM, so that the native layer cannot efficiently reuse the ListCell.
現行のネイティブ開発においては、ＬｉｓｔＣｅｌｌの再利用に応ずる対応技術が存在する。しかし、ハイブリッド技術においては、ページ開発にフロントエンド技術が用いられるため、フロントエンドではＬｉｓｔＶｉｅｗとＬｉｓｔＣｅｌｌとの両方が創出される。ＬｉｓｔＣｅｌｌがネイティブレイヤで創出され、再利用された場合、フロントエンドで定義されるＬｉｓｔＣｅｌｌクラスをネイティブレイヤへ伝送できない。換言すると、フロントエンドにてＪａｖａＳｃｒｉｐｔ（登録商標）（ＪＳ）を用いて定義されるＬｉｓｔＣｅｌｌクラスについて、インスタンスをネイティブレイヤにて直接創出できない。したがって、当業界において、現在、ハイブリッド開発でフロントエンドＬｉｓｔＣｅｌｌの再利用に用いることができる技術は存在しない。 In the current native development, there is a corresponding technology corresponding to the reuse of ListCell. However, since front-end technology is used for page development in hybrid technology, both ListView and ListCell are created in the front-end. When ListCell is created and reused in the native layer, the ListCell class defined in the front end cannot be transmitted to the native layer. In other words, it is not possible to directly create an instance in the native layer for the ListCell class defined using JavaScript (registered trademark) (JS) at the front end. Accordingly, there is currently no technology in the industry that can be used to reuse the front end ListCell in hybrid development.
本願の目的は、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法及び装置を提供することにより、ハイブリッド開発において、ＬｉｓｔＣｅｌｌの構造とクラスはフロントエンドにて定義され、しかし、ＬｉｓｔＣｅｌｌはネイティブエンドにて創出され再利用されるという課題を解決することである。 The purpose of this application is to provide a method and apparatus for reusing ListCell in hybrid applications, so that in hybrid development, ListCell structure and classes are defined at the front end, but ListCell is created and recreated at the native end. It is to solve the problem of being used.
本願の態様により、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法が提供され、前記方法は以下を含む：前記ハイブリッドアプリケーションのフロントエンドにて、ＬｉｓｔＣｅｌｌのプロトタイプを定義するステップ；前記ハイブリッドアプリケーションのネイティブエンドにて、前記ＬｉｓｔＣｅｌｌの前記プロトタイプに基づいてコピーすることを通じて、前記ＬｉｓｔＣｅｌｌを取得し、前記ＬｉｓｔＣｅｌｌを再利用するステップ。 According to an aspect of the present application, a method for reusing a ListCell in a hybrid application is provided, the method comprising: defining a ListCell prototype at the front end of the hybrid application; at the native end of the hybrid application; , Acquiring the ListCell through copying based on the prototype of the ListCell, and reusing the ListCell.
更に、前記方法において、ＬｉｓｔＣｅｌｌのプロトタイプを定義する前記ステップは以下を含む：前記ＬｉｓｔＣｅｌｌの前記プロトタイプの構造レイアウト及びクラスを定義するステップ。 Further, in the method, the step of defining a ListCell prototype includes: defining a structural layout and class of the prototype of the ListCell.
更に、前記方法において、前記ＬｉｓｔＣｅｌｌの前記プロトタイプは、単一のＬｉｓｔＣｅｌｌのプロトタイプである。 Further, in the method, the prototype of the ListCell is a single ListCell prototype.
更に、前記方法において、前記ＬｉｓｔＣｅｌｌの前記プロトタイプに基づいてコピーすることを通じて前記ＬｉｓｔＣｅｌｌを取得する前記ステップは以下を含む：前記ＬｉｓｔＣｅｌｌの前記プロトタイプに基づいてＬｉｓｔＣｅｌｌテンプレートを創出するステップ；前記ＬｉｓｔＣｅｌｌテンプレートをコピーすることにより前記ＬｉｓｔＣｅｌｌを取得するステップ；取得されたＬｉｓｔＣｅｌｌのコンテンツを前記コピーされたＬｉｓｔＣｅｌｌに記入し、前記ＬｉｓｔＣｅｌｌを表示するステップ。 Further, in the method, the step of obtaining the ListCell through copying based on the prototype of the ListCell includes: creating a ListCell template based on the prototype of the ListCell; copying the ListCell template Obtaining the ListCell by entering the content of the obtained ListCell in the copied ListCell and displaying the ListCell.
更に、前記方法において、前記ＬｉｓｔＣｅｌｌテンプレートをコピーすることにより前記ＬｉｓｔＣｅｌｌを取得する前記ステップは以下を含む：前記ＬｉｓｔＣｅｌｌテンプレートの全てのサブビューをトラバースし、これらを取得するステップ；全ての前記サブビューと前記サブビューの属性とを含むＬｉｓｔＣｅｌｌを創出するステップ。 Further, in the method, the step of obtaining the ListCell by copying the ListCell template includes: traversing and obtaining all subviews of the ListCell template; all the subviews and the subviews Creating a ListCell containing the attributes of
更に、前記方法において、取得されたＬｉｓｔＣｅｌｌのコンテンツを前記コピーされたＬｉｓｔＣｅｌｌに記入する前記ステップは以下を含む：前記取得されたＬｉｓｔＣｅｌｌのコンテンツを、前記創出されたＬｉｓｔＣｅｌｌのそれぞれの対応するサブビューに記入するステップ。 Further, in the method, the step of filling the acquired ListCell content in the copied ListCell includes the following: filling the obtained ListCell content in a corresponding subview of each of the created ListCells Step to do.
更に、前記方法において、前記ＬｉｓｔＣｅｌｌのコンテンツは前記フロントエンドから取得される。 Further, in the method, the content of the ListCell is obtained from the front end.
更に、前記方法において、前記ＬｉｓｔＣｅｌｌテンプレートをコピーすることにより前記ＬｉｓｔＣｅｌｌを取得する間に、コピーされるＬｉｓｔＣｅｌｌの数が、表示領域に含めて表示することができるＬｉｓｔＣｅｌｌの数に基づいて特定される。 Further, in the method, while acquiring the ListCell by copying the ListCell template, the number of ListCells to be copied is specified based on the number of ListCells that can be displayed in the display area.
更に、前記方法において、前記ＬｉｓｔＣｅｌｌを再利用する前記ステップは以下を含む：
或るＬｉｓｔＣｅｌｌのコンテンツが前記表示領域の外に移動された場合、前記移動されたＬｉｓｔＣｅｌｌのコンテンツを含むＬｉｓｔＣｅｌｌを再利用可能なＬｉｓｔＣｅｌｌとしてリサイクルするステップ；
新しいＬｉｓｔＣｅｌｌのコンテンツを前記表示領域に移動すべき場合、再利用可能なＬｉｓｔＣｅｌｌが存在するかどうかを特定するステップ；
肯定である場合、前記新しいＬｉｓｔＣｅｌｌのコンテンツを前記再利用可能なＬｉｓｔＣｅｌｌに記入し、前記ＬｉｓｔＣｅｌｌを表示するステップ；又は、否定である場合、前記ＬｉｓｔＣｅｌｌテンプレートをコピーすることにより前記ＬｉｓｔＣｅｌｌを取得し、前記新しいＬｉｓｔＣｅｌｌのコンテンツを前記コピーされたＬｉｓｔＣｅｌｌに記入し、前記ＬｉｓｔＣｅｌｌを表示するステップ。
Further, in the method, the step of reusing the ListCell includes:
Recycling a ListCell including the moved ListCell content as a reusable ListCell when the content of the ListCell is moved out of the display area;
Determining whether there is a reusable ListCell if new ListCell content is to be moved to the display area;
If affirmative, fill the reusable ListCell with the content of the new ListCell and display the ListCell; or if negative, obtain the ListCell by copying the ListCell template; Filling the copied ListCell with the contents of the new ListCell and displaying the ListCell.
本願の他の態様により、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置が更に提供され、前記装置は以下を含む：前記ハイブリッドアプリケーションのフロントエンドにて、ＬｉｓｔＣｅｌｌのプロトタイプを定義するように構成された定義装置；前記ハイブリッドアプリケーションのネイティブエンドにて、前記ＬｉｓｔＣｅｌｌの前記プロトタイプに基づいてコピーすることを通じて前記ＬｉｓｔＣｅｌｌを取得し、前記ＬｉｓｔＣｅｌｌを再利用するように構成されたコピー・再利用装置。 According to another aspect of the present application, there is further provided an apparatus for reusing a ListCell in a hybrid application, the apparatus comprising: a definition apparatus configured to define a ListCell prototype at the front end of the hybrid application A copy / reuse device configured to acquire the ListCell by copying based on the prototype of the ListCell and to reuse the ListCell at a native end of the hybrid application.
更に、前記装置において、前記定義装置は、前記ＬｉｓｔＣｅｌｌの前記プロトタイプの構造レイアウト及びクラスを定義するように構成される。 Further, in the apparatus, the definition device is configured to define a structural layout and class of the prototype of the ListCell.
更に、前記装置において、前記ＬｉｓｔＣｅｌｌの前記プロトタイプは、単一のＬｉｓｔＣｅｌｌのプロトタイプである。 Further, in the apparatus, the prototype of the ListCell is a single ListCell prototype.
更に、前記装置において、前記コピー・再利用装置は、前記ＬｉｓｔＣｅｌｌの前記プロトタイプに基づいてＬｉｓｔＣｅｌｌテンプレートを創出し、前記ＬｉｓｔＣｅｌｌテンプレートをコピーすることにより前記ＬｉｓｔＣｅｌｌを取得し、取得されたＬｉｓｔＣｅｌｌのコンテンツを前記コピーされたＬｉｓｔＣｅｌｌに記入し、前記ＬｉｓｔＣｅｌｌを表示するように構成される。 Further, in the device, the copy / reuse device creates a ListCell template based on the prototype of the ListCell, acquires the ListCell by copying the ListCell template, and obtains the content of the obtained ListCell. It is configured to fill in the copied ListCell and display the ListCell.
更に、前記装置において、前記コピー・再利用装置は、前記ＬｉｓｔＣｅｌｌテンプレートの全てのサブビューをトラバースし、これら取得し、全ての前記サブビューと前記サブビューの属性とを含むＬｉｓｔＣｅｌｌを創出するように構成される。 Further, in the apparatus, the copy / reuse apparatus is configured to traverse and retrieve all subviews of the ListCell template and create a ListCell that includes all the subviews and attributes of the subviews. .
更に、前記装置において、前記コピー・再利用装置は、前記取得されたＬｉｓｔＣｅｌｌのコンテンツを、前記創出されたＬｉｓｔＣｅｌｌのそれぞれの対応するサブビューに記入するように構成される。 Further, in the apparatus, the copy / reuse apparatus is configured to fill the acquired ListCell content in a corresponding subview of each of the created ListCells.
更に、前記装置において、前記ＬｉｓｔＣｅｌｌのコンテンツは前記フロントエンドから取得される。 Further, in the apparatus, the content of the ListCell is acquired from the front end.
更に、前記装置において、前記コピー・再利用装置は、表示領域に含めて表示することができるＬｉｓｔＣｅｌｌの数に基づいて、コピーされるＬｉｓｔＣｅｌｌの数を特定するように構成される。 Further, in the device, the copy / reuse device is configured to identify the number of ListCells to be copied based on the number of ListCells that can be displayed in the display area.
更に、前記装置において、前記コピー・再利用装置は、或るＬｉｓｔＣｅｌｌのコンテンツが前記表示領域の外に移動された場合、前記移動されたＬｉｓｔＣｅｌｌのコンテンツを含むＬｉｓｔＣｅｌｌを再利用可能なＬｉｓｔＣｅｌｌとしてリサイクルし；新しいＬｉｓｔＣｅｌｌのコンテンツを前記表示領域に移動すべき場合、再利用可能なＬｉｓｔＣｅｌｌが存在するかどうかを特定し；肯定である場合、前記新しいＬｉｓｔＣｅｌｌのコンテンツを、前記再利用可能なＬｉｓｔＣｅｌｌに記入し、前記ＬｉｓｔＣｅｌｌを表示し；否定である場合、前記ＬｉｓｔＣｅｌｌテンプレートをコピーすることにより前記ＬｉｓｔＣｅｌｌを取得し、前記新しいＬｉｓｔＣｅｌｌのコンテンツを、前記コピーされたＬｉｓｔＣｅｌｌに記入し、前記ＬｉｓｔＣｅｌｌを表示するように構成される。 Further, in the apparatus, when the content of a certain ListCell is moved out of the display area, the copy / reuse apparatus recycles the ListCell including the moved ListCell content as a reusable ListCell. If new ListCell content is to be moved to the display area, identify if there is a reusable ListCell; if yes, enter the new ListCell content in the reusable ListCell; Display the ListCell; if not, obtain the ListCell by copying the ListCell template and enter the content of the new ListCell in the copied ListCell Configured to display the ListCell.
既存の技術と比べると、本願においては、ＬｉｓｔＣｅｌｌのプロトタイプがフロントエンドにて定義される。ＬｉｓｔＣｅｌｌのプロトタイプは、ネイティブエンドにてコピーされる。ネイティブエンドは、現在のリスト提示位置に基づいて不可視のＬｉｓｔＣｅｌｌを再利用する。そのため、ＬｉｓｔＣｅｌｌのプロトタイプをフロントエンドにて定義でき、ネイティブエンドにてＬｉｓｔＣｅｌｌを自由に創出し、レンダリングし、再利用できる。したがって、ハイブリッド開発におけるＬｉｓｔＣｅｌｌの定義付けの柔軟性を維持できるだけでなく、ＬｉｓｔＣｅｌｌをネイティブエンドにて再利用でき、それにより、大きなリストの提示及び操作性能が大幅に向上する。本願の技術的解決策の中核は、リストページ上のＬｉｓｔＣｅｌｌを再利用し、レンダリング及び操作性能を向上させるため、ハイブリッドアプリケーション開発において、ＬｉｓｔＣｅｌｌの構造及びクラスをフロントエンドにて定義するが、ＬｉｓｔＣｅｌｌをネイティブエンドにて創出し、再利用する、という課題を解決することである。 Compared with existing technology, in this application, a prototype of ListCell is defined at the front end. The ListCell prototype is copied at the native end. The native end reuses the invisible ListCell based on the current list presentation position. Therefore, a prototype of ListCell can be defined at the front end, and ListCell can be freely created, rendered, and reused at the native end. Therefore, not only can the flexibility of defining ListCell in hybrid development be maintained, but ListCell can be reused in the native end, thereby greatly improving the presentation and operation performance of a large list. The core of the technical solution of the present application is to define the ListCell structure and class at the front end in hybrid application development in order to reuse the ListCell on the list page and improve rendering and operation performance. The solution is to create and reuse at the native end.
本願の他の特徴、目的、及び利点は、以下の添付図面を参照して、非限定的な実施の詳細な説明を読むことによってより明らかになる。 Other features, objects, and advantages of the present application will become more apparent upon reading the detailed description of the non-limiting implementation with reference to the accompanying drawings in which:
添付図面における同一又は類似の符号は、同一又は類似の構成要素を表す。 The same or similar symbols in the accompanying drawings represent the same or similar components.
以下では、添付の図面を参照して、本願の実施を詳細に説明する。 Hereinafter, embodiments of the present application will be described in detail with reference to the accompanying drawings.
本願の典型的な構成では、端末デバイス、サービスネットワークデバイス、及び信頼できるパーティのそれぞれは、１つ又は複数の中央処理装置（ＣＰＵ）、入力／出力インターフェース、ネットワークインターフェイス、及びメモリを含む。 In a typical configuration of the present application, each of the terminal device, service network device, and trusted party includes one or more central processing units (CPUs), input / output interfaces, network interfaces, and memory.
メモリは、コンピュータ可読媒体における、非永続メモリ、ランダムアクセスメモリ（ＲＡＭ）、及び／又は不揮発性メモリ、例えば、読み出し専用メモリ（ＲＯＭ）又はフラッシュメモリ（フラッシュＲＡＭ）など、を含むことができる。メモリは、コンピュータ可読媒体の一例である。 The memory can include non-permanent memory, random access memory (RAM), and / or non-volatile memory, such as read only memory (ROM) or flash memory (flash RAM), in a computer readable medium. The memory is an example of a computer readable medium.
コンピュータ可読媒体は、任意の方法又は技術を使用することによって情報の記憶を実施することができる、永続性、非永続性、可動性及び移動不可能な媒体を含む。情報は、コンピュータ可読命令、データ構造、プログラムモジュール、又は他のデータとすることができる。コンピュータ記憶媒体の例には、相変化メモリ（ＰＲＡＭ）、スタティックランダムアクセスメモリ（ＳＲＡＭ）、ダイナミックランダムアクセスメモリ（ＤＲＡＭ）、別のタイプのランダムアクセスメモリ（ＲＡＭ）、読出し専用メモリ（ＲＯＭ）、電気的消去可能ＰＲＯＭ（ＥＥＰＲＯＭ）、フラッシュメモリ、又は他のメモリ技術、コンパクトディスク読出し専用メモリ（ＣＤ−ＲＯＭ）、デジタル多用途ディスク（ＤＶＤ）、又は他の光学記憶装置、カセット磁気テープ、テープ及びディスク記憶装置、又は他の磁気記憶装置、又は他の任意の非伝送媒体を含むことができるが、これらに限定されない。コンピュータ記憶媒体は、コンピュータデバイスによってアクセス可能な情報を記憶するように構成することができる。本明細書で説明するように、コンピュータ可読媒体は、変調データ信号及び搬送波などの非一時的なコンピュータ可読媒体を含まない。 Computer-readable media includes permanent, non-persistent, movable and non-movable media that can store information using any method or technique. The information can be computer readable instructions, data structures, program modules, or other data. Examples of computer storage media include phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), another type of random access memory (RAM), read only memory (ROM), electrical Erasable PROM (EEPROM), flash memory, or other memory technology, compact disc read only memory (CD-ROM), digital versatile disc (DVD), or other optical storage device, cassette magnetic tape, tape and disc It can include, but is not limited to, storage devices, or other magnetic storage devices, or any other non-transmission medium. A computer storage medium may be configured to store information accessible by a computing device. As described herein, computer-readable media does not include non-transitory computer-readable media such as modulated data signals and carrier waves.
図２に示すように、本願の態様によると、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法が提供される。この方法は、下記のステップを含む。 As shown in FIG. 2, according to aspects of the present application, a method for reusing a ListCell in a hybrid application is provided. The method includes the following steps.
ステップＳ１：ハイブリッドアプリケーションのフロントエンドにて、ＬｉｓｔＣｅｌｌのプロトタイプを定義する。 Step S1: Define a ListCell prototype at the front end of the hybrid application.
ステップＳ２：ハイブリッドアプリケーションのネイティブエンドにて、ＬｉｓｔＣｅｌｌのプロトタイプに基づいてコピーすることを通じてＬｉｓｔＣｅｌｌを取得し、ＬｉｓｔＣｅｌｌを再利用する。本願において、ＬｉｓｔＣｅｌｌのプロトタイプ（親）が、フロントエンドにて定義される。ＬｉｓｔＣｅｌｌのプロトタイプは、ネイティブエンド（Ｎａｔｉｖｅ）にてコピー（クローン生成）される。ネイティブエンドは、現在のリスト提示位置に基づいて不可視のＬｉｓｔＣｅｌｌを再利用する。そのため、ＬｉｓｔＣｅｌｌのプロトタイプをフロントエンドにて定義でき、ネイティブエンドにてＬｉｓｔＣｅｌｌを自由に創出し、レンダリングし、再利用できる。したがって、ハイブリッド開発におけるＬｉｓｔＣｅｌｌの定義付けの柔軟性を維持できるだけでなく、ＬｉｓｔＣｅｌｌをネイティブエンドにて再利用でき、それにより、大きなリストの提示及び操作性能が大幅に向上する。本願の技術的解決策の中核は、ハイブリッド開発において、ＬｉｓｔＣｅｌｌの構造及びクラスはフロントエンドにて定義され、しかし、ＬｉｓｔＣｅｌｌはネイティブエンドにて創出され再利用される、という課題を解決することである。それにより、リストページ上でＬｉｓｔＣｅｌｌを再利用してレンダリングと操作性能とを向上させることができる。本願は、全てのハイブリッドアプリケーション開発に適用可能であり、Ｒｅａｃｔ Ｎａｔｉｖｅフレームワークにおいて非常に良好な実施効果を奏する。 Step S2: At the native end of the hybrid application, the ListCell is acquired through copying based on the ListCell prototype, and the ListCell is reused. In the present application, a ListCell prototype (parent) is defined at the front end. The ListCell prototype is copied (cloned) at the native end (Native). The native end reuses the invisible ListCell based on the current list presentation position. Therefore, a prototype of ListCell can be defined at the front end, and ListCell can be freely created, rendered, and reused at the native end. Therefore, not only can the flexibility of defining ListCell in hybrid development be maintained, but ListCell can be reused in the native end, thereby greatly improving the presentation and operation performance of a large list. The core of the technical solution of the present application is to solve the problem that, in hybrid development, the structure and class of ListCell are defined in the front end, but ListCell is created and reused in the native end. . Thereby, it is possible to improve rendering and operation performance by reusing ListCell on the list page. The present application is applicable to all hybrid application development, and has a very good implementation effect in the React Native framework.
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法の実施の例において、ＬｉｓｔＣｅｌｌのプロトタイプを定義するステップＳ１は、ＬｉｓｔＣｅｌｌのプロトタイプの構造レイアウト及びクラスを定義するステップを含む。ここで、ＬｉｓｔＣｅｌｌのプロトタイプを定義するステップは、ＬｉｓｔＣｅｌｌの構造及びクラスを定義するステップを含む。そのため、ハイブリッド開発において、フロントエンドにてＬｉｓｔＣｅｌｌを柔軟に定義できる。 In an example implementation of a method for reusing ListCell in a hybrid application in this application, step S1 of defining a ListCell prototype includes defining a structural layout and class of the ListCell prototype. Here, the step of defining the ListCell prototype includes the step of defining the ListCell structure and class. Therefore, in hybrid development, ListCell can be flexibly defined at the front end.
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法の実施の例では、ＬｉｓｔＣｅｌｌのプロトタイプは単一のＬｉｓｔＣｅｌｌのプロトタイプである。ここでは、１つのインスタンス（即ち、ＬｉｓｔＣｅｌｌのプロトタイプ）のみがフロントエンドレイヤにて創出される。それに続き、ＬｉｓｔＣｅｌｌテンプレートをプロトタイプのみに基づいてネイティブエンドにて創出できる。次いで、ＬｉｓｔＣｅｌｌテンプレートが必要に応じてコピーされる。そのため、新しいＬｉｓｔＣｅｌｌの創出及び配置に要するメモリ及び時間を削減して性能を向上させることができる。 In the present example implementation of a method for reusing ListCell in a hybrid application, the ListCell prototype is a single ListCell prototype. Here, only one instance (ie, a ListCell prototype) is created at the front end layer. Following that, a ListCell template can be created at the native end based solely on the prototype. The ListCell template is then copied as needed. Therefore, it is possible to improve the performance by reducing the memory and time required for creating and arranging a new ListCell.
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法の実施の例では、ＬｉｓｔＣｅｌｌのプロトタイプに基づいてコピーすることを通じてＬｉｓｔＣｅｌｌを取得するステップは：ＬｉｓｔＣｅｌｌのプロトタイプに基づいてＬｉｓｔＣｅｌｌテンプレートを創出するステップと；ＬｉｓｔＣｅｌｌテンプレートをコピーすることによりＬｉｓｔＣｅｌｌを取得するステップと；取得されたＬｉｓｔＣｅｌｌのコンテンツを、コピーされたＬｉｓｔＣｅｌｌに記入し、ＬｉｓｔＣｅｌｌを表示するステップと；を含む。ここで、図３に示すように、ＬｉｓｔＣｅｌｌテンプレート、即ち、図におけるＬｉｓｔＣｅｌｌプロトタイプのインスタンスは、フロントエンドにて定義されるプロトタイプのみに基づいてネイティブエンドにて創出される。次に、ＬｉｓｔＣｅｌｌテンプレートが、表示する必要があるＬｉｓｔＣｅｌｌのコンテンツの数に基づいてコピーされて、対応する数のＬｉｓｔＣｅｌｌが取得される。次に、ＬｉｓｔＣｅｌｌのコンテンツ、即ち、図３におけるＬｉｓｔＣｅｌｌデータ１からｎがレンダリング及び表示のために、それぞれ対応するＬｉｓｔＣｅｌｌに記入される。そのため、新しいＬｉｓｔＣｅｌｌの創出及び配置に要するメモリ及び時間を削減して性能を向上させることができる。
In an example implementation of a method for reusing a ListCell in a hybrid application in the present application, obtaining a ListCell through copying based on a ListCell prototype includes: creating a ListCell template based on a ListCell prototype; Obtaining a ListCell by copying a template; and writing the obtained ListCell content in the copied ListCell and displaying the ListCell. Here, as shown in FIG. 3, the ListCell template, that is, the instance of the ListCell prototype in the figure is created in the native end based only on the prototype defined in the front end. Next, the ListCell template is copied based on the number of ListCell contents that need to be displayed to obtain the corresponding number of ListCells. Next, the contents of ListCell, that is,
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法の実施の例では、ＬｉｓｔＣｅｌｌテンプレートをコピーすることによりＬｉｓｔＣｅｌｌを取得するステップは：ＬｉｓｔＣｅｌｌテンプレートの全てのサブビューをトラバースし、取得するステップと；全てのサブビューと、サブビューの属性とを含むＬｉｓｔＣｅｌｌを創出するステップと；を含む。ここで、ＬｉｓｔＣｅｌｌテンプレートの全てのサブビュー（ビュー）は再帰的にトラバースされ、次いで、全てのサブビューとサブビューに対応する属性とを含むためにコピーすることを通じてＬｉｓｔＣｅｌｌが取得される。そのため、ＬｉｓｔＣｅｌｌを正確にコピーできる。図４に示すように、ＬｉｓｔＣｅｌｌテンプレート、即ち、図４におけるＬｉｓｔＣｅｌｌプロトタイプのサブビューは、Ａ、Ｂ、Ｃ、Ｄ、及びＥを含む。ＬｉｓｔＣｅｌｌプロトタイプをコピーするステップは、ＬｉｓｔＣｅｌｌプロトタイプの全てのサブビューと、サブビューの属性とを含むＬｉｓｔＣｅｌｌを創出する工程である。取得されるＬｉｓｔＣｅｌｌのサブビューは、Ａ’、Ｂ’、Ｃ’、Ｄ’、及びＥ’を含む。 In an example implementation of a method for reusing a ListCell in a hybrid application in the present application, obtaining a ListCell by copying a ListCell template includes: traversing and obtaining all subviews of the ListCell template; and all subviews; And creating a ListCell that includes the attributes of the subviews. Here, all subviews (views) of the ListCell template are recursively traversed, and then the ListCell is obtained through copying to include all subviews and attributes corresponding to the subviews. Therefore, ListCell can be copied accurately. As shown in FIG. 4, the ListCell template, ie, the subview of the ListCell prototype in FIG. 4, includes A, B, C, D, and E. The step of copying the ListCell prototype is a process of creating a ListCell that includes all the subviews of the ListCell prototype and the attributes of the subviews. The acquired ListCell subviews include A ', B', C ', D', and E '.
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法の実施の例では、取得されたＬｉｓｔＣｅｌｌのコンテンツを、コピーされたＬｉｓｔＣｅｌｌに記入するステップは：取得されたＬｉｓｔＣｅｌｌのコンテンツを、創出されたＬｉｓｔＣｅｌｌのそれぞれの対応するサブビューに記入するステップを含む。ここで、ＬｉｓｔＣｅｌｌのコンテンツを、ＬｉｓｔＣｅｌｌのコンテンツに基づいてコピーされたＬｉｓｔＣｅｌｌのそれぞれの対応するサブビューに記入できる。そのため、ＬｉｓｔＣｅｌｌのコンテンツを、ＬｉｓｔＣｅｌｌの対応する位置で正確に表示できる。図４に示すように、本実施において、ＬｉｓｔＣｅｌｌのコンテンツ、即ち、図４におけるコンテンツデータはそれぞれ、コピーされたＬｉｓｔＣｅｌｌの対応するサブビューＡ’、Ｂ’、Ｃ’、Ｄ’、及びＥ’に記入される。 In an example implementation of a method for reusing a ListCell in a hybrid application in the present application, the step of filling the acquired ListCell content into the copied ListCell is: each of the created ListCells with the acquired ListCell content. Including filling in the corresponding subviews of. Here, the contents of the ListCell can be written in the corresponding subviews of the ListCell copied based on the contents of the ListCell. Therefore, the content of ListCell can be accurately displayed at the position corresponding to ListCell. As shown in FIG. 4, in this implementation, the content of ListCell, that is, the content data in FIG. 4 is entered in the corresponding subviews A ′, B ′, C ′, D ′, and E ′ of the copied ListCell, respectively. Is done.
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法の実施の例では、ＬｉｓｔＣｅｌｌのコンテンツはフロントエンドから取得される。ここで、図３に示すように、ＬｉｓｔＣｅｌｌのプロトタイプの定義付けに加え、フロントエンドは、ＬｉｓｔＣｅｌｌのコンテンツ、即ち、図３におけるＬｉｓｔＣｅｌｌのデータをネイティブエンドへ伝送するだけでよい。そのため、フロントエンドデータ処理で消費されるメモリ及び時間を削減できる。 In the example of implementation of the method of reusing ListCell in a hybrid application in the present application, the content of ListCell is obtained from the front end. Here, as shown in FIG. 3, in addition to defining the ListCell prototype, the front end only needs to transmit the ListCell content, that is, the ListCell data in FIG. 3 to the native end. Therefore, it is possible to reduce the memory and time consumed in front-end data processing.
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法の実施の例では、ＬｉｓｔＣｅｌｌテンプレートをコピーすることによりＬｉｓｔＣｅｌｌを取得する間に、表示領域に含めて表示できるＬｉｓｔＣｅｌｌの数に基づいてコピーされるＬｉｓｔＣｅｌｌの数が特定される。ここでは、とりわけ、ＬｉｓｔＣｅｌｌが表示領域に初めて表示される場合、再利用可能なＬｉｓｔＣｅｌｌがまだ存在しないため、表示領域に含めて表示できるＬｉｓｔＣｅｌｌの数に基づいてコピーすることにより、対応する数のＬｉｓｔＣｅｌｌを取得する必要がある。例えば、図３において、対応する数のＬｉｓｔＣｅｌｌが、１画面上に表示できるＬｉｓｔＣｅｌｌの数に基づいて生成される、ことが特定される。そのため、ＬｉｓｔＣｅｌｌを必要に応じてコピーすることができ、新しいＬｉｓｔＣｅｌｌの創出及び配置に要するメモリ及び時間を削減して性能を向上させることができる。例えば、１０個のＬｉｓｔＣｅｌｌのコンテンツを表示する必要があり、表示領域が、１０個のＬｉｓｔＣｅｌｌを含めて表示できる場合、１０個のＬｉｓｔＣｅｌｌをコピーする必要がある。 In the implementation example of the method of reusing ListCell in a hybrid application in the present application, while acquiring ListCell by copying a ListCell template, ListCell copied based on the number of ListCells that can be displayed and included in the display area A number is specified. Here, especially when ListCell is displayed for the first time in the display area, there is no reusable ListCell yet, so by copying based on the number of ListCells that can be included and displayed in the display area, the corresponding number of ListCells Need to get. For example, in FIG. 3, it is specified that a corresponding number of ListCells are generated based on the number of ListCells that can be displayed on one screen. Therefore, the ListCell can be copied as necessary, and the memory and time required for creating and arranging a new ListCell can be reduced to improve the performance. For example, when 10 ListCell contents need to be displayed and the display area can include 10 ListCells, it is necessary to copy 10 ListCells.
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法の実施の例では、ＬｉｓｔＣｅｌｌを再利用するステップは：或るＬｉｓｔＣｅｌｌのコンテンツが表示領域の外に移動された場合、移動されたＬｉｓｔＣｅｌｌのコンテンツを含むＬｉｓｔＣｅｌｌを、再利用可能なＬｉｓｔＣｅｌｌとしてリサイクルするステップと；新しいＬｉｓｔＣｅｌｌのコンテンツを表示領域に移動すべき場合、再利用可能なＬｉｓｔＣｅｌｌが存在するかどうかを特定するステップと；肯定であれば、新しいＬｉｓｔＣｅｌｌのコンテンツを再利用可能なＬｉｓｔＣｅｌｌに記入し、ＬｉｓｔＣｅｌｌを表示するステップ；又は、否定であれば、ＬｉｓｔＣｅｌｌテンプレートをコピーすることによりＬｉｓｔＣｅｌｌを取得し、新しいＬｉｓｔＣｅｌｌのコンテンツを、コピーされたＬｉｓｔＣｅｌｌに記入し、ＬｉｓｔＣｅｌｌを表示するステップ；とを含む。ここで、図３に示すように、とりわけ、或るＬｉｓｔＣｅｌｌが表示領域に初めて表示される場合、このとき再利用可能なＬｉｓｔＣｅｌｌが既に存在する場合があるため、新しいＬｉｓｔＣｅｌｌのコンテンツが表示されるときに再利用可能なＬｉｓｔＣｅｌｌを使用できる、即ち、表示領域内のＬｉｓｔＣｅｌｌは、リストをスクロールする工程において繰り返し再利用され移動される。そのため、新しいＬｉｓｔＣｅｌｌの創出及び配置に要するメモリ及び時間を更に削減して性能を向上させることができる。当然、再利用可能なＬｉｓｔＣｅｌｌが存在しない場合、新しいＬｉｓｔＣｅｌｌのコンテンツに基づいてＬｉｓｔＣｅｌｌテンプレートをコピーして対応するデータのＬｉｓｔＣｅｌｌを取得する必要がある。例えば、１５個のＬｉｓｔＣｅｌｌのコンテンツを表示する必要があり、表示領域は、１０個のＬｉｓｔＣｅｌｌを含めて表示できる。この場合、１０個のＬｉｓｔＣｅｌｌのコンテンツを表示するために１０個のＬｉｓｔＣｅｌｌを最初の表示時にコピーする必要がある。他の５個のＬｉｓｔＣｅｌｌのコンテンツを表示のために表示領域へ移動する必要がある場合、既に表示されている５個の対応するＬｉｓｔＣｅｌｌのコンテンツは表示領域の外に移動される。表示領域の外に移動される５個のＬｉｓｔＣｅｌｌは、再利用可能なＬｉｓｔＣｅｌｌとしてリサイクルすることができる。次いで、５個の再利用可能なＬｉｓｔＣｅｌｌは、他の５個のＬｉｓｔＣｅｌｌのコンテンツのために再利用できる。 In an example implementation of a method for reusing a ListCell in a hybrid application in this application, the steps for reusing a ListCell include: If the content of a ListCell is moved out of the display area, the content of the moved ListCell is included. Recycle the ListCell as a reusable ListCell; if the content of the new ListCell should be moved to the display area, identify if there is a reusable ListCell; if yes, a new ListCell Filling in the reusable ListCell and displaying the ListCell; or, if not, by copying the ListCell template And a; get, the contents of the new ListCell, fill the copied ListCell, the step of displaying the ListCell. Here, as shown in FIG. 3, in particular, when a certain ListCell is displayed for the first time in the display area, there may already be a reusable ListCell, so when a new ListCell content is displayed. The reusable ListCell can be used, that is, the ListCell in the display area is repeatedly reused and moved in the process of scrolling the list. Therefore, the memory and time required for creating and arranging a new ListCell can be further reduced to improve the performance. Of course, when there is no reusable ListCell, it is necessary to copy the ListCell template based on the content of the new ListCell and acquire the ListCell of the corresponding data. For example, it is necessary to display the contents of 15 ListCells, and the display area can be displayed including 10 ListCells. In this case, in order to display the contents of 10 ListCells, it is necessary to copy 10 ListCells at the time of initial display. When it is necessary to move the contents of the other five ListCells to the display area for display, the contents of the five corresponding ListCells already displayed are moved out of the display area. The five ListCells moved out of the display area can be recycled as reusable ListCells. The 5 reusable ListCells can then be reused for the content of the other 5 ListCells.
図５に示すように、本願の原理及び手順をより深く理解するため、ハイブリッドフレームワーク（Ｒｅａｃｔ Ｎａｔｉｖｅ）を例にとり、本願の実施原理及び手順を以下の通り説明する。 As shown in FIG. 5, in order to better understand the principle and procedure of the present application, the implementation principle and procedure of the present application will be described as follows by taking a hybrid framework (React Native) as an example.
ステップＳ５１：フロントエンドレイヤが、ＬｉｓｔＣｅｌｌの構造及びクラスを定義する。 Step S51: The front end layer defines the structure and class of the ListCell.
ステップＳ５２：フロントエンドレイヤが、リストコンテンツデータ、即ち、ＬｉｓｔＣｅｌｌのコンテンツを取得する。 Step S52: The front-end layer acquires list content data, that is, ListCell content.
ステップＳ５３：フロントエンドレイヤが、定義されたＬｉｓｔＣｅｌｌの構造及びクラスに基づいてＬｉｓｔＣｅｌｌプロトタイプを創出し、リストコンテンツデータをネイティブエンドへ伝送し、次いで、ステップＳ５６へ進む。 Step S53: The front end layer creates a ListCell prototype based on the defined ListCell structure and class, transmits the list content data to the native end, and then proceeds to Step S56.
ステップＳ５６：ネイティブエンドレイヤが、フロントエンドレイヤにより創出されたＬｉｓｔＣｅｌｌプロトタイプに基づいてＬｉｓｔＣｅｌｌプロトタイプインスタンス、即ち、ＬｉｓｔＣｅｌｌテンプレートを創出する。 Step S56: The native end layer creates a ListCell prototype instance, that is, a ListCell template, based on the ListCell prototype created by the front end layer.
ステップＳ５７：ネイティブエンドが、新しいＬｉｓｔＣｅｌｌを表示領域に移動すべきであると特定し、ステップＳ５８へ進む。 Step S57: The native end specifies that a new ListCell should be moved to the display area, and proceeds to step S58.
ステップＳ５７と同時に実行されるステップＳ６２：ネイティブエンドが、或るＬｉｓｔＣｅｌｌを表示領域の外へ移動すべきであると特定し、ステップＳ６３へ進む。 Step S62 executed simultaneously with step S57: The native end specifies that a certain ListCell should be moved out of the display area, and proceeds to step S63.
ステップＳ６３：ネイティブエンドが、モバイル表示領域内のＬｉｓｔＣｅｌｌを再利用可能なＬｉｓｔＣｅｌｌとして用い、次いで、ステップＳ５８へ進む。 Step S63: The native end uses the ListCell in the mobile display area as a reusable ListCell, and then proceeds to Step S58.
ステップＳ５８：ネイティブエンドが、再利用可能なＬｉｓｔＣｅｌｌが存在するかどうかを特定する。 Step S58: The native end specifies whether there is a reusable ListCell.
肯定であれば、ステップＳ５９が実行される。即ち、ネイティブエンドが再利用可能なＬｉｓｔＣｅｌｌを直接再利用し、次いで、ステップＳ６１へ進む。ここで、ネイティブエンドは、表示可能領域に含めて表示できるＬｉｓｔＣｅｌｌの数に基づいて、再利用できるＬｉｓｔＣｅｌｌを特定する。 If affirmative, step S59 is executed. That is, the ListCell that can be reused by the native end is directly reused, and then the process proceeds to Step S61. Here, the native end specifies a reusable ListCell based on the number of ListCells that can be displayed in the displayable area.
否定であれば、ステップＳ６０が実行される。即ち、ネイティブエンドが、リストコンテンツデータに基づいてＬｉｓｔＣｅｌｌプロトタイプインスタンスからＬｉｓｔＣｅｌｌをコピーし、次いで、ステップＳ６１へ進む。ここで、ネイティブエンドは、フロントエンドレイヤから伝送されるリストコンテンツデータに基づいて他のＬｉｓｔＣｅｌｌをコピーする。 If not, step S60 is executed. That is, the native end copies the ListCell from the ListCell prototype instance based on the list content data, and then proceeds to Step S61. Here, the native end copies another ListCell based on the list content data transmitted from the front end layer.
ステップＳ６１：ＬｉｓｔＣｅｌｌをレンダリングし、次いで、ステップＳ５４へ進む。 Step S61: Renders the ListCell, and then proceeds to Step S54.
ステップＳ５４：フロントエンドレイヤユーザが、リストをスクロールする。 Step S54: The front end layer user scrolls the list.
ステップＳ５５：リフレッシュを起動した後、フロントエンドレイヤが、ステップＳ５３へ進む。この場合、ＬｉｓｔＣｅｌｌプロトタイプを再度創出する必要はなく、リストのリフレッシュされたコンテンツデータ、即ち、表示すべき新しいリストコンテンツデータのみがネイティブエンドに伝送される。 Step S55: After starting the refresh, the front end layer proceeds to step S53. In this case, it is not necessary to recreate the ListCell prototype, and only the refreshed content data of the list, i.e. new list content data to be displayed, is transmitted to the native end.
図６に示すように、本願の別の態様によると、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置が更に提供される。装置１００は、ハイブリッドアプリケーションのフロントエンドにて、ＬｉｓｔＣｅｌｌのプロトタイプを定義するように構成された定義装置１と；ハイブリッドアプリケーションのネイティブエンドにて、ＬｉｓｔＣｅｌｌのプロトタイプに基づいてコピーすることを通じてＬｉｓｔＣｅｌｌを取得し、ＬｉｓｔＣｅｌｌを再利用するように構成されたコピー・再利用装置２と；を含む。本願において、ＬｉｓｔＣｅｌｌのプロトタイプがフロントエンドにて定義される。ＬｉｓｔＣｅｌｌのプロトタイプは、ネイティブエンド（Ｎａｔｉｖｅ）にてコピーされる。ネイティブエンドは、現在のリスト提示位置に基づいて不可視のＬｉｓｔＣｅｌｌを再利用する。そのため、ＬｉｓｔＣｅｌｌのプロトタイプをフロントエンドにて定義することができ、ネイティブエンドにてＬｉｓｔＣｅｌｌを自由に創出し、レンダリングし、再利用できる。したがって、ハイブリッド開発においてＬｉｓｔＣｅｌｌの定義付けにおける柔軟性を維持できるだけでなく、ＬｉｓｔＣｅｌｌをネイティブエンドにて再利用でき、それにより、大きなリストの提示及び操作性能が大幅に向上する。本願の技術的解決策の中核は、ハイブリッド開発においては、ＬｉｓｔＣｅｌｌの構造及びクラスはフロントエンドにて定義される、しかし、ＬｉｓｔＣｅｌｌはネイティブエンドにて創出され再利用される、という課題を解決することである。そうすることで、リストページ上でＬｉｓｔＣｅｌｌを再利用してレンダリング及び操作性能を向上させることができる。本願は、全てのハイブリッドアプリケーション開発に適用可能であり、Ｒｅａｃｔ Ｎａｔｉｖｅフレームワークにおいて非常に良好な実施効果を奏する。
As shown in FIG. 6, according to another aspect of the present application, an apparatus for reusing a ListCell in a hybrid application is further provided. The apparatus 100 obtains a ListCell through copying based on the ListCell prototype at the native end of the hybrid application, and a
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置の実施の例では、定義装置１は、ＬｉｓｔＣｅｌｌのプロトタイプの構造レイアウト及びクラスを定義するように構成される。ここで、ＬｉｓｔＣｅｌｌのプロトタイプを定義することは、ＬｉｓｔＣｅｌｌの構造及びクラスを定義することを含む。そのため、ハイブリッド開発において、フロントエンドにてＬｉｓｔＣｅｌｌを柔軟に定義できる。
In the example implementation of the device for reusing ListCell in a hybrid application in this application, the
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置の実施の例では、ＬｉｓｔＣｅｌｌのプロトタイプは単一のＬｉｓｔＣｅｌｌのプロトタイプである。ここでは、１つのインスタンス（即ち、ＬｉｓｔＣｅｌｌのプロトタイプ）のみがフロントエンドレイヤにて創出される。それに続き、ＬｉｓｔＣｅｌｌテンプレートをプロトタイプのみに基づいてネイティブエンドにて創出できる。次いで、ＬｉｓｔＣｅｌｌテンプレートが、必要に応じてコピーされる。そのため、新しいＬｉｓｔＣｅｌｌの創出及び配置に要するメモリ及び時間を削減して性能を向上させることができる。 In the example implementation of an apparatus for reusing ListCell in a hybrid application in this application, the ListCell prototype is a single ListCell prototype. Here, only one instance (ie, a ListCell prototype) is created at the front end layer. Following that, a ListCell template can be created at the native end based solely on the prototype. The ListCell template is then copied as needed. Therefore, it is possible to improve the performance by reducing the memory and time required for creating and arranging a new ListCell.
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置の実施の例では、コピー・再利用装置２は、ＬｉｓｔＣｅｌｌのプロトタイプに基づいてＬｉｓｔＣｅｌｌテンプレートを創出し、ＬｉｓｔＣｅｌｌテンプレートをコピーすることによりＬｉｓｔＣｅｌｌを取得し、取得されたＬｉｓｔＣｅｌｌのコンテンツをコピーされたＬｉｓｔＣｅｌｌに記入し、ＬｉｓｔＣｅｌｌを表示するように構成される。ここで、図３に示すように、ＬｉｓｔＣｅｌｌテンプレート、即ち、図におけるＬｉｓｔＣｅｌｌプロトタイプのインスタンスは、フロントエンドにて定義されるプロトタイプのみに基づいてネイティブエンドにて創出される。次いで、表示する必要があるＬｉｓｔＣｅｌｌのコンテンツの数に基づいて、ＬｉｓｔＣｅｌｌテンプレートがコピーされ、対応する数のＬｉｓｔＣｅｌｌが取得される。次いで、ＬｉｓｔＣｅｌｌのコンテンツ、即ち、図３におけるＬｉｓｔＣｅｌｌデータ１からｎが、レンダリング及び表示のためにそれぞれ対応するＬｉｓｔＣｅｌｌに記入される。そのため、新しいＬｉｓｔＣｅｌｌの創出及び配置に要するメモリ及び時間を削減して性能を向上させることができる。
In the example of the implementation of the device for reusing ListCell in a hybrid application in the present application, the copy /
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置の実施の例では、コピー・再利用装置２は、ＬｉｓｔＣｅｌｌテンプレートの全てのサブビューをトラバースして、これらを取得し、全てのサブビュー及びサブビューの属性を含むＬｉｓｔＣｅｌｌを創出するように構成される。ここで、ＬｉｓｔＣｅｌｌテンプレートの全てのサブビュー（ビュー）は再帰的にトラバースされ、次いで、全てのサブビュー及びサブビューに対応する属性を含むためにコピーすることを通じてＬｉｓｔＣｅｌｌが取得される。そのため、ＬｉｓｔＣｅｌｌを正確にコピーすることができる。図４に示すように、ＬｉｓｔＣｅｌｌテンプレート、即ち、図４におけるＬｉｓｔＣｅｌｌプロトタイプのサブビューは、Ａ、Ｂ、Ｃ、Ｄ、及びＥを含む。ＬｉｓｔＣｅｌｌプロトタイプをコピーするステップは、ＬｉｓｔＣｅｌｌプロトタイプの全てのサブビュー及びサブビューの属性を含むＬｉｓｔＣｅｌｌを創出する工程である。取得されるＬｉｓｔＣｅｌｌのサブビューは、Ａ’、Ｂ’、Ｃ’、Ｄ’、及びＥ’を含む。
In the example of the implementation of the device for reusing ListCell in a hybrid application in this application, the copy /
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置の実施の例では、コピー・再利用装置２は、取得されたＬｉｓｔＣｅｌｌのコンテンツを、創出されたＬｉｓｔＣｅｌｌのそれぞれの対応するサブビューに記入するように構成される。ここで、ＬｉｓｔＣｅｌｌのコンテンツに基づいてコピーされたＬｉｓｔＣｅｌｌのそれぞれの対応するサブビューに、ＬｉｓｔＣｅｌｌのコンテンツを記入できる。そのため、ＬｉｓｔＣｅｌｌのコンテンツをＬｉｓｔＣｅｌｌの対応する位置に正確に表示できる。図４に示すように、本実施において、ＬｉｓｔＣｅｌｌのコンテンツ、即ち、図４におけるコンテンツデータはそれぞれ、コピーされたＬｉｓｔＣｅｌｌの対応するサブビューＡ’、Ｂ’、Ｃ’、Ｄ’、及びＥ’に記入される。
In the example of implementation of the device for reusing ListCell in a hybrid application in the present application, the copy /
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置の実施の例では、ＬｉｓｔＣｅｌｌのコンテンツはフロントエンドから取得される。ここで、図３に示すように、ＬｉｓｔＣｅｌｌのプロトタイプを定義することに加えて、フロントエンドは、ＬｉｓｔＣｅｌｌのコンテンツ、即ち、図３におけるＬｉｓｔＣｅｌｌのデータをネイティブエンドへ伝送するだけでよい。そのため、フロントエンドデータ処理のために消費されるメモリ及び時間を削減できる。 In the embodiment of the apparatus for reusing ListCell in a hybrid application in the present application, the content of ListCell is acquired from the front end. Here, as shown in FIG. 3, in addition to defining the ListCell prototype, the front end only needs to transmit the ListCell content, that is, the ListCell data in FIG. 3 to the native end. Therefore, the memory and time consumed for front-end data processing can be reduced.
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置の実施の例では、コピー・再利用装置２は、表示領域に含めて表示できるＬｉｓｔＣｅｌｌの数に基づいてコピーされるＬｉｓｔＣｅｌｌの数を特定するように構成される。ここでは、とりわけ、ＬｉｓｔＣｅｌｌが表示領域に初めて表示される場合、再利用可能なＬｉｓｔＣｅｌｌがまだ存在しないため、表示領域に含めて表示できるＬｉｓｔＣｅｌｌの数に基づいてコピーすることにより、対応する数のＬｉｓｔＣｅｌｌを取得する必要がある。例えば、図３において、対応する数のＬｉｓｔＣｅｌｌが、１つの画面上に表示できるＬｉｓｔＣｅｌｌの数に基づいて生成される、ことが特定される。そのため、ＬｉｓｔＣｅｌｌを必要に応じてコピーすることができ、新しいＬｉｓｔＣｅｌｌの創出及び配置に要するメモリ及び時間を削減して性能を向上させることができる。例えば、１０個のＬｉｓｔＣｅｌｌコンテンツを表示する必要があり、表示領域は、１０個のＬｉｓｔＣｅｌｌを含めて表示できる場合、１０個のＬｉｓｔＣｅｌｌをコピーする必要がある。
In the implementation example of the device that reuses ListCell in a hybrid application in the present application, the copy /
本願における、ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置の実施の例では、コピー・再利用装置２は、或るＬｉｓｔＣｅｌｌのコンテンツが表示領域の外に移動された場合、移動されたＬｉｓｔＣｅｌｌのコンテンツを含むＬｉｓｔＣｅｌｌを再利用可能なＬｉｓｔＣｅｌｌとしてリサイクルし；新しいＬｉｓｔＣｅｌｌのコンテンツを表示領域に移動すべき場合、再利用可能なＬｉｓｔＣｅｌｌが存在するかどうかを特定し；肯定であれば、新しいＬｉｓｔＣｅｌｌのコンテンツを再利用可能なＬｉｓｔＣｅｌｌに記入し、ＬｉｓｔＣｅｌｌを表示し；否定であれば、ＬｉｓｔＣｅｌｌテンプレートをコピーすることによりＬｉｓｔＣｅｌｌを取得し、新しいＬｉｓｔＣｅｌｌのコンテンツをコピーされたＬｉｓｔＣｅｌｌに記入し、ＬｉｓｔＣｅｌｌを表示するように構成される。ここで、図３に示すように、とりわけ、或るＬｉｓｔＣｅｌｌが表示領域に初めて表示される場合、このとき再利用可能なＬｉｓｔＣｅｌｌが既に存在する場合があるため、新しいＬｉｓｔＣｅｌｌコンテンツが表示されるときに再利用可能なＬｉｓｔＣｅｌｌを使用できる、即ち、表示領域内のＬｉｓｔＣｅｌｌは、リストをスクロールする工程において繰り返し再利用され移動される。そのため、新しいＬｉｓｔＣｅｌｌの創出及び配置に要するメモリ及び時間を更に削減して性能を向上させることができる。当然、再利用可能なＬｉｓｔＣｅｌｌが存在しない場合、新しいＬｉｓｔＣｅｌｌコンテンツに基づいてＬｉｓｔＣｅｌｌテンプレートをコピーして対応するデータのＬｉｓｔＣｅｌｌを取得する必要がある。例えば、１５のＬｉｓｔＣｅｌｌコンテンツを表示する必要があり、表示領域は、１０個のＬｉｓｔＣｅｌｌを含めて表示できる。この場合、１０個のＬｉｓｔＣｅｌｌコンテンツを表示するために１０個のＬｉｓｔＣｅｌｌを最初の表示時にコピーする必要がある。他の５つのＬｉｓｔＣｅｌｌコンテンツを表示のために表示領域へ移動する必要がある場合、既に表示されている５個の対応するＬｉｓｔＣｅｌｌコンテンツは表示領域の外に移動される。表示領域の外に移動される５個のＬｉｓｔＣｅｌｌは、再利用可能なＬｉｓｔＣｅｌｌとしてリサイクルできる。５個の再利用可能なＬｉｓｔＣｅｌｌは、他の５個のＬｉｓｔＣｅｌｌコンテンツのために再利用できる。
In the example of implementation of the device for reusing ListCell in a hybrid application in the present application, the copy /
結論として、本願において、ＬｉｓｔＣｅｌｌのプロトタイプがフロントエンドにて定義される。ＬｉｓｔＣｅｌｌのプロトタイプは、ネイティブエンドにてコピーされる。ネイティブエンドは、現在のリスト提示位置に基づいて不可視のＬｉｓｔＣｅｌｌを再利用する。そのため、ＬｉｓｔＣｅｌｌのプロトタイプをフロントエンドにて定義することができ、ネイティブエンドにてＬｉｓｔＣｅｌｌを自由に創出し、レンダリングし、再利用できる。したがって、ハイブリッド開発においてＬｉｓｔＣｅｌｌの定義付けの柔軟性を維持できるだけでなく、ＬｉｓｔＣｅｌｌをネイティブエンドにて再利用でき、それにより、大きなリストの提示及び操作性能が大幅に向上する。本願の技術的解決策の中核は、リストページ上のＬｉｓｔＣｅｌｌを再利用し、レンダリング及び操作性能を向上させるため、ハイブリッドアプリケーション開発においては、ＬｉｓｔＣｅｌｌの構造及びクラスはフロントエンドにて定義されるが、ＬｉｓｔＣｅｌｌはネイティブエンドにて創出され再利用される、という課題を解決することである。 In conclusion, in the present application, a ListCell prototype is defined at the front end. The ListCell prototype is copied at the native end. The native end reuses the invisible ListCell based on the current list presentation position. Therefore, a ListCell prototype can be defined at the front end, and a ListCell can be freely created, rendered, and reused at the native end. Therefore, not only can the flexibility of defining ListCell be maintained in hybrid development, but ListCell can be reused in the native end, thereby greatly improving the presentation and operation performance of a large list. The core of the technical solution of the present application is to reuse the ListCell on the list page to improve rendering and operation performance. In hybrid application development, the structure and class of the ListCell are defined in the front end. It is to solve the problem that ListCell is created and reused at the native end.
明らかに、当業者は、本願の精神及び範囲から逸脱することなく、本願に対して様々な修正及び変形を行うことができる。本願は、これらの改変及び変形が添付の特許請求の範囲及びそれらと同等の技術によって定義される保護の範囲内に入る限り、本願のこれらの改変及び変形を包含することを意図している。 Obviously, those skilled in the art can make various modifications and variations to the present application without departing from the spirit and scope of the present application. This application is intended to cover these modifications and variations of the present application so long as they fall within the scope of protection as defined by the appended claims and equivalent technology.
本願は、ソフトウェア及び／又はソフトウェアとハードウェアとの組み合わせで実施することができることに留意する価値がある。例えば、本願は、特定用途向け集積回路（ＡＳＩＣ）、汎用コンピュータ、又は任意の他の同様のハードウェアデバイスを使用することによって実施することができる。ある実施では、前述のステップ及び機能を実施するために、本願のソフトウェアプログラムをプロセッサによって実行することができる。同様に、本願におけるソフトウェアプログラム（関連するデータ構造を含む）は、コンピュータ読み取り可能記録媒体、例えばＲＡＭメモリ、磁気又は光学ドライブ、又は、フロッピー（登録商標）ディスク、及び同様のデバイスに格納することができる。更に、本願におけるいくつかのステップ又は機能は、ハードウェア、例えば、プロセッサと協働してステップ又は機能を実行する回路を使用することによって実施することができる。 It is worth noting that the present application may be implemented in software and / or a combination of software and hardware. For example, the present application may be implemented by using an application specific integrated circuit (ASIC), a general purpose computer, or any other similar hardware device. In one implementation, the software program of the present application can be executed by a processor to perform the steps and functions described above. Similarly, the software programs (including associated data structures) in this application may be stored on computer readable storage media such as RAM memory, magnetic or optical drives, floppy disks, and similar devices. it can. Furthermore, some steps or functions in this application may be implemented by using hardware, for example, a circuit that performs the steps or functions in cooperation with a processor.
更に、本願の一部は、コンピュータプログラム命令のようなコンピュータプログラム製品として実施することができる。コンピュータプログラム命令がコンピュータによって実行されるとき、本願に基づく方法及び／又は技術的解決策は、コンピュータの動作を使用して呼び出されるか又は提供されることができる。更に、本願の方法を呼び出すためのプログラム命令は、固定又は取外し可能な記録媒体に格納することができ、及び／又は他の信号ベアラ媒体におけるブロードキャスト又はデータフローを使用して送信することができ、及び／又はプログラム命令に基づいて動作するコンピュータデバイスのオペレーティングメモリに格納することができる。ここで、本願による実施は、装置を含み、装置は、コンピュータプログラム命令を記憶するように構成されたメモリと、プログラム命令を実行するように構成されたプロセッサとを含む。コンピュータプログラム命令がプロセッサによって実行されると、コンピュータプログラム命令は、本願による複数の実施における前述の方法及び／又は技術的解決策に基づいて装置の作動をトリガする。 Moreover, portions of the present application may be implemented as computer program products such as computer program instructions. When computer program instructions are executed by a computer, the methods and / or technical solutions according to the present application may be invoked or provided using computer operations. Further, the program instructions for invoking the method of the present application can be stored on a fixed or removable recording medium and / or transmitted using broadcast or data flow in other signal bearer media, And / or can be stored in the operating memory of a computing device that operates based on program instructions. Here, an implementation according to the present application includes an apparatus, the apparatus including a memory configured to store computer program instructions and a processor configured to execute the program instructions. When the computer program instructions are executed by the processor, the computer program instructions trigger the operation of the device based on the aforementioned methods and / or technical solutions in several implementations according to the present application.
本願は、前述の実施例の詳細に限定されず、本願は、本願の精神又は本質的な特徴から逸脱することなく、別の特定の形態で実施され得ることは当業者には明らかである。したがって、実施は、例示的であり、すべての態様において限定的ではなく、本願の範囲は、上記の説明ではなく添付の特許請求の範囲によって限定されるべきである。したがって、本願は、特許請求の範囲の均等な要素の意味及び範囲内のすべての変更を包含する。特許請求の範囲内の任意の参照番号は、関連する特許請求の範囲の限定とみなされるべきではない。更に、「含む」という単語は、他のユニット又はステップを排除するものではなく、単数は複数を除外しないことは明らかである。また、装置クレームに記載された複数のユニット又は装置は、ソフトウェア又はハードウェアにより、１つのユニット又は装置に実現させることができる。「第１」及び「第２」などの単語は、特定の順序ではなく名前を示すために使用される。
It will be apparent to those skilled in the art that the present application is not limited to the details of the foregoing embodiments, and that the present application may be embodied in other specific forms without departing from the spirit or essential characteristics of the present application. Accordingly, the implementation is illustrative and not restrictive in all aspects, and the scope of the present application should be limited not by the above description, but by the appended claims. Accordingly, this application includes the meaning and range of equivalent elements of the claims. Any reference signs in the claims should not be construed as limiting the relevant claims. Furthermore, the word “comprising” does not exclude other units or steps, and it is obvious that the singular does not exclude a plurality. The plurality of units or devices described in the device claims can be realized in one unit or device by software or hardware. Words such as “first” and “second” are used to indicate names rather than a specific order.
Claims (18)
前記ハイブリッドアプリケーションのネイティブエンドにて、前記ＬｉｓｔＣｅｌｌの前記プロトタイプに基づいてコピーすることを通じて、前記ＬｉｓｔＣｅｌｌを取得し、前記ＬｉｓｔＣｅｌｌを再利用するステップと；を備える、
ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する方法。 Defining a ListCell prototype at the front end of the hybrid application;
Obtaining the ListCell by copying based on the prototype of the ListCell at a native end of the hybrid application, and reusing the ListCell.
A method of reusing ListCell in a hybrid application.
前記ＬｉｓｔＣｅｌｌの前記プロトタイプの構造レイアウト及びクラスを定義するステップを備える、
請求項１に記載の方法。 The steps for defining a ListCell prototype are:
Defining a structural layout and class of the prototype of the ListCell;
The method of claim 1.
請求項１に記載の方法。 The prototype of the ListCell is a single ListCell prototype,
The method of claim 1.
前記ＬｉｓｔＣｅｌｌの前記プロトタイプに基づいてＬｉｓｔＣｅｌｌテンプレートを創出するステップと；
前記ＬｉｓｔＣｅｌｌテンプレートをコピーすることにより前記ＬｉｓｔＣｅｌｌを取得するステップと；
取得されたＬｉｓｔＣｅｌｌのコンテンツを前記コピーされたＬｉｓｔＣｅｌｌに記入し、前記ＬｉｓｔＣｅｌｌを表示するステップと；を備える、
請求項１乃至請求項３のいずれか１項に記載の方法。 The steps of obtaining the ListCell through copying based on the prototype of the ListCell include:
Creating a ListCell template based on the prototype of the ListCell;
Obtaining the ListCell by copying the ListCell template;
Filling the acquired ListCell content in the copied ListCell and displaying the ListCell;
The method according to any one of claims 1 to 3.
前記ＬｉｓｔＣｅｌｌテンプレートの全てのサブビューをトラバースし、これらを取得するステップと；
全ての前記サブビューと前記サブビューの属性とを含むＬｉｓｔＣｅｌｌを創出するステップと；を備える、
請求項４に記載の方法。 The steps of obtaining the ListCell by copying the ListCell template include:
Traversing all subviews of the ListCell template and obtaining them;
Creating a ListCell that includes all the subviews and attributes of the subviews;
The method of claim 4.
前記取得されたＬｉｓｔＣｅｌｌのコンテンツを、前記創出されたＬｉｓｔＣｅｌｌのそれぞれの対応するサブビューに記入するステップを備える、
請求項５に記載の方法。 The step of entering the obtained ListCell content in the copied ListCell includes:
Filling the obtained ListCell content in a corresponding subview of each of the created ListCells;
The method of claim 5.
請求項６に記載の方法。 The content of the ListCell is obtained from the front end.
The method of claim 6.
請求項４に記載の方法。 While acquiring the ListCell by copying the ListCell template, the number of ListCells to be copied is specified based on the number of ListCells that can be included in the display area and displayed.
The method of claim 4.
或るＬｉｓｔＣｅｌｌのコンテンツが前記表示領域の外に移動された場合、前記移動されたＬｉｓｔＣｅｌｌのコンテンツを含むＬｉｓｔＣｅｌｌを再利用可能なＬｉｓｔＣｅｌｌとしてリサイクルするステップと；
新しいＬｉｓｔＣｅｌｌのコンテンツを前記表示領域に移動すべき場合、再利用可能なＬｉｓｔＣｅｌｌが存在するかどうかを特定するステップと；
肯定である場合、前記新しいＬｉｓｔＣｅｌｌのコンテンツを前記再利用可能なＬｉｓｔＣｅｌｌに記入し、前記ＬｉｓｔＣｅｌｌを表示するステップ；又は
否定である場合、前記ＬｉｓｔＣｅｌｌテンプレートをコピーすることにより前記ＬｉｓｔＣｅｌｌを取得し、前記新しいＬｉｓｔＣｅｌｌのコンテンツを前記コピーされたＬｉｓｔＣｅｌｌに記入し、前記ＬｉｓｔＣｅｌｌを表示するステップ；とを備える、
請求項４に記載の方法。 The steps of reusing the ListCell include:
Recycling a ListCell containing the moved ListCell content as a reusable ListCell when the content of a certain ListCell is moved out of the display area;
Identifying whether there is a reusable ListCell if new ListCell content is to be moved to the display area;
If affirmative, fill the reusable ListCell with the content of the new ListCell and display the ListCell; or, if negative, obtain the ListCell by copying the ListCell template Filling ListCell content into the copied ListCell and displaying the ListCell;
The method of claim 4.
前記ハイブリッドアプリケーションのネイティブエンドにて、前記ＬｉｓｔＣｅｌｌの前記プロトタイプに基づいてコピーすることを通じて前記ＬｉｓｔＣｅｌｌを取得し、前記ＬｉｓｔＣｅｌｌを再利用するように構成されたコピー・再利用装置と；
を備える、
ハイブリッドアプリケーションにおいてＬｉｓｔＣｅｌｌを再利用する装置。 A definition device configured to define a ListCell prototype at the front end of the hybrid application;
A copy / reuse device configured to acquire the ListCell by copying based on the prototype of the ListCell and to reuse the ListCell at a native end of the hybrid application;
Comprising
A device that reuses ListCell in hybrid applications.
請求項１０に記載の装置。 The definition device is configured to define a structural layout and class of the prototype of the ListCell;
The apparatus according to claim 10.
請求項１０に記載の装置。 The prototype of the ListCell is a single ListCell prototype,
The apparatus according to claim 10.
請求項１０乃至請求項１２のいずれか１項に記載の装置。 The copy / reuse device creates a ListCell template based on the prototype of the ListCell, acquires the ListCell by copying the ListCell template, and fills the copied ListCell with the content of the acquired ListCell And configured to display the ListCell,
The apparatus according to any one of claims 10 to 12.
請求項１３に記載の装置。 The copy / reuse device is configured to traverse all subviews of the ListCell template, obtain them, and create a ListCell that includes all the subviews and attributes of the subviews,
The apparatus of claim 13.
請求項１４に記載の装置。 The copy / reuse device is configured to fill in the content of the acquired ListCell in a corresponding subview of each of the created ListCells;
The apparatus according to claim 14.
請求項１５に記載の装置。 The content of the ListCell is obtained from the front end.
The apparatus according to claim 15.
請求項１３に記載の装置。 The copy / reuse device is configured to identify the number of ListCells to be copied based on the number of ListCells that can be displayed in the display area.
The apparatus of claim 13.
請求項１３に記載の装置。 When the content of a certain ListCell is moved out of the display area, the copy / reuse device recycles the ListCell including the moved ListCell content as a reusable ListCell; If moving to the display area, specify whether there is a reusable ListCell; if yes, enter the new ListCell content in the reusable ListCell and display the ListCell If not, obtain the ListCell by copying the ListCell template, fill in the content of the new ListCell in the copied ListCell, and replace the ListCell with It is configured to Shimesuru so,
The apparatus of claim 13.
Applications Claiming Priority (3)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201610116409.9A CN107153528A (en) | 2016-03-02 | 2016-03-02 | The method and apparatus that mixed model list items are reused |
| CN201610116409.9 | 2016-03-02 | ||
| PCT/CN2017/074178 WO2017148298A1 (en) | 2016-03-02 | 2017-02-20 | Method and apparatus reusing list cell in hybrid application |
Publications (3)
| Publication Number | Publication Date |
|---|---|
| JP2019510309A true JP2019510309A (en) | 2019-04-11 |
| JP2019510309A5 JP2019510309A5 (en) | 2020-03-12 |
| JP6941617B2 JP6941617B2 (en) | 2021-09-29 |
Family
ID=59743462
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| JP2018546452A Active JP6941617B2 (en) | 2016-03-02 | 2017-02-20 | Methods and equipment for reusing ListCell in hybrid applications |
Country Status (10)
| Country | Link |
|---|---|
| US (2) | US10691427B2 (en) |
| EP (1) | EP3425526B1 (en) |
| JP (1) | JP6941617B2 (en) |
| KR (1) | KR102127063B1 (en) |
| CN (1) | CN107153528A (en) |
| MY (1) | MY193879A (en) |
| PH (1) | PH12018501836A1 (en) |
| SG (1) | SG11201807357WA (en) |
| TW (1) | TWI697790B (en) |
| WO (1) | WO2017148298A1 (en) |
Families Citing this family (12)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107153528A (en) | 2016-03-02 | 2017-09-12 | 阿里巴巴集团控股有限公司 | The method and apparatus that mixed model list items are reused |
| CN110020308A (en) * | 2017-12-01 | 2019-07-16 | 北京高德云图科技有限公司 | The method and device of cell component load |
| CN108023960B (en) * | 2017-12-08 | 2019-05-21 | 百度在线网络技术（北京）有限公司 | The method for constructing the device and the push of Feed stream information of Feed stream application |
| CN108744514B (en) * | 2018-05-18 | 2021-08-06 | 腾讯科技（深圳）有限公司 | Sliding list generation method, data display device and storage medium |
| CN110688114B (en) * | 2018-07-05 | 2022-11-11 | 武汉斗鱼网络科技有限公司 | Method, storage medium, device and system for bridging native list views |
| CN109614194B (en) * | 2018-12-11 | 2020-06-30 | 北京微播视界科技有限公司 | List interface display method, device, equipment and storage medium |
| CN109683939B (en) * | 2018-12-29 | 2023-05-02 | 北京小米移动软件有限公司 | Component object updating method, device and storage medium |
| CN109871523A (en) * | 2019-01-31 | 2019-06-11 | 成都摹客科技有限公司 | A kind of Method of Creation Process and system of the unit cell based on prototype tool |
| CN109871254A (en) * | 2019-01-31 | 2019-06-11 | 成都摹客科技有限公司 | A kind of creation method and system of the unit cell of separable prototype tool |
| CN110347327B (en) * | 2019-07-12 | 2021-03-23 | 网易（杭州）网络有限公司 | Item editing method and touch terminal |
| CN111240672A (en) * | 2020-01-02 | 2020-06-05 | 广州虎牙科技有限公司 | List implementation method and device, electronic equipment and readable storage medium |
| CN111857718B (en) * | 2020-07-29 | 2024-04-09 | 网易（杭州）网络有限公司 | List editing method, device, equipment and storage medium |
Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2001325098A (en) * | 2000-05-16 | 2001-11-22 | Sumitomo Electric Ind Ltd | Method for preparing application program method for operating database, method for managing item object, method for controlling module operation and computer- readable recording medium recorded with program for realizing operation, management and control methods |
| JP2013003651A (en) * | 2011-06-13 | 2013-01-07 | Sony Computer Entertainment Inc | List display apparatus |
| WO2014168809A1 (en) * | 2013-04-11 | 2014-10-16 | Facebook, Inc. | Application-tailored object re-use and recycling |
Family Cites Families (32)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US5485600A (en) * | 1992-11-09 | 1996-01-16 | Virtual Prototypes, Inc. | Computer modelling system and method for specifying the behavior of graphical operator interfaces |
| US6009251A (en) * | 1997-09-30 | 1999-12-28 | Synopsys, Inc. | Method and system for layout verification of an integrated circuit design with reusable subdesigns |
| US7421648B1 (en) * | 1999-05-21 | 2008-09-02 | E-Numerate Solutions, Inc. | Reusable data markup language |
| US7222291B2 (en) * | 2000-12-29 | 2007-05-22 | International Business Machines Corporation | Method and system for importing HTML forms |
| US20130024812A1 (en) * | 2011-07-13 | 2013-01-24 | Z124 | Foreground/background assortment of hidden windows |
| US8219900B2 (en) * | 2006-07-07 | 2012-07-10 | International Business Machines Corporation | Programmatically hiding and displaying Wiki page layout sections |
| US9019300B2 (en) * | 2006-08-04 | 2015-04-28 | Apple Inc. | Framework for graphics animation and compositing operations |
| US8621652B2 (en) * | 2007-09-17 | 2013-12-31 | Metabyte Inc. | Copying a web element with reassigned permissions |
| US7853905B1 (en) * | 2007-12-27 | 2010-12-14 | Cadence Design Systems, Inc. | Performing early DFT-aware prototyping of a design |
| US20100031152A1 (en) * | 2008-07-31 | 2010-02-04 | Microsoft Corporation | Creation and Navigation of Infinite Canvas Presentation |
| US20100153866A1 (en) * | 2008-12-11 | 2010-06-17 | Accenture Global Services Gmbh | Method and system for modifying the execution of a native application running on a portable electronic device |
| US8661147B2 (en) | 2008-12-12 | 2014-02-25 | At&T Intellectual Property I, L.P. | Monitoring requested content |
| US8494824B2 (en) * | 2009-02-16 | 2013-07-23 | The Boeing Company | Methods and apparatus for integrating engineering models from disparate tools in support of model reuse |
| US20110202871A1 (en) * | 2010-02-17 | 2011-08-18 | Oracle International Corporation | Method and system for scrolling through a graphical user interface list control |
| US8645491B2 (en) * | 2010-12-18 | 2014-02-04 | Qualcomm Incorporated | Methods and apparatus for enabling a hybrid web and native application |
| US20140089786A1 (en) * | 2012-06-01 | 2014-03-27 | Atiq Hashmi | Automated Processor For Web Content To Mobile-Optimized Content Transformation |
| KR101456505B1 (en) * | 2012-08-06 | 2014-10-31 | 인크로스 주식회사 | A user interface framework for developing web applications |
| KR101456507B1 (en) * | 2012-08-13 | 2014-10-31 | 인크로스 주식회사 | An authoring apparatus for applying n-screen to web application ui and the method for the same |
| US10410257B1 (en) * | 2012-12-18 | 2019-09-10 | Nativo, Inc. | Native online ad creation |
| CN103164839B (en) * | 2013-03-07 | 2019-06-21 | 华为技术有限公司 | A kind of drawing practice, device and terminal |
| CN103279382B (en) * | 2013-04-27 | 2016-12-28 | 北京微云即趣科技有限公司 | Primary mode accesses the method for resource, Java end, primary end and system |
| CN104216909B (en) * | 2013-06-04 | 2018-10-02 | 腾讯科技（深圳）有限公司 | Web data processing method and processing unit |
| CN103336816B (en) * | 2013-06-28 | 2017-02-08 | 广州市动景计算机科技有限公司 | Canvas element rendering method and device realized on Android system based on GPU (Graphic Processing Unit) |
| CN103530018B (en) * | 2013-09-27 | 2017-07-28 | 深圳天珑无线科技有限公司 | The method for building up and mobile terminal at widget interface in Android operation system |
| CN103995884A (en) * | 2014-05-29 | 2014-08-20 | 北京中电普华信息技术有限公司 | Hybrid application page switching method and system |
| KR101588592B1 (en) * | 2014-08-22 | 2016-02-12 | (주)비원이즈 | Hybrid application development system based on object relational mapping and the method thereof |
| CN104267934B (en) * | 2014-09-10 | 2017-12-29 | 北京金山安全软件有限公司 | Information display method and device and mobile terminal |
| CN104238881A (en) * | 2014-09-10 | 2014-12-24 | 北京金山安全软件有限公司 | Terminal information display method and device and terminal |
| CN104572098B (en) * | 2014-12-30 | 2018-10-12 | 北京奇虎科技有限公司 | A kind of update method and device of mobile terminal pages table |
| CN104965914A (en) * | 2015-07-06 | 2015-10-07 | 无锡天脉聚源传媒科技有限公司 | Page display method and apparatus |
| CN105117154A (en) * | 2015-08-07 | 2015-12-02 | 上海斐讯数据通信技术有限公司 | Application method of Android list view component |
| CN107153528A (en) * | 2016-03-02 | 2017-09-12 | 阿里巴巴集团控股有限公司 | The method and apparatus that mixed model list items are reused |
-
2016
- 2016-03-02 CN CN201610116409.9A patent/CN107153528A/en active Pending
-
2017
- 2017-01-17 TW TW106101576A patent/TWI697790B/en active
- 2017-02-20 MY MYPI2018703026A patent/MY193879A/en unknown
- 2017-02-20 WO PCT/CN2017/074178 patent/WO2017148298A1/en active Application Filing
- 2017-02-20 JP JP2018546452A patent/JP6941617B2/en active Active
- 2017-02-20 KR KR1020187028571A patent/KR102127063B1/en active IP Right Grant
- 2017-02-20 EP EP17759149.2A patent/EP3425526B1/en active Active
- 2017-02-20 SG SG11201807357WA patent/SG11201807357WA/en unknown
-
2018
- 2018-08-29 PH PH12018501836A patent/PH12018501836A1/en unknown
- 2018-08-31 US US16/119,224 patent/US10691427B2/en active Active
-
2020
- 2020-06-17 US US16/904,031 patent/US10789051B1/en active Active
Patent Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2001325098A (en) * | 2000-05-16 | 2001-11-22 | Sumitomo Electric Ind Ltd | Method for preparing application program method for operating database, method for managing item object, method for controlling module operation and computer- readable recording medium recorded with program for realizing operation, management and control methods |
| JP2013003651A (en) * | 2011-06-13 | 2013-01-07 | Sony Computer Entertainment Inc | List display apparatus |
| WO2014168809A1 (en) * | 2013-04-11 | 2014-10-16 | Facebook, Inc. | Application-tailored object re-use and recycling |
Non-Patent Citations (1)
| Title |
|---|
| 大津 真: "「初めて作るｉＰｈｏｎｅアプリ」", 日経ソフトウエア, vol. 第１５巻, 第１１号, JPN6021008511, 24 September 2012 (2012-09-24), pages 15 - 17, ISSN: 0004469865 * |
Also Published As
| Publication number | Publication date |
|---|---|
| TW201732640A (en) | 2017-09-16 |
| KR20180116423A (en) | 2018-10-24 |
| EP3425526B1 (en) | 2021-08-04 |
| JP6941617B2 (en) | 2021-09-29 |
| KR102127063B1 (en) | 2020-06-26 |
| US20180364990A1 (en) | 2018-12-20 |
| EP3425526A1 (en) | 2019-01-09 |
| MY193879A (en) | 2022-10-30 |
| US10691427B2 (en) | 2020-06-23 |
| PH12018501836A1 (en) | 2019-05-15 |
| WO2017148298A1 (en) | 2017-09-08 |
| EP3425526A4 (en) | 2019-08-28 |
| US10789051B1 (en) | 2020-09-29 |
| TWI697790B (en) | 2020-07-01 |
| CN107153528A (en) | 2017-09-12 |
| US20200319858A1 (en) | 2020-10-08 |
| SG11201807357WA (en) | 2018-09-27 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| KR102127063B1 (en) | Method and apparatus for reusing ListCell in hybrid application | |
| CN110489116B (en) | Page rendering method and device and computer storage medium | |
| TWI700638B (en) | Display method and device of mixed view | |
| CN105824830B (en) | Method, client and equipment for displaying page | |
| CN112272109A (en) | Network topological graph generation method, equipment and system | |
| KR20180019158A (en) | METHOD AND DEVICE FOR PREVIEWING A DYNAMIC IMAGE, AND METHOD AND DEVICE FOR DISPLAYING A DISPLAY PACKAGE | |
| CN110968314B (en) | Page generation method and device | |
| CN112068911A (en) | Method, device, system, equipment and medium for generating electronic form | |
| CN113553123B (en) | Data processing method, device, electronic equipment and storage medium | |
| WO2019047881A1 (en) | Page display method and apparatus for application program (app), device, and storage medium | |
| CN114995699A (en) | Interface interaction method and device | |
| CN114489607A (en) | Cross-stack application processing and page rendering method, device, equipment and storage medium | |
| US11120099B2 (en) | Rendering a web element in a web page | |
| CN114594945A (en) | Method, device, system, equipment and medium for generating advanced popup selection frame | |
| CN112346761A (en) | Front-end resource online method, equipment, system and storage medium | |
| CN112068828A (en) | Title control generation method, device, system, equipment and medium | |
| CN113779466B (en) | Page display method and device, storage medium and electronic equipment | |
| CN112416268B (en) | Laser printing strategy code display method and related device | |
| CN114968204B (en) | Method and device for converting front end component and back end component | |
| CN111539183B (en) | Data processing method, device, electronic equipment and storage medium | |
| CN113806670A (en) | Method for processing hypertext markup language data, related device and storage medium | |
| CN114428609A (en) | Page file generation method and device, storage medium and electronic equipment | |
| CN112068829A (en) | Method, device, system, equipment and medium for generating single text input control | |
| CN114065079A (en) | Method and equipment for generating PDF file by Web | |
| CN117348856A (en) | Method, device, equipment and computer medium for generating special effect material packet |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| A521 | Request for written amendment filed |
Free format text: JAPANESE INTERMEDIATE CODE: A523 Effective date: 20200127 |
|
| A621 | Written request for application examination |
Free format text: JAPANESE INTERMEDIATE CODE: A621 Effective date: 20200127 |
|
| RD03 | Notification of appointment of power of attorney |
Free format text: JAPANESE INTERMEDIATE CODE: A7423 Effective date: 20200605 |
|
| A711 | Notification of change in applicant |
Free format text: JAPANESE INTERMEDIATE CODE: A711 Effective date: 20201228 |
|
| A977 | Report on retrieval |
Free format text: JAPANESE INTERMEDIATE CODE: A971007 Effective date: 20210224 |
|
| A131 | Notification of reasons for refusal |
Free format text: JAPANESE INTERMEDIATE CODE: A131 Effective date: 20210322 |
|
| A521 | Request for written amendment filed |
Free format text: JAPANESE INTERMEDIATE CODE: A523 Effective date: 20210602 |
|
| TRDD | Decision of grant or rejection written | ||
| A01 | Written decision to grant a patent or to grant a registration (utility model) |
Free format text: JAPANESE INTERMEDIATE CODE: A01 Effective date: 20210816 |
|
| A61 | First payment of annual fees (during grant procedure) |
Free format text: JAPANESE INTERMEDIATE CODE: A61 Effective date: 20210906 |
|
| R150 | Certificate of patent or registration of utility model |
Ref document number: 6941617 Country of ref document: JP Free format text: JAPANESE INTERMEDIATE CODE: R150 |