In a previous post we introduce TLFormView, a truly universal generic form for iOS that provides tools for handling all types of devices, orientations and UI/UX experiences out of the box.

Here we present the second part of that post with some of the nicer features that we didn't include in the first one. Please feel free to check the project home page at GitHub or try the example project through cocoa pods with pod try TLFormView.

TLFormModel. Keep It Stupid Simple [*]

In our previous post were working on an example form for a simple user profile with three fields: photo, user name and age.

But, where is the piece that makes TLFormView absurdly awesome? Right, here: It comes with one more class TLFormModelthat allows simplifying the setup process to the absolute minimum.

TLFormModel has a default implementation for the form delegate and data source we just saw in the previous post. This component reads information from the class' taxonomy so you only need to declare a class that extend TLFormModel and add the properties you want appearing as form fields. Properties must be defined as instances of one of our special types in order to be used as fields in the form.

Let's rewrite the previous example using TLFormModel. Here it is:

The results should be the same form we saw in the previous post for iPhone.

The default implementation  places all fields in a vertical layout, in the same order than the properties were declared. The field titles will by equal to the property name replacing "_" with spaces and capitalising all words.

If we want to adapt the form's layout in the same way we did before for iPad we just need to override the default implementation of the data source method constraintsFormatForFieldsInForm: in our UserModel class like this:

And More

There are two more useful features that we didn't mentioned yet. Both are part of the TLFormField.

Let's imagine that we want our form to show the "User Name" field only if the "Age" is greater than 12 years. And we want to explain this strange behaviour with a help button in the "Age" field. To do so we are going to extend our previous UserModel implementation to override another method of the TLFormDataSource protocol. Here is how:

The NSPredicate in the property visibilityPredicate receives all the fields in the given form as variables so you can check any field value with the syntax: $[field name].value. More about how it works here.

This is the final result. Here is how the help icon works and how the help is displayed:

Testing

And this is how the visibility predicate works on the edit and read only modes:

Conclusion

TLFormView is a great tool to handle any kind of entity edition and display. It scales very well from simple objects with some fields to big and complex ones, allowing developers to choose how to handle user interaction and look-and-feel. It takes care of the boilerplate behind managing an adaptative solution that takes advantage of all the available capabilities in each device.

Plans for this component are just starting. If you want to learn more check the TLFormView repository on GitHub. If you want to contribute there is a small TODO list of things that I think are needed first. The project has pod support so you can always pod try it with:

The examples presented here are really simple cases, and they do not show all the possibilities that this tool provides. We just reviewed two types of fields out of five! We didn't talk about special event handling (choosing  images, working with the field types TLFormFieldList, etc). So please check the project repo or get the sample project to have a much more complete overview.

It will be really nice to have you involved with this project, or any of the other open source projects at the Tryolabs GitHub, so just come in and have fun!