Technology Blogs by Members
Explore a vibrant mix of technical expertise, industry insights, and tech buzz in member blogs covering SAP products, technology, and events. Get in the mix!
cancel
Showing results for 
Search instead for 
Did you mean: 
Former Member

Introduction of Fiori for iOS control Series Blog


The series blogs will be a full introduction of  Fiori for iOS controls .

It helps you to get best benefits of controls provided by SAP to develop iOS apps using swift language.

Part1: Overview 


Introduction of Fiori for iOS

Overview of Controls of Fiori for iOS(This Blog)

Part2: Step by step blogs to use Fiori controls


  Set up development environment for Fiori for iOS development

2.1 Build input form using FUIFormCell series controls


Getting Start with FUIFormCell control and it’s sub classes

Build complex input form

Make your code reusable

Short Summary

Part3: Realize Fiori floor plans using Fiori for iOS controls


Part4: Theme customization


 

In previous blog: Introduction of Fiori for iOS, I introduced the concept of Fiori for iOS, In this blog, In the this blog, I will give you an overview of controls in Fiori for iOS, you will get the idea of how Fiori controls simplified your work.

1 Technical Background of iOS Development

When we develop apps for iOS, we have two options: Objective C, the old one,  and SWIFT, the new one.Swift is a robust and intuitive programming language created by Apple for building apps for iOS, Mac, Apple TV, and Apple Watch. It’s designed to give developers more freedom than ever. Swift is easy to use and open source, so anyone with an idea can create something incredible.

Other than the new language, we use the framework called Cocoa Touch to develop enterprise apps. The framework can help you build apps using MVC easily. You create a Xcode project, and create storyboard in it. The storyboard is a collection of views to help you visualize your apps. Using a storyboard, you can not only build views by drag and drop, but also define navigations between views.  You can also build models and controllers using .swfit file and connect your swift code to the storyboard. For more information of SWIFT and Cocoa Touch, please refer to apple’s website.

https://www.apple.com/swift/

You can also learn it in 5 days in training courses provide by SAP Apple Academy.

https://training.sap.com/shop/course/ffa100-introduction-to-swift-classroom-001-cn-en/

https://training.sap.com/shop/course/ffa200-introduction-to-the-ios-sdk-classroom-001-cn-en/

2 Technical Background of Fiori for iOS

All Fiori for iOS controls are built in swift. You can import the framework including all the controls into your Xcode project easily. And easily adapt Fiori controls in the story board. Most Fiori controls are inherited from standard cocoa touch controls, some controls do not have correspondents in iOS are also built by swift. There are also some storyboard templates to help you to build standardize UIs for most common usage.

For developers, there are many controls to use and to learn. For people to lean them fast, I classified those controls to 4 classes.

  1. Storyboard Templates

  2. Enhanced Standard Controls

  3. Quick Control Templates

  4. New Controls


3 Storyboard Templates

Fiori for iOS provides some Storyboard templates to build unified screens for common task, such as user logon, change password, and so on. Here are an example of welcome screen.



User actions, like click the ‘Active’ button, will trigger a predefined delegate method called didSelectSignIn(_:). The only thing you need to do is implemented those predefined delegate methods. Use templates sap provided, you will get easier to build unified UI across apps in your enterprise.

4 Enhanced Standards Controls

Many standard controls in Cocoa Touch is not powerful enough for enterprise applications. SAP build lots of controls as  subclasses of Cocoa Touch standard controls.

For example:

UI Navigation Bar is a common control used for display title, action, and handle go back action when user navigation from view to view. It looks like the image below.



But in enterprise applications, we have more chance to produce error, thus we need more convent way and a good place to show the error message. In Fiori for iOS, we have a new control called FUINavigationBar, the control is a subclass of UINavigationBar, besides it apply the Fiori look and feel, it have an additional FUIBannerMessageView just under it. You can access it by its attribute ‘bannerView’ and display it by calling method ‘show’  of the attribute.





5 Quick Control Templates

The cocoa touch framework provided all of basic controls. But for some of common task we need to combine several controls and write lots of code. For example, in a list control, I put a data input control. If I use cocoa touch control, I need two cells, the first cell needs a text field to display title, and another text field to display the result user selected. The second cell has a DateTimePicker control let user select the date or time. Beyond those, I also need to control the logic between those controls, for example, the second cell should beed hide normally ,it is only display when user wants to select date. And after the user select a date or time, I need to update the text of the text field. This will cost me lots of time if I have many DateTime fields.



In Fiori for iOS, we have a FUIDatePickerFormCell control to put them together and help you simplify your job.



6 New Controls

Some controls required by enterprise applications are not present in Cocoa Touch. Fiori for iOS provides those controls to help you display complex data.

For example , we have FUITimelineCell and FUITimelineMarkerCell controls to help you display the timeline of the process of a workflow.



7 Summary

After reading this blog, I believe you already know what is the main additional feature Fiori for iOS provide comparing to pure iOS development. And you will have an overview of how Fiori controls can help you in your developments.

If you want to have a detailed knowledge of Fiori controls, please downloads the Fiori Mentor App in Apple App Store using your iPad.( Only iPad is supported ).

In following blog of this series. I will pick some of most import controls and give you step by step guide to help you implement Fiori for iOS controls.

 

In Next blog, I will guide you the process of get and install SAP Cloud Platform SDK for iOS and how to set up your Xcode project for Fiori for iOS.

 

 
Labels in this area