Change Size handling, add IBDesignable support about nvactivityindicatorview HOT 8 CLOSED

Improvements in #26

• Respects size given in Interface Builder, by init(frame) and code
• Supports IBDesignable in Storyboard

I also replaced your call to super.backgroundColor with backgroundColor. Super is not needed here.

One caveat: IBDesignable does not support enums. I Implemented a wrapper allowing to set the Type by Int. See https://openradar.appspot.com/18224964 and http://stackoverflow.com/a/27435318/844907.

from nvactivityindicatorview.

Hi Winkelsdorf,

Supporting IBDesignable in Storyboard is what I intent to do. Now I made it. Great! Thanks for contribution 👍

Here is answer for your questions about size. It is used to specify different size for the animation layer instead of using view's itself. That gives a bit control of the padding and it is useful in my opinion.

About the caveat you mentioned above, if we are using a wrapper to set type, user has to set value like 1, 2, 3,... instead of .Pacman for example. It is not intuitive and we have to update the document if we want to give ease of use to user. What do you think? Any better way?

from nvactivityindicatorview.

Hi Nguyen,

you're welcome :)

Regarding type: I have another Idea. We might use a String-based approach.

    @available(*, unavailable, message="This property is reserved for Interface Builder. Use 'type' instead.")
    @IBInspectable var typeName: String {
        get {
            return self.type.rawValue
        }
        set (typeString) {
            let newType: NVActivityIndicatorType? = NVActivityIndicatorType(rawValue: typeString.lowercaseString)
            self.type = newType ?? self.type
        }
    }

One caveat with this: rawValue is case-sensitive (LineScale != linescale). This needs more work to support upper/lowercase combinations of the enum's name representation.

I am now testing an approach extending rawValue/RawRepresentable. I'll ping you when I'm ready. Not sure it will work.

Regarding size: I knew that you were going to say that ;) Well it might be useful in some cases, but in fact you are breaking Storyboard support and AutoLayout with the current approach.

I would say make it frame.size and let the users position it as usual with UIViews: The above view is responsible for positioning and size of the SubView.

Example: I set two different sizes for the Activity Indicator, based on Trait Collections:

No matter what I set as size in IB, without my change NVActivityIndicatorView will be 40x40 during runtime. I would say that's a bug and not common behavior.

Tip to get what you want, too: Any user can override the frame of NVActivityIndicatorView by simply setting it in code ;)

activityIndicatorView.frame.size, activityIndicatorView.bounds

So with my change you get

1. full Storyboard support for sizing and
2. allow manipulation of Indicator size by code.

That's the UIKit way.

By the way: Notice in the Screenshot the nice designable values for your component :)

One more thing: I'll need to check if we can set the default value to "On". Currently there's "Default, On, Off" for .hidesWhenStopped.

Cheers,
Frederik

from nvactivityindicatorview.

"Default Values"
Association in IB is not supported in the way I wanted. So there's still "Default, On, Off". But that's logical: Default means components default, On = explicitly on and Off = explicitly off.

String Name
Sadly enum does not conform to the SequenceType protocol, so enumerating over the values is not possible out of the box. Enum of type String does not allow case-insensitive init(rawValue:).

But this works:

public enum NVActivityIndicatorType: Int { 

    // add this to the enum, keep in mind to adjust last value, BallRotateChase, if enum case is added
    private static let allTypes = (Blank.rawValue ... BallRotateChase.rawValue).map{ NVActivityIndicatorType(rawValue: $0)! }

}

[...]

    @available(*, unavailable, message="This property is reserved for Interface Builder. Use 'type' instead.")
    @IBInspectable var typeName: String {
        get {
            return String(self.type)
        }
        set (typeString) {
            for item in NVActivityIndicatorType.allTypes {
                if String(item).caseInsensitiveCompare(typeString) == NSComparisonResult.OrderedSame {
                    self.type = item
                    break
                }
            }
        }
    }

Now we can set the animation type in IB case-insensitive to something like "ballscaleRipple" or "ballscaleripple" :)

Should I adjust my PR or will you integrate this on your own?

from nvactivityindicatorview.

Sure, please update your PR.

Regarding size, I think we can add padding property. By this way, view's size is determined by IB and animation layer's size is calculated automatically base on view's size and padding. That would satisfy both requirements :). Your thought on this?

from nvactivityindicatorview.

Sorry for the late reply.

Excellent idea with the padding! That would fit both use cases perfectly 👍

I quickly implemented a single CGFloat padding for all four sides (that is IBInspectable, too). If you need different padding for each of the four sides, please let me know. Tested the changes, working correctly even with padding.

Here we go: https://github.com/winkelsdorf/NVActivityIndicatorView/commit/66a2f58438e011d8e5bf5955568ed68ececf88f1 is included in my PR #26 now and ready to pull.

Feel free to update the Demo and Doc, if you like :)

Cheers,
Frederik

from nvactivityindicatorview.

👍

I think one common padding for 4 sides suffices.
Beside, I will add animation name in demo as I suggested earlier to make usage easier.

Thanks for helping improve this library :)

from nvactivityindicatorview.

You're welcome :) Thank you for creating this library!

To let you know how I use this: I use it on a custom splash screen on App launch when integrating database updates. The splash is based on launchScreen (added subView), I added a fancy logo zoom towards the User for an ImageView on the SubView, and a screen bounce for the initial View behind (both unrelated animations), while the Indicator is shown with a light color in lower position, just enough to be visible.

The activity Indicator is shown and hidden with alpha fading:

        if updatesAvailable {
            // Start Activity Animation
            UIView.animateWithDuration(0.75, delay: 0.15, options: [UIViewAnimationOptions.CurveEaseIn], animations: {
                self.activityIndicatorView.startAnimation()
                self.activityIndicatorView.alpha = 1
            }, completion: nil)

            // Run Activity from closure parameter
            // Note: This should block until finished but activity is threaded..
            activity()

            // Stop Activity Animation and
            delay(0.5) {
                UIView.animateWithDuration(0.75, delay: 0.50, options: [], animations: {
                    self.activityIndicatorView.alpha = 0
                    }, completion: {(finished: Bool) in
                        self.activityIndicatorView.stopAnimation()
                })
            }

            // Always show the Main View Controller
            delay(1.5) { // 0.25 sec before previous animation stops
                self.animateToMain(completion: completion)
            }
        } else {
            self.animateToMain(completion: completion)
        }

Probably a nice idea to add to startAnimation/stopAnimation, like startAnimation(fadeIn: Bool = false) and stopAnimation(fadeOut: Bool = false)?

Anyway, NVActivityIndicatorView fits perfect for this use case 👍

from nvactivityindicatorview.