About Us Developer Portal Archives

iOS Story Quick Start Guide

Quick Start Guide for Integrating AmityUIKit's Story Feature into iOS Applications

Welcome to the Quick Start Guide for integrating Amity Social Cloud's Story feature into your existing iOS application using Swift Package Manager (SwiftPM). This guide assumes that you have basic knowledge of iOS development and Xcode.

Prerequisites

  1. Xcode version 15+ installed on your macOS system.

  2. An existing iOS project or create a new one for this integration.

  3. A valid Amity Social Cloud account and an API key. If you haven’t already registered for an Amity account, we recommend following our comprehensive step-by-step guide here in the Amity Portal to create your new network.

Step 1: Create or Open Your Project

  • Launch Xcode and either create a new iOS project or open an existing one where you wish to integrate the Story feature.

Step 2: Add AmityUIKit Package Dependency

  • Go to File > Swift Packages > Add Package Dependency.

  • Enter the repository URL for AmityUIKit: https://github.com/AmityCo/Amity-Social-Cloud-UIKit-iOS-SwiftPM.

  • Choose the appropriate version or branch and then add the package to your project.

Step 3: Import AmityUIKit

In your Swift file where you want to use the Story feature, import the AmityUIKit:

import AmityUIKit

Step 4: Setup Required Permissions

Your application needs the following permissions for accessing camera, microphone, and photo library:

  • In your info.plist, add the following keys with appropriate descriptions:

    • NSCameraUsageDescription

    • NSMicrophoneUsageDescription

    • NSPhotoLibraryUsageDescription

Step 5: Initialize AmityUIKit

Before using any features of the UIKit, you need to initialize it with your API key and optional configuration settings.

import AmityUIKit
import AmitySDK

AmityUIKitManager.setup(apiKey: "your_api_key_here", region: .global)

Optionally, you can specify endpoints manually if required by your application's needs.

Step 6: Authenticate

To use the SDK features, including the Story feature, register the current device with a user ID.

AmityUIKitManager.registerDevice(withUserId: "USER_ID", displayName: "DISPLAY_NAME", authToken: "AUTH_TOKEN")

Step 7: Integrate Story Feature

Integrating the Story feature involves utilizing the AmityStoryTabComponent and AmityCreateStoryPage for story creation and display.

  • For displaying stories related to a specific community:

let storyTabComponent = AmityStoryTabComponent(storyFeedType: .community(community))
let viewController = SwiftUIHostingController(rootView: storyTabComponent)

  • For navigating to the story creation page, specifying a target community ID:

let createStoryPage = AmityCreateStoryPage(targetId: "community-id", avatar: avatarImageURL)
let viewController = SwiftUIHostingController(rootView: createStoryPage)

Step 8: Customizing the UI

AmityUIKit supports extensive customization options via a config.json file. You can modify themes, colors, and icons for various components and elements of the story feature according to your application's design requirements.

  • Example customization snippet:

"global_theme": {
  "light_theme": {
    "primary_color": "#FFFFFF",
    "secondary_color": "#AB1234"
  }
}

  • You can exclude certain UI elements or customize specific components and elements as per your needs.

You have now successfully integrated the Amity Social Cloud Story feature into your iOS application. For further customization options, refer to the detailed documentation provided with the SDK. If you encounter any issues or require assistance, our community forum at community.amity.co is always here to help.

Last updated