Grids keep UI elements in your app aligned and organized. In Fiori for iOS we use grids to help create clean and beautiful apps.
Generally, grids only apply to content area on the screen when Nav Bar, Toolbar and Tab Bar follow their own visual specifications.
When creating high-fidelity screens with your design software of choice (e.g., Sketch, Illustrator, etc.), it is critical to be mindful of how your elements are aligned.
When a text box is created in design software, there is typically 1pt of padding surrounding the actual text characters. However, the outside edge of the text box (not the edge of the text characters themselves) should serve as the reference point when aligning the text box.
In these examples, the guideline (shown here as a thin, red vertical line) should just be touching the edge of the text box, not the text characters.
Similar to the text box, icon images are contained within bounding boxes. When aligning icons images, the edges of the bounding boxes should serve as the reference point, not the icon itself, as icons may or may not fill their bounding boxes completely.
iPad with Readable Width
When there are a lot of texts on the screen, it is recommended to apply readable width on an iPad in landscape orientation. iOS has defined the maximum optimal width for text objects inside the view by increasing the side margins. The margins also vary depending on different screen size. The difference becomes obvious only when working on an iPad in landscape orientation.