A Side-By-Side Comparison of Two Great iOS Views Debugging Tools

RevealApp vs. Lookin

Jesus Nieves
Better Programming

--

two screenshots, one from RevealApp and the other from LookIn
RevealApp vs. Lookin

There are many tools and applications that make our software development task a little easier. We generally focus on tools that help us write better code or maybe save time in the development of new features. We usually use libraries, classes, and all kinds of things that make our work easier.

But we also have to pay attention to the quality of the user interface that we offer within our applications, and at some point, we spend a lot of time guessing what is wrong with our views implementation, with our constraints, or with how our views actually work.

Why a Tool for Debugging Views?

I love clean code, but I also love that my views fit perfectly to the design specifications and don’t have any visual errors (I hate apps that look bad). I try not to have constraint warnings or a lot of nested views, and I like to know how my code behaves. But how do I know how the views generated by that code behave?

That’s where the tools that help me inspect the views of my applications come in. They open up a whole new world of debugging. Now I don’t have to guess how my views behave.

These applications give us the ability to modify applications on the fly. You'll be debugging view design and rendering issues in seconds.

There are two main applications that I always use.

RevealApp

This is a fairly robust application that is supported by a company called Itty Bitty Apps based in Australia. The app has constant updates and is very stable.

Site: https://revealapp.com/

Owner: https://www.ittybittyapps.com/

Price: Starts at $59 year

screenshot of RevealApp

Lookin

This was created and maintained by QMUI Team, an Asian team with a few interesting open source projects.

Site: https://lookin.work/

Owner: https://qmuiteam.com/web/page/index.html

Price: Free

screenshot of LookIn

The main difference between these two applications is that one is open source and the other is not. That said, one app has more powerful features than the other, but they both have the tools to debug our views and stop wasting time guessing what the heck is going on in our views.

Features Comparison

checklist of features comparing RevealApp and LookIn

But what does each of these features mean? I want to show you what each of these items means, what its use is, and how it looks.

Features Details

Gesture debugging

Inspect the gesture recognizers you’ve attached to all of your views, as well as the recognizers added by iOS. You can update and modify their behaviour.

screenshot of gesture debugging screens

Measure tool

This allows you to measure the distance between two views.

photo image centered on black background with crosshair lines and numbers indicating placement of image on screen

3D views layers

This tool provides a beautiful 3D visualization of your views.

visualization of 3D view layers

Live edit

You can edit sizes, colors, text, and a lot of things in real time, and the changes are immediately reflected in your app. (They are only visual changes, nothing is changed in the code.)

screenshot of choices for live edit

View/layout inspector

Inspect each of the views, their hierarchy, components, and properties.

screenshot of photo image and its hierarchies, components, and properties

Visualize constraints

Find and discover relationships between views and constraints directly on the canvas.

visualization of views on the right and a list of constraints on the left

Manage constraints

Quickly edit or navigate to constraints that affect a view’s layout, see constraints owned by a view in the outline, and identify those created by the system.

screenshot of options for navigating or editing constraints

App extensions inspector

Inspect your app’s extensions, and debug issues that even Xcode can’t see.

drawings of four ice cream cones showing layers

Share snapshots

Share snapshots with your team or use them as point-in-time references during development. (I love this feature. It helps you share your entire view without having to compile your app. It’s great for a review by the design team.)

screenshot of social media feed
image of three LookIn snapshot files

In-app inspector

This feature is very interesting. It helps you inspect your views from the same device, without needing a Mac or installing any additional app (requires additional configuration).

two smartphone screens showing ability to inspect an app

Console

Get property values or invoke methods of any NSObject in your app.

property values of a programming Object

Auto-layout warning and errors

This highlights views and constraints affected by common auto-layout issues, helping you to fix layout problems faster.

screenshot of sample report of auto-layout errors

There are many other features, like dark mode simulation, tvOS support, method trace, and filters. I invite you to take a look at each app to discover everything they have to offer.

Conclusion

These applications give us the ability to modify applications on the fly. You’ll be debugging view design and rendering issues in seconds.

Both tools are great, as I said before. One has more powerful features, but both achieve the goal of view debugging, in my opinion. You can start with Lookin because it’s free, and if you need a little more power or maybe some kind of support for your business, you need to use RevealApp.

There is another app that I use as a plug-in for Lookin, and it’s called Sherlock. You should take a look at it. Later I will talk about this app.

Thanks for reading.

--

--

✖Member of the @xteam, 👊🏽Software Engineer at @riotgames 👨🏽‍🏫Mentor at @FrontEndCafe 📢Speaker at @fundacionjaa ✍🏼Writer at @medium