LlmChatView 小部件是 AI Toolkit 提供的互動式聊天體驗的入口點。託管 LlmChatView 例項可啟用許多無需額外程式碼即可使用的使用者體驗功能。

  • 多行文字輸入:允許使用者貼上長文字輸入或在輸入文字時插入新行。
  • 語音輸入:允許使用者透過語音輸入提示,方便使用。
  • 多媒體輸入:允許使用者拍照併發送圖片及其他檔案型別。
  • 影像縮放:允許使用者放大影像縮圖。
  • 複製到剪貼簿:允許使用者將訊息文字或 LLM 響應複製到剪貼簿。
  • 訊息編輯:允許使用者編輯最近的訊息以重新提交給 LLM。
  • Material 和 Cupertino:適應兩種設計語言的最佳實踐。

多行文字輸入

#

使用者在完成提示撰寫後,有多種提交選項,這些選項再次因平臺而異。

  • 移動裝置:點選提交按鈕。
  • 網頁:按 Enter 或點選提交按鈕。
  • 桌面:按 Enter 或點選提交按鈕。

此外,聊天檢視支援包含嵌入式換行符的文字提示。如果使用者有包含換行符的現有文字,他們可以像往常一樣將其貼上到提示文字欄位中。

如果他們想在輸入提示時手動嵌入換行符,他們可以這樣做。該操作的手勢因其使用的平臺而異。

  • 移動裝置:點選虛擬鍵盤上的回車鍵。
  • 網頁:不支援。
  • 桌面:按 Ctrl+EnterOpt/Alt+Enter

這些選項如下所示:

桌面端:

Screenshot of entering text on desktop

移動裝置:

Screenshot of entering text on mobile

語音輸入

#

除了文字輸入,聊天檢視還可以透過點選麥克風按鈕來接收音訊錄音作為輸入,當尚未輸入任何文字時,麥克風按鈕可見。

點選麥克風按鈕開始錄音。

Screenshot of entering text

按下停止按鈕將使用者的語音輸入轉換為文字。

然後可以像往常一樣編輯、增強和提交此文字。

Screenshot of entered voice

多媒體輸入

#

Textfield containing "Testing, testing, one, two, three"

聊天檢視還可以接收圖片和檔案作為輸入,傳遞給底層 LLM。使用者可以點選文字輸入左側的加號按鈕,然後選擇拍照圖片庫附件圖示。

Screenshot of the 4 icons

拍照按鈕允許使用者使用其裝置的攝像頭拍照。

Selfie image

按下圖片庫按鈕允許使用者從其裝置的圖片庫上傳。

Download image from gallery

按下附件按鈕允許使用者選擇裝置上可用的任何型別的檔案,例如 PDF 或 TXT 檔案。

選擇照片、影像或檔案後,它將成為附件並顯示為與當前活動提示關聯的縮圖。

Thumbnails of images

使用者可以透過點選縮圖上的X按鈕來刪除附件。

影像縮放

#

使用者可以透過點選圖片縮圖將其放大。

Zoomed image

按下 ESC 鍵或點選影像外部的任何位置可關閉放大的影像。

複製到剪貼簿

#

使用者可以透過多種方式複製當前聊天中的任何文字提示或 LLM 響應。在桌面或網路上,使用者可以透過滑鼠選擇螢幕上的文字並像往常一樣將其複製到剪貼簿。

Copy to clipboard

此外,在每個提示或響應的底部,當用戶將滑鼠懸停時,他們可以按下彈出的複製按鈕。

Press the copy button

在移動平臺上,使用者可以長按提示或響應並選擇複製選項。

Long tap to see the copy button

訊息編輯

#

如果使用者希望編輯他們上一個提示並讓 LLM 再次處理它,他們可以這樣做。在桌面上,使用者可以點選最近提示的複製按鈕旁邊的編輯按鈕。

How to edit prompt

在移動裝置上,使用者可以長按並訪問最近提示上的編輯選項。

How to access edit menu

一旦使用者點選了編輯按鈕,他們將進入編輯模式,該模式會從聊天曆史中刪除使用者的最後一個提示和 LLM 的最後一個響應,將提示文字放入文字欄位,並提供一個編輯指示器。

How to exit editing mode

在編輯模式下,使用者可以根據需要編輯提示,並像往常一樣提交給 LLM 以生成響應。或者,如果他們改變主意,可以點選編輯指示器旁邊的X以取消編輯並恢復他們之前的 LLM 響應。

Material 和 Cupertino

#

LlmChatView 小部件託管在 Material 應用中時,它會使用 Material 設計語言提供的功能,例如 Material 的 TextField。同樣,當託管在 Cupertino 應用中時,它會使用這些功能,例如 CupertinoTextField

Cupertino example app

然而,雖然聊天檢視同時支援 Material 和 Cupertino 應用型別,但它不會自動採用關聯的主題。相反,這由 LlmChatViewstyle 屬性設定,如自定義樣式文件中所述。