Development (Face Capture)
This page contains the information of Usage, Configuration, Result of OkayCam for Android, iOS and React-native in Face Capture
Usage
For Android, a selfie camera can be launched by invoking the start method on OkayCamSelfie with context, license key, config and callback method:
A License Key is required to start the SDK.
OkayCamSelfie.start(this,license_key, config) {
success, images, exception ->
// do something with the result
}Configuration
The configuration object is optional if is calling from Kotlin.
The configuration object can be created and can be customised as following:
val config = OkaySelfieConfig.init(this)
config.topLabel.text = "Top Label"List of Possible Configurations
This is a complete list of possible configurations that has been provided to the user to make any custom configuration:
-
Property
Description
Default Value
-
width
width to resize the image
null
-
imageQuality
quality of image
1.0f (range from 0 to 1.0)
-
outputPath
desired output image path
null
-
defaultCameraFacing
initial camera facing when the selfie camera is launched
CameraFacing.FRONT
topLabel
text
text of the top label
"Please align your face within the frame"
topLabel
color
color of the top label
#FFFFFF
topLabel
size
text size of the top label
24
-
bottomFrameColor
color of the bottom frame
#EB6709
-
captureBtnColor
color of the capture button
#EB144C
confirmBtnConfig
backgroundColor
background color of the confirm button
#EB144C
confirmBtnConfig
contentColor
content color of the confirm button
#FFFFFF
retakeBtnConfig
backgroundColor
background color of the retake button
#EB144C
retakeBtnConfig
contentColor
content color of the retake button
#FFFFFF
switchBtnConfig
color
color of the switch button
#FFFFFF
switchBtnConfig
show
show or hide the camera switch button
true
Result Callback
After the image is capture or cancelled by the user, the callback method will be called.
Result callback has 3 parameters as follow:
Conditions
Results
Success
It will be true if the image is captured successfully, else it will return false.
Images
If it is successful, images will contain the file path the image, else it will return null.
Exception
If it is successful, the exception will be null, else it will contain the exception that occurred during the image capturing.
Base64 Conversion
import com.innov8tif.okaycam.utils.BitmapUtils;
String result = BitmapUtils.INSTANCE.convertToBase64(image);Usage
For iOS, there will be several steps to initialize and configure the Face Capture settings.
Instantiate the configuration object. A reference must be passed into the Navigation Controller as follows:
let config = OkaySelfieConfig(navigationController: nav)Start the process by calling start on OkaySelfieCam class. Similarly, the result can be handle in the completion handler.
OkayCamSelfie.start{
okaySelfieConfig: config,
license: licenseKey,
{ filePath, error in
// handle
}
}The response will only be the <filePath> or an error. One of them will be valid and the other one will be nil.
Configuration
The configuration object can be modified as follow:
let config = OkaySelfieConfig(navigationController: nav)
config.topLabel.text = "top label text"
config.topLabel.color = .green
config.topLabel.size = 14
config.bottomFrameColor = .darkGray
config.bottomBtnColor = .white
config.switchBtnConfig.show = true
config.switchBtnConfig.color = .magenta
config.confirmBtnConfig.backgroundColor = .blue
config.confirmBtnConfig.contentColor = .black
config.retakeBtnConfig.backgroundColor = .orange
config.retakeBtnConfig.contentColor = .black
config.width = 250
config.imageQuality = 1.0
config.defaultCameraFacing = .back
config.outputPath = myCustomFilePathList of Possible Configurations
This is a complete list of possible configurations that has been provided to the user to make any custom configuration:
Property
Type
Default Value
topLabel
OkaySelfieLabelConfig
OkaySelfieLabelConfig(text: "Please align your face within the frame", color: UIColor.white, size: CGFloat(18))
bottomFrameColor
UIColor
UIColor(red: 0.92, green: 0.40, blue: 0.04, alpha: 1.0)
captureBtnColor
UIColor
UIColor(red: 0.92, green: 0.08, blue: 0.30, alpha: 1.0)
confirmBtnConfig
OkayCamBtnConfig
OkayCamBtnConfig(
backgroundColor: UIColor(red: 0.92, green: 0.08, blue: 0.30, alpha: 1.0),
contentColor: UIColor.white
)
retakeBtnConfig
OkayCamBtnConfig
OkayCamBtnConfig(
backgroundColor: UIColor(red: 0.92, green: 0.08, blue: 0.30, alpha: 1.0),
contentColor: UIColor.white
)
switchBtnConfig
SwitchBtnConfig
SwitchBtnConfig(color: UIColor.white, show: false)
defaultCameraFacing
OkayCam.CameraDevice
OkayCam.CameraDevice.front
outputPath
URL?
nil
width
Int?
nil
imageQuality
CGFloat
1.0 (range from 0 to 1.0)
Result Callback
After the image is capture or cancelled by the user, the callback method will be called.
Result callback has 2 parameters as follow:
Result
Description
filepath
If it is successful, image path will be returned, else nil will be returned.
error
If it is successful, the error will be nil, else it will contain the error that occurred during the image capturing.
Base64 Conversion
do {
let base64String = try convertImageToBase64(fileUrl: myImageFilePath)
print(base64String)
} catch {
print(error.localizedDescription)
}Usage
For React-native, this is an example for the face capture for the custom camera UI design as following:
captureDocument(license, base64, config)
To generate base64 string as output, base64 parameter needs to be set as true.
import { captureSelfie } from "react-native-okaycam"
captureSelfie(
license,
true,
{
topLabel: {
text: "Align you face within the frame",
color: "#4287f5",
size: 20
},
bottomFrameColor: "#4287f5",
captureBtnColor: "#ffffff",
switchBtnConfig: {
color: "#ffffff",
show: true
},
confirmBtnConfig: {
backgroundColor: "#4287f5",
contentColor: "#000000"
},
retakeBtnConfig: {
backgroundColor: "#4287f5",
contentColor: "#000000"
},
defaultCameraFacing: "front",
width: 1000,
imageQuality: 1.0
}
)
.then(result => {
console.log(result)
})
.catch(error => {
console.log(error)
})Configuration
There are some configurations object to be followed in the development stage. The configurations that are going to show below can be implemented into the Usage section above.
List of Possible Configurations
-
Property
Description
Default Value
-
width
width to resize the image
null
-
imageQuality
quality of image
1.0 (range from 0 to 1.0)
topLabel
text
text of the top label
Please align your face within the frame
topLabel
color
color of the top label
#FFFFFF
topLabel
size
text size of the top label
24
-
bottomFrameColor
color of the bottom frame
#EB6709
switchBtnConfig
color
color of the switch button
#FFFFFF
switchBtnConfig
show
show or hide the camera switch button
true
-
captureBtnColor
color of the capture button
#FFFFFF
confirmBtnConfig
backgroundColor
background of the confirm button
#EB144C
confirmBtnConfig
contentColor
content color of the confirm button
#FFFFFF
retakeBtnConfig
backgroundColor
background of the retake button
#EB144C
retakeBtnConfig
contentColor
content color of the retake button
#FFFFFF
-
defaultCameraFacing
Initial camera facing when the selfie cam is launched
CameraFacing.FRONT
Result
Result
Description
selfieImage
Captured selfie image
User Interface Example
The OkayCam (face capture) camera user interface follows the design configurations from the above sections.
Example:

Last updated
Was this helpful?