DEV Community: Eon

FlowLayout - A minimal layout kit

Eon — Sun, 05 Aug 2018 13:30:41 +0000

Concept:

The idea is to give aspiring app developers a dead simple "vanilla" swift library to start with. Just add some end point calls to instagram and you could literally have a minimal insta client in a day.

Description:

I wanted to make a very responsive fluid app like instagram or snapchat. But using apples own app framework always ended up feeling kind of outdated and slow. The concept is really simple. It's just 1 horizontal UICollection and 1 vertical UICollection. The current version uses only 1 RootViewController. The CollectionViews are UIViews with delegate handlers. This makes it really easy to transition to another ViewController. And it also enables you to embed FlowLayout in pure UIView setups like an image picker or alike.

Pull to refresh:

Compact mode:

Swipe to new pages:

Links:

https://www.producthunt.com/posts/flowlayout

https://github.com/eonist/FlowLayout

Prototyping in playground

Eon — Mon, 31 Jul 2017 02:33:58 +0000

Prototyping UI/UX with XCode Playground and Animator a new animation .framework I'm building. The best part? You get native code you can use when building your apps. And it's OpenSource . Check out the examples bellow:

7. Let's add some design to it:

6. Peek & Pop is now complete (added dismiss):

5. Modal now remains idle if in prompt state:

4. Modal now reveals prompt buttons:

3. Modal now has boundaries w/ log10 (aka slippery friction):

2. Modal is now draggable w/ easing:

1. Deep click button to activate peek:

Prerequisites: (Figure out how ForceTouch works)

Resources:

Using Framework files in playground

This article was originally published on my blog http://eon.codes

ForceTouch in macOS

Eon — Wed, 26 Jul 2017 12:30:05 +0000

Here are some handy snippets when dealing with ForceTouch in macOS:

Event handler:

var prevStage = 0
override func pressureChange(with event: NSEvent) {
    let curStage:Int = event.stage
    if event.pressureBehavior == NSPressureBehavior.primaryDeepClick,prevStage != curStage {
        switch (curStage,prevStage){
            case (0,1):
                Swift.print("from idle to clickStage")
            case (1,0):
                Swift.print("from clickStage to idle")
            case (1,2):
                Swift.print("from clickStage to deepClickStage")
            case (2,1):
                Swift.print("from deepStage to clickStage")
            default: break;//isn't possible
        }
        Swift.print("stageChange")
        prevStage = curStage/*always set prevStage to curStage on stage change*/
    }
    Swift.print("pressureChange")
}

Normalize the pressure:

/**
 * NOTE: calculates the entire range of the stage pressures so from stage 0 to 1 the pressure goes from 0 to 0.5 and from stage 1 to 2 the linear pressure goes from 0.5 to 1 this makes it easier to scale things in a linear fashion from 0 to 1 in the entire stage range
 */
var linearPressure:CGFloat{
    if event.stage == 0 {
        return 0
    }else if event.stage == 1{
        return pressure / 2
    }else /*if stage == 2*/ {
        return 0.5 + (pressure / 2)
    }
}

UI provided by https://github.com/eonist/Element