Swift 入门指南

本指南介绍了如何在 Swift 中创建和实现 iOS 应用,以使用 Google 跟踪代码管理器 (GTM) 跟踪屏幕打开和按钮按下事件。

1. 创建一个新项目

  1. 打开 Xcode。 创建一个新项目
  2. 点击 Create a new Xcode project(创建新的 Xcode 项目)。
  3. 选择 Single View Application(单视图应用)。 选择单一视图应用
  4. 点击下一步
  5. 为您的项目命名并为其选择其他选项。您的项目名称和应用名称将与产品名称相同。
    输入商品名称和其他选项
  6. 点击下一步
  7. 选择项目位置(目录)。
  8. 点击创建

2. 安装 Google 跟踪代码管理器依赖项

  1. 退出 Xcode。
  2. 在终端中,运行以下命令以安装 CocoaPods
    $ sudo gem install cocoapods
    
  3. 切换到您的项目目录。
  4. 运行以下命令以创建名为 Podfile 的文件:
    $ pod init
    
  5. Podfile 中,取消注释 use_frameworks! 并将 pod 'GoogleTagManager' 添加到目标:
  6. # Uncomment this line if you're using Swift
    use_frameworks!
    
    target 'GtmSwiftTutorial' do
      pod 'GoogleTagManager'
    end
    
  7. 运行以下命令,下载 Google 跟踪代码管理器 (GTM) 依赖项并将其安装到您的项目中:
    $ pod install
    

    此命令还会创建工作区 GtmSwiftTutorial.xcworkspace。从现在开始,请使用此工作空间开发 GtmSwiftTutorial 应用。

3. 为 Objective-C 库添加桥接头文件

如需创建桥接头文件,请执行以下操作:

  1. 打开 Xcode。
  2. 依次点击 File > New > File
  3. iOS > Source 下,选择 Header File
  4. 点击下一步
  5. 输入头文件名称 BridgingHeader.h
    创建桥接头文件
  6. 点击创建
  7. 将以下 import 语句添加到头文件:
    #ifndef BridgingHeader_h
    #define BridgingHeader_h
    
    #import <GoogleTagManager/TAGManager.h>
    #import <GoogleTagManager/TAGContainer.h>
    #import <GoogleTagManager/TAGContainerOpener.h>
    #import <GoogleTagManager/TAGDataLayer.h>
    #import <GoogleTagManager/TAGLogger.h>
    
    #endif /* BridgingHeader_h */
    

要在构建设置中添加 Objective-C 桥接头文件,请执行以下操作:

  1. 在 Xcode 中,点击您的项目。
  2. 点击编辑器区域中的 Build Settings
    点击“Build Settings”(构建设置)
  3. 依次选择全部已合并,然后搜索桥接
    搜索桥接
  4. 在包含 Objective-C 桥接标头的行的右列中,输入 BridgingHeader.h
    添加 BridgingHeader.h 作为 Objective-C 桥接标头

4. 向项目中添加默认容器

在将默认容器添加到项目之前,请先下载移动容器二进制文件:

  1. 登录您的 Google 跟踪代码管理器帐号。
  2. 选择一个移动容器。
  3. 点击菜单栏中的版本
  4. 针对所选容器版本,依次点击操作 > 下载
  5. 已下载文件的名称以容器 ID 命名,例如 GTM-PT3L9Z

如需将默认容器二进制文件添加到您的项目,请执行以下操作:

  1. 打开 Xcode。
  2. 点击 Dock 上的 Finder 图标。
  3. 点击 Downoloads 文件夹。
  4. 将容器二进制文件拖动到 Downloads 文件夹中,然后将其拖放到 Xcode 项目的根文件夹中。
  1. 在 Xcode 中,打开文件 AppDelegate.swift
  2. AppDelegate 类扩展 TAGContainerOpenerNotifier 类:
    import UIKit
    
    @UIApplicationMain
    class AppDelegate: UIResponder, UIApplicationDelegate, TAGContainerOpenerNotifier {
      // ...
    }
    

    扩展该类后,您会收到 Type 'AppDelegate' does not conform to protocol 'TAGContainerOpenerNotifier' 错误。以下步骤将修复此错误。

  3. 将以下函数添加到 AppDelegate 类定义的底部:
    func containerAvailable(container: TAGContainer!) {
      container.refresh()
    }
    
  4. application 函数中,在 return true 语句前面添加以下代码:
    let GTM = TAGManager.instance()
    GTM.logger.setLogLevel(kTAGLoggerLogLevelVerbose)
    
    TAGContainerOpener.openContainerWithId("GTM-PT3L9Z",  // change the container ID "GTM-PT3L9Z" to yours
        tagManager: GTM, openType: kTAGOpenTypePreferFresh,
        timeout: nil,
        notifier: self)
    

6. 跟踪屏幕打开事件

如需跟踪屏幕打开事件,请执行以下操作:

  1. 创建一个用于存储跟踪 ID 的变量。
  2. 创建一个名为 screenName 的数据层变量。
  3. 创建名为“屏幕浏览”的 GTM 代码。
  4. 添加屏幕跟踪代码。

a. 创建用于存储跟踪 ID 的变量

  1. 登录您的 Google 跟踪代码管理器账号。
  2. 选择一个移动容器。
  3. 在左侧导航栏中,点击变量
  4. 用户定义的变量下,点击新建
  5. 点击未命名变量,输入变量名称 跟踪 ID
  6. 选择常量作为变量类型。
  7. 输入跟踪 ID(以 UA-XXXXXXXX-X 的形式,其中 X 为数字)作为变量的值。
    使用 UA-47605289-5(待删除)。
  8. 点击创建变量

b. 创建一个名为 screenName 的数据层变量

  1. 登录您的 Google 跟踪代码管理器账号。
  2. 选择一个移动容器。
  3. 在左侧导航栏中,点击变量
  4. 用户定义的变量下,点击新建
  5. 点击未命名变量,输入标题 Screen Name
  6. 选择数据层变量作为变量类型。
  7. 输入 screenName 作为数据层变量名
  8. 点击设置默认值
  9. 输入默认值 unknown screen
  10. 点击创建变量

c. 创建名为“屏幕浏览”的 GTM 代码

  1. 登录您的 Google 跟踪代码管理器账号。
  2. 选择一个移动容器。
  3. 在左侧导航栏中,点击代码
  4. 点击 New(新建)。
  5. 点击未命名代码,输入代码名称 Screen View
  6. 选择产品 Google Analytics(分析)
  7. 从列表中选择跟踪 ID
  8. 选择应用浏览作为跟踪类型
  9. 点击更多设置
  10. 点击要设置的字段
  11. 点击 + 添加字段
  12. 选择字段名称 screenName 及其值 Screen Name
  13. 点击继续
  14. 触发条件下,选择任何事件
  15. 点击创建代码

d. 添加屏幕跟踪代码

  1. 在 Xcode 中打开 ViewController.swift 文件。
  2. ViewController 类中定义名为 dataLayer 的变量:
    var dataLayer: TAGDataLayer = TAGManager.instance().dataLayer
    
  3. viewDidLoad() 函数中,将 OpenScreen 事件推送到数据层:
    dataLayer.push(["event": "OpenScreen", "screenName": "Home Screen"])
    

ViewController 类的定义如下所示:

import UIKit

class ViewController: UIViewController {
  var dataLayer: TAGDataLayer = TAGManager.instance().dataLayer

  override func viewDidLoad() {
    super.viewDidLoad()
    dataLayer.push(["event": "OpenScreen", "screenName": "Home Screen"])
  }

  override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that cant be recreated
  }
}

7. 跟踪按钮按下事件

如需跟踪按钮按下事件,请执行以下操作:

  1. 创建一个名为 eventAction 的数据层变量。
  2. 创建一个名为 Event 的自定义事件变量。
  3. 创建名为已按下按钮的 GTM 代码。
  4. 创建一个按钮并添加代码,以跟踪用户按下该按钮的操作。

a. 创建一个名为 eventAction 的数据层变量

  1. 登录您的 Google 跟踪代码管理器账号。
  2. 选择一个移动容器。
  3. 在左侧导航栏中,点击变量
  4. 用户定义的变量下,点击新建
  5. 点击未命名变量,输入标题事件操作
  6. 选择数据层变量作为变量类型。
  7. 输入 eventAction 作为数据层变量名称
  8. 点击设置默认值
  9. 输入默认值未知事件
  10. 点击创建变量

b. 创建一个名为“事件”的自定义事件变量

  1. 登录您的 Google 跟踪代码管理器账号。
  2. 选择一个移动容器。
  3. 在左侧导航栏中,点击变量
  4. 用户定义的变量下,点击新建
  5. 点击未命名变量,输入变量名称事件
  6. 选择自定义事件作为变量类型。
  7. 点击创建变量

c. 创建名为“按下按钮”的 GTM 代码

  1. 登录您的 Google 跟踪代码管理器账号。
  2. 选择一个移动容器。
  3. 在左侧导航栏中,点击代码
  4. 点击 New(新建)。
  5. 点击未命名的代码,输入标签名称 Button Pressed
  6. 选择产品 Google Analytics(分析)
  7. 从列表中选择跟踪 ID
  8. 选择事件作为跟踪类型
  9. 选择活动类别。
  10. 选择事件操作
  11. 点击继续
  12. 触发条件下,选择任何事件
  13. 点击创建代码

d. 创建按钮并添加代码以跟踪用户按下该按钮的操作

  1. 打开您的 Xcode 项目。
  2. 打开 Main.storyboard
  3. 点击 Xcode 工具栏中最右上角的按钮,打开实用程序区域(右边栏)。 分镜脚本和实用区
  4. 在实用程序区域的底部,点击
    用于打开对象库的蓝色按钮

    点击 Show the Object library 按钮(蓝色按钮):

    对象库弹出式窗口
  5. 在搜索框中输入 button
    对象库中的按钮
  6. Button 拖到故事板中,并将其放在左上角。
    将该按钮拖放到故事板中
  7. 点击 Xcode 工具栏中的 Assistant Editor 按钮 “Google 助理编辑器”按钮
  8. 按住 Ctrl 键的同时,将该按钮拖放到 ViewController 类定义的底部。
    将按钮拖放到 ViewController 类定义中
  9. 在对话框中,选择 Action 连接,输入函数名称 buttonPressed,然后点击 Connect
    创建用于处理按钮按下事件的代码

    这会将以下函数添加到 ViewController 类定义的末尾:

    @IBAction func buttonPressed(sender: AnyObject) {
    }
    

    每次按下按钮时,系统都会执行该函数。

  10. buttonPressed 函数中,添加以下代码,将 ButtonPressed 事件推送到日图层:
    @IBAction func buttonPressed(sender: AnyObject) {
      dataLayer.push(["event": "ButtonPressed", "eventAction": "Test Event"])
    }
    

8. 构建并运行应用

在 Xcode 中,点击 Product(产品)> Run(运行)。Xcode 将构建并运行应用:

已启动应用的屏幕截图