DEV Community: Midhet Sulemani

Cloud Firestore DB with Swift

Midhet Sulemani — Sat, 01 May 2021 15:13:18 +0000

As most mobile application developers I have encountered in my experience, have a basic understanding and experience in connecting and implementing a basic database structure and design for an application prototype or a side project they might be working on. But as for me, who switched from front end web development to developing apps in Swift, I didn't have a clue on connecting databases to build a working application with web services.

After a lot of begging my backend dev friends to make databases for me and getting a lot of annoyed rebuttals, I decided to take matters into my own hands. I discovered how to use Cloud Firestore for designing my own database and web services. An overview on getting started here

Since Cloud Firestore is based on a NoSQL database, you can use the service as a data dump, but also add some structure if you'd like. A little bit of understanding of terminology between SQL and NoSQL databases and how you could turn a NoSQL database into a relational one.

An explanation on how this will work out:

Let's take an example of a database of Cars and their owners in a City/Administrative region.

Cars have information on their owner, model and license plate number. Owners have their id, name and email/contact.

The following image will show this design in a Relational Database:

The next image is a translation of the same design in a Cloud Firestore DB:

To learn more and get a sense of the working of Firestore and its queries, you could try out this codelab

Apologies for my handwriting in the DB Images. Hope you understood what I was trying to say. That's all for this blog!

XML Parsing in Swift

Midhet Sulemani — Thu, 22 Apr 2021 12:25:33 +0000

A few years ago I had tried to look for some resources to parse XML in Swift for an interview test that I had received, without avail. Now I know this isn't the most common or developer friendly solution for parsing web service data but more often than not, due to security and other business decisions, the web and mobile developers need to find their own solutions towards parsing issues 😂

So here's a simple parsing tutorial to parse XML in your Swift Data Models. Download the starter project from here

In this project we will be going over multilevel XML documents which will map into our array of data models. Will also be learning Cat Facts!

In the starter project we will first add these three variables:

var xmlDict = [String: Any]()
var xmlDictArr = [[String: Any]]()
var currentElement = ""

xmlDict is going to keep a record of the current parsed element. xmlDictArr is going to keep a record of any arrays of objects that you may encounter while parsing. currentElement will tell you the name of the element being parsed.

In the starter project, you will see a XML response file called catfacts.xml. We will be using this response file to display the cat facts in the Label. Let's populate the loadCatFacts() method with:

let xmlResponseData = Bundle.main.getFileData("catfacts.xml")
let parser = XMLParser(data: xmlResponseData)
parser.delegate = self
parser.parse()

We need to add the protocol XMLParserDelegate to the ViewController class for implementation of our parsing methods.

The first method in the protocol will be:

func parser(_ parser: XMLParser, didStartElement elementName: String, namespaceURI: String?, qualifiedName qName: String?, attributes attributeDict: [String : String] = [:]) {
    if elementName == "element" {
        xmlDict = [:]
    } else {
        currentElement = elementName
    }
}

In this method we will be notified of the start of the process and the start of each element tag.

The second method will be as follows:

func parser(_ parser: XMLParser, foundCharacters string: String) {
    if !string.trimmingCharacters(in: .whitespacesAndNewlines).isEmpty {
        if xmlDict[currentElement] == nil {
               xmlDict.updateValue(string, forKey: currentElement)
        }
    }
}

In this method, we are notified of the values of the element tag through the parameter of string

The third method is as follows:

func parser(_ parser: XMLParser, didEndElement elementName: String, namespaceURI: String?, qualifiedName qName: String?) {
    if elementName == "element" {
            xmlDictArr.append(xmlDict)
    }
}

This method is called on encountering the closing tag of an element. Whether it is the current element or not, is for us to judge.

The last method that we need to use is as follows:

func parserDidEndDocument(_ parser: XMLParser) {
     parsingCompleted()
}

This method is called when the complete document has ended and the parser has encountered a closing root tag.

In the parserDidEndDocument method we can call our user defined method where we map the dictionary we have created into the data model we require. So the parsingCompleted() method will be written like so:

func parsingCompleted() {
    self.facts = self.xmlDictArr.map { Fact(details: $0) }
    self.updateUI()
}

The last step towards the completion of this project will be tying up the loose ends.

This will be done by customizing the init() call in out data model struct:

init(details: [String: Any]) {
    id = details["_id"] as? String ?? ""
    fact = details["text"] as? String ?? ""
}

And by adding the updateUI() method in the factButton @IBAction outlet.

Now Build and Run and let the magic unfold!

Hope you're doing the Happy Dance along with me!

If you would need any help, the complete project is linked here

Core Animations in Swift

Midhet Sulemani — Mon, 19 Apr 2021 16:17:41 +0000

Apple's documentation says that: Core Animation provides high frame rates and smooth animations without burdening the CPU and slowing down your app. Most of the work required to draw each frame of an animation is done for you. You configure animation parameters such as the start and end points, and Core Animation does the rest, handing off most of the work to dedicated graphics hardware, to accelerate rendering.

The main difference between UIView animations and Core Animations is that UIView animations animate the whole view whereas Core Animations have the ability to animate each sublayer of the UIView.

You can find all the various types of animations enabled by Core Animation in iOS here.

Let's continue with adding a Core Animation to the TODO Application we built in the previous post of this series, or you can find the starter project here.

We are going to build a live color changing gradient animation to the Add ToDo button.

Let's create a method called animateGradient() in NewTodoViewController.swift.

Add the following code in the method:

func animateGradient() {
    // cycle through all the colors, feel free to add more to the set
    if currentGradient < gradientSet.count - 1 {
        currentGradient += 1
    } else {
        currentGradient = 0
    }

    // animate over 3 seconds
    let gradientChangeAnimation = CABasicAnimation(keyPath: "colors")
    gradientChangeAnimation.duration = 3.0
    gradientChangeAnimation.toValue = gradientSet[currentGradient]
    gradientChangeAnimation.fillMode = CAMediaTimingFillMode.forwards
    gradientChangeAnimation.isRemovedOnCompletion = false
    gradientChangeAnimation.delegate = self
    gradient.add(gradientChangeAnimation, forKey: "gradientChangeAnimation")
}

And now you have created your first Core Animation!

Core Animation is a very powerful library and you can do almost all the animations your heart desires. So get a move on and explore the full potential of Core Animations!

That's it for this series on animations and stay tuned for more tips and tricks in iOS :)

UIView Animations in Swift

Midhet Sulemani — Wed, 14 Apr 2021 15:10:06 +0000

Apple's documentations says that: Changes to several view properties can be animated—that is, changing the property creates an animation starting at the current value and ending at the new value that you specify.

The following properties of the UIView class are animatable:

frame: position of the view with respect to it's superview
bounds: position of the view with respect to it's own view
center: center point of the view with respect to it's superview
transform: size of the view and its orientation in the superview
alpha: opacity of the view
backgroundColor

These are some of the basic animation functions provided by Swift as an extension to UIViews:

/* Animate changes to one or more views using the specified duration, delay, options, and completion handler. */

class func animate(withDuration: TimeInterval, delay: TimeInterval, options: UIView.AnimationOptions, animations: () -> Void, completion: ((Bool) -> Void)?)

/* Animate changes to one or more views using the specified duration and completion handler. */
class func animate(withDuration: TimeInterval, animations: () -> Void, completion: ((Bool) -> Void)?)

/* Animate changes to one or more views using the specified duration. */
class func animate(withDuration: TimeInterval, animations: () -> Void)

Let's start with a simple TODO application and traverse through all these animations

You can download the starter project from here.

Our first task is to animate the welcome labels to behave like this:

In the animateEachLabel() function, we want to animate our welcome message.

@objc func animateEachLabel() {
    UIView.animate(withDuration: 1.5, animations: {
        self.welcomeLabel.frame.origin.x = 20
    }) {_ in
        UIView.an animate(withDuration: 1.5) {
            self.nameLabel.frame.origin.x = 20
        }
    }
}

We have nested one UIView.animate within another because we want the effect of an animation starting on the completion of other. This is also called as animation chaining.

The next animation will be a task checking animation in which will be animating the alpha of the button's image. This will also be combined with a checking/unchecking toggle as below:

@IBAction func checkingBox(_ sender: UIButton) {
    UIView.animate(withDuration: 0.2, animations: {
        sender.alpha = 0
    }, completion: {_ in
        UIView.animate(withDuration: 0.2, animations: {
            sender.isSelected = !sender.isSelected
            sender.alpha = 1
        })
    })
}

The next animation we will accomplish is a material design tabs behavior

We will be using a horizontal scroll view and it's delegate for creating an effect on the horizontal swipe.

Add this code to your TodoListViewController

//Make an outlet for your scrollview
@IBOutlet weak var pagingScroll: UIScrollView!

//Add this line in your viewDidLoad
pagingScroll.delegate = self

//Add the following functions
func scrollViewDidScroll(_ scrollView: UIScrollView) {
    let pageIndex = round(scrollView.contentOffset.x/view.frame.width)
    let arrayIndex = Int(pageIndex)
    underlineLabel.center.x = getDraggablePoint(scrollView: scrollView)
    underlineLabel.frame.size.width = todoCategory[arrayIndex].intrinsicContentSize.width
}

func getDraggablePoint(scrollView: UIScrollView) -> CGFloat {
    let progress = scrollView.contentOffset.x / (scrollView.contentSize.width - scrollView.bounds.size.width)
    let minPoint = todoCategory.first?.center.x ?? 0
    let maxPoint = todoCategory.last?.center.x ?? 0
    let pathValue = maxPoint - minPoint
    return (pathValue * progress) + minPoint
}

The getDraggablePoint method is going to calculate the center point of your label in the scrollview and figure out its own offset.

The UI setup of the buttons in the scrollview are given in the starter project.

You'll see that nothing is working on the click of the button, the code we wrote above is to facilitate the moving of the underline on swiping in through views.

To make the animation work on clicking of the button, add this code to the outlet of your buttons:

@IBAction func selectTodo(_ sender: UIButton) {
    //Calculating offset of the underline
    let contentOffsetPoint = sender.tag * Int(self.view.frame.width)

    //Automatically scrolling the scroll view and underline with animation
    UIView.animate(withDuration: 0.75) {
        self.pagingScroll.setContentOffset(
        CGPoint(x: contentOffsetPoint, y: 0), animated: false)
    }
}

To see your beautiful animations in action, Build & Run!

Hope you enjoyed this tutorial, will be back with the Core Animation one soon!

Animations in Swift

Midhet Sulemani — Mon, 12 Apr 2021 16:57:47 +0000

I believe that an attractive design helps users take the initial step of choosing your application from its competition. It does not really matter what your product is, there are so many frameworks/libraries that help you to create great animations these days.

Although you can always use a third party library to do all the animations in your application, having a good foundation of inbuilt libraries is always a plus so you can have the tools to customize your animations and accomplish your vision.

Swift has a powerful background setup for you to fulfill all your design dreams and it also backs it up by having the best in industry graphics support in all its devices.

I have divided all the animations I have learnt into 2 parts:

UIView Animations
Core Animations

Let's morph our animation skills in Swift from Rachel to Grizzly! 😅

iOS Developer Journey

Midhet Sulemani — Mon, 27 Jul 2020 09:43:20 +0000

I am an iOS Developer currently, have been experienced with Swift and MVC architecture for around 4 years now. Worked on a few small scale full stack projects for a year before that. I just wonder what my next steps should be like? I want to get hired by a well known brand which allows me to explore other areas of a product like UX and design, maybe marketing as well. Is this the right way to go? Or should I be looking for something in the places I apply to?

Real-time Geo Location Updates for IOS

Midhet Sulemani — Thu, 02 Jul 2020 17:40:42 +0000

Any help on how to make a real time update system for location tracking the way we track our Uber/Lyft rides in Swift?

Ways of testing on various iOS versions

Midhet Sulemani — Thu, 28 May 2020 12:54:46 +0000

What do you people usually do to test your application/update on various versions of iOS before submission or release?

Tags in Swift UIViews

Midhet Sulemani — Mon, 02 Mar 2020 08:21:03 +0000

Is using tag in your UIView to store the state of the UIView a bad practice?

Fetching data with Core Data

Midhet Sulemani — Wed, 13 Nov 2019 14:18:32 +0000

I am here with another Core Data tutorial, this will be about fetching data from our database, and we will use the same project that we used in the previous tutorial to show a single contact on the screen.

If you haven’t read the previous tutorial, you can check that out here.

This will be a relatively short tutorial, but it is a bit complicated if you’re a beginner, so hang in there…

We will now make a new screen to display a single contact’s information and we will create a segue from our Contacts Table View Controller to the new ViewController. You should add some identifier to the segue, since we will need it. I have named mine “gotoSingleContact”

Now, we will pick another function from the UITableViewDelegate protocol, which is called didSelectRowAt function

In that function we will write a block of code which will fetch our contact through it’s first name.

Note: Since the scope of my project is smaller, I have not used a userId in this case, but if you feel like adding a userId to properly distinguish between two contacts, you could do that.

Now, back to our didSelectRowAt function:

override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {

        let fetchRequest = NSFetchRequest<NSFetchRequestResult>(entityName: "Contact")
        if let contactFirstName = allContacts[indexPath.row].firstName {
            let predicate = NSPredicate(format: "firstName = %d",
                                        argumentArray: [contactFirstName])
            fetchRequest.predicate = predicate
        }

        do {
            if let contacts = try helper.context.fetch(fetchRequest) as? [Contact],
                let selectedContact = contacts.first {
                performSegue(withIdentifier: "gotoSingleContact", sender: selectedContact)
            }
        } catch {
            print("No contacts found")
        }
    }

As you can see, we have added a performSegue function call in the didSelectRowAt function. Our purpose here will be that when we select the particular cell, the fetch request will fetch the single contact and pass its value over to the new screen.

So, we will call a prepareForSegue function here:

override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "gotoSingleContact" {
            if let nextVC = segue.destination as? DisplaySingleContactViewController,
                let selectedContact = sender as? Contact {
                nextVC.selectedContact = selectedContact
            }
        }
    }

Note: I have been having some problems with my Xcode lately, so haven’t been able to test this thoroughly. Anyway, if you get stuck somewhere or come across some bug, please comment below. You could also raise any issue in the GitHub project linked below.

Additional tips: Fetching for core data is one of the uses of NSPredicates, but NSPredicate is a very powerful class and can be used to filter and classify for a lot of other purposes in Swift as well. If you would like to know about NSPredicates in CoreData further, please comment below, or you can read about the scope of NSPredicates in Swift in the Apple Documentation.

The completed project for this tutorial is linked here.

Getting Started with Core Data

Midhet Sulemani — Tue, 12 Nov 2019 11:49:10 +0000

After elaborating on both sides of Core Data and SQLite in my previous post, let's start with using the Core Data library in Swift.

We'll be making a simple contact list application to store all your contacts in one place.

Starting with a new project with a Single View Controller and made a new UINavigationController with root view controller and dragged another View Controller into the app.

After adding some custom Views in the app and now the storyboard looks like this:

The link to the starter app will be posted here.
Now create a new file and set it to Data Model

Name it whatever you’d like and describe the model as given below. I have made this in accordance with the UI that I have structured, but you can make a different UI with a different description of your Model. If you have any other fields, don’t forget to add them in every piece of code as we go further.

Pro tip: You can add and select an image for your contact. The datatype should be set to Binary Data and the data of the image should be stored in this field.

With the Entity Name highlighted, go to the Data Model Inspector and change the property of Codegen under Class from Class Definition to Manual/None

Move to the Editor Tab in Xcode and click on Create NSManagedObjectSubclass which will result in the creation of 2 files namely: CoreDataClass.swift and CoreDataProperties.swift

Add this convenience initializer code in the CoreDataClass.swift:

convenience init(first: String, last: String, email: String, phone: Int64, context: NSManagedObjectContext) {
    if let ent = NSEntityDescription.entity(forEntityName: "Contact", in: context) {
        self.init(entity: ent, insertInto: context)
        self.firstName = first
        self.lastName = last
        self.emailId = email
        self.contactNumber = phone
    } else {
        fatalError("Unable to find Entity name!")
    }
}

This code works on initialization of the Core Data Model instance by setting all the fields through a function call.

Coming back to the Storyboard, we will first configure the save function in the Add Contact Page.

Prepare all the outlets and actions like so:

You will need to add two more files namely CoreDataStack and CoreDataHelper which are linked in the gist below:

Make an instance of the CoreDataHelper class in the save action:

let helper = CoreDataHelper()

Initialize an instance of the Core Data Model ‘Contact’

guard let newContact = NSEntityDescription.insertNewObject(
            forEntityName: "Contact",
            into: helper.context) as? Contact else { return }
newContact.firstName = firstNameTF.text
newContact.lastName = lastNameTF.text
newContact.emailId = emailTF.text
newContact.contactNumber = Int64(contactTF.text ?? "0") ?? 0

Also, remember to import Core Data in all the files where we use Core Data function and object instances such as this one.

Add a do-catch handler to save the instance in the database

do {
    try helper.context.save()
    print("saved user")
} catch {
    print("error in saving context")
}

The next step is to fetch the data from the offline graph and present it in our ContactTableViewController.

Fetch all the contacts stored in the database, make a function out of it and call it in the viewDidAppear function.

let helper = CoreDataHelper()
let fr = NSFetchRequest<NSFetchRequestResult>(entityName: "Contact")
do {
    if let contactList = try helper.context.fetch(fr) as? [Contact] {
        allContacts = contactList
        tableView.reloadData()
    }
} catch {
    print("Could not read contact fetcher")
}

Declare the allContacts variable in the class definition like so:

var allContacts: [Contact] = []

Number of rows should be returned as allContacts.count, keeping the number of sections as default.

Next, we will configure the cell for the custom view.

To customize the cell, we will make a UITableViewCell class like so:

Then add the following code into the cellForRowAt function:

cell.showData(cellData: allContacts[indexPath.row])

Add this to your fetchAllContacts function after fetching the contacts:

tableView.reloadData()

We’re almost done! Just need to wire up the Add Contact Segue.

For the segue, Ctrl+Drag the Add Bar Button to the AddContactViewController and Select the Show Option.

Now the AddContactViewController will be pushed and popped like a new page.

You can download the complete project from here.

Advanced Challenge: Try to make a new page and fetch a single contact on selection in the UITableViewController. (Hint: Use NSPredicate to write a small filter query on the basis of a unique field in the Contact Model)

Stay tuned for the next post on fetching data through a filter and versioning in core data! :)

Core Data vs. SQLite

Midhet Sulemani — Wed, 06 Nov 2019 14:28:42 +0000

Making an iOS application is all fun until you have to start maintaining offline user sessions and preferences on the app. Then comes the age old question.

Core Data/SQLite or something else?

So I want to share some of my insights on the topic.

Let’s start with Core Data,

Graph framework for maintaining objects and their relationships with each other.
Stores its data into a SQLite DB but is not a database in itself.
Manages and updates objects automatically in the memory. Can handle a complex graph of objects without any pressure/load on the memory management system of the device.
Has object versioning system in place which lets you update the object entities and attributes without deleting the previous data.
Is an Apple created framework, so is automatically updated with any updates in Swift. And now for SQLite,

SQLite is a persistent database model, which make a database and stores it in the file management system of your phone’s application.

It could be used for more lightweight models since its memory management will be dependent on the CocoaPods or Frameworks that have been used.
SQLite Pods or third party providers are easier to use and easier to grasp.
Can be created and updated just by writing a few custom queries. There are many Pods for SQLite in the market but one of the most popular and most stable is SQLite3.

There are pros and cons to both the frameworks and it all depends upon your requirements.
If you have enough time to configure a data persistence system, do dig into the Core Data option too.

There is another newer and faster option on the internet called Realm. I can’t really comment on it since I haven’t worked with it. It supports most platforms like Android, Swift, ObjC as well as React Native.

Since there are not many Getting Started with Core Data tutorials that I have come across, So I will be making one myself!