Filling UITableView with data from bottom to top

If you work on something like an chat app, you may need to use the UITableView in a way where data is filled from bottom to top. An example of this is a chat detail screen, where you want the UITableView to show the latest messages at the bottom when loaded, new messages are added to the bottom and immediately shown and older messages are loaded on top when the user scrolls to the top of the UITableView.

There are multiple ways to achieve this, each with some advantages and disadvantages.

Scrolling

The first simplest idea that comes to mind is using the UITableView as is and just scrolling it when necessary:

  • Scroll to bottom when the initial messages are loaded
  • Scroll to bottom when a new message is added
  • When older messages are about to be added to the top, remember the position, add the older messages, scroll back to that position

The first two situations are easy to accomplish, but the last one is not. I could not find a way to make it works without a visible scrolling effect.

Rotating UITableView 180 degrees

Another solution is to rotate the UITableView by 180 degrees; rotating it upside down. Of course you have to also “flip” your data source but that is trivial to achieve. The advantage is that you do not have to do any scrolling when new messages are added to the bottom (which is the top of the rotated UITableView) and if you use batch updates instead of reload neither when older messages are loaded.

[Read More]

Creating a dropdown menu from iOS navigation bar

Working on an iOS app I had to implement a filter for the table view displayed on screen. The filter should have contained 5 items and be accessible when tapping the screen title in the navigation bar. My first idea was to use an UIAlertController with those 5 options. It worked but it looked really ugly, So I started searching for a better, nicer solution. Ideally some kind of a dropdown menu.

I found multiple libraries for an iOS dropdown menu, but I liked BTNavigationDropdownMenu the best. The usage is really simple. First you define the items for the dropdown as an string array

create the menu instance

[Read More]

iOS tip: Changing navigation bar vs tab bar title

The UI of the iOS app I currently work on contains a tab bar with “Profile” as the title of one of the included tabs. This “Profile” tab contains a view controller with a navigation bar where I wanted the title to be set as “You profile”.

So I set the tab bar item’s title to “Profile” and wanted to set the navigation bar title of the view controller the standard way

I noticed that this also changes the title in the tab bar. After some research I found out that changing the view controller’s title property changes bot the title in the navigation bar and in the bar bar. But you can change the title just for the navigation bar

[Read More]

Using protocol default implementation instead of abstract classes

When I started using Swift the first thing I started missing was the support for abstract classes. I was used to using abstract classes for my ViewModels, especially to implement the template pattern, but also to provide some basic methods, like showing dialogs, that the ViewModels may need. Of course there are some “tricks” to do abstract classes like checking in the class type in constructor and throwing an error if it is the abstract class type, but Swift is a language based on protocols so there are better ways to achieve the same results just using the protocols.

Imagine you want to add a functionality to show iOS alerts to some of your ViewControllers. In a language like C# you would create an abstract class, something like BaseViewController, add a ShowAlert method to it and make all your ViewControllers inherit from this base class. Most languages nowadays only support single inheritance, so you would put all the functionality your ViewController may or may not need to your one abstract class. But you can typically implement as many interfaces as you like.

Using Swift and protocols there is another way. Protocols in Swift are really similar to interfaces in languages like Java or C# but with some neat stuff added to them like default protocol implementation.

[Read More]

Simpler and safer iOS custom table view cells with Reusable

When you create a UITableViewCell that you want to use with multiple UITableViews and design its view using a XIB file you know that registering and using it involves the usage of string constants. When you register your custom UITableViewCell with the UITableView you use a string as XIB name and a string as the reuse identifier. Then you use the string reuse identifier again to actually use it. There must be a better, safer way, right? Of course there is, just use Reusable.

Reusable is a Swift mixin for reusing views easily and in a type-safe way for UITableViewCells, UICollectionViewCells, custom UIViews, ViewControllers, Storyboards. It contains protocols you add to your classes and let the magic (the default implementation for those protocols) happen.

So how do you get rid of all those strings when using custom cells with UITableView? First, add the NibReusable protocol to you custom cell class

[Read More]

Making UITableView's header 'stickier'

Working on na iOS app I had to solve a interesting UI problem. The screen had to contain a UITableView with a header. The header should not have been visible when the screen was displayed. In fact the header should not have been visible when the user just scrolled the UITableView up and down, it only had to become visible when the user “dragged” the UITableView down, similar to doing pull to refresh. Scrolling the UITableView then hides the header again.

To better imagine the requirements, take a look at this animation

Notice that you see that the header is there but I have to really drag the UITableView to make it visible. It then disappears when I scroll the UITableView.

[Read More]

Formatting Swift code in XCode

When I started using XCode I was really surprised about the really poor implementation of its code formatting functionality. It kind of formats the alignment of the code but ignores unnecessary spaces and a lot of other things. Formatting the source code and keeping the style consistent is really important to me so I was looking for a solution. I found some linters like SwiftLint but I was interested in a tool that will actually format the source code for me on demand. I found SwiftFormat.

SwiftFormat

SwiftFormat is a code library and command-line tool for reformatting swift code. It applies a set of rules to the formatting and space around the code, leaving the meaning intact.

[Read More]

Using MVVM with tables and cells in iOS

When I ventured into native iOS development I immediately took a look at the possibility to use data binding on iOS which enables me to simply declare the relationships between the UI and the ViewModel. This article takes that approach further shows you how to use MVVM and data binding when using tables and cells, or in the world of iOS UITableView and UITableViewCell.

Sample scenario

Let’s start with simple example scenario. You want to show progress of some flow that contains of multiple steps, each of the steps can be either running or complete. When a step is running it can report its progress. You want to display this flow in a table that looks like this

[Read More]

Using data binding in iOS

When I started working on a native iOS project after a few years of Windows (Phone) development I looked into ways to write a more declarative and more elegant code than the “standard” iOS way. I wanted to transfer some of my habits over and the first thing I really missed was XAML data binding. I did some research on how to do data binding in iOS and found a few libraries that make it possible. This allowed me to write better code and I think data binding is a concept that all the iOS developer should look into. If you are interested in my experience with using binding in iOS, read on.

Sample scenario

Let’s use a simple example scenario. You have a screen where the users have to choose their country and then enter their mobile number. The number has to be validated with respect to the selected country and if everything is ok the Next button should become visible. So basically it should work like this

[Read More]