Skip to content

agilestarskim/Midget

Repository files navigation

Midget

Mimic iOS Widget control system in swiftUI you can add, delete and move your own views

Screenshots

EDIT ADD REMOVE MOVE

Installing

It requires iOS 15

In Xcode go to File -> Swift Packages -> Add Package Dependency and paste in the repo's url:

https://github.com/agilestarskim/Midget.git

Usage

1. Import the package in the file you would like to use it

import Midget

2. Set Midget state

@State private var MidgetState = [   
        MidgetState("viewA", true),
        MidgetState("viewB", true),
        MidgetState("viewC", true),
        MidgetState("viewD", false),
        MidgetState("viewE", false)
]

What is a MidgetState?

  • This is an object for storing and managing the state of Midgets

What do I need to make a MidgetState?

  • id: Identifier string that can identify the view
  • isVisible: Bool value to set whether or not to show the view initially

3. Place MidgetController

var body: some View {
    MidgetController(MidgetState) {
    
    } onChange: { _ in
    
    }       
}

Place the MidgetController where you want it and pass the just created MidgetState to the constructor parameter.

4. Make Midgets.

What is a Midget?

  • A view that has an ID that can be added, deleted, and moved inside the Midget controller.

How to make the Midget?

  • simply
Midget("viewA") {
    VStack {
        Text("This is a Test Label")
    }
}

How to add?

var body: some View {
    MidgetController($MidgetState) {
        Midget("viewA") {
            //your view
        }
        Midget("viewB") {
            //your view
        }
        Midget("viewC") {
            //your view
        }
        Midget("viewD") {
            //your view
        }
        Midget("viewE") {
            //your view
        }            
    }   
}

5. Save the changed MidgetState.

What is the changed MidgetState?

  • When the user finishes editing and presses the done button, the edited result is returned to the onChaged closure.
var body: some View {
    MidgetController(MidgetState) {
        // your Midgets
    } onChange: { changedMidget in
        self.MidgetState = changedMidget
        //save it to your DB
    }       
}

As you may have noticed, the values of the key in the MidgetState in step 2 made and the identifier in the Midget must be the same.

6. Features

onTouch

  • When you click a Midget in the non-edit mode, call the closure.
Midget("viewA") {
    //your view
} onTouch: {
    print("viewA Touched")
}

Releases

No releases published

Packages

No packages published

Languages