Animation implementation method and device for interface switching

Abstract

The invention relates to the technical field of terminals, and provides an animation implementation method and device for interface switching. According to the method, when a preset gesture for operating a tabBar is detected at a terminal, the gesture type of the preset gesture is determined, a tabBar proxy object switched this time is created according to the preset gesture and the gesture type, when it is determined that the tabBar proxy object comprises an animation object, an animation starting function of the animation object is started, and animation parameters of the animation object are obtained; and executing the animation object based on the animation parameter so as to realize animation switching of the terminal interface, so that terminal interface animation switching which runs efficiently and is interactive based on tabBar is provided, and the user experience is improved.

Description

Technical Field

[0001] The present application relates to the field of terminal technology, and in particular to a method and device for implementing animation of interface switching. Background Art

[0002] In the development of the iPhone Operate System (iOS), the tab bar (tabBar) switching has no animation effect by default, and the system controls do not provide such support.

[0003] Some animation implementation methods for implementing tabBar switching are provided in the related art. These methods are either complex to implement and occupy more system resources, or have poor switching effects and are difficult to implement interaction. Summary of the invention

[0004] In view of this, an embodiment of the present application provides an interface switching animation implementation method and implementation device to solve the problem that the interface switching animation implementation method in the prior art is not flexible and efficient enough.

[0005] In a first aspect of an embodiment of the present application, a method for implementing an animation of interface switching is provided, the method being executed by a terminal and being used to implement an animation switching of a terminal interface based on a tab bar tabBar, the method comprising:

[0006] In response to detecting a preset gesture, determining a gesture type of the preset gesture;

[0007] Create the tabBar proxy object for this switch based on the preset gesture and gesture type;

[0008] In response to determining that the tabBar proxy object includes an animation object, starting an animation start function of the animation object, and obtaining animation parameters of the animation object;

[0009] Execute animation objects based on animation parameters to achieve animation switching of the terminal interface.

[0010] According to a second aspect of an embodiment of the present application, there is provided an animation implementation device for interface switching, comprising:

[0011] a determination module, configured to determine a gesture type of a preset gesture in response to detecting a preset gesture;

[0012] A creation module is configured to create a tabBar proxy object for this switch according to a preset gesture and gesture type;

[0013] A starting module, configured to start an animation start function of the animation object in response to determining that the tabBar proxy object includes an animation object, and obtain animation parameters of the animation object;

[0014] The switching module is configured to execute the animation object based on the animation parameters to realize the animation switching of the terminal interface.

[0015] The beneficial effects of the embodiments of the present application compared with the prior art are as follows: when the terminal detects a preset gesture for operating the tabBar, the embodiments of the present application determine the gesture type of the preset gesture, and create a tabBar proxy object for this switching according to the preset gesture and gesture type. When it is determined that the tabBar proxy object includes an animation object, the animation start function of the animation object is started and the animation parameters of the animation object are obtained, and the animation object is executed based on the animation parameters to realize animation switching of the terminal interface, thereby providing an efficient and interactive terminal interface animation switching based on tabBar and improving the user experience. BRIEF DESCRIPTION OF THE DRAWINGS

[0016] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the drawings required for use in the embodiments or the description of the prior art will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative work.

[0017] Figure 1 This is a schematic diagram of the sub-controller layout of the tabBar in the iOS system.

[0018] Figure 2 It is a schematic diagram of the layout of sub-controllers that can be switched animatedly in the tabBar in the iOS system.

[0019] Figure 3 It is a flowchart of an animation implementation method for interface switching provided in an embodiment of the present application.

[0020] Figure 4 It is a system architecture diagram of a method for implementing a non-interactive animation for interface switching provided in an embodiment of the present application.

[0021] Figure 5 It is a flowchart of a method for implementing a non-interactive animation for interface switching provided in an embodiment of the present application.

[0022] Figure 6 It is a flowchart of a method for creating a tabBar proxy object for this switching according to preset gestures and gesture types provided in an embodiment of the present application.

[0023] Figure 7 It is a system architecture diagram of a method for implementing interactive animation for interface switching provided in an embodiment of the present application.

[0024] Figure 8It is a flowchart of a method for implementing an interactive animation for interface switching provided in an embodiment of the present application.

[0025] Fig. 9 It is a flowchart of a method for implementing animation switching of a terminal interface by executing animation objects based on animation parameters provided in an embodiment of the present application.

[0026] Fig.10 It is a schematic diagram of an interface switching animation implementation device provided in an embodiment of the present application.

[0027] Fig.11 It is a schematic diagram of an electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION

[0028] In the following description, specific details such as specific system structures, technologies, etc. are provided for the purpose of illustration rather than limitation, so as to provide a thorough understanding of the embodiments of the present application. However, it should be clear to those skilled in the art that the present application may also be implemented in other embodiments without these specific details. In other cases, detailed descriptions of well-known systems, devices, circuits, and methods are omitted to prevent unnecessary details from obstructing the description of the present application.

[0029] A method and device for implementing an animation of interface switching according to an embodiment of the present application will be described in detail below with reference to the accompanying drawings.

[0030] As mentioned above, in iOS development, tabBar switching has no animation effect by default, and the system controls do not provide such support.

[0031] Some methods for implementing animations for tabBar switching are provided in the related art. For example, you can customize a set of parent-child controller layers and add animations when the customized child controller switches to achieve animation effects. However, in the tabBar provided by the iOS system, in order to save performance, each child controller is implemented within the same container. Its general layout is as follows: Figure 1 As shown, sub-controllers 2 and 3 are both arranged in parent controller 1.

[0032] For custom parent-child controller layers, if a switching animation is added, you can usually use a slidable view as the parent controller. In this case, the layout of the controllers is as follows: Figure 2 As shown in the figure, 1 is the parent controller, 2, 3 and 4 are child controllers, and the offset of the parent controller is controlled to determine which child controller is displayed in front of the user. This implementation method has a large performance gap compared to the native controls of the iOS system, and it will occupy too much memory, which may easily cause the system to crash when there are too many child views.

[0033] For another example, in the related art, you can also take screenshots of the subview that is about to disappear and the subview that is about to appear, and then use these two screenshots to create an animation, insert an animation layer on top of the real view, and set it to disappear after the switch is completed. However, this implementation method has the following problems: the full picture of the subview that is about to appear may not be clear, and it is impossible to take a screenshot. If it is estimated, some of the data display may require network request data, which is ineffective and time-consuming and resource-consuming. In addition, taking screenshots of the subview that is about to disappear will also consume system performance, and during the animation process, the screenshot may become distorted due to operations such as scaling, affecting the user experience. Moreover, this method cannot achieve interactive animation.

[0034] In view of this, an embodiment of the present application provides an animation implementation method for interface switching. When the terminal detects a preset gesture for operating the tabBar, the gesture type of the preset gesture is determined, and a tabBar proxy object for this switching is created according to the preset gesture and gesture type. When it is determined that the tabBar proxy object includes an animation object, the animation start function of the animation object is started and the animation parameters of the animation object are obtained. The animation object is executed based on the animation parameters to realize animation switching of the terminal interface. An efficient and interactive terminal interface animation switching based on tabBar is provided, thereby improving the user experience.

[0035] Figure 3 It is a flowchart of an animation implementation method for interface switching provided in an embodiment of the present application.

[0036] like Figure 3 As shown, the method comprises the following steps:

[0037] In step S301 , in response to detecting a preset gesture, a gesture type of the preset gesture is determined.

[0038] In step S302, a tabBar proxy object for this switching is created according to a preset gesture and gesture type.

[0039] In step S303, in response to determining that the tabBar proxy object includes an animation object, an animation start function of the animation object is started, and animation parameters of the animation object are obtained.

[0040] In step S304, the animation object is executed based on the animation parameters to achieve animation switching of the terminal interface.

[0041] In certain embodiments of the present application, the animation implementation method of interface switching can be executed by the terminal to implement the animation switching of the terminal interface based on the tabBar. Among them, the tabBar is a common configuration in the applet, including the bottom tabBar and the top tabBar. When switching the tabBar, the tabBar interface can be switched to the interface corresponding to the selected index by operating the selected tabBar index.

[0042] In some embodiments of the present application, if the terminal detects a preset gesture, the type of the preset gesture may be first determined. The type of the preset gesture may include, for example, a default gesture type and a custom gesture type. Further, different current switching tabBar proxy objects may be created according to different gesture types and the preset gesture.

[0043] Taking the implementation in iOS system as an example, to create the tabBar proxy object for this switch, you can define a class to implement the interface UITabBarControllerDelegate as the created tabBar proxy object. The created tabBar proxy object can be assigned to tabBar. Furthermore, you can rewrite the function of the tabBar proxy object:

[0044] -(nullable id

[0045] <uiviewcontrolleranimatedtransitioning>)tabBarController:(UITabBarController*)tabBarController

[0046] animationControllerForTransitionFromViewController:(UIViewController

[0047] *)fromVCtoViewController:(UIViewController*)toVCAPI_AVAILABLE(ios(7.0))API_UNAVAILABLE(visionos)

[0048] Among them, nullable means that null values ​​are allowed, id is the tabBar proxy object identifier, UIViewControllerAnimatedTransitioning is a protocol used to define view controller transition animation in iOS development, tabBarController and UITabBarController are both tabBar child view controllers, animationControllerForTransitionFromViewController is a method of the UIViewControllerAnimatedTransitioning protocol, which is used to define which object should be used to control the animation process when a view controller's transition animation starts, and UIViewController is a view controller in iOS. In this function, you can return the "animated tabBar proxy object".

[0049] Furthermore, it can be determined whether the created tabBar proxy object includes a corresponding animation object. Whether to define a corresponding animation object in the tabBar proxy object can be determined according to business needs. If the interface switching needs to be implemented in an animation manner, the corresponding animation object is defined in the created tabBar proxy object.

[0050] Still taking the implementation in the iOS system as an example, a class can be defined to implement the interface UIViewControllerAnimatedTransitioning as an animation proxy object. In some implementations of the present application, the tabBartabBar proxy object and the animation tabBar proxy object can be the same object or different objects. Furthermore, one or more animation objects can be defined in the animation proxy object, and at least part of the animation parameters in the animation object can be defined according to the animation form to be implemented. Among them, the animation object can be pre-defined and can be called by different tabBar proxy objects when executing the same animation, or it can be defined by itself according to the animation form to be implemented this time.

[0051] After the animation object is determined, the animation start function of the animation object can be started according to the preset trigger condition, and the animation parameters of the animation object can be obtained. Among them, the preset trigger condition can be different according to the gesture type. That is, the animation objects corresponding to different tabBar proxy objects determined according to different gesture types can use different preset trigger conditions to start their animation start functions.

[0052] After starting the animation start function, the animation object can be executed according to the obtained animation parameters, thereby realizing the animation switching of the terminal interface. Executing the animation object may be to execute the animation implementation method in the animation object, and the animation implementation method is constrained by its animation parameters.

[0053] According to the technical solution provided in the embodiment of the present application, when the terminal detects a preset gesture for operating the tabBar, the gesture type of the preset gesture is determined, and the tabBar proxy object for this switching is created according to the preset gesture and gesture type. When it is determined that the tabBar proxy object includes an animation object, the animation start function of the animation object is started and the animation parameters of the animation object are obtained. The animation object is executed based on the animation parameters to realize the animation switching of the terminal interface, thereby providing an efficient and interactive terminal interface animation switching based on tabBar and improving the user experience.

[0054] Still taking the implementation in iOS system as an example, the animation proxy object can be configured as follows: You can rewrite the transitionDuration function of the animation proxy object, which is defined as (NSTimeInterval)transitionDuration:(nullable id <uiviewcontrollercontexttransitioning>)transitionContext, where NSTimeInterval represents the calculated time difference, transitionDuration represents the total duration of the animation, that is, the total duration of the animation execution, UIViewControllerContextTransitioning is a protocol for defining transition animations in iOS, which provides the context information required for transition animations, and transitionContext represents the transition context information.

[0055] The total execution time of the animation is returned in this function. The total execution time is a configurable object. It should be noted that an animation object can include one or more animations. When multiple animations are included, the total execution time is the upper limit of the total execution time of each animation, that is, the maximum value of the total execution time of each animation.

[0056] You can also rewrite the animateTransition function of the animation object, which is defined as -(void)animateTransition:(id

[0057] <uiviewcontrollercontexttransitioning>)transitionContext, where void represents an empty tuple type, i.e., a closure that accepts no parameters and has no return value. In this system callback function, you can start the animation, i.e., you can define one or more animation objects in it and call its "start animation" function startAnimation to start executing the animation object. Each animation object can be defined as an interactive animation object to cover non-interactive animation and interactive animation.

[0058] For each animation object, you can override its interruptibleAnimatorForTransition function, which is defined as -(id <uiviewimplicitlyanimating>)interruptibleAnimatorForTransition:(id

[0059] <uiviewcontrollercontexttransitioning>)transitionContextAPI_AVAILABLE(ios(Figure.0)), where UIViewImplicitlyAnimating is a protocol provided by the iOS system for animation, and interruptibleAnimatorForTransition is a method that the protocol object can execute. This function is a system callback function, and its execution time is when the tabBar is clicked and is about to start switching. This function requires an animation object to tell the system how to execute what kind of animation.

[0060] This function can be called multiple times by the system when the interface switches, so it can be saved as a member variable of the animation object. Its type can be nullable, that is, it can be a global variable or a local variable. For example, you can define varanim:UIViewImplicitlyAnimating?, that is, define the variable anim as the UIViewImplicitlyAnimating interface type. Using this method instead of directly defining a UIViewPropertyAnimator can achieve the separation of the abstract and concrete animation objects. When you need to replace one animation object with another, you can directly modify its related definitions and parameters without changing the code.

[0061] In the animation proxy object, if it is determined that an animation object is not empty, it indicates that the animation object has been initialized. At this time, it can be directly returned and called in subsequent processing. Otherwise, if it is determined that the animation object is empty, it can be initialized.

[0062] The initialization operation of the animation object is determined by the business requirements corresponding to the animation. If the business requirements require the animation object to complete a certain kind of animation, then during the initialization process, an animation scheme for completing the animation can be first formulated for the animation object. That is, the animation object includes an animation scheme variable, which is a configurable object used to implement the animation that the business requirements require it to execute.

[0063] For example, if the tabBar has three subcontrollers, namely the purple subcontroller, the yellow subcontroller and the red subcontroller, then there must be three corresponding items in the tabBar. For example, the bottom of the tabBar includes the first, second and third items, which correspond to the purple subcontroller, the yellow subcontroller and the red subcontroller. If the interface corresponding to the yellow subcontroller is currently displayed, the selected item at the bottom of the tabBar is the second item.

[0064] If the first item of the tabBar is clicked, the interface corresponding to the purple subcontroller can be displayed by panning to the right like a drawer, and the interface corresponding to the yellow subcontroller can be displayed by panning to the right like a drawer. Or, if the third item of the tabBar is clicked, the interface corresponding to the red subcontroller can be displayed by panning to the left like a drawer, and the interface corresponding to the yellow subcontroller can be displayed by panning to the left like a drawer.

[0065] Next, the formulated animation scheme can be read to obtain the animation parameters of the animation object, that is, the configuration parameters of the relevant animation in the animation object, wherein the configuration parameters may include the above-mentioned total execution duration variable, and may also include animation type variables, etc. Animation types may include translation type, rotation type, scaling type, etc. Furthermore, for non-interactive animation objects and interactive animation objects, they have different other animation parameters, respectively. The specific setting method is described in detail below, which will not be repeated here.

[0066] After completing the setting of the animation parameters, you can create a UIViewPropertyAnimator object, which calls the animation object interface and executes the animation object with the corresponding animation parameters to achieve animation switching of the interface.

[0067] As mentioned above, gesture types may include default gesture types and custom gesture types. Among them, the default gesture is the system's built-in tabBar gesture, such as a click on the tabBar gesture. Custom gestures are other gestures defined by the user. In some embodiments, custom gesture types may also include a click on the tabBar index gesture type. If the preset gesture is to click on the tabBar index, it is possible to directly determine that the view corresponding to the clicked tabBar index is the animation target view of this switch, and create a corresponding tabBar proxy object based on the current view and the animation target view.

[0068] That is to say, if the gesture type is determined to be a tabBar index click gesture type, the view corresponding to the tabBar index clicked by the preset gesture can be determined as the animation target view, and then a tabBar proxy object is created that switches from the current view to the animation target view as the tabBar proxy object for this switch.

[0069] At this time, the animation parameters of the animation object can be obtained by the self-transition animation implementation function. The animation parameters at least include the end position of the sub-controller corresponding to the view that is about to disappear in the animation object, the initial position of the sub-controller corresponding to the view that is about to appear in the animation object, and the end position of the sub-controller corresponding to the view that is about to appear in the animation object.

[0070] Still taking the implementation in the iOS system as an example, for a non-interactive animation object, in addition to the total execution time and animation type, the relevant parameters of the sub-controller that is about to disappear and the relevant parameters of the sub-controller that is about to appear can also be determined as animation parameters. Among them, the sub-controller that is about to disappear is the sub-controller related to the current page, and the sub-controller that is about to appear is the sub-controller related to the page displayed after the switch is completed.

[0071] In one example, necessary information may be read from the animation context provided by the system, including information about the subcontroller that is about to disappear, information about the subcontroller that is about to appear, and a temporary container where the animation is located.

[0072] The relevant information of the sub-controller that is about to disappear can be obtained in the following ways: use the command letvcDisappear=transitionContext.viewController(forKey:.from)! to obtain the sub-controller that is about to disappear, use the command let DisappearStart=transitionContext.initialFrame(for:vcDisappear) to obtain the initial coordinate position of the sub-controller that is about to disappear, use the command let viewDisappear=transitionContext.view(forKey:.from)! to obtain the page of the sub-controller that is about to disappear, and use the command let indexDisappear=self.tbc.viewControllers! .firstIndex(of:vcDisappear)! to obtain the index of the sub-controller that is about to disappear.

[0073] Similarly, the relevant information of the sub-controller that is about to appear can be obtained in the following way: use the command letvcAppear=transitionContext.viewController(forKey:.to)! to obtain the sub-controller that is about to appear, use the command let AppearEnd=transitionContext.finalFrame(for:vcAppear) to obtain the coordinate position where the sub-controller that is about to appear will eventually go, use the command let viewAppear=transitionContext.view(forKey:.to)! to obtain the page of the sub-controller that is about to appear, and use the command letindexAppear=self.tbc.viewControllers! .firstIndex(of:vcAppear)! to obtain the index of the sub-controller that is about to appear.

[0074] At the same time, you can use the command let container = transitionContext.containerView to get the temporary container where the animation is located.

[0075] In some real-time modes, the direction of the animation can be recorded. The direction can be customized, for example, you can set the right direction to be positive, represented by 1, and the left direction to be negative, represented by -1. The direction can be represented by the variable direction.

[0076] Next, you can use the animation type variable to obtain the specific implementation type of the animation, and then calculate the position of each sub-controller based on the type and the preset gesture. Taking the synchronous horizontal translation of two sub-controllers as an example, you can subtract the product of the width and direction of the sub-controller from the initial position horizontal coordinate value of the sub-controller that is about to disappear to get the horizontal coordinate value of the end position of the sub-controller that is about to disappear, while the vertical coordinate value of the sub-controller that is about to disappear remains unchanged. Similarly, you can also add the horizontal coordinate value of the end position of the sub-controller that is about to appear to the product of the width and direction of the sub-controller to get the horizontal coordinate value of the initial position of the sub-controller that is about to appear, while the vertical coordinate value of the sub-controller that is about to disappear remains unchanged.

[0077] As mentioned above, since all subcontrollers of the tabBar are at the position of their parent controllers by default, the subcontrollers that are about to appear need to be moved to the calculated initial position before the animation starts. That is, the calculated initial position of the subcontroller that is about to appear can be assigned to the frame of the subcontroller that is about to appear, and the page of the subcontroller that is about to appear can be placed in a temporary container where the animation is located to support the animation. Among them, the frame can represent the position of a control, which includes coordinate points and size, etc.

[0078] Next, you can create a UIViewPropertyAnimator object and set its execution animation to: set the frame of the sub-controller that is about to disappear to the calculated "end position of the sub-controller that is about to disappear", and set the frame of the sub-controller that is about to appear to the calculated "end position of the sub-controller that is about to appear".

[0079] Furthermore, in this function, you can also set the transitionContext system function completeTransition() to be called after the animation is completed, with the parameter passed in as true, to notify the system that the animation execution is finished. At the same time, you can also rewrite its function animationEnded to -(void)animationEnded:(BOOL)transitionCompleted to destroy the corresponding animation object member variable after the animation execution is finished. The destruction method can be to set the member variable to null.

[0080] Figure 4 : is a system architecture diagram of a method for implementing a non-interactive animation for interface switching provided by an embodiment of the present application. Figure 4 As shown, when a preset gesture is detected, the tabBar can call the tabBar proxy object and the animation proxy object corresponding to the tabBar proxy object. The animation proxy object may include one or more animation objects. The one or more animation objects are executed to complete the animation switching of the tabBar view, thereby realizing the animation switching of the terminal interface.

[0081] Figure 5 1 is a flow chart of a method for implementing a non-interactive animation for interface switching provided by an embodiment of the present application. Figure 5 As shown, when the user clicks on the tabBar, the terminal can determine the index (index) of the tabBar switch according to the user's click position, and then determine whether there is a corresponding tabBar proxy object. When the tabBar proxy object determines that its corresponding animation proxy object has an animation object, the animation object can call the start animation function and call the animation parameters obtained by setting the animation object initialization function at the same time. The animation scheme of the animation object is executed based on the animation parameters, that is, the animation object starts to execute the animation until the animation ends, completing the animation switch of the terminal interface. Furthermore, after the animation ends, the animation object can be destroyed to free up space.

[0082] It should be noted that the configuration file can also be used to configure whether to use the technical solution provided in the embodiment of the present application to implement interface switching. That is, the variable of whether to use this solution is set in the configuration file. When it is true, the technical solution provided in the embodiment of the present application is used, and when it is false, it is not used.

[0083] In some cases, it may be necessary to provide users with an animated switching method for an interactive terminal interface. For example, still taking the translation switching interface as an example, the user may hope to achieve the effect of animated switching of the tabBar when sliding the sub-controller of the tabBar left and right. At the same time, the sub-controller sets the advancement distance and confirms the final switching action as the user slides the finger. In other words, the interface switches to where the user slides. If the distance exceeds a preset threshold, such as half the width of the interface, the switching is considered complete. If the user's finger leaves the screen at this moment, the switching action is executed. If the distance does not exceed the preset threshold, the switching is considered incomplete. If the user's finger leaves the screen at this moment, the restoration action is executed.

[0084] In some embodiments of the present application, the gesture type also includes other gesture types except the tabBar index clicking gesture type.

[0085] Figure 6 1 is a flow chart of a method for creating a tabBar proxy object for this switching according to a preset gesture and gesture type provided in an embodiment of the present application. Figure 6 As shown, the method comprises the following steps:

[0086] In step S601, in response to determining that the gesture type is another gesture type, the gesture state of the gesture response function is obtained from the tabBar view.

[0087] In step S602, in response to determining that the gesture state is the start state, the target click tabBar index of this switching is determined according to the position information corresponding to the preset gesture.

[0088] In step S603, it is determined that the view corresponding to the target clicked tabBar index is the animation target view.

[0089] In step S604, a tabBar proxy object is created for switching from the current view to the animation target view as the tabBar proxy object for this switching.

[0090] In some embodiments of the present application, if the gesture type is other than the click tabBar index gesture type, the tabBar proxy object for this switch can be created according to the preset gesture and gesture type, and an interactive type animation object can be created in the animation proxy object corresponding to the tabBar proxy object.

[0091] At this time, you can first get the gesture state of the gesture response function in the tabBar view. If the gesture state is determined to be the start state, you can determine the target click tabBar index for this switch based on the position information corresponding to the preset gesture. Then use the view corresponding to the target click tabBar index as the animation target view for this switch, and create a tabBar proxy object that switches from the current view to the animation target view as the tabBar proxy object for this switch.

[0092] In some embodiments, if the gesture type is other gesture types, obtaining the animation parameters of the animation object can be: obtaining the gesture state of the gesture response function from the tabBar view; in response to determining that the gesture state is in progress, calculating the animation execution ratio based on the real-time position of the gesture execution subject; and determining the animation parameters at least based on the animation execution ratio.

[0093] Furthermore, the animation execution ratio can be calculated based on the real-time position of the gesture execution subject by obtaining the real-time position of the gesture execution subject, determining the distance moved by the gesture execution subject in a first target direction according to the real-time position, wherein the first target direction corresponds to the direction of this animation; obtaining the target distance, which is the distance that the animation interface needs to move; and determining the quotient of the moved distance and the distance that needs to be moved as the animation execution ratio.

[0094] Still taking the implementation in iOS system as an example, for the interactive animation proxy object, you can rewrite its initialization transition animation method function startInteractiveTransition to -(void)startInteractiveTransition:(id

[0095] <uiviewcontrollercontexttransitioning>)transitionContext. In this function, you can define an interactive animation object and start the animation in combination with the detected gesture state. The initialization method of the interactive animation object is basically the same as the initialization method of the non-interactive animation object described above, and will not be repeated here.

[0096] Furthermore, since the execution of the animation needs to be controlled in combination with the gesture state, the animation context needs to be saved to the transitionContext member variable of the function.

[0097] At the same time, you can also rewrite the function interactionControllerForAnimationController of the tabBar proxy object as

[0098] -(nullable id

[0099] <uiviewcontrollerinteractivetransitioning>)tabBarController:(UITabBarController*)tabBarController

[0100] interactionControllerForAnimationController:(id <uiviewcontrolleranimatedtransitioning>)animationController API_AVAILABLE(ios(7.0))API_UNAVAILABLE(visionos). Among them, interactionControllerForAnimationController is a method function in the transition animation, which requires returning one or more interactive animation proxy objects. According to the configuration value of the transition animation (interacting), if it is false (false), it returns empty, which is also the default value of the system. If it is true, it returns one or more interactive animation proxy objects.

[0101] On the other hand, gestures need to be added to the tabBar view. The tabBar view can be obtained through the command tabbar.view. Since the details of finger sliding need to be obtained in the interactive animation, gestures are needed. Considering that the tabBar is full screen, the specific gesture added can be, for example, the screen edge gesture UIScreenEdgePanGestureRecognizer. It is understandable that this is not the only optional gesture. The selection of gesture is related to business needs. If the business requirement is: click to switch tabBar (for example, this is done in a reading application), or a user-defined gesture, such as: double-click twice, then we need to add the corresponding gesture or even a custom gesture to tabBar.view. These configurable items are placed in the specific gesture variables of the interaction of the tabBar view.

[0102] The following takes the screen edge gesture as an example to introduce a method for implementing interface switching based on gestures and animation objects. In one example, two screen edge gestures can be added to the view of the tabBar, one representing the left edge of the screen and the other representing the right edge of the screen. Furthermore, proxy objects can be set for the two screen edge gestures to coordinate the relationship between the two gestures. The proxy object of the gesture can be the same as or different from the tabBar proxy object and the animation proxy object.

[0103] You can rewrite the gesture proxy object's function gestureRecognizerShouldBegin to -(BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer*)gestureRecognizer, and get the current index of the tabBar in it, then read the configuration, get the value of the variable of whether to loop the sliding when the index exceeds the limit, if the value of the variable is false, for the left edge gesture of the screen, if the index value is greater than 0, the gesture on the left side of the screen is allowed to take effect; or for the right edge gesture of the screen, if the index value is less than the maximum number of sub-controllers, that is, less than the maximum value of the index value, the gesture on the right side of the screen is allowed to take effect. Among them, gestureRecognizerShouldBegin is a function to determine whether a gesture should be started, UIGestureRecognizer is the basic class of gestures, and gestureRecognizer is a gesture recognizer.

[0104] Next, you can get the gesture state in the gesture response function. If the gesture state is the beginning state (.began), you can set interacting to true and manually trigger the tabBar switching action.

[0105] Among them, interacting is the interactivity variable of the animation object, and its value can be determined in the following way: in response to determining that the gesture type is a click tabBar index gesture type, determining that the value of the interactive variable is false; in response to determining that the gesture type is other gesture types and the gesture state is the start state, setting the value of the interactive variable to true; in response to determining that the gesture type is other gesture types and the gesture state is the end state, receiving the return value of the completion function of the animation object; in response to determining that the return value of the completion function is true, setting the value of the interactive variable to false.

[0106] On the other hand, the manual triggering of the tabBar switching action can be, if the preset gesture is the left edge of the screen gesture, the selected target index (selectedIndex) of the tabBar can be set to the current selectedIndex value minus 1. If the preset gesture is the right edge of the screen gesture, the selectedIndex of the tabBar can be set to the current selectedIndex value plus 1. In other words, since the left edge of the screen gesture represents a swipe to the right, the gesture must mean to go to the previous subcontroller, so it is minus 1; vice versa.

[0107] Next, if the gesture state is determined to be in progress (.changed), it means that the user's finger is moving on the screen. At this time, taking the horizontal translation animation type as an example, the distance the finger slides in the horizontal direction can be calculated to know how far the animation moves, and then the percentage of the animation (fractionComplete), that is, the animation execution ratio, can be calculated.

[0108] Then, you can call the updateInteractiveTransition of the aforementioned transitionContext and pass in the fractionComplete as a parameter to inform the system of the progress of the current switching of the sub-controller.

[0109] In one example, the view property can be called for the gesture to get the control associated with the gesture, that is, the tabBar. The function open func translation(in view: UIView?)->CGPoint is called for the gesture, and the parameter is passed to the control tabBar. The return value is the current distance moved by the finger. The horizontal value of the current distance moved is taken out and divided by the width of the tabBar (usually the width of the terminal screen) to get the fractionComplete.

[0110] The calculated fractionComplete can be used as the animation parameter of the animation object and written into its animation execution ratio variable. At the same time, the updateInteractiveTransition of transitionContext can be called and the fractionComplete parameter can be passed in to notify the system of the animation execution ratio.

[0111] After the animation is executed, when the gesture state obtained is the end state, the animation object can be paused and the current animation execution ratio can be obtained. In response to determining that the current animation execution ratio meets the preset switching condition, the animation object continues to be executed until the animation switching is completed; or, in response to determining that the current animation execution ratio does not meet the preset switching condition, the interface is rolled back to the interface before the animation switching.

[0112] That is to say, if it is determined that the gesture state has changed to the end state (.ended), it means that the user's finger has left the screen. At this time, the animation object can be paused by calling the pauseAnimation function of the animation object, and the fractionComplete property value of the animation object can be retrieved for judgment. If fractionComplete does not meet the preset switching condition, for example, it is less than the preset threshold (such as 0.5), the animation is rolled back and the isReversed property of the animation object is set to true.

[0113] On the contrary, if fractionComplete meets the preset switching condition, for example, it is greater than or equal to the preset threshold, the animation object's function open func continueAnimation(withTimingParameters parameters:(any UITimingCurveProvider)?, durationFactor:CGFloat) is called to make the animation object continue to execute until the interface switching is completed.

[0114] Optionally, you can set the fallback animation option in the animation object. If the fallback animation option is enabled, the animation will fall back along the initial trajectory of the animation when fractionComplete does not meet the preset switching conditions. Conversely, if the fallback animation option is not enabled, the animation switch of the interface can still be performed along the target trajectory when fractionComplete does not meet the preset switching conditions.

[0115] When the animation is finished, you can also set interacting to false in the animationEnded function to make the tabBar animation non-interactive after the animation ends.

[0116] In some embodiments of the present application, other gesture types may include sliding gesture types, double-click gesture types, and custom gesture types. In one example, if the other gesture type is a sliding gesture type, determining the target click tabBar index for this switch based on the position information corresponding to the preset gesture may be to detect the sliding direction of the preset gesture; in response to determining that the sliding direction is the first direction, determining the previous index of the current index as the target click tabBar index for this switch; in response to determining that the sliding direction is the first direction, the current index is the first index, and the value of the loop sliding variable in the tabBar proxy object of the preset gesture is true, determining the last index as the target click tabBar index for this switch; in response to determining that the sliding direction is the second direction, determining the next index of the current index as the target click tabBar index for this switch; in response to determining that the sliding direction is the second direction, the current index is the last index, and the value of the loop sliding variable in the tabBar proxy object of the preset gesture is true, determining the first index as the target click tabBar index for this switch.

[0117] That is to say, a circular sliding variable can be set in the tabBar proxy object of the preset gesture. When a sliding gesture is detected, the sliding direction is first determined. If the sliding direction is the first direction, such as sliding from left to right, the previous index of the current index of the tabBar can be used as the target index of this switch, and the tabBar proxy object of this switch can be created according to the interface corresponding to the current index and the target index. Furthermore, if the current index is the first index of the tabBar, when the value of the circular sliding variable is true, the last index in the tabBar index can be used as the target index of this switch.

[0118] Correspondingly, if the sliding direction is the second direction, such as sliding from right to left, the next index of the current tabBar index can be used as the target index of this switch, and the tabBar proxy object of this switch can be created according to the interface corresponding to the current index and the target index. Furthermore, if the current index is the last index of the tabBar, when the value of the loop sliding variable is true, the first index in the tabBar index can be used as the target index of this switch.

[0119] In another example, if the other gesture type is a double-click gesture type, when a double-click gesture is detected, the double-click position can be obtained. If the double-click position is located in the first area of ​​the terminal screen, such as the left half, the previous index of the current index of the tabBar can be used as the target index of this switch, and the tabBar proxy object of this switch is created according to the interface corresponding to the current index and the target index. Furthermore, if the current index is the first index of the tabBar, when the value of the loop sliding variable is true, the last index in the tabBar index can be used as the target index of this switch.

[0120] Correspondingly, if the double-click position is in the second area of ​​the terminal screen, such as the right half, the next index of the current tabBar index can be used as the target index of this switch, and the tabBar proxy object of this switch can be created according to the interface corresponding to the current index and the target index. Furthermore, if the current index is the last index of the tabBar, when the value of the loop sliding variable is true, the first index in the tabBar index can be used as the target index of this switch.

[0121] The method of determining the target index corresponding to other custom gesture types is similar to the above method, where the judgment conditions can be defined according to business needs and are not limited here.

[0122] Figure 7 1 is a system architecture diagram of an interactive animation implementation method for interface switching provided by the present application embodiment. Figure 7 As shown, when a preset gesture is detected, the tabBar can call the tabBar proxy object and the animation proxy object corresponding to the tabBar proxy object. The animation proxy object can include one or more interactive animation objects. At the same time, the tabBar can also obtain relevant information of the gesture from the view, set parameters such as the animation execution ratio according to the relevant information of the gesture, and determine the variables that trigger the execution of the animation. When the variables that trigger the execution of the animation meet the preset conditions, the one or more animation objects are executed based on the animation execution ratio, thereby completing the animation switching of the tabBar view, and then realizing the animation switching of the terminal interface.

[0123] Figure 8 1 is a flow chart of a method for implementing an interactive animation for interface switching provided by an embodiment of the present application. Figure 8 As shown, after the user operates the screen with other gestures, when the state of the gesture in the gesture response function obtained from the tabBar view is the start state, the tabBar is triggered and the index is switched. After that, the tabBar asks the proxy object whether there is an interactive animation object. If so, the animation parameters set by the animation object initialization function are called, and when the gesture state is determined to be in progress, the animation execution ratio variable of the animation object is obtained, and the variable is sent to the system so that the system controls the switching progress of the sub-controller based on the value of the variable. Finally, when it is determined that the gesture state is updated to the end state, it is determined whether to continue the animation or roll back the animation based on the value of the animation execution ratio variable.

[0124] To further enhance the user experience, you can also add additional temporary visual controls to non-interactive objects or interactive animations, which disappear after the animation is completed. These temporary visual controls support user interaction, including but not limited to clicks, following finger slides, etc. In one example, these controls can be: butterflies, fireworks, balls, etc. that appear as the animation progresses, or some other auxiliary controls, such as buttons, etc.

[0125] In some implementations of the present application, the animation object is bound to at least one target visual control, wherein the target visual control is used to display the target visual effect when the interface is switched.

[0126] In some implementations, the animation parameters may further include a target visual control interactivity variable. In response to determining that the value of the target visual control interactivity variable is false, obtaining the animation parameters of the animation object may be: obtaining the total animation execution duration of each visual control in the target visual control; determining the maximum value of the total animation execution duration of each visual control as the total animation execution duration variable in the animation parameters; and determining the starting position and the end position of each visual control in the animation parameters based on the context information of the target visual control.

[0127] On the other hand, in response to determining that the value of the interactivity variable of the target visual control is true, obtaining the animation parameters of the animation object can be: obtaining the gesture state of the gesture response function from the tabBar view; in response to determining that the gesture state is the start state and the state of the animation object is the active state, stopping the animation object; in response to determining that the gesture state is the ongoing state, obtaining the real-time position information of the target visual control based on the real-time position calculation of the gesture execution subject; and determining the animation parameters based on at least the real-time position information of the target visual control.

[0128] Still taking the implementation in the iOS system as an example, the target visual control can be obtained, which is one or more temporary visual controls. Furthermore, an animation object can be defined and bound to the temporary visual control. Among them, the implementation effect of the animation object can be that after reading the gesture of the variable target visual control interaction, the target visual control can be moved from the current position to the end position determined by the business needs. Furthermore, in the animation object, the value of the animation parameter total execution duration variable can be set to the product of the total animation execution duration of the target visual control and a preset control factor, wherein the value of the preset control factor is greater than 0 and less than or equal to 1.

[0129] Next, you can call addSubview on transitionContext and pass in each target visual control. Then determine the value of the interactivity variable of the target visual control. If it is false, it is similar to a non-interactive animation object. Directly define the animation of the target visual control and start the animation. Conversely, if it is true, you can refer to the interactive animation to set the animation parameters of the animation object bound to the target visual control.

[0130] For example, if the animation scheme of the target visual control is, it can be animated from the starting point to the end point according to the established animation scheme, but it can be changed by user gestures in the middle: the user can slide it to any position with a finger, and when the finger is released, it slides from the position where the user released it to the original end point at the same speed. Then you can first add gestures to the target visual control. The specific gestures can be defined according to business needs and are not limited here. Furthermore, if there are multiple gestures, you can also set a proxy for the gesture to coordinate the conflicts and consistency between different gestures.

[0131] Then, in the gesture response function, the gesture state is determined. If the gesture state is .began, it is possible to further determine whether the state of the animation object bound to the target visual control is active (.active). If so, the animation object is stopped (stopAnimation). Otherwise, the next state is processed directly. For example, the fallthrough keyword can be used to enter the next state.

[0132] If the gesture state is judged to be .changed, it means that the user's finger is moving on the screen at this time. Therefore, it is necessary to calculate the distance that the finger slides in each direction to know how far the target visual control should move. In an example, the view property can be called for the gesture to get the control associated with the gesture, that is, the tabBar. And the function open functranslation(in view:UIView?)->CGPoint is called for the gesture, and the parameter is passed into the control, and its return value is the current distance moved by the finger. Among them, the distance can include the horizontal distance value and the vertical coordinate value.

[0133] At the same time, a reference point can also be determined in the target visual control, such as the midpoint of the target visual control, or a randomly selected point. The selection of the reference point can be specified by business needs and is not limited here. The horizontal coordinate value of the reference point is added to the above-mentioned horizontal distance value, and the vertical coordinate value of the reference point is added to the above-mentioned vertical distance value to obtain the real-time position information of the target visual control. At this time, the target visual control can follow the movement of the finger according to the real-time position information.

[0134] That is to say, the real-time position information of the target visual control can be calculated based on the real-time position of the gesture execution subject, and the real-time position of the gesture execution subject can be obtained, and the distance moved by the gesture execution subject in the second target direction can be determined according to the real-time position, wherein the second target direction corresponds to the animation direction of the target visual control. Determine the reference point of the target visual control. Move the distance moved by the gesture execution subject in the second target direction from the reference point position to obtain the real-time position of the target visual control. The second target direction can include one or more directions.

[0135] In one example, during the animation execution of the target visual control, that is, the target visual control moves in real time following the finger, the setTranslation method can be called for the gesture, and the parameter .zero is passed in. This is to consume the distance of the gesture displacement, so as to determine whether to continue the animation when the finger is lifted.

[0136] In some implementations of the present application, the animation parameters may also include a variable of whether to execute at the original speed after the gesture ends and a variable of the total execution duration.

[0137] Fig. 9 1 is a flow chart of a method for implementing animation switching of a terminal interface by executing animation objects based on animation parameters provided by an embodiment of the present application. Fig. 9 As shown, the method comprises the following steps:

[0138] In step S901, the gesture state of the gesture response function is obtained from the tabBar view.

[0139] In step S902, in response to determining that the gesture state is the end state and the value of the variable whether to execute at the original speed after the gesture ends is false, the animation object is restarted to complete the animation switching of the terminal interface at least based on the total execution time of the animation object.

[0140] In step S903, in response to determining that the gesture state is the end state, and the value of the variable whether to execute at the original speed after the gesture ends is true, the animation object control factor is calculated according to the real-time position and target position of the target visual control, and the product of the control factor and the total execution time of the animation object is used as the total execution time of the updated animation object.

[0141] In step S904, the animation switching of the terminal interface is completed based on at least the total execution time of the updated animation object.

[0142] In some embodiments, when it is determined that the gesture state of a preset gesture used to control a target visual control is an end state, it is possible to continue to judge whether the value of the variable is executed at the original speed after the gesture in the target visual control ends. If the value is false, the animation object continues to be executed, and the animation switching of the terminal interface is completed at least based on the total execution time of the animation object.

[0143] That is to say, when the user lifts his finger, if you want to continue the animation so that the target visual control does not need to move to the preset end position at the original speed, you can set the preset control factor value to 1 and directly use the total execution time of the animation object to complete the animation switch.

[0144] On the other hand, if the value of the variable "whether to execute at the original speed" is true, the remaining distance can be calculated based on the recorded distance of the gesture displacement that has been consumed and the total distance that the target visual control needs to move, and then the remaining execution time can be calculated using the principle of constant speed, and the target visual control can be controlled to complete the animation switching with the remaining execution time, thereby keeping the original speed unchanged.

[0145] That is to say, the total distance that the target visual control needs to move can be obtained by subtracting the predetermined starting point coordinates from the predetermined end point coordinates, and the distance of the gesture displacement that has been consumed that is saved from the system is obtained, and the total distance is subtracted from the distance of the gesture displacement that has been consumed to obtain the remaining distance, and then the quotient of the remaining distance and the total distance is determined as the preset control factor. Furthermore, the preset control factor is multiplied by the total execution time of the animation object to obtain the updated total execution time. By executing the animation object based on the updated total execution time, the target visual control can complete the animation at the original speed.

[0146] In some implementations, some variables can be stored in a configuration file, which can be stored locally on the terminal or in the cloud, and sent to the terminal at the beginning of the terminal application startup. At the beginning of the application startup, or after the latest configuration file is sent from the cloud, the terminal reloads the configuration file, reads the variables stored in it into the memory, and uses different execution codes according to the different values ​​of each variable. This mechanism can be understood as a state machine.

[0147] The variables in the configuration file may include whether to adopt the solution, animation solution, interactivity, and whether to add target visual controls.

[0148] Whether to adopt this solution The type of the variable can be a Boolean type. If the technical solution provided by the embodiment of the present application is not adopted, the value of the variable is true, and the delegate attribute of tabBar is set to nil at the application of tabBar, that is, the system default value is adopted. On the contrary, if the technical solution provided by the embodiment of the present application is adopted, the value of the variable is false, and the delegate attribute of tabBar is set to the proxy object of tabBar defined by the technical solution provided by the embodiment of the present application at the application of tabbar, thereby realizing the animation implementation of the interface switching based on tabBar.

[0149] The animation scheme variable can be a composite value, which includes all the parameters required for the animation scheme, such as the total duration of the animation execution, the animation type, etc. The total duration of the animation execution variable can be specified by business requirements as a specific fixed value, or it can be dynamically generated. For example: Count the time it takes for the upcoming sub-controller to be initialized and load the data and interface, and use this time as the total duration of the animation execution. It can be understood that when there are multiple tabBars in an application that are applied to the technical solution provided in the embodiment of the present application, each one has its own corresponding value.

[0150] For example, in the first application, the total execution time can be configured to be specified by business requirements, such as 2 seconds. In the second application, the total execution time can be determined by the loading time of the upcoming sub-controller.

[0151] The animation type variable can be an enumeration type, and its values ​​include translation, rotation, scaling, etc., and their combinations. If the animation type is translation, the expected starting position and expected ending position of the sub-controller that is about to disappear, and the expected starting position and expected ending position of the sub-controller that is about to appear are specified. These parameters can be used to create rich translation effects.

[0152] For example, you can set the disappearing subcontroller to have an obvious sliding effect, while the appearing subcontroller is below it and does not move. Or you can set the disappearing subcontroller and the appearing subcontroller to slide together, so that the two appear to be squeezed together, etc.

[0153] The type of the interactivity variable can be a Boolean type. When the value of the variable is false, it means that interaction is not possible, and the page switching is completed using the implementation method when the gesture type at least includes the click tabBar index gesture type. Conversely, when the value of the variable is true, it means that interaction is possible, and the page switching is completed using the implementation method when the gesture type is other gesture types.

[0154] Furthermore, when the value of the variable is true, it may also include a specific gesture variable of the interaction and a loop sliding variable, wherein the loop sliding variable may also be referred to as a loop sliding variable whether the index is exceeded.

[0155] The specific gesture variable of the interaction can be a composite value, including the specific type of gesture, various parameters required for gesture setting, whether coordination is required (whether the gesture proxy object needs to be set), etc. The variable of whether to slide circularly beyond the index is of Boolean type, which is used to indicate whether it is necessary to support: you can also slide to the next one when the index of the sub-control is less than 0 or greater than the maximum value: if the index is less than 0, continue to slide to the right to enter the sub-control corresponding to the maximum value index; if the index is greater than the maximum value, continue to slide to the left to enter the sub-control corresponding to the first index.

[0156] Whether to add the target visual control variable is a Boolean type variable. When its value is false, no visual control needs to be added. When its value is true, it further includes the target visual control type variable, the target visual control animation scheme variable, the target visual control interactivity variable, and the specific gesture variable for the target visual control interaction.

[0157] Among them, the target visual control type variable is a composite value, including: control type, storage location, control related properties, such as: transparency, related pictures, color, shadow, starting position, end position, etc.

[0158] The target visual control animation scheme variables are similar to the animation scheme variables and are not described here.

[0159] The target visual control interactivity variable is of Boolean type. When its value is true, gesture operation needs to be added and processed. Otherwise, when it is false, gesture operation does not need to be added and the animation can be started directly.

[0160] The specific gesture variable of the target visual control interaction is a composite value, including: the specific type of gesture, the various parameters required for gesture setting, whether coordination is required (whether a gesture proxy object needs to be set), which point of the target visual control is used as the reference point of the gesture, whether it is necessary to move to the predetermined end point at the original speed after the interaction, etc.

[0161] By adopting the technical solution of the embodiment of the present application, the animation of switching the Tabbar interactive interface can be realized. The bottom layer of the solution adopts the tabBar control provided by the terminal system, so it can ensure good performance. At the same time, the solution provides highly customized implementation means, including switching animation selection, addition of target visual controls, interactivity of controls, animation properties, etc., which can be flexibly configured and have strong versatility.

[0162] Furthermore, the technical solution provided in the embodiment of the present application utilizes the PropertyAnimator provided by the terminal system to simply implement interaction, avoiding complexity and improving user experience.

[0163] All the above optional technical solutions can be arbitrarily combined to form optional embodiments of the present application, which will not be described one by one here.

[0164] The following is an embodiment of the device of the present application, which can be used to execute the embodiment of the method of the present application. For details not disclosed in the embodiment of the device of the present application, please refer to the embodiment of the method of the present application.

[0165] Fig.10 Schematic diagram of an interface switching animation implementation device provided in an embodiment of the present application. Fig.10 As shown, the device comprises:

[0166] The determination module 1001 is configured to determine the gesture type of the preset gesture in response to detecting the preset gesture.

[0167] The creation module 1002 is configured to create the tabBar proxy object of this switching according to the preset gesture and gesture type.

[0168] The starting module 1003 is configured to start the animation start function of the animation object in response to determining that the tabBar proxy object includes an animation object, and obtain animation parameters of the animation object.

[0169] The switching module 1004 is configured to execute the animation object based on the animation parameters to achieve animation switching of the terminal interface.

[0170] According to the technical solution provided in the embodiment of the present application, when the terminal detects a preset gesture for operating the tabBar, the gesture type of the preset gesture is determined, and the tabBar proxy object for this switching is created according to the preset gesture and gesture type. When it is determined that the tabBar proxy object includes an animation object, the animation start function of the animation object is started and the animation parameters of the animation object are obtained. The animation object is executed based on the animation parameters to realize the animation switching of the terminal interface, thereby providing an efficient and interactive terminal interface animation switching based on tabBar and improving the user experience.

[0171] In some embodiments, the gesture type at least includes a tabBar index click gesture type; creating a tabBar proxy object for this switch based on a preset gesture and gesture type, including: in response to determining that the gesture type is a tabBar index click gesture type, determining that the view corresponding to the tabBar index clicked by the preset gesture is the animation target view; creating a tabBar proxy object that switches from the current view to the animation target view as the tabBar proxy object for this switch.

[0172] In some embodiments, in response to determining that the gesture type is a tabBar index click gesture type, the step of obtaining the animation parameters of the animation object is to obtain the animation parameters from the transition animation implementation function; wherein the animation parameters include at least the end position of the sub-controller corresponding to the view that is about to disappear in the animation object, the initial position of the sub-controller corresponding to the view that is about to appear in the animation object, and the end position of the sub-controller corresponding to the view that is about to appear in the animation object.

[0173] In some embodiments, the gesture type also includes other gesture types; a tabBar proxy object for this switch is created based on the preset gesture and gesture type, including: in response to determining that the gesture type is other gesture types, obtaining the gesture state of the gesture response function from the tabBar view; in response to determining that the gesture state is the start state, determining the target click tabBar index for this switch based on the position information corresponding to the preset gesture; determining that the view corresponding to the target click tabBar index is the animation target view; and creating a tabBar proxy object that switches from the current view to the animation target view as the tabBar proxy object for this switch.

[0174] In some embodiments, in response to determining that the gesture type is other gesture types, animation parameters of the animation object are obtained, including: obtaining the gesture state of the gesture response function from the tabBar view; in response to determining that the gesture state is in progress, calculating the animation execution ratio based on the real-time position of the gesture execution subject; and determining the animation parameters based on at least the animation execution ratio.

[0175] In some embodiments, the animation execution ratio is calculated based on the real-time position of the gesture execution subject, including: obtaining the real-time position of the gesture execution subject, determining the distance that the gesture execution subject has moved in the first target direction according to the real-time position, the first target direction corresponding to the current animation direction; obtaining the target distance, the target distance is the distance that the animation interface needs to move; determining the quotient of the moved distance and the distance that needs to be moved as the animation execution ratio.

[0176] In some embodiments, in response to determining that the gesture type is another gesture type, executing an animation object based on animation parameters includes: obtaining the gesture state of the gesture response function from the tabBar view; in response to determining that the gesture state is an end state, pausing the animation object; obtaining the current animation execution ratio; in response to determining that the current animation execution ratio meets a preset switching condition, continuing to execute the animation object until the animation switching is completed; in response to determining that the current animation execution ratio does not meet the preset switching condition, rolling back the interface to the interface before the animation switching.

[0177] In some embodiments, the animation object includes an interactivity variable; the value of the interactive variable is determined in the following manner: in response to determining that the gesture type is a click tabBar index gesture type, determining that the value of the interactive variable is false; in response to determining that the gesture type is other gesture types and the gesture state is a start state, setting the value of the interactive variable to true; in response to determining that the gesture type is other gesture types and the gesture state is an end state, receiving the return value of the completion function of the animation object; in response to determining that the return value of the completion function is true, setting the value of the interactive variable to false.

[0178] In some embodiments, other gesture types include sliding gesture types, double-click gesture types, and custom gesture types; in response to other gesture types being sliding gestures, determining the target click tabBar index for this switch according to the position information corresponding to the preset gesture, including: detecting the sliding direction of the preset gesture; in response to determining that the sliding direction is a first direction, determining the previous index of the current index as the target click tabBar index for this switch; in response to determining that the sliding direction is the first direction, the current index is the first index, and the value of the circular sliding variable in the tabBar proxy object of the preset gesture is true, determining the last index as the target click tabBar index for this switch; in response to determining that the sliding direction is the second direction, determining the next index of the current index as the target click tabBar index for this switch; in response to determining that the sliding direction is the second direction, the current index is the last index, and the value of the circular sliding variable in the tabBar proxy object of the preset gesture is true, determining the first index as the target click tabBar index for this switch.

[0179] In some embodiments, the animation object is bound to at least one target visual control; wherein the target visual control is used to display a target visual effect when the interface is switched.

[0180] In some embodiments, the animation parameters also include a target visual control interactivity variable; in response to determining that the value of the target visual control interactivity variable is false, obtaining the animation parameters of the animation object, including: obtaining the total animation execution duration of each visual control in the target visual control; determining the maximum value of the total animation execution duration of each visual control as the total animation execution duration variable in the animation parameters; and determining the starting position and end position of each visual control in the animation parameters based on the context information of the target visual control.

[0181] In some embodiments, in response to determining that the value of the target visual control interactivity variable is true, obtaining animation parameters of the animation object includes: obtaining the gesture state of the gesture response function from the tabBar view; in response to determining that the gesture state is a start state and the state of the animation object is an active state, stopping the animation object; in response to determining that the gesture state is an ongoing state, obtaining the real-time position information of the target visual control based on the real-time position calculation of the gesture execution subject; and determining the animation parameters based on at least the real-time position information of the target visual control.

[0182] In some embodiments, the animation parameters also include a variable indicating whether to execute at the original speed after the gesture ends and a variable indicating the total execution time; the animation object is executed based on the animation parameters to realize animation switching of the terminal interface, including: obtaining the gesture state of the gesture response function from the tabBar view; in response to determining that the gesture state is the end state and the value of the variable indicating whether to execute at the original speed after the gesture ends is false, restarting the animation object, and completing the animation switching of the terminal interface based on at least the total execution time of the animation object; or in response to determining that the gesture state is the end state and the value of the variable indicating whether to execute at the original speed after the gesture ends is true, calculating the control factor of the animation object according to the real-time position and the target position of the target visual control, and taking the product of the control factor and the total execution time of the animation object as the total execution time of the updated animation object; completing the animation switching of the terminal interface based on at least the total execution time of the updated animation object.

[0183] In some embodiments, the real-time position information of the target visual control is calculated based on the real-time position of the gesture execution subject, including: obtaining the real-time position of the gesture execution subject, determining the moved distance of the gesture execution subject in a second target direction according to the real-time position, the second target direction corresponding to the animation direction of the target visual control; determining a reference point of the target visual control; moving the gesture execution subject in the second target direction along the second target direction from the reference point position to obtain the real-time position of the target visual control.

[0184] In some embodiments, the animation parameters are obtained from a preset configuration file; the preset configuration file also stores variables of whether to adopt the present solution, interactivity, and whether to add a target visual control variable.

[0185] It should be understood that the size of the serial numbers of the steps in the above embodiments does not mean the order of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of the present application.

[0186] Fig.11 Schematic diagram of an electronic device provided in an embodiment of the present application. Fig.11 As shown, the electronic device 11 of this embodiment includes: a processor 1101, a memory 1102, and a computer program 1103 stored in the memory 1102 and executable on the processor 1101. When the processor 1101 executes the computer program 1103, the steps in the above-mentioned method embodiments are implemented. Alternatively, when the processor 1101 executes the computer program 1103, the functions of the modules / units in the above-mentioned device embodiments are implemented.

[0187] The electronic device 11 may be a desktop computer, a notebook, a PDA, a cloud server, or other electronic device. The electronic device 11 may include, but is not limited to, a processor 1101 and a memory 1102. Those skilled in the art will appreciate that Fig.11 The electronic device 11 is merely an example and does not limit the electronic device 11 , and may include more or fewer components than those shown in the figure, or different components.

[0188] Processor 1101 can be a central processing unit (CPU), or other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), field-programmable gate arrays (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc.

[0189] The memory 1102 may be an internal storage unit of the electronic device 11, for example, a hard disk or memory of the electronic device 11. The memory 1102 may also be an external storage device of the electronic device 11, for example, a plug-in hard disk, a smart media card (SMC), a secure digital (SD) card, a flash card (FlashCard), etc. equipped on the electronic device 11. The memory 1102 may also include both an internal storage unit of the electronic device 11 and an external storage device. The memory 1102 is used to store computer programs and other programs and data required by the electronic device.

[0190] Those skilled in the art can clearly understand that for the convenience and simplicity of description, only the division of the above-mentioned functional units and modules is used as an example. In actual applications, the above-mentioned functions can be assigned to different functional units and modules as needed, that is, the internal structure of the device can be divided into different functional units or modules to complete all or part of the functions described above. The functional units and modules in the embodiments can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The above-mentioned integrated unit can be implemented in the form of hardware or in the form of software functional units.

[0191] If the integrated module / unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the present application implements all or part of the processes in the above-mentioned embodiment method, and can also be completed by instructing the relevant hardware through a computer program. The computer program can be stored in a computer-readable storage medium, and the computer program can implement the steps of the above-mentioned various method embodiments when executed by the processor. The computer program may include computer program code, which may be in source code form, object code form, executable file or some intermediate form. Computer-readable media may include: any entity or device capable of carrying computer program code, recording medium, U disk, mobile hard disk, disk, optical disk, computer memory, read-only memory (ROM), random access memory (RAM), electric carrier signal, telecommunication signal and software distribution medium, etc.

[0192] The above embodiments are only used to illustrate the technical solutions of the present application, rather than to limit them. Although the present application has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or make equivalent replacements for some of the technical features therein. These modifications or replacements do not deviate the essence of the corresponding technical solutions from the spirit and scope of the technical solutions of the embodiments of the present application, and should all be included in the protection scope of the present application.< / uiviewcontrolleranimatedtransitioning> < / uiviewcontrollerinteractivetransitioning> < / uiviewcontrollercontexttransitioning> < / uiviewcontrollercontexttransitioning> < / uiviewimplicitlyanimating> < / uiviewcontrollercontexttransitioning> < / uiviewcontrollercontexttransitioning> < / uiviewcontrolleranimatedtransitioning>

Claims

1. A method for implementing an animation of interface switching, characterized in that: The method is executed by a terminal and is used to implement animation switching of a terminal interface based on a tab bar tabBar, and includes: In response to detecting a preset gesture, determining a gesture type of the preset gesture; Create the tabBar proxy object for this switching according to the preset gesture and gesture type; In response to determining that the tabBar proxy object includes an animation object, starting an animation start function of the animation object, and obtaining animation parameters of the animation object; The animation object is executed based on the animation parameters to achieve animation switching of the terminal interface.

2. The method according to claim 1, characterized in that The gesture type at least includes a tabBar index click gesture type; The creating of the tabBar proxy object for this switching according to the preset gesture and gesture type includes: In response to determining that the gesture type is a tabBar index click gesture type, determining that a view corresponding to the tabBar index clicked by the preset gesture is an animation target view; Create a tabBar proxy object that switches from the current view to the animation target view as the tabBar proxy object for this switch.

3. The method according to claim 2, characterized in that In response to determining that the gesture type is a click on the tabBar index gesture type, the step of obtaining the animation parameters of the animation object is to obtain the animation parameters from the transition animation implementation function; Among them, the animation parameters include at least the end position of the sub-controller corresponding to the view that is about to disappear in the animation object, the initial position of the sub-controller corresponding to the view that is about to appear in the animation object, and the end position of the sub-controller corresponding to the view that is about to appear in the animation object.

4. The method according to claim 2, characterized in that: The gesture type also includes other gesture types; The creating of the tabBar proxy object for this switching according to the preset gesture and gesture type includes: In response to determining that the gesture type is another gesture type, acquiring a gesture state of a gesture response function from the tabBar view; In response to determining that the gesture state is the start state, determining the target click tabBar index of this switching according to the position information corresponding to the preset gesture; Determine that the view corresponding to the target clicked tabBar index is the animation target view; Create a tabBar proxy object that switches from the current view to the animation target view as the tabBar proxy object for this switch.

5. The method according to claim 4, characterized in that In response to determining that the gesture type is another gesture type, obtaining the animation parameter of the animation object includes: Get the gesture status of the gesture response function from the tabBar view; In response to determining that the gesture state is in progress, calculating an animation execution ratio based on a real-time position of the gesture execution subject; The animation parameter is determined based on at least the animation execution ratio.

6. The method according to claim 5, characterized in that The calculating the animation execution ratio based on the real-time position of the gesture execution subject includes: Acquire the real-time position of the gesture execution subject, and determine the moved distance of the gesture execution subject in a first target direction according to the real-time position, where the first target direction corresponds to the current animation direction; Get the target distance, which is the distance that the animation interface needs to move; The quotient of the moved distance and the distance required to be moved is determined as the animation execution ratio.

7. The method according to claim 5, characterized in that In response to determining that the gesture type is another gesture type, executing the animation object based on the animation parameter includes: Get the gesture status of the gesture response function from the tabBar view; In response to determining that the gesture state is an end state, pausing the animation object; Get the current animation execution ratio; In response to determining that the current animation execution ratio meets a preset switching condition, continuing to execute the animation object until the animation switching is completed; In response to determining that the current animation execution ratio does not meet a preset switching condition, the interface is rolled back to an interface before the animation switching.

8. The method according to claim 5, characterized in that The animation object includes an interactivity variable; The value of the interactive variable is determined in the following way: In response to determining that the gesture type is a click tabBar index gesture type, determining that the value of the interactable variable is false; In response to determining that the gesture type is another gesture type and the gesture state is a start state, setting the value of the interactable variable to true; In response to determining that the gesture type is another gesture type and the gesture state is an end state, receiving a completion function return value of the animation object; In response to determining that the return value of the completion function is true, setting the value of the interactable variable to false.

9. The method according to claim 4, characterized in that Other gesture types include sliding gesture type, double-click gesture type, and custom gesture type; In response to the other gesture type being a sliding gesture, determining the target click tabBar index of this switching according to the position information corresponding to the preset gesture includes: Detecting the sliding direction of the preset gesture; In response to determining that the sliding direction is the first direction, determining the previous index of the current index as the target click tabBar index of this switching; In response to determining that the sliding direction is the first direction, the current index is the first index, and the value of the loop sliding variable in the tabBar proxy object of the preset gesture is true, determining the last index as the target click tabBar index of this switching; In response to determining that the sliding direction is the second direction, determining the next index of the current index as the target clicked tabBar index of this switching; In response to determining that the sliding direction is the second direction, the current index is the last index, and the value of the loop sliding variable in the tabBar proxy object of the preset gesture is true, the first index is determined to be the target click tabBar index of this switching.

10. The method according to any one of claims 1 to 9, characterized in that The animation object is bound to at least one target visual control; Among them, the target visual control is used to display the target visual effect when the interface is switched.

11. The method according to claim 10, characterized in that The animation parameters also include the target visual control interactivity variable; In response to determining that the value of the target visual control interactivity variable is false, obtaining the animation parameter of the animation object includes: Obtaining the total execution time of the animation of each visual control in the target visual control; Determine the maximum value of the total animation execution duration of each visual control as the total animation execution duration variable in the animation parameter; The starting position and the ending position of each visual control in the animation parameters are determined based on the context information of the target visual control.

12. The method according to claim 11, characterized in that In response to determining that the value of the target visual control interactivity variable is true, obtaining the animation parameter of the animation object includes: Get the gesture status of the gesture response function from the tabBar view; In response to determining that the gesture state is a start state and the state of the animation object is an active state, stopping the animation of the animation object; In response to determining that the gesture state is in progress, calculating the real-time position information of the target visual control based on the real-time position of the gesture execution subject; The animation parameters are determined based at least on real-time position information of the target visual control.

13. The method according to claim 12, characterized in that The animation parameters also include a variable of whether to execute at the original speed after the gesture ends and a variable of the total execution time; Executing the animation object based on the animation parameter to implement animation switching of the terminal interface includes: Get the gesture status of the gesture response function from the tabBar view; In response to determining that the gesture state is an end state, and the value of the variable whether to execute at the original speed after the gesture ends is false, restarting the animation object, and completing the animation switching of the terminal interface based on at least the total execution time of the animation object; or In response to determining that the gesture state is an end state, and the value of a variable indicating whether to execute at the original speed after the gesture ends is true, calculating a control factor of the animation object according to the real-time position and the target position of the target visual control, and taking the product of the control factor and the total execution duration of the animation object as the total execution duration of the updated animation object; The animation switching of the terminal interface is completed at least based on the total execution time of the updated animation object.

14. The method according to claim 12, characterized in that The step of calculating the real-time position information of the target visual control based on the real-time position of the gesture execution subject includes: Acquire the real-time position of the gesture execution subject, and determine the moved distance of the gesture execution subject in a second target direction according to the real-time position, where the second target direction corresponds to the animation direction of the target visual control; Determine the reference point of the target visual control; The real-time position of the target visual control is obtained by moving the gesture execution subject in the second target direction from the reference point position.

15. The method according to claim 1, characterized in that The animation parameters are obtained from a preset configuration file; The preset configuration file also stores variables of whether to adopt the present solution, variables of interactivity, and variables of whether to add target visual controls.

16. An animation implementation device for interface switching, characterized in that: include: a determination module, configured to determine a gesture type of the preset gesture in response to detecting the preset gesture; A creation module, configured to create a tabBar proxy object for this switching according to the preset gesture and gesture type; A starting module, configured to start an animation start function of the animation object in response to determining that the tabBar proxy object includes an animation object, and obtain animation parameters of the animation object; The switching module is configured to execute the animation object based on the animation parameters to achieve animation switching of the terminal interface.

Images