Protoyping-Project WallAngle - With this App, you can measure the angle without searching for tools and calculations

Overview

Protoyping-Project_WallAngle

YouTube


Logo

This is the App that I made for the Prototyping Project, it can be used to measure the angle between two walls.
Explore the docs »

View Demo · Report Bug · Request Feature


Table of Contents
  1. About The Project
  2. Getting Started
  3. Usage
  4. Project Roadmap
  5. Contributing
  6. Contact
  7. Acknowledgments

About The Project

With this App, you can measure the angle without searching for tools and calculations. From phyphox, I have learned that the sensors in my phone can be used to do a lot. For example, gyroscope is used for measuring or maintaining orientation and angular velocity. Magnetometers can be used for measuring the strength and sometimes the direction of magnetic fields, including those on or near the Earth and in space. Magnetometers are also used to calibrate electromagnets and permanent magnets and to determine the magnetization of materials. So we want to export these data from the phone, and analyse them.



(back to top)

Built With

This section includes major frameworks/libraries used in my project.
There are some helpful tutorials can be found in the Acknowledgements section.
Some of useful libraries and tools that are not used in this final App, are also documented in the Roadmap section.

(back to top)

Getting Started

This post is mostly about the SwiftUI side of the measurement function. The main part of this tutorial will be

  • Getting the rotations and padding correct
  • Having the testing processes correct
  • Giving an alert and blocking with UIDeviceOrientation when the phone is not being hold horizontally
  • Implement the App on your iphone 🎉

Prerequisites

  1. Having your iphone with magnetometer sensor working well, you can check with your Compass app to see if the results are acceptable.
  2. Create an Apple Developer account

Build the WallAngle App

  1. Install Xcode from App Store, it takes longer than installing other Apps.
  2. Create a new Xcode Project
  1. Choose a template for App
  1. Then you will have an empty tempalte for your App with ContentView

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, world!")
            .padding()
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

  1. Replace the above code with my ContentView code. Explanations are comments in between the codes.

🛠️ Capsule I use Capsule view to show direction where my phone is facing.

                Capsule()
                    .frame(width: 5, height: 70)
                    .foregroundColor(.orange)

🛠️ rotationEffect(_:anchor:) The rotationEffect will rotate the second Capsule so that the marker view is at the correct angle.

                    Capsule()
                        .frame(width: 5, height: 70)
                        .foregroundColor(.blue)
                        .rotationEffect(SwiftUI.Angle(degrees: self.compassHeading.degrees-Wall1), anchor: .bottom)

🛠️ magneticHeading Core Location provides services that determine a device’s geographic location, altitude, and orientation, or its position relative to a nearby iBeacon device. The framework gathers data using all available components on the device, including the Wi-Fi, GPS, Bluetooth, magnetometer, barometer, and cellular hardware.

magneticHeading is used to measure the heading (measured in degrees) relative to magnetic north.

We need to create a new file called CompassHeading.swift and write the following code to it:

import Foundation
import Combine
import CoreLocation

class CompassHeading: NSObject, ObservableObject, CLLocationManagerDelegate {
    var objectWillChange = PassthroughSubject<Void, Never>()
    var degrees: Double = .zero {
        didSet {
            objectWillChange.send()
        }
    }
    
    private let locationManager: CLLocationManager
    
    override init() {
        self.locationManager = CLLocationManager()
        super.init()
        
        self.locationManager.delegate = self
        self.setup()
    }
    
    private func setup() {
        self.locationManager.requestWhenInUseAuthorization()
        
        if CLLocationManager.headingAvailable() {
            self.locationManager.startUpdatingLocation()
            self.locationManager.startUpdatingHeading()
        }
    }
    
    func locationManager(_ manager: CLLocationManager, didUpdateHeading newHeading: CLHeading) {
        self.degrees = -1 * newHeading.magneticHeading
    }
}

🛠️ UIDeviceOrientation

🛠️ Layout Containers

(back to top)

Usage

When using this app, you should keep holding the phone HORIZONTALLY, otherwise the measurement function will be blocked by UIDeviceOrientation. Try to use the top side of the phone to touch the wall surfaces, as there is no buttons which might cause inaccuarcy.

For more details, please refer to the Video

(back to top)

Project Roadmap

  • KivyApp
  • Built with SwiftUI, without the alert information and the blocking functions to ensure the phone is holding horizontally
  • Adding alert information and the blocking functions to ensure the phone is holding horizontally
  • Adding a colored bar to show the user to touch the wall surfaces with the top side of the phone, so that the results will not be affected by the button
  • Communications
  • ...

See the open issues for a full list of proposed features (and known issues).

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

(back to top)

Contact

Yuening Hong - [email protected]

Project Link: https://github.com/Ferkelcode/Protoyping-Project_WallAngle

(back to top)

Acknowledgments

(back to top)

You might also like...
You can dismiss modal by using gesture
You can dismiss modal by using gesture

RPModalGestureTransition You can dismiss modal by using gesture. Usage 1.Define animation You define animator class inherits UIViewControllerAnimatedT

Each step you take reveals a new horizon. You have taken the first step today.
Each step you take reveals a new horizon. You have taken the first step today.

The story Seeing the animations behind Paper, or the transitions behind Mail, being in a world of flat design and transitions, user interaction, app b

WifiView Pod can animate wifi signal strength
WifiView Pod can animate wifi signal strength

WifiView WifiView is animateable UIView that can significantly enhance your users’ experiences and set your app apart from the rest of the pack. It is

A lightweight loading animation that can be applied to any SwiftUI view with 1 line of code.

SimpleAFLoader A lightweight loading animation that can be applied to any SwiftUI view with 1 line of code. All animations are built using the SwiftUI

Project 04 I created for
Project 04 I created for "iOS & Swift - The Complete iOS App Development Bootcamp"

Magic 8 Ball This is the fourth project I created for "iOS & Swift - The Complete iOS App Development Bootcamp" Our Goal The objective of this challen

Letters animation allows you to click on different letters and accordingly it will animate letters in a cool way. It has a very attractive UI and is very easy to use.
Letters animation allows you to click on different letters and accordingly it will animate letters in a cool way. It has a very attractive UI and is very easy to use.

Letters Animation Cool Letters Animation in iOS written in Swift. Preview Table of content :- Description How to add in your project Requirement Licen

Numbers animation allows you to click on different numbers and accordingly it will animate numbers in a cool way. It has a very attractive UI and is very easy to use.
Numbers animation allows you to click on different numbers and accordingly it will animate numbers in a cool way. It has a very attractive UI and is very easy to use.

Numbers Animation Cool Numbers Animation in iOS written in Swift. Preview Table of content :- Description How to add in your project Requirement Licen

Reading animation allows you to click on the different page numbers and accordingly it will animate page changes in a cool way. It has a very attractive UI and is very easy to use.
Reading animation allows you to click on the different page numbers and accordingly it will animate page changes in a cool way. It has a very attractive UI and is very easy to use.

Reading Animation Cool Reading Animation in iOS written in Swift. Preview Table of content :- Description How to add in your project Requirement Licen

Presentation helps you to make tutorials, release notes and animated pages.
Presentation helps you to make tutorials, release notes and animated pages.

Presentation helps you to make tutorials, release notes and animated pages.

Owner
null
Tools for SwiftUI that helps perform Path and Shape animations, such us morphing circle or shape transformations

SwiftUI+PathAnimations ?? Introduction This packages contains SimilarShape and InterpolatedShape, both can be used to achieve shapes animations with S

Alfredo Delli Bovi 180 Dec 29, 2022
CCMRadarView uses the IBDesignable tools to make an easy customizable radar view with animation

CCMRadarView CCMRadarView is a simple to use view that uses the new IBDesignable and IBInspectable features of XCode6 to easily configure the icon in

Carlos Compean 183 Sep 17, 2022
MGFlipView allows to create flipping view in easy way without worrying about flipping animation and flipping logic.

MGFlipView About If you are looking for an easy way of implement 3D flipping view, you are in the right place. MGFlipView allows to create flipping vi

Maciej Gomółka 47 Sep 28, 2022
Get a remote image's size and type without downloading the full image

FastImage FastImage 2.0 is an Swift port of the Ruby project by Stephen Sykes. It's directive is to request as little data as possible (usually just t

Kyle Hickinson 64 Sep 2, 2022
A UICollectionViewLayout subclass that adds custom transitions/animations to the UICollectionView without effecting your existing code.

AnimatedCollectionViewLayout Normally a UICollectionView has no transition effects when you scroll from one item to another. There are lots of ways to

Jin Wang 4.5k Jan 1, 2023
Build complex, conducted animations declaratively without manually managing state.

Maestro Build complex, conducted animations declaratively without manually managing state. Code struct AnimatedPieChart: View { private enum Trim

Ryan Wachowski 5 Nov 20, 2022
Chain multiple UIView animations without endlessly nesting in completion closures.

⛓ Chain multiple UIView animations without endlessly nesting in completion closures. Used in some of the more superfluous animations in the OK Video app.

Pim 78 Dec 26, 2022
Poi - You can use tinder UI like tableview method

Poi You can use tinder UI like tableview method Installation Manual Installation Use this command git clone [email protected]:HideakiTouhara/Poi.git Imp

null 65 Nov 7, 2022
Design-system-demo - This example code is bare-bones to show you what this framework can do

Basic Style Dictionary This example code is bare-bones to show you what this fra

Tylen St Hilaire 0 Feb 3, 2022
jasu 29 Dec 20, 2022