Note: Descriptions are shown in the official language in which they were submitted.
METHOD, APPARATUS AND COMPUTER DEVICE FOR IMPLEMENTING POP-UP
WINDOW IN HYBRID INTERFACE APPLICATION
Technical Field
[0001] The present disclosure relates to Internet technologies, and
particularly relates to the
methods, apparatuses, and computer devices for implementing pop-up windows in
hybrid apps.
[0002] Background
[0003] Pop-ups refer to windows that pop up automatically when users open
webpages,
software, or mobile apps. They are usually triggered by certain logic and
overlay the floating
layer on the screen page. Prompt boxes and controls are two common types of
pop-up windows.
Currently, in the business development process, it is often necessary to
display pop-ups in hybrid
interfaces, and WebView-based pop-ups are usually implemented through the two
methods
below. The first method uses webpage technology to directly pop up a div box
and draws the
pop-up content in the box to display it to users. The second method uses
webpage technology to
pop up an inline frame (iframe), control the size and location of the frame,
and open the specified
webpage address in the iframe to display the pop-up.
[0004] Therefore, there is a need for new methods, apparatuses, and
computing devices to
implement pop-ups in hybrid apps.
[0005] The above information about supporting technologies is only meant to
provide
background for the present disclosure. Therefore, it may not include
information on existing
technology that is already known by average technicians in this field.
[0006] Summary
[0007] In view of this, it is an object of the present disclosure to
provide a type of method,
apparatus, and computing device for implementing a pop-up window in a hybrid
app, thereby
overcoming one or more problems due to the limitations and disadvantages of
the related
technologies, at least to some extent.
[0008] Other features and advantages of the present disclosure will be
apparent from the
following detailed descriptions or learned by putting the present disclosure
into practice.
1
CA 3054877 2019-09-10
[0009] According to one aspect of the embodiments of the present
disclosure, a type of
method is provided for implementing a pop-up window in a hybrid app when the
hybrid app
includes a native loading part and a web loading part. This method comprises
the following: The
native loading part acquires pop-up configuration parameters transmitted from
the web loading
part according to the pop-up command loaded in the web loading part. The
native loading part
creates a pop-up webpage based on the pop-up configuration parameter. It then
displays the pop-
up WebView on the current view of the hybrid app, overlaying the native
content of the current
view.
[0010] According to another aspect of the embodiments of the present
disclosure, a type of
apparatus is provided for implementing a pop-up window in a hybrid app when
the hybrid app
includes a native loading part and a web loading part. This apparatus
comprises the following:
The pop-up configuration module is set to acquire the pop-up configuration
parameters in the
native loading part transmitted from the web loading part according to the pop-
up command
loaded in the web loading part; and the view overlay module is set to create a
pop-up webpage in
the native loading part based on the pop-up configuration parameter. The pop-
up WebView is
then displayed on the current view of the hybrid app, overlaying the native
content of the current
view.
[0011] According to one aspect of the embodiments of the present
disclosure, a storage
medium storing a computer program is provided that, when executed by the
processor of a
computer, causes the computer to perform the methods of any of the above
embodiments.
[0012] According to one aspect of the embodiments of the present
disclosure, a computing
device is provided, which comprises: A processor; and a memory, which stores
commands
executable by the processor. The processor is configured to execute any of the
methods
described in the above embodiments.
[0013] According to the technical solution provided by the embodiment of
the present
disclosure, when the pop-up window is implemented, overlaying the native
content displayed by
the application interface can prevent the user from entering other interfaces
due to mis-operation,
thereby reducing the mis-operation rate of the terminal, improving the
processing efficiency of
the terminal, and improving user experience.
2
CA 3054877 2019-09-10
[0014] It should be understood that both the foregoing general description
and the detailed
descriptions below are merely exemplary and explanatory and are not intended
to limit the
present disclosure.
[0015] Brief Description of Drawings
[0016] A better understanding of the present disclosure described above and
its objectives,
features, and advantages can be obtained from the reference drawings
corresponding to the
detailed descriptions and the exemplary embodiments thereof. The drawings
described below are
only some of the embodiments of the present disclosure. Average technicians in
this field can
obtain other drawings based on these drawings without any creative labor.
[0017] Fig. 1 is a schematic showing the implementation of a pop-up window
in the related
technology.
[0018] Fig. 2 is a schematic showing the structural principles of pop-up
loading based on
Fig. 1.
[0019] Fig. 3 is a flowchart of a pop-up implementation method based on an
exemplary
embodiment.
[0020] Fig. 4 is a schematic showing the structural principles of pop-up
loading based on an
exemplary embodiment.
[0021] Fig. 5 is a schematic showing the structural principles of pop-up
loading based on an
exemplary embodiment.
[0022] Fig. 6 is a flowchart of a pop-up implementation method based on an
exemplary
embodiment.
[0023] Fig. 7 is a schematic showing the structural principles of pop-up
loading based on an
exemplary embodiment.
[0024] Fig. 8 is a flowchart of a pop-up implementation method based on an
exemplary
embodiment.
[0025] Fig. 9 is a schematic showing the structural principles of pop-up
loading based on an
exemplary embodiment.
[0026] Fig. 10 is a structural schematic of the apparatus used for pop-up
implementation
based on an embodiment of the present disclosure.
3
CA 3054877 2019-09-10
[0027] Fig. 11 is a structural schematic of the computer device used for
pop-up
implementation based on an embodiment of the present disclosure.
[0028] Detailed Description
[0029] Exemplary embodiments will now be described more fully, with
reference to the
accompanying drawings. However, the exemplary embodiments can be embodied in a
variety of
forms and should not be construed as being limited to the embodiments set
forth herein. Rather,
these embodiments are provided so that the present disclosure will be thorough
and complete and
will fully convey the concepts of the exemplary embodiments to those skilled
in this field. The
reference numbers in the drawings denote the same or similar parts, so each
number will only be
described once.
[0030] Furthermore, the described features, structures, or characteristics
can be combined in
any suitable manner in one or more embodiments. In the following descriptions,
numerous
specific details are set forth to provide a better understanding of the
embodiments of the present
disclosure. However, skilled practitioners in this field shall note that the
technical solution of the
present disclosure may be implemented without one or more of the specific
details, or other
methods, components, apparatuses, and steps may be employed. In other
instances, well-known
methods, apparatuses, implementations, or operations are not shown or
described in detail to
avoid obscuring aspects of the present disclosure.
[0031] The block diagrams shown in the figures are merely functional
entities and do not
necessarily correspond to physically separate entities. That is, these
functional entities may be
implemented as software, implemented in one or more hardware modules or
integrated circuits,
or implemented in different networks and/or processor devices and/or
microcontroller devices.
[0032] The flowcharts shown in the figures are merely illustrative. Not all
of the content and
operations/steps are necessarily included or performed in the order described.
For example, some
operations/steps may be divided, and some operations/steps may be combined or
partially
merged. Therefore, the actual execution order may vary depending on the
situation.
[0033] It must be understood that, although the terms "first", "second",
"third", and so on
may be used to describe various components, these components are not limited
by these terms.
These terms are only used to distinguish one component from another.
Therefore, the first
component discussed below could be referred to as the second component in
another context,
4
CA 3054877 2019-09-10
without departing from the concepts set out in the present disclosure. The
term "and/or" as used
herein indicates any and all combinations of one or more of the associated
listed items.
[0034] Those skilled in this field will recognize that these drawings are
only a schematic
diagram of the exemplary embodiments, and the modules or processes in the
drawings are not
necessarily required to implement the disclosure and therefore are not
intended to limit the scope
of the disclosure.
[0035] . Before describing embodiments of the present invention in detail, we
must first
provide further information regarding some relevant technologies that may be
involved in the
embodiments.
[0036] With the popularization of the Internet, and especially mobile
Internet, more and
more product and service providers have chosen to use applications (apps) as
one channel for
interacting with consumers or even the primary channel. Current apps have
several different
development modes, including native mode, web mode, and hybrid mode, all of
which have their
own characteristics.
[0037] A native app is an app based on the native development mode. It is
directly dependent
on the operating system and provides the strongest interaction and the most
powerful functions.
However, the development cost is high. Native apps must be developed
independently for
different platforms (such as Android and i0S), and update and maintenance
costs are high. A
web app deploys a page on the server, and users can access it through their
browsers. Web apps
feature low development costs and can be used across platforms. The app does
not need to be
installed by the client, saving the user's local resources. However, web apps
are heavily reliant
on the network and consume network traffic. In addition, they cannot call the
native Application
Programming Interfaces (APIs) of the user's local system, so their
functionality is very limited. A
hybrid app (hybrid interface application) generally refers to an app based on
a hybrid
development model. Such apps combine native and web elements in development,
giving them
some of the advantages of both native apps and web apps. Hybrid apps can be
used across
platforms, and their debugging, update, and maintenance costs are low. Hybrid
apps can call
native APIs, giving them better functionality. For these reasons, the use of
hybrid apps is
growing.
[0038] Currently, for most Hybrid applications, the implementation of pop-
ups is performed
in WebView. This is mainly implemented in the following two ways. The first
method uses
CA 3054877 2019-09-10
webpage technology to directly pop up a div box and draws the pop-up content
in the box to
display it to users. The second method uses webpage technology to pop up an
inline frame
(iframe), control the size and location of the frame, and open the specified
webpage address in
the iframe to display the pop-up. Because the native navigation bar is at a
higher level than
WebView, its masked portion cannot overlay the native navigation bar. When the
navigation bar
cannot be overlaid, the pop-up mask is not full screen, which compromises the
aesthetics of the
interface. Because the buttons on the navigation bar are clickable, such as a
clickable back
button, the current page cannot prevent page redirects caused by button
clicks. This can result in
unpredictable behavior. Therefore, both of the above two pop-up implementation
methods are
flawed to different degrees.
[0039] Fig. 1 is a schematic showing the implementation of a pop-up window
in the related
technology. As shown in the figure, after page 11 jumps to page 12, page 12 is
in a display state
after the pop-up window is loaded, and the navigation bar and the pop-up
window are both
operable at the same time.
[0040] Fig. 2 is a schematic showing the structural principles of pop-up
loading based on
Fig. 1. Using the two methods above, pages include the mask 24 in the WebView
and the pop-up
23 and native navigation bar 22 in the WebView. Since the level of the native
navigation bar 22
is higher than the current WebView, the mask 24 in the WebView located under
the pop-up
window cannot overlay the native navigation bar 22. If the native navigation
bar 22 is not
overlaid, the pop-up window 23 and the native navigation bar 22 in the WebView
are both
operable. In this situation, the user cannot easily be guided to complete the
corresponding pop-up
operations, which will affect user experience. On the other hand, when a pop-
up is implemented
by the div method, if only the pop-up content needs to be updated online, the
entire project needs
to be updated online. The pop-up content cannot be updated independently
online. This may
cause a significant increase in maintenance and management costs.
[0041] To address the above problems of the related technologies, the
embodiments of the
present disclosure provide pop-up implementation methods, apparatuses, and
computer devices
for hybrid apps. These are described in detail below.
[0042] Fig. 3 is a flowchart of a pop-up implementation method for a hybrid
app based on an
exemplary embodiment. The method of the present embodiment includes the
following steps
6
CA 3054877 2019-09-10
=
S301-S302. In one embodiment, the method of the present embodiment can be
performed by a
user terminal (e.g., a cell phone) running a hybrid app.
[0043] In step S301, the native loading part acquires pop-up configuration
parameters
transmitted from the web loading part according to the pop-up command loaded
in the web
loading part.
[0044] As mentioned above, hybrid apps are based on the hybrid development
model, which
combines native and web elements. Thus, when a hybrid app is run on the user
terminal, it may
be thought of as being composed of two parts that work together: the native
loading part and the
web loading part. The native loading part (hereinafter also referred to as
"native") mainly
interacts locally with the user terminal. It is used to load native content in
the hybrid app and
display preset basic frameworks. The web loading part primarily communicates
and interacts
with the server. It is used to load online content updated and maintained by
the server. It can also
display WebView content in the basic frameworks of the native loading part.
Here, native
content is usually built into the hybrid app installation package. As the
hybrid app is installed
and stored on the user terminal, it is mainly used to construct the basic
framework of the hybrid
app user interface. Common native content includes, but is not limited to, the
navigation bar and
status bar.
[0045] In one embodiment, the pop-up command can include a code segment
retrieved from
the server when the local application displays the WebView. This is used to
trigger the display of
the pop-up in the local application. In one embodiment, the pop-up command can
also carry the
pop-up configuration parameters. These can be the height of the pop-up box,
the position of the
pop-up box, the borders of the pop-up box, the rounded corners of the pop-up
box, or where a
Close button is displayed.
[0046] Next, in step S302, the native loading part creates a pop-up webpage
based on the
pop-up configuration parameters. It then displays the pop-up WebView on the
current view of
the hybrid app, overlaying the native content of the current view.
[0047] Fig. 4 is a schematic showing the structural principles of pop-up
loading based on an
exemplary embodiment. As shown in Fig. 4, native initializes a new native pop-
up WebView 43
according to the received pop-up configuration parameters. The native pop-up
WebView 43 is
displayed on the current view 41 of the hybrid app and overlays the native
navigation bar 42. The
7
CA 3054877 2019-09-10
native pop-up WebView 43 here may have the same width and height as the
current view 41, for
example.
[0048] The visibility style of the native pop-up WebView 43 can be
controlled to make the
visual interface more aesthetic. For example, it can set the WebView width,
height, spacing,
alignment, border settings of the pop-up, background color, and Close button
settings.
[0049] Fig. 5 is a schematic showing the structural principles of pop-up
loading based on
another exemplary embodiment. As shown in Fig. 5, a native mask view 54 can be
configured in
the above webpage structure. The native mask view 54 is placed between the
native pop-up
WebView 53 and the current view 51 and overlays the native navigation bar 52.
In one
embodiment, the native mask view 54 can be implemented as a semitransparent
mask layer.
Here, for example, native may initialize the native mask view 54 according to
the mask
configuration information in the received pop-up configuration parameters. The
mask
configuration information can include the mask color, the mask transparency,
and whether or not
a click on the mask closes the pop-up.
[0050] In some implementation methods, causing the native content of the
current view to be
overlaid may include causing the native navigation bar in the current view to
be overlaid.
[0051] Optionally, the pop-up configuration parameters can include a
callback function,
allowing the method to perform the following operation: When user operation
data is received in
the pop-up WebView, the user operation data is delivered to the current view
for processing by
the callback function.
[0052] The callback function is used for data transfer. For example, when
the user performs
an interactive operation, such as data input or resource call, in the pop-up
WebView, the pop-up
WebView receives the data to be processed and sends it to the native. Then,
the native passes the
data to the current view through the callback function. Finally, the current
view responds based
on the data.
[0053] Optionally, the pop-up configuration parameters can include pop-up
webpage code or
a pop-up page address, allowing the method to perform the following operation:
In the pop-up
WebView, the pop-up page is displayed according to the pop-up webpage code or
the pop-up
webpage is loaded according to the pop-up page address.
[0054] The pop-up net map directly opens the destination page address when
it is created.
The target pages include, but are not limited to, remote pages or local codes.
This means that the
8
CA 3054877 2019-09-10
code of the destination page can be well separated from the code of the pop-up
window. This
improves the efficiency of subsequent code maintenance and project updates.
[0055] Optionally, the pop-up configuration parameters can include an
animation parameter
used to display pop-up webpage videos on the current view of the hybrid app.
This includes the
following scenario: Based on the animation parameters, the pop-up WebView is
displayed on the
current view in an animated manner.
[0056] The animation method can be used to do the following: Change the pop-
up WebView
transparency from the initial 0 to 1; move or fade the pop-up WebView position
from the bottom
of the current view to the centered position of the current view; move or fade
the pop-up page
view position from the left side of the current view to the centered position
of the current view;
or flip the pop-up WebView by 90 degrees.
[0057] For the method to implement a pop-up in a hybrid app based on the
present
embodiment, overlaying the native content can prevent the user from entering
other interfaces
due to mis-operation, thereby reducing the mis-operation rate of the terminal,
improving the
processing efficiency of the terminal, and improving user experience.
[0058] Fig. 6 is a flowchart of a pop-up implementation method for a hybrid
app based on an
exemplary embodiment. As shown in the figure, the method of the present
embodiment includes
the following steps S601-S603. In one embodiment, the method of the present
embodiment can
be performed by a user terminal (e.g., a cell phone) running a hybrid app.
[0059] In step S601, the native loading part acquires pop-up configuration
parameters
transmitted from the web loading part according to the pop-up command loaded
in the web
loading part.
[0060] The details of step S601 are the same as S301 from the embodiment in
Fig. 3, so
these details are not repeated here.
[0061] In step S602, the native loading part creates a pop-up WebView based
on the pop-up
parameters and the pop-up WebView overlays the original content of the current
view.
[0062] In some embodiments of the present disclosure, after performing step
S602, the
electronic device may create a pop-up WebView based on the principles shown in
Fig. 4. For the
specifics of the displayed content, refer to the schematic of the embodiment
shown in Fig. 7.
[0063] For example, when the user performs operations on the current view,
the page pops
up an authorization pop-up WebView. The authorization pop-up WebView
completely overlays
9
CA 3054877 2019-09-10
the current view, but when the user performs a corresponding operation in the
authorization pop-
up WebView or closes the view, the page redirects back to the current view.
[0064] In step S603, when the preset conditions are satisfied, the pop-up
WebView is closed.
[0065] Optionally, when the pop-up parameters indicate that the pop-up
WebView has a
Close button, the pop-up WebView is closed when the user operates the Close
button.
[0066] Optionally, when the pop-up parameters indicate closing conditions
of the pop-up
WebView, the pop-up WebView is closed when it has been determined that these
conditions
have been met. For example, when the user needs to input corresponding data in
the pop-up
WebView, the window is closed after the user clicks "Confirm".
[0067] Optionally, when the pop-up configuration parameters include a
callback function
and user operation data is received in the pop-up WebView, the user operation
data is transmitted
to the current view through the callback function for processing. In this
case, the implemented
pop-up interacts with the user data.
[0068] Optionally, when the pop-up configuration parameters include pop-up
webpage code
or a pop-up page address, the pop-up webpage is displayed in the pop-up
WebView based on the
pop-up webpage code, or the pop-up webpage is loaded based on the webpage
address.
[0069] Optionally, when the pop-up configuration parameters include
animation parameters,
the pop-up WebView is displayed on the current view in an animated manner
based on the
animation parameters.
[0070] For the method to implement a pop-up in a hybrid app based on the
present
embodiment, overlaying the native content can prevent the user from entering
other interfaces
due to mis-operation, thereby reducing the mis-operation rate of the terminal,
improving the
processing efficiency of the terminal, and improving user experience. In
addition, while
overlaying the Native navigation bar, a new WebView pops up to implement the
pop-up, which
facilitates external data interaction with the pop-up content.
[0071] Fig. 8 is a flowchart of a pop-up implementation method for a hybrid
app based on an
exemplary embodiment. As shown in the figure, the method of the present
embodiment includes
the following steps S801-S804. In one embodiment, the method of the present
embodiment can
be performed by a user terminal (e.g., a cell phone) running a hybrid app.
CA 3054877 2019-09-10
[0072] In step S801, the native loading part acquires pop-up configuration
parameters
transmitted from the web loading part according to the pop-up command loaded
in the web
loading part.
[0073] The details of step S801 are the same as S301 from the embodiment in
Fig. 3, so
these details are not repeated here.
[0074] In step S802, the native loading part creates a mask view based on
the mask
parameters and the mask view overlays the original content of the current
view.
[0075] After acquiring the command sent by the hybrid interface, native
creates a new view
element. Native sets the width and height of the view element to be equal to
the width and height
of the screen and sets the background color of the view element to be
semitransparent. Then, the
view element, i.e. the native mask layer view, is added to the hybrid
interface and displays the
native mask layer above the current WebView of the hybrid application. It
overlays the native
content of the current view, such as the native navigation bar.
[0076] In step S803, the native loading part creates a pop-up WebView based
on the pop-up
parameters and displays the pop-up Webpage view on the mask view.
[0077] In some embodiments of the present disclosure, after performing step
S803, the
electronic device may create a pop-up WebView based on the principles shown in
Fig. 5. For the
specifics of the displayed content, refer to the schematic of the embodiment
shown in Fig. 9.
[0078] Optionally, when the pop-up configuration parameters include a
callback function
and user operation data is received in the pop-up WebView, the user operation
data is transmitted
to the current view through the callback function for processing.
[0079] Optionally, when the pop-up configuration parameters include pop-up
webpage code
or a pop-up page address, the pop-up webpage is displayed in the pop-up
WebView based on the
pop-up webpage code, or the pop-up webpage is loaded based on the webpage
address.
[0080] Optionally, when the pop-up configuration parameters include
animation parameters,
the pop-up WebView is displayed on the current view in an animated manner
based on the
animation parameters.
[0081] In step S804, when the preset conditions are satisfied, the pop-up
WebView is closed.
[0082] Optionally, the mask parameters can be used to indicate that the
mask view closes the
pop-up window when clicked. At this time, the pop-up WebView may be closed
based on
receiving a click operation when the user clicks the mask view.
11
CA 3054877 2019-09-10
[0083] When the mask view is initialized, the mask is set according to the
pop-up
configuration parameters, for example, whether the mask view can be clicked to
close the pop-up
window. When the pop-up WebView is displayed above the mask view, the user
only needs to
click on the mask to close or hide the pop-up WebView and display the current
view again.
[0084] Optionally, when the pop-up parameters indicate that the pop-up
WebView has a
Close button, the pop-up WebView is closed when the user operates the Close
button.
[0085] Optionally, when the pop-up parameters indicate closing conditions
of the pop-up
WebView, the pop-up WebView is closed when it has been determined that these
conditions
have been met. For example, the pop-up window must receive the keyboard or
mouse operation
before the pop-up window can be closed or hidden.
[0086] For the method to implement a pop-up in a hybrid app based on the
present
embodiment, overlaying the native content can prevent the user from entering
other interfaces
due to mis-operation, thereby reducing the mis-operation rate of the terminal,
improving the
processing efficiency of the terminal, and improving user experience. In
addition, a mask view is
added in the current WebView of the hybrid app. This allows users to focus on
the pop-up
content while blocking users from performing operations on the interface
overlaid by the mask.
[0087] The following is an apparatus embodiment of the present disclosure,
which can be
used to implement the method embodiments of the present disclosure. For
details not disclosed
in the apparatus embodiments, refer to the method embodiments of the present
disclosure.
[0088] Fig. 10 is a structural block diagram of the apparatus used for pop-
up implementation
based on an embodiment of the present disclosure. As shown in the diagram, the
apparatus of the
present embodiment includes a pop-up configuration module 101 and a view
overlay module
102.
[0089] The pop-up configuration module 101 is set to acquire the pop-up
configuration
parameters in the native loading part transmitted from the web loading part
according to the pop-
up command loaded in the web loading part.
[0090] The view overlay module 102 is set to create a pop-up webpage in the
native loading
part based on the pop-up configuration parameter. The pop-up WebView is then
displayed on the
current view of the hybrid app, overlaying the native content of the current
view.
[0091] Optionally, the view overlay module 102 can create a pop-up WebView
based on the
pop-up parameters, and the pop-up WebView overlays the native content of the
current view.
12
CA 3054877 2019-09-10
[0092] Optionally, the view overlay module 102 can create a mask view based
on the mask
parameters and use the mask view to overlay the native content of the current
view. Further, it
creates a pop-up WebView based on the pop-up parameters. The pop-up WebView is
displayed
on the mask view.
[0093] Optionally, the mask parameters can be used to indicate that the
mask view closes the
pop-up window when clicked. At this time, the view overlay module 102 can
close the pop-up
WebView based on receiving a click operation when the user clicks the mask
view.
[0094] Optionally, when the pop-up parameters indicate that the pop-up
WebView has a
Close button, the view overlay module 102 closes the pop-up WebView when the
user operates
the Close button.
[0095] Optionally, when the pop-up parameters indicate other closing
conditions of the pop-
up WebView, the view overlay module 102 will close the pop-up WebView when it
has been
determined that these conditions have been met.
[0096] Optionally, when the pop-up configuration parameters include a
callback function,
the view overlay module 102 transmits the user operation data to the current
view through the
callback function for processing when user operation data is received in the
pop-up WebView.
[0097] The callback function is used for data transfer. For example, when
the user performs
an interactive operation, such as data input or resource call, in the pop-up
WebView, the pop-up
WebView receives the data to be processed and sends it to the native. Then,
the native passes the
data to the current view through the callback function. Finally, the current
view responds based
on the data.
[0098] Optionally, when the pop-up configuration parameters include
animation parameters,
the view overlay module 102 displays the pop-up WebView on the current view in
an animated
manner based on the animation parameters.
[0099] Optionally, when the pop-up configuration parameters include pop-up
webpage code
or a pop-up page address, the view overlay module 102 displays the pop-up
webpage in the pop-
up WebView based on the pop-up webpage code or loads the pop-up webpage based
on the
webpage address.
[0100] For the apparatus used to implement a pop-up in a hybrid app based
on the present
embodiment, overlaying the native content can prevent the user from entering
other interfaces
13
CA 3054877 2019-09-10
due to mis-operation, thereby reducing the mis-operation rate of the terminal,
improving the
processing efficiency of the terminal, and improving user experience.
[0101] The present embodiment is based on the same inventive concept as the
foregoing
method embodiments. It provides an apparatus to implement pop-ups in a hybrid
app. The
present embodiment can be used to implement the methods to implement pop-ups
in hybrid apps
provided in the above embodiments.
[0102] It should be noted that, although several modules or units used by
the device to
execute the actions are mentioned in the detailed description above, such
divisions are not
mandatory. In fact, in accordance with the embodiments of the present
disclosure, the features
and functions of two or more modules or units described above may be embodied
in one module
or unit. Conversely, the features and functions of one of the modules or units
described above
may be further divided into multiple modules or units. The components
displayed as modules or
units may or may not be physical units, i.e. they may be located in one place
or may be
distributed over multiple network elements. Some or all of the modules may be
selected to
achieve the purpose of the solution provided by the present disclosure
according to actual needs.
This applies to the scope in which average technicians in this field can
understand and
implement solutions without any creative effort.
[0103] Through the description of the above embodiments, technicians in
this field will
readily understand that the example embodiments described above may be
implemented by
software or by software in combination with necessary hardware.
[0104] For example, in an exemplary embodiment, a computer readable storage
medium is
also provided. This medium stores computer programs which, when executed by a
processor,
implement the steps of the methods described in any one of the above
embodiments. For the
specific steps of the method, refer to the detailed descriptions in the
foregoing embodiments.
These details are not repeated here. The computer-readable storage medium may
be a ROM, a
random access memory (RAM), a CD-ROM, a magnetic tape, a floppy disk, or an
optical data
storage device.
[0105] In another exemplary embodiment, a computing device is also
provided. This may be
a mobile terminal, such as a mobile phone or a tablet, or it may be a terminal
device such as a
desktop computer or a server. The present embodiment is not limited by device
type. Fig. 11 is a
schematic of the computer device 110 used for pop-up implementation based on
the
14
CA 3054877 2019-09-10
embodiments of the present disclosure. For example, device 110 can be provided
as a mobile
terminal. Referring to Fig. 11, device 110 includes a processing component 111
that further
includes one or more processors and memory resources represented by memory 112
for storing
commands executable by processing component 111, such as an app. An app stored
in memory
112 may include one or more modules, each corresponding to a set of
instructions. Additionally,
the processing component 111 is configured to execute instructions in order to
perform the pop-
up implementation methods described above.
[0106] The memory can be used to store software programs and modules, and
the processor
executes various functional apps and data processing by running software
programs and modules
stored in the memory. The memory may include a high-speed RAM and may also
include non-
volatile memory, such as one or more magnetic storage devices, flash memory
components, or
other non-volatile solid-state memory components. In some instances, the
memory can further
include memory located in a location remote from the processor, which can be
connected to the
computer terminal or mobile terminal via a network. Examples of such networks
include, but are
not limited to, the Internet, internal company networks, local area networks,
mobile
communication networks, and combinations thereof.
[0107] Device 110 may also include a power supply component 113 configured
to perform
power management for device 110, a wired or wireless network interface 114
configured to
connect device 110 to the network, and an input/output (I/O) interface 115.
Device 110 may
operate based on an operating system stored in memory 112, such as Android or
i0S.
[0108] Other embodiments of the present disclosure will be easily thought
of after those
skilled in the field have considered the specifications and carried out the
inventions disclosed
here. The present application is intended to cover any variations, uses, or
adaptations of the
present disclosure, which are in accordance with the general principles of the
disclosure and
include common general knowledge in the technical field or conventional
techniques that are not
disclosed in the present disclosure. The descriptions and embodiments are to
be considered as
illustrative only. The true scope and spirit of the disclosure is indicated by
the appended claims.
[0109] Although the present disclosure has been described with reference to
a few typical
embodiments, it is understood that the terms used are illustrative and
exemplary, not restrictive.
The present disclosure may be embodied in a variety of forms without departing
from the spirit
or scope of the application. It is to be understood that the above-described
embodiments are not
CA 3054877 2019-09-10
limited to the foregoing details but are construed broadly within the spirit
and scope defined by
the appended claims. All variations and modifications that come within the
scope of the claims
or the equivalents thereof are intended to be covered by the appended claims.
16
CA 3054877 2019-09-10
