Debugging UI iOS

Introduction

Through this guide you will learn about some GUI debugging tools. Those tools will not only allow you to learn the views hierarchy, but they will also provide you with useful mechanisms to test the GUI performance. This, will allow you yo detect bottle necks and improve the efficiency of your app.

Objectives

The objective of this guide is:

  • To familiarize with different GUI debugging tools and understand why are they important in the apps development.
Micro Sprint 11
Activity Type Lesson
Expected Duration 30 minutes
Topic Debugging UI

Content

Recommended Links:

1. Hierarchy view debugging

There is a button in the bottom of the Xcode editor, that allows you to stop the execution of the application and capture the screen to debug the GUI.

Once you click the button, the view that is been show in the simulator can now be seen in the IDE. To the left of this new window you can take a look of the hierarchy tree of all the elements that are in the mobile screen at the moment. On the right side you can see a graphic representation of the hierarchy with the application wireframes to help you identify the elements easily.

Because the elements may be overlapping, the left window let you click and drag to give a 3D effect to the elements of the view.

When you hover over any of the elements they should change the color and the area related to them in the view should be highlighted (Bounds). If you right click a component a description of the same could be printed in the console.

This window will help you understand all the elements that are being drawn in the view.

GUI debugging using memory graphics

There is also an option to activate debugging to identify the memory usage. With this option you can inspect the instances of the different objects and their location in memory.

When you click that button, the window to the left shows all the instances of the different objects of the application. Once you click on any of the objects you can see the memory trace of them. this window is useful to identify the impact on memory of the objects.

Personalize location debugging

The location button allows you to simulate the geographic location of the simulator.

The list of locations is predefined, but you can add GPX files to simulate different locations that the ones given by Xcode.

VERSIONS

Version Authors Date
1.1 MARÍA CAMILA ÁNGEL February 25, 2017
1.2 JUAN DAVID CRUZ February 27, 2017
1.3 MARIO LINARES VASQUEZ February 28, 2017
1.4 JUAN DAVID CRUZ September 21, 2017
2.0 SERGIO VELASQUEZ April 14, 2018

results matching ""

    No results matching ""