antiguab/bafluidview

UIView that simulates a 2D view of a fluid in motion

BAFluidView

Overview

This view and its layer create a 2D fluid animation that can be used to simulate a filling effect.

For a how-to guide on use go to: https://antiguab.github.io/bafluidview/

bafluidview's Issues

Tilt won't work if device starts app while laying flat on surface

If I start the app while holding my phone in my hand in an upright position, the tilting functionality works well. However, if app is launched while the device is flat on a desk or counter top, the tilting functionality will not work once the device is picked up.

Could not find remote branch bug_15_fix to clone

I'm trying to run pod install in my local directory for this app.

https://github.com/FancyPixel/gulps

My-Macbook:gulps-master-two username$ pod install
Updating local specs repositories
Analyzing dependencies
Pre-downloading: BAFluidView from https://github.com/antiguab/BAFluidView, branch bug_15_fix

[!] Error installing BAFluidView
[!] /usr/bin/git clone https://github.com/antiguab/BAFluidView /var/folders/98/hsph0_wj4ll194qg8rr90ms40000gn/T/d20150720-1288-1wgijjp --single-branch --depth 1 --branch bug_15_fix

Cloning into '/var/folders/98/hsph0_wj4ll194qg8rr90ms40000gn/T/d20150720-1288-1wgijjp'...
warning: Could not find remote branch bug_15_fix to clone.
fatal: Remote branch bug_15_fix not found in upstream origin

Any ideas? Thanks!

adding BAFluidView as part of the subview missing from examples

[self.view addSubview:fluidView];

is missing at the end of each example

or add a section at the end before the change log stating to add BAFluidView as part of the subview

Extra info regarding the tilt animation for the documentation

I was having problems with the tilt animation, and I couldn't get it to work. I would trace all the function calls all the way to the library adding the 3D animation to the layer, and yet it did not work.

But then I noticed that the only difference between my code and the example is that I called

fluidView.startAnimation()
fluidView.startTiltAnimation()

inside of viewDidLoad(). Moving those calls to viewDidAppear fixed the problem. I think you could perhaps want to add this to the Read-me file.

Awesome job with the view! 👍

Tilt animation - does not work properly during walking

Tilt animation works well when i just seat on chair and rotate device. But it does not properly when walk around.

Not able to have animation tilt with masked image?

Can you make it that you can tilt the fluid while its on a masked image?

Option to pause the fill animation while keeping the wave animation

I'm working on a project where the background liquid "fill" animation will need to be paused by a user interaction. I'd like to have the waves continue to crest, even when the animation is not filling the view.

Have you considered adding something like this?

I'm struggling with the implementation, but if it's easy, could you share some initial direction?

Thanks!

Tilt functionality doesn't work in Landscape orientation

To reproduce:
Start example app in landscape orientation
Swipe down to get to Tilt example
Notice incorrect Tilt (see screenshot)
Changing orientation of device incorrectly changes fluid level (to near zero)

Note: Tilt does work correctly if you start app in portrait orientation

Tilt animation in Swift?

Hey,
nice view, but in Swift the kBAFluidViewCMMotionUpdate doesn't work. Can you help me?

    private func addFluidIndicator() {
        if self.motionManager.deviceMotionAvailable
        {
            self.motionManager.deviceMotionUpdateInterval = 0.3
            self.motionManager.startDeviceMotionUpdatesToQueue(NSOperationQueue.mainQueue(), withHandler: { (deviceManager, error) -> Void in

                guard let deviceManager = deviceManager else { return }

                let nc = NSNotificationCenter.defaultCenter()
                let userInfo = NSDictionary(object: deviceManager, forKey: "data")
                nc.postNotificationName(kBAFluidViewCMMotionUpdate, object: self, userInfo: userInfo as [NSObject : AnyObject])
            })
        }

        let fluidView           = BAFluidView(frame: UIScreen.mainScreen().bounds, startElevation: 0.5)
        fluidView.fillColor     = UIColor.blueColor()
        fluidView.strokeColor   = UIColor.whiteColor()
        fluidView.keepStationary()
        fluidView.startAnimation()
        fluidView.startTiltAnimation()
        self.view.addSubview(fluidView)
    }

Issue on adding a new BAFluidView to the same View

On adding a new BAFluidView to the same container view there is an issue where you can not animate it.

Other than that you work is great @antiguab 👍

Improvements you can do:

1. Add a variable to set the Wave Crest speed.
2. Add the Swift 5 version.

Option for wave length ?

Hello,
Thanks for your work. I would know if we can set a wave length (aka distance between 2 crests) for a fluid view ? Something similar to amplitude, but for x axis ?
Thank you

Create reverse fill out animation

Is it possible to achieve a fill out only animation or just a reverse fill starting from full fill to empty fill ?

Swift Implementation

Hi, I'm trying to implement this great lib on swift, by writing this code:

    let fluidView = BAFluidView(frame: self.view.frame, startElevation: 0.9)!
    
    fluidView.strokeColor = UIColor.green
    fluidView.fillColor = Constants.COLOR_BLUE
    fluidView.keepStationary()
    fluidView.startAnimation()
    
    self.view.addSubview(fluidView)

and here is the preview:

I've been changing the value of startElevation from 0.1 to 9000, but the height of wave didn't change. I want to achieve that the height of wave is 1/4 of the height screen.

Thank you.

Animation glitched after entering background

Hi!
Looks like the wave animation bugs out when the app goes in the background. You can reproduce the issue in the demo app in the simulator by getting back home and reopening the app. The vertical animation runs fine, but the crests are now fixed (the amplitude changes a bit, but they keep the same overall shape).

Improvements nice to have

Improvements you can do:

1. Add a variable to set the Wave Crest speed.
2. Add the Swift 5 version.

@antiguab 🥇

Orientation issues with tilt

I had a load of problems getting this to behave itself in an app locked to Landscape orientation. In the end I had to change:

In initialise()

• self.orientation = [[UIApplication sharedApplication] statusBarOrientation];
• [self updateRollAdjustmentBasedOnOrientation];
• self.orientation = [[UIDevice currentDevice] orientation];

In addTiltAnimations()
if((roll + self.rollOrientationAdjustment)< -1){
roll = -1 - self.rollOrientationAdjustment;
} else if((roll + self.rollOrientationAdjustment) > 1){
roll = 1 - self.rollOrientationAdjustment;
}

instead of roll = -1 / 1 respectively

I added a few extra sets for orientation and orientation factor but that probably isn't necessary.

Issue running pod install

Hey just want to let you know that doing just pod install on the Example folder triggered this error:

[!] Unable to satisfy the following requirements:

• BAFluidView (from../) required by Podfile
• BAFluidView (from../) required by Podfile
• BAFluidView (= 0.1.1) required by Podfile.lock

However, running pod update after solved it.

navigation issue

Doesn’t change frame during navigation transition

How to fill the view and keep the filler stationary ?

Thanks a lot for the pod, it looks great.

I am try to use this in one of my project where i want to use this as a progress view where the fluid fills out my view. I have tried

myView.fillAutoReverse = false and it doesnot work.

Can anyone please help me how to keep the filler stationary after it has made till 80% of the view ?

Little issue with Auto Layout

Hi, I'm trying to use AutoLayout to place the BAFluidView on my main view. I tried initializing using [[BAFluidView alloc] init] but got a Message from debugger: Terminated due to memory issue

This is my code now:

self.fluidView = [[BAFluidView alloc] initWithFrame:CGRectMake(0, 0, 100, 100);
self.fluidView.backgroundColor = [UIColor redColor];
[self.fluidView fillTo:@1];

[self.view addSubview:self.fluidView];

NSMutableDictionary *views = [[NSMutableDictionary alloc] init];
[views setObject:self.fluidView forKey:@"fluidView"];
self.fluidView.translatesAutoresizingMaskIntoConstraints = NO;

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-35-[fluidView]-35-|"
                                                                      options:0
                                                                      metrics:nil
                                                                        views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[fluidView]-100-|"
                                                                      options:0
                                                                      metrics:nil
                                                                        views:views]];

and this is the resulting fluidView: https://gfycat.com/VengefulRaggedIndianspinyloach

So my questions are:

1. Why does calling init result in a memory issue if there is no frame?
2. When I use AutoLayout, why does the elevation start at slightly above the halfway line and not from 0?

I'd really appreciate your help.
Immanuel

Glitch when using autolayout

Hi :)
I'm using BAFluidView with interface builder and autolayout, and I noticed a glitch when doing so:

http://d.pr/v/aR6

looks like the bezier path are computed at the starting size, but once autolayout resizes it to fit a bigger screen those values are no longer valid.

This sample shows the issue (you might need to hide the frontmost mask in IB, or just run it on your device and tilt it :) )

Any idea?

Thanks

Lagging on other animation started

I added BAFluidView to my screen and I use SWRevealViewController to menu navigation.
IF I started to swipe in the menu, the View animation starts to lagging until I release the pull.

Memory issue

After applications goes to background and returns to foreground BAFluidView causes memory issue and app crashes with error : Terminated due to memory issue . I thinks something strange is happening in getBezierPathValues method but ca't figure it out.

Can you please give some idea how to fix this?

Retain Cycle

There seems to be a retain cycle somewhere in the library. The memory spikes and then the application crashes (Swift 5.3).

Tilt Rotation not working

I send the notification and the breakpoints hit the correct lines in the tilt animation, but it just won't perform the animation. Any ideas?

Random Crash!

It seems like the app runs out of memory after a certain period of time.

Here is a console log:

malloc: can't allocate region
*** mach_vm_map(size=939524096) failed (error code=3) AppName
<img width="555" alt="Screenshot 2019-12-19 at 21 38 44" src="https://user-images.githubusercontent.com/3489125/71204297-7ae68800-22a8-11ea-855d-e5af690c9d16.png">
(7620,0x101ecebc0) malloc: *** set a breakpoint in malloc_error_break to debug

Reverse animation to 0

I am trying to animate the FluidView from top (1.0) to bottom (0.0)
On doing so, the FluidView just remains at the top, without any reverse animation.

I tried animating from 1.0 to 0.1, with a fillDuration of 7, but the FluidView just quickly animates to 0.1 in one second.

Here is the code for reference:

fluidView = BAFluidView(frame: fluidViewFrame, maxAmplitude: 25, minAmplitude: 20, amplitudeIncrement: 5, startElevation: 1.0)
fluidView.backgroundColor = LIGHTER_GRAY
fluidView.fillAutoReverse = false
fluidView.fillDuration = 7
fluidView.strokeColor = OFF_WHITE
fluidView.fillRepeatCount = 1
fluidView.fillColor = WHITE
fluidView.fill(to: 0.0)

Use accelerometer to influence fluid

It would be cool if the accelerometer was used to influence how to fluid behaves. I guess that would require some sort of physics simulation, but it would still be cool :)

Add speed field

Great API, I think you could add the option for the user easily to change the speed by changing the value 7 on verticalAnimation.duration inside the method fillTo to a variable that the user of the API could set.

iOS 10.3.1 fluid disappears

Hello I'm having a problem, when the application is in the background the liquid is disappearing. If anyone can help me. This happens in the version of iOS 10.3.1

RGB color with fillColor

There's an issue with using UIColor red green blue where there's no background, just the top outline.