Nuta
Dostęp do tej strony wymaga autoryzacji. Możesz spróbować się zalogować lub zmienić katalog.
Dostęp do tej strony wymaga autoryzacji. Możesz spróbować zmienić katalogi.
Biblioteka UI ułatwia tworzenie nowoczesnych doświadczeń użytkowników komunikacji za pomocą usług Azure Communication Services. Możesz również użyć biblioteki UI do połączenia z OpenAI lub dowolnym innym modelem. Nasze SDK oferuje bibliotekę gotowych do produkcji komponentów UI, które możesz dodać do swoich aplikacji.
Notatka
Aby uzyskać szczegółową dokumentację dotyczącą biblioteki Web UI, odwiedź Web UI Library Storybook. Tam znajdziesz dodatkową dokumentację koncepcyjną, szybkiego startu oraz przykłady.
Kompozyty. Te komponenty to gotowe rozwiązania, które wdrażają typowe scenariusze komunikacyjne. Do aplikacji można szybko dodawać środowiska rozmów wideo lub czatu (obecnie dostępne tylko za pośrednictwem biblioteki internetowego interfejsu użytkownika). Kompozyty to komponenty wyższego rzędu, które są otwartoźródłowe i zbudowane z użyciem komponentów interfejsu użytkownika.
Komponenty interfejsu użytkownika. Komponenty te są otwartoźródłowymi elementami konstrukcyjnymi, które pozwalają na tworzenie spersonalizowanych doświadczeń komunikacyjnych. Komponenty są oferowane zarówno dla możliwości połączeń, jak i czatu, które można połączyć, aby tworzyć doświadczenia.
Wszystkie te biblioteki klienckie interfejsu użytkownika używają języka projektowania i zasobów Fluent firmy Microsoft . Fluent UI zapewnia warstwę podstawową dla Biblioteki UI i jest aktywnie używana w produktach Microsoft.
W połączeniu z komponentami interfejsu użytkownika, Biblioteka UI udostępnia stanową bibliotekę kliencką do dzwonienia i czatu. Ten klient jest neutralny wobec dowolnego konkretnego frameworku do zarządzania stanem i może być zintegrowany z popularnymi menedżerami stanów, takimi jak Redux lub React Context. Ta klientowa biblioteka z pamięcią stanową może być używana z komponentami UI do przekazywania właściwości i metod, aby komponenty UI mogły renderować dane. Aby uzyskać więcej informacji, zobacz Stateful Client Overview.
Notatka
Te same komponenty i kompozyty, które są dostępne w UI Library, są dostępne w Design Kit for Figma, dzięki czemu możesz szybko projektować i prototypować swoje doświadczenia z dzwonieniem i czatem.
Przegląd kompozytów
Kompozyty to komponenty wyższego poziomu złożone z komponentów interfejsu użytkownika, które dostarczają gotowe rozwiązania dla typowych scenariuszy komunikacji z użyciem Azure Communication Services. Deweloperzy mogą łatwo utworzyć instancję Composite, korzystając z tokenu dostępu Azure Communication Services oraz wymaganej konfiguracji przypisanej do połączeń lub czatu.
| Kompozyt | Przypadki użycia |
|---|---|
| Zadzwoń z ChatComposite | Doświadcz łączenia funkcji połączeń i czatu, aby umożliwić użytkownikom rozpoczęcie lub dołączenie do rozmowy i wątku czatu. W doświadczeniu użytkownik ma możliwość komunikowania się zarówno głosowo, jak i za pomocą wideo oraz dostęp do bogatego wątku czatu, w którym uczestnicy mogą wymieniać się wiadomościami. Obejmuje wsparcie dla Teams Interop. |
| CallComposite (WywołanieKompozytowe) | Doświadczenie rozmowy, które pozwala użytkownikom rozpocząć lub dołączyć do połączenia. W ramach tego doświadczenia użytkownicy mogą konfigurować swoje urządzenia, uczestniczyć w rozmowie wideo oraz widzieć innych uczestników, w tym uczestników z włączonym wideo. W przypadku interoperacyjności w Teams, włączona jest funkcja poczekalni, aby użytkownik mógł czekać na przyjęcie. |
| ChatComposite (CzatKompozyt) | Doświadczenie czatu, w którym użytkownik może wysyłać i otrzymywać wiadomości. Zdarzenia wątku, takie jak pisanie, odczytywanie, wchodzenie i wychodzenie uczestników, są wyświetlane użytkownikowi jako część wątku czatu. |
Omówienie składnika interfejsu użytkownika
Czyste komponenty interfejsu użytkownika mogą być używane przez deweloperów do tworzenia doświadczeń komunikacyjnych, od łączenia kafelków wideo w siatkę w celu pokazania zdalnych uczestników, po organizowanie komponentów, aby dopasować je do specyfikacji Twojej aplikacji. Składniki interfejsu użytkownika obsługują dostosowywanie, aby nadać składnikom odpowiedni charakter i wygląd, aby pasowały do marki i stylu aplikacji.
| Obszar | Komponent | Opis |
|---|---|---|
| Dzwonienie | Układ siatki | Komponent siatki do organizowania kafelków wideo w siatce NxN |
| Kafelek wideo | Komponent, który wyświetla strumień wideo, gdy jest dostępny, oraz domyślny statyczny komponent, gdy nie ma dostępnego strumienia. | |
| Pasek sterowania | Kontener do organizacji przycisków domyślnych do podłączenia do konkretnych akcji podczas rozmowy, takich jak wyciszenie lub udostępnienie ekranu. | |
| Galeria wideo | Komponent galerii wideo pod klucz, który dynamicznie się zmienia wraz z dodawaniem uczestników. | |
| Klawiatura numeryczna | Komponent do obsługi wprowadzania numerów telefonów i tonów DTMF | |
| Rozmowa | Wątek wiadomości | Kontener, który wyświetla wiadomości czatu, wiadomości systemowe i niestandardowe wiadomości |
| Skrzynka Wysyłania | Komponent wprowadzania tekstu z oddzielnym przyciskiem do wysyłania | |
| Pole wysyłania tekstu sformatowanego | Komponent wejściowy tekstu sformatowanego z opcjami formatowania i dyskretnym przyciskiem wysyłania | |
| Wskaźnik Statusu Wiadomości | Komponent potwierdzeń przeczytania o wielu stanach do pokazania stanu wysłanej wiadomości | |
| Wskaźnik pisania | Komponent tekstowy wyświetlający uczestników, którzy aktywnie piszą w wątku | |
| Zwykły / Wspólny | Element uczestnika | Uniwersalny komponent do renderowania uczestnika połączenia lub rozmowy, w tym awatara i wyświetlanej nazwy |
| Lista uczestników | Wspólny komponent do wyświetlania listy uczestników połączenia lub czatu, w tym awatara i nazwy wyświetlanej. |
Instalacja biblioteki interfejsu użytkownika Web
Klienci z obsługą stanu są częścią pakietu @azure/communication-react.
npm i --save @azure/communication-react
Jaki artefakt interfejsu użytkownika będzie najlepszy dla mojego projektu?
Zrozumienie tych wymagań pomoże Ci wybrać odpowiednią bibliotekę klienta.
- Jak wiele personalizacji sobie życzysz? Podstawowe biblioteki klientów Azure Communication nie mają interfejsu użytkownika (UX) i są zaprojektowane tak, aby można było stworzyć dowolny interfejs użytkownika. Składniki biblioteki interfejsu użytkownika udostępniają zasoby interfejsu użytkownika kosztem zmniejszonego dostosowywania.
- Na jakie platformy kierujesz swoją ofertę? Różne platformy mają różne możliwości.
Szczegóły dotyczące dostępności funkcji w UI Library są dostępne tutaj, ale kluczowe kompromisy są podsumowane w następnej tabeli.
| Biblioteka klienta / SDK | Złożoność wdrożenia | Możliwość personalizacji | Dzwonienie | Rozmowa | Współdziałanie usługi Teams |
|---|---|---|---|---|---|
| Komponenty kompozytowe | Niski | Niski | ✔ | ✔ | ✔ |
| Komponenty bazowe | Średni | Średni | ✔ | ✔ | ✔ |
| Podstawowe biblioteki klienckie | Wysoki | Wysoki | ✔ | ✔ | ✔ |
Composites to gotowe rozwiązania, które implementują powszechne scenariusze komunikacyjne. Możesz dodać funkcje wideorozmów do swoich aplikacji. Kompozyty to komponenty wyższego rzędu o otwartym kodzie źródłowym, z których programiści mogą korzystać, aby skrócić czas tworzenia i złożoność inżynieryjną.
Przegląd kompozytów
| Kompozyt | Przypadki użycia |
|---|---|
| CallComposite (WywołanieKompozytowe) | Doświadczenie rozmowy, które pozwala użytkownikom rozpocząć lub dołączyć do połączenia. W ramach doświadczenia użytkownicy mogą konfigurować swoje urządzenia, uczestniczyć w połączeniu wideo i oglądać innych uczestników, w tym tych z włączonym wideo. Aby zapewnić interoperacyjność z Teams, CallComposite obejmuje funkcjonalność poczekalni, dzięki której użytkownicy mogą czekać na przyjęcie. |
| ChatComposite (CzatKompozyt) |
ChatComposite zapewnia użytkownikom doświadczenie przesyłania wiadomości tekstowych w czasie rzeczywistym. Użytkownicy mogą wysyłać i odbierać wiadomości na czacie wraz z informacjami o pisaniu i potwierdzeniach przeczytania. Ponadto użytkownicy mogą również otrzymywać wiadomości systemowe, takie jak dodanie lub usunięcie uczestnika oraz zmiany tytułu czatu. |
Scenariusze kompozytowe dla połączeń
Dołączanie do rozmowy wideo/audio
Użytkownicy mogą dołączyć do rozmowy, korzystając z URL zebrania w Teams, lub mogą skonfigurować rozmowę za pomocą Azure Communication Services. To podejście oferuje prostsze doświadczenie, podobnie jak aplikacja Teams.
Doświadczenie przed rozmową telefoniczną
Jako uczestnik rozmowy możesz podać nazwę i skonfigurować domyślne ustawienia dla urządzeń audio i wideo. Następnie jesteś gotowy, aby dołączyć do rozmowy.
Doświadczenie rozmowy
Kompozyt wywołujący zapewnia kompleksowe środowisko, optymalizuje czas programowania i koncentruje się na czystym układzie.
Doświadczenie związane z wykonywaniem połączeń oferuje wszystkie te funkcje w jednym złożonym komponencie, zapewniając przejrzystą ścieżkę bez skomplikowanego kodu, co prowadzi do szybszego czasu rozwoju.
Jakość i bezpieczeństwo
Kompozyty mobilne do wywoływania są inicjowane przy użyciu tokenów dostępu Azure Communication Services.
Więcej szczegółów
Jeśli potrzebujesz więcej informacji na temat mobilnych kompozytów do rozmów, zobacz przypadki użycia.
Scenariusze kompozytów dla czatu
Ważne
Ta funkcja usługi Azure Communication Services jest obecnie dostępna w wersji próbnej. Funkcje w wersji zapoznawczej są publicznie dostępne i mogą być używane przez wszystkich nowych i istniejących klientów firmy Microsoft.
Interfejsy API i pakiety SDK w wersji zapoznawczej są udostępniane bez umowy o gwarantowanym poziomie świadczenia usług. Zalecamy, aby nie używać ich do obciążeń produkcyjnych. Niektóre funkcje mogą nie być obsługiwane lub mogą być ograniczone.
Aby uzyskać więcej informacji, zobacz Uzupełniające warunki korzystania z wersji zapoznawczych platformy Microsoft Azure.
Doświadczenie czatu
Zapewnia ChatComposite obsługę wiadomości tekstowych w czasie rzeczywistym. Mając na uwadze elastyczność i skalowalność, można ChatComposite dostosować się do różnych układów lub widoków z aplikacji bez złożoności. Możesz także zdecydować się na niepokazywanie widoku ChatComposite i otrzymywanie jedynie powiadomień, aby spełnić różne potrzeby biznesowe.
| iOS | Android |
|---|---|
|
|
Jakość i bezpieczeństwo
Podobnie jak CallComposite, ChatComposite również wykorzystuje tokeny dostępu Azure Communication Services. Aby upewnić się, że tylko użytkownicy posiadający odpowiednie uprawnienia mogą uzyskać dostęp do czatu, ich tokeny muszą być dodane do prawidłowego wątku czatu przed rozpoczęciem korzystania z czatu.
Więcej szczegółów
Jeśli potrzebujesz więcej informacji o mobilnych kompozytach do czatu, zobacz przypadki użycia.
Jaki artefakt interfejsu użytkownika będzie najlepszy dla mojego projektu?
Wymagania te pomagają wybrać odpowiednią bibliotekę klienta.
Jak wiele personalizacji sobie życzysz? Biblioteki klienckie rdzenia usługi Azure Communication Services nie mają interfejsu użytkownika (UX) i są zaprojektowane tak, aby umożliwić budowę dowolnego interfejsu użytkownika według własnych potrzeb. Składniki biblioteki interfejsu użytkownika udostępniają zasoby interfejsu użytkownika kosztem zmniejszonego dostosowywania.
Na jakie platformy kierujesz swoją ofertę? Różne platformy mają różne możliwości.
Oto kilka kluczowych kompromisów:
| Biblioteka klienta / SDK | Złożoność wdrożenia | Możliwość dostosowania | Dzwonienie | Rozmowa | Interoperacyjność Teams |
|---|---|---|---|---|---|
| Komponenty kompozytowe | Niski | Niski | ✔ | ✔ | ✔ |
| Podstawowe biblioteki klienckie | Wysoki | Wysoki | ✔ | ✔ | ✔ |
Aby uzyskać więcej informacji o dostępności funkcji w Bibliotece UI, zobacz przypadki użycia Biblioteki UI.