Three lines

Uber

Developers

iOS

This tutorial will guide you through the steps of putting a Ride Request Button into your iOS app, and optionally displaying realtime information on that button to provide a better user experience.

At the end of this tutorial, you will have either a deep link button, or a deep link button with realtime information.


Deep link button

Button with realtime info displayed

You can achieve this with about 10 lines of code for the button, and about 20 lines of code for the button with realtime information.

Your iOS Project

We can create a new Single View Application project to demonstrate how to begin using the SDK. In XCode, choose File > New > Project and when prompted to “Choose a template for your new project”, select Single View Application and click Next.

In the next screen, set the Product Name field to any name you want, leave everything else as the default and click Next. Choose which folder you want to save the project to and click Create. You now have a boilerplate app with just one view!

Add the SDK to your project

There are currently two ways to add the Uber Rides iOS SDK to your project:

Using a dependency manager such as Carthage or CocoaPods makes it easy to keep your app updated with the latest version of the SDK.

CocoaPods

The Uber Rides iOS SDK is a CocoaPod written in Swift. You can install CocoaPods with the following command:

$ gem install cocoapods

To integrate Uber Rides into your Xcode project, navigate to the directory that contains your project and create a new Podfile with pod init. Add the following under your Podfile’s target:

target 'Your Project Name' do
  use_frameworks!
  pod 'UberRides', '~> 0.9'
end

Then, run the following command to install the dependency:

$ pod install

Next, close your Xcode project. In your project folder, you should see another file alongside your .xcodeproj file: the .xcworkspace file. Open the .xcworkspace file.

Congratulations, you’ve added the Uber Rides iOS SDK into your project using CocoaPods! Next, you have to configure the sdk.

Carthage

You can integrate Uber Rides into your project using Carthage. You can install Carthage (with XCode 7+) via homebrew:

brew update
brew install carthage

To install UberRides via Carthage, you need to create a Cartfile. In the root directory of your project, run the following command:

touch Cartfile

In the editor of your choice open the file and add the following:

# UberRides
github "uber/rides-ios-sdk" ~> 0.9

Now run the following command to checkout & build our repo and dependencies.

carthage update --platform iOS

You should now have a Carthage/Build folder in your project directory. Open your .xcodeproj and go to the General settings tab. In the Linked Frameworks and Libraries section, drag and drop each framework (in Carthage/Build/iOS)

Now, open your application target’s Build Phases settings tab, click the + icon, and select New Run Script Phase. Add the following to the script area:

/usr/local/bin/carthage copy-frameworks

and add the paths to the required frameworks in Input Files

$(SRCROOT)/Carthage/Build/iOS/UberRides.framework

Congratulations, you’ve added the Uber Rides iOS SDK into your project using Carthage! Next, you have to configure the sdk.

Configuring the SDK

To begin making calls to the Uber API, you need to register an application on the Uber Developer Site and get credentials for your app.

Then, configure your Xcode with information for the Uber SDK. Locate the Info.plist file for your application. Right-click this file and select Open As > Source Code

Add the following code snippet, replacing the placeholders within the square brackets ([]) with your app’s information from the developer dashboard. (Note: Do not include the square brackets)

<key>UberClientID</key>
<string>[ClientID]</string>
<key>UberDisplayName</key>
<string>[App Name]</string>
<key>LSApplicationQueriesSchemes</key>
<array>
    <string>uber</string>
    <string>uberauth</string>
</array>
Adding A Simple Button

We can add a button that simply opens the Uber App to the view. We’ll go into the View Controller and add the RideRequestButton. First, open up ViewController.swift and import UberRides:

// Put this line after import UIKit
import UberRides

Now, we can insert the button into the view inside the function viewDidLoad(). Add these lines into the end of the function

let button = RideRequestButton()
view.addSubview(button)

After that, viewDidLoad() should now look like this:

override func viewDidLoad() {
    super.viewDidLoad()

    // ride request button
    let button = RideRequestButton()

    //put the button in the view
    view.addSubview(button)
}

Click the Build button, and you should see something that looks like this:


Off-center button, oh no!

Looks like the button is not centered! We can add this line before view.addSubview(button) to center it.

button.center = view.center

Click the Build button again, and you should now see the button in the center! Now, this is how viewDidLoad() should look like:

override func viewDidLoad() {
  super.viewDidLoad()

  // ride request button
  let button = RideRequestButton()

  // center button
  button.center = view.center

  //put the button in the view
  view.addSubview(button)
}
Optional: Color Theme

The button currently supports two color themes:

  1. Black background with white text (default)
  2. White background with black text

To use the second color theme, you can set the colorStyle attribute like this:

button.colorStyle = .white // White Background, Black Text
Passing Parameters to the Button

This button will Deeplink into the Uber App and will simply open up the app, because we did not pass any parameters to it. The Ride Request Button can accept optional parameters to pre-load some information into the ride request.

Let’s say we want to make it easy for users to get an Uber to the San Francisco International Airport (SFO). The latitude and longitude of this location is:

latitude: 37.6213129,
longitude: -122.3789554

We can pass the destination parameters to the Ride Request Button so that the destination will be pre-populated when the app opens. We’ll need to use the RideParametersBuilder() to set these parameters into the button.

First, we’ll need to import CoreLocation. Put this under import UberRides we had earlier.

import CoreLocation

Next, let’s create a CLLocation object using the latitude and longitude we found earlier for our destination, San Francisco International Airport.

let dropoffLocation = CLLocation(latitude: 37.6213129, longitude: -122.3789554)

Next, we’ll use the RideParametersBuilder() to set the destination location. Note that setting either a nickname or address is required. Both these fields are only for displaying a recognizable display text to the user when they see their destination in the Uber App. Setting these values will not override the destination latitude and longitude. For this example, we can just set a nickname. Notice we’re nicknaming the San Francisco International Airport as “Awesome Airport”.

let builder = RideParametersBuilder()
builder.dropoffLocation = dropoffLocation
builder.dropoffNickname = "Awesome Airport"

And lastly, we need to build the parameters and set this into the button.

button.rideParameters = builder.build()

After all that, your viewDidLoad() function should look like this:

override func viewDidLoad() {
  super.viewDidLoad()

  // ride request button
  let button = RideRequestButton()

  // set a dropoffLocation
  let dropoffLocation = CLLocation(latitude: 37.6213129, longitude: -122.3789554)
  let builder = RideParametersBuilder()
  builder.dropoffLocation = dropoffLocation
  builder.dropoffNickname = "Awesome Airport"
  button.rideParameters = builder.build()

  //center the button
  button.center = view.center

  //put the button in the view
  view.addSubview(button)
}

Build the project again, and we should see the button just as it was before, but now it can set a destination when it opens the Uber App. Build the app on your phone, and tap it to try it out! You should see the “Awesome Airport” in the destination field inside the Uber App.

Check out this setPickup reference to find out a list of deep link parameters.

Congratulations! You’ve successfully used the SDK to get a Ride Request Button into your app.

We’re working hard to provide you with more step by step instructions for all Uber products. Stay tuned! In the meantime, you can and check out the Uber Rides iOS SDK on GitHub for more cool stuff!

Congratulations! You have finished the Ride Request Button tutorial and you are able to request rides!

Uber

Developers
© 2023 Uber Technologies Inc.