0% found this document useful (0 votes)
78 views24 pages

iOS Native Components: Alert, Image Picker, Date Picker, Mail and SMS

The document discusses several native iOS components including alerts, image pickers, date pickers, messaging, and activity view controllers. It provides details on how to use UIAlertController to display alerts and action sheets, UIImagePickerController to select images from the camera and photo library, MessageUI to send messages and emails, UIDatePicker for date selection, and UIActivityViewController for sharing content. Code examples are given for implementing date pickers and handling date selection.

Uploaded by

Lina Y Harara
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
78 views24 pages

iOS Native Components: Alert, Image Picker, Date Picker, Mail and SMS

The document discusses several native iOS components including alerts, image pickers, date pickers, messaging, and activity view controllers. It provides details on how to use UIAlertController to display alerts and action sheets, UIImagePickerController to select images from the camera and photo library, MessageUI to send messages and emails, UIDatePicker for date selection, and UIActivityViewController for sharing content. Code examples are given for implementing date pickers and handling date selection.

Uploaded by

Lina Y Harara
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 24

iOS Native Components

Alert, Image Picker, Date Picker, Mail and SMS Mr. Ahmed Qazzaz

last update Dec. 7th., 2019


1
Native Components

✤ Native components are UI components we use in our


apps, that are implemented in the system, and we only
reuse it inside our app.

✤ sometimes it can be customized, and mostly it is not


customizable.

2
Native Components
✤ UIAlert

✤ Alert

✤ ActionSheet

✤ ImagePicker

✤ Camera

✤ Saved Photos Album

✤ Photos Library

✤ Messages

✤ Messages (SMS)

✤ Mail

✤ Data Picker

✤ ActivityViewController
3
UIAlertController
✤ Alert controller contains two types of messages

✤ Alert, which is a pop up message usually used to


show information, or in Yes, and No questions

✤ ActionSheet, which is a presented options list from


bottom, we use it when there is two or more options
to select

4
UIAlertController

✤ first line, define the alert object

✤ to add buttons to the alert box we create UIAlertAction, and add it


to the alert object

✤ then we present the alert object just as we present view controllers

5
UIAlertController / ActionSheet

✤ Action sheets are created as the same as the alert using


the same components but we change the style (the
third parameter in the UIAlertController constructor)
to .actionsheet, instead of .alert

6
UIAlertAction

✤ All alert actions will dismiss the UIAlertController but


if we need to add extra code to be executed when
selecting the AlertAction we need to add code the
handler closure

7
Native Components
✤ UIAlert

✤ Alert

✤ ActionSheet

✤ ImagePicker

✤ Camera

✤ Saved Photos Album

✤ Photos Library

✤ Messages

✤ Messages (SMS)

✤ Mail

✤ Data Picker

✤ ActivityViewController
8
Image Picker

✤ image picker is the class we use to access user images,


and the camera.

✤ This process need permissions.

✤ we add permissions in info.plist file

9
Some Permissions

Privacy - Photo Library Usage Description:


This permission used to ask the user about the accessing for his photos library, this permission
message should be clear and completely showing the purpose of this access

Privacy - Camera Usage Description


This permission used to ask the user about the accessing for his camera device, this permission
message should be clear and completely showing the purpose of this access

App Transport Security Settings


This keys tells the app to allow requests to non HTTPS servers

10
Image Picker
✤ To show the image picker

✤ We create the image Picker

✤ then define the source of the image

✤ set the delegate of the picker

✤ Delegate should be of the type

✤ UINavigationControllerDelegate

✤ UIImagePickerControllerDelegate

✤ then present the imagePicker


11
Handle image selection

✤ There is a delegate function in the


UIImagePickerControllerDelegate used to handle the
selected image.

✤ you need to implement it in the your delegate class

12
Native Components
✤ UIAlert

✤ Alert

✤ ActionSheet

✤ ImagePicker

✤ Camera

✤ Saved Photos Album

✤ Photos Library

✤ Messages

✤ Messages (SMS)

✤ Mail

✤ Data Picker

✤ ActivityViewController
13
Mails, and Message

✤ if you want your app to send a message using SMS


message composer or iMessages.

✤ or your want to send an email via the Mail app


through your app

✤ You need to import a new library called MessageUI

14
Mails, and Message

15
Native Components
✤ UIAlert

✤ Alert

✤ ActionSheet

✤ ImagePicker

✤ Camera

✤ Saved Photos Album

✤ Photos Library

✤ Messages

✤ Messages (SMS)

✤ Mail

✤ Data Picker

✤ ActivityViewController
16
Date Picker

✤ Date picker is a component that can be used directly in


the storyboard, or can be presented instead of the
keyboard when selecting a textfield

✤ also we can connect this picker to a function to be


executed when value changed

✤ To dismiss this picker we can add a tool bar on its top


that contains an item bar button to dismiss.
17
Let’s do it …

18
Let’s do it …

✤ These two lines are to


define the datePicker,
and the textfield that
will be assigned with
the date picker

19
✤ Assign the function
“dateDidChanged” on the
value changed event

✤ Then assigning the


datePicker to the input
view of the textfield, so the
date picker will be
presented instead of the
keyboard when textfield
selected.
20
✤ We create a tool bar with a
height of 40, and create a
button to be added on the tool
bar, with the title “Done”, this
button will execute the
function “dateDidChanged”
when clicked

✤ to make this toolbar presented


with the input view, we need
to add it as accessory view to
the textfield.
21
Note About dismissing

✤ When we present a view controller from another one,


we make the presented view controller dismiss it self

✤ When the navigation controller push a view controller,


, we make the navigation controller pop it

✤ When the textfield present an input view, the same


textfield should dismiss this input view

✤ using :
22
Native Components
✤ UIAlert

✤ Alert

✤ ActionSheet

✤ ImagePicker

✤ Camera

✤ Saved Photos Album

✤ Photos Library

✤ Messages

✤ Messages (SMS)

✤ Mail

✤ Data Picker

✤ ActivityViewController
23
UIActivityViewController

✤ Used to show a list of activities to apply on text,


image, or URL, or share it via different apps installed
on your device.

24

You might also like