<style>
.reveal, .reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 {
font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, "Microsoft JhengHei", Meiryo, "MS ゴシック", "MS Gothic", sans-serif;
}
h1, h2, h3, h4, h5, h6 {
text-transform: none !important;
}
.js-img {
background: url(https://upload.wikimedia.org/wikipedia/commons/thumb/6/6a/JavaScript-logo.png/480px-JavaScript-logo.png) center/contain;
width: 350px;
height: 350px;
display: block;
margin: 20px auto !important;
border: 4px solid white !important;
}
.hfbook-img {
background: url(http://images.thebookstores.net/imagesnew5c/9780596007126.jpg) center/contain;
width: 350px;
height: 350px;
display: block;
margin: 20px auto !important;
border: 4px solid white !important;
}
.sun0-img {
background: url(http://img.blog.163.com/photo/L56rCU_JmE3g5rkd3TjfTg==/1449877605037188949.jpg) center/contain;
width: 330px;
height: 238px;
display: block;
margin: 20px auto !important;
border: 4px solid white !important;
}
.sun-img {
background: url(http://www.tv543.com/images/kr/descendants-of-sun.jpg) center/contain;
width: 350px;
height: 260px;
display: block;
margin: 20px auto !important;
border: 4px solid white !important;
}
</style>
# 實作歐巴聊天機器人
## SwiftGirls
<img src="https://i.imgur.com/4U3CiG4.jpg" style="width:150px;height:150px;border-radius:50%"/>
Michael-Chen
Taipei, Taiwan
[@Github](https://github.com/helloworldsmart) [@FB](https://www.facebook.com/helloWorldMichaelChen)
----
# 前置
# [安裝cocoapods](http://www.appcoda.com.tw/cocoapods/)
---

# One Line
我開始把韓劇歐巴台詞丟進 API.AI想說做圖靈測試
----
## 結果咧
情境跟語意跳針回覆,不如丟相聲台詞
----

----
## conversation interface
### 用對話介面代替手滑介面,幫你處理特定問題
## natural language processing
## machine learning algorithms
----
- Agent
- Intents
- Entities
----
## 實作 API.AI
----
## Api.ai
## JSQMessageViewController
## RealmSwift
----
```ruby=
target 'chatbotTutorial' do
# Comment the next line if you're not using Swift and don't want to use dynamic frameworks
use_frameworks!
# Pods for chatbotTutorial
pod 'ApiAI'
pod 'JSQMessagesViewController'
pod 'RealmSwift'
post_install do |installer|
installer.pods_project.targets.each do |target|
target.build_configurations.each do |config|
config.build_settings['SWIFT_VERSION'] = '3.0'
end
end
end
end
```
---
- AppDelegate
```swift=
import ApiAI
/.../
let configuration: AIConfiguration = AIDefaultConfiguration()
configuration.clientAccessToken = "YOUR_CLIENT_ACCESS_TOKEN"
let apiai = ApiAI.shared()!
apiai.configuration = configuration
//apiai.lang = "zh-TW"
```
---
## JSQMessagesViewController
----
```swift=
// MARK: - 訊息印出來
func addMessage(_ senderName: String, _ senderID: String, _ senderMessage: String) {
let message = JSQMessage(senderId: senderId, displayName: senderDisplayName, text: text)
messages.append(message!)
finishSendingMessage()
}
```
```swift=
// MARK: - 多少訊息顯示
override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return messages.count
}
// MARK: - 顯示哪個訊息
override func collectionView(_ collectionView: JSQMessagesCollectionView!, messageDataForItemAt indexPath: IndexPath!) -> JSQMessageData! {
return messages[indexPath.row]
}
```
----
```swift=
// MARK: - 定義好顯示使用者名稱
override func collectionView(_ collectionView: JSQMessagesCollectionView!, attributedTextForCellTopLabelAt indexPath: IndexPath!) -> NSAttributedString! {
let message = messages[indexPath.row]
let messageUserName = message.senderDisplayName
return NSAttributedString(string: messageUserName!)
}
```
```swift=
//MARK: - 頭像
override func collectionView(_ collectionView: JSQMessagesCollectionView!, avatarImageDataForItemAt indexPath: IndexPath!) -> JSQMessageAvatarImageDataSource! {
let message = messages[indexPath.row]
if currentUser.id == message.senderId {
return JSQMessagesAvatarImageFactory.avatarImage(with: UIImage(named:"user.info.avator1")!, diameter: 30)
} else {
return JSQMessagesAvatarImageFactory.avatarImage(with: UIImage(named:"user.info.avator2")!, diameter: 30)
}
}
```
----
```swift=
// MARK: - 定義好bubblename 與框框距離
override func collectionView(_ collectionView: JSQMessagesCollectionView!, layout collectionViewLayout: JSQMessagesCollectionViewFlowLayout!, heightForCellTopLabelAt indexPath: IndexPath!) -> CGFloat {
return 15
}
```
```swift=
// MARK: - 判斷使用者id顯示對話框顏色
override func collectionView(_ collectionView: JSQMessagesCollectionView!, messageBubbleImageDataForItemAt indexPath: IndexPath!) -> JSQMessageBubbleImageDataSource! {
let bubbleFactory = JSQMessagesBubbleImageFactory()
let message = messages[indexPath.row]
if currentUser.id == message.senderId {
return bubbleFactory?.outgoingMessagesBubbleImage(with: .green)
} else {
return bubbleFactory?.incomingMessagesBubbleImage(with: .blue)
}
}
```
---
# Realm
---
# 串接Api.ai
---
# 結論
# 對話腳本需要很多Data去訓練
---
# iOS - Taipei
----
###### 參考資料
- [Google](https://www.youtube.com/watch?v=ulAKc2gezfU&index=1&list=PLOU2XLYxmsIKgPTizdYWPPYEpU96FCJrQ)
- [API.AI in Swift 3](https://medium.com/ios-os-x-development/api-ai-with-swift-3-e65df33d3d35l)
- [Getting started with api.ai for iOS](https://martinmitrevski.com/2017/03/12/getting-started-with-api-ai-for-ios/)
- [Building a Chatbot app on iOS Using Api.AI](https://speakerdeck.com/simonng/building-a-chatbot-app-on-ios-using-api-dot-ai)
- [Xanxus Shan youtuber](https://www.youtube.com/user/tarasuzy00)
---
## Thank you!歡迎指教
{"metaMigratedAt":"2023-06-14T12:42:47.206Z","metaMigratedFrom":"Content","title":"實作歐巴聊天機器人","breaks":true,"contributors":"[]"}