How to Format Data, and improve UX in Swift? - Part One

Note: If you are a beginner and you find it difficult to understand things written in this article. Feel free to ask questions in the Comment section.

Remember, you can do it. ; )

---

You are into iOS Development for years, or maybe you are a fresher. It doesn’t matter until you don’t do your job the right way. User Experience is an essential thing in developing applications.

Your UX guy can give you an idea of providing ease of use and understanding in your applications, but for that, you should know how things work in Swift and what are the API’s you can use to accomplish a behaviour.

How does Data Formatting help?

Well, It helps a user find the proper meaning of the data without much thinking, and hence providing ease of understanding helps in ease of use of an application.

So, let’s learn it the right way.

Relative Date Formatting

You must have seen in many apps that dates are formatted in “2 minutes ago” or “1 week ago”; It’s so easy for a user to evaluate the meaning by just looking at it.

How do we do that?

Before iOS 13, it was a difficult job, and we would have required to write a separate function to get such a result. But, In iOS 13, we can do so much better. Let’s dive into the code and let me show you the easiness of formatting Dates.

// Creating a date of 2 weeks earlier.
let date = Calendar.current.date(byAdding: .weekOfYear, value: -2, to: Date())!
// Create Formatter
let relativeFormatter = RelativeDateTimeFormatter()
// Get the Formatted String
let dateString = relativeFormatter.localizedString(for: date, relativeTo: Date())
// Print
print(dateString) // 2 weeks ago

You can copy this code and test it in the playground. It’s so easy, but very few of us are doing it.

RelativeDateFormatter was introduced in WWDC 2019, and with that came a List Formatter as well, which we will be learning next. The formatter giving back the string is localized, which is a plus point for us as we don’t have to handle anything here in terms of localization. You can make more modifications to the way you see your relative date output. Try modifying unitsStyle property of RelativeDateFormatter object.

RelativeDateFormatter is not available iOS 12. But, WWDC 2020 is near, and we will be having iOS 14 soon in our hands (at least the beta), and soon many of us will be dropping support for iOS 12. For the people who aren’t, you can always depend on the if-else statement, but you must start using these new API’s and keep exploring. Remember, it can be your next interview question.

List Formatting

ListFormatter was also introduced in WWDC 2019, and it’s as simple as the one we discussed above.

ListFormatter is like the joined(separator: String = ““) -> String , but more powerful.

Let me show you how it’s better.

let stringCollection = ["US", "UK", "Canada"]

let listFormatterString = ListFormatter.localizedString(byJoining: stringCollection)
print(listFormatterString) // Output: US, UK, and Canada

let joinedString = stringCollection.joined(separator: ",")
print(joinedString) // Output: US,UK,Canada

The output is mentioned as a comment in the code above.

The spacing and conjunction matter when a user is reading it. We Programmers eventually don’t find it difficult even if space or conjunction is missing. We can always relate, but users are different; they need something easy for them to process.

But, what’s so powerful about it?

For that, we’ll need another example.

import Foundation

//Ignore : Start
struct DateCollection {
    
    static func getDates() -> [Date] {
        var dates: [Date] = []
        
        let currentCalendar = Calendar.current
        dates.append(currentCalendar.date(byAdding: .minute, value: -30, to: Date())!)
        dates.append(currentCalendar.date(byAdding: .hour, value: -2, to: Date())!)
        dates.append(currentCalendar.date(byAdding: .day, value: -3, to: Date())!)
        dates.append(currentCalendar.date(byAdding: .weekOfYear, value: -1, to: Date())!)
        
        return dates
    }
}
//Ignore : End


let dates = DateCollection.getDates()

let listFormatter = ListFormatter()
let dateFormatter = DateFormatter()
dateFormatter.dateStyle = .medium

listFormatter.itemFormatter = dateFormatter
let listFormatterString = listFormatter.string(from: dates)!
print(listFormatterString) // Output: Jun 10, 2020, Jun 10, 2020, Jun 7, 2020, and Jun 3, 2020

DateCollection here is to help us generate some dummy dates to test our data and store it in the dates variable.

Next, I have created a ListFormatter & DateFormatter object to demonstrate the power of ListFormatter.

Here comes the magic listFormatter.itemFormatter = dateFormatter .

DateFormatter helps ListFormatter format its inner values; the value here is the date objects.

You can use any type of formatter in the place of dateFormatter *depending on the value*

The output mentioned next to the print statement is the output we get in our current code.

Feel free to modify the code by copying this code in your playground and try changing the dateStyle, or define a custom dateFormat.

It’s not over yet

In the next article, we will be exploring more types of Data Formatting.

I hope you enjoyed reading this article and it was helpful to you. Please subscribe to support this website and stay updated about my new articles.

If you have any suggestions or questions, Feel free to connect me on Twitter. 😉

Read Data Formatting in Swift and Improving UX - Part Two