Omówienie biblioteki interfejsu użytkownika
Biblioteka interfejsu użytkownika ułatwia tworzenie nowoczesnych środowisk użytkownika komunikacji przy użyciu usług Azure Communication Services. Udostępnia ona bibliotekę składników interfejsu użytkownika gotowych do produkcji, które można umieścić w aplikacjach:
Uwaga
Aby uzyskać szczegółową dokumentację dotyczącą biblioteki interfejsu użytkownika sieci Web, odwiedź podręcznik biblioteki interfejsu użytkownika sieci Web. W tym miejscu znajdziesz dodatkową dokumentację koncepcyjną, przewodniki Szybki start i przykłady.
Kompozyty. Te składniki są kluczowymi rozwiązaniami, które implementują typowe scenariusze komunikacji. Możesz szybko dodać połączenia wideo lub czat (obecnie dostępne tylko za pośrednictwem biblioteki interfejsu użytkownika sieci Web) do aplikacji. Składniki złożone to składniki o wyższej kolejności typu open source utworzone przy użyciu składników interfejsu użytkownika.
Składniki interfejsu użytkownika. Te składniki to bloki konstrukcyjne typu open source, które umożliwiają tworzenie niestandardowego środowiska komunikacji. Składniki są oferowane zarówno na potrzeby połączeń telefonicznych, jak i funkcji czatu, które można połączyć w celu tworzenia środowisk.
Te biblioteki klienckie interfejsu użytkownika używają języka i zasobów projektowych Fluent firmy Microsoft. Interfejs użytkownika Fluent udostępnia podstawową warstwę biblioteki interfejsu użytkownika i jest aktywnie używany w produktach firmy Microsoft.
W połączeniu ze składnikami interfejsu użytkownika biblioteka interfejsu użytkownika uwidacznia stanową bibliotekę klienta do wywoływania i czatu. Ten klient jest niezależny od dowolnej konkretnej struktury zarządzania stanem i może być zintegrowany z typowymi menedżerami stanu, takimi jak Redux lub React Context. Tej stanowej biblioteki klienta można używać ze składnikami interfejsu użytkownika do przekazywania rekwizytów i metod składników interfejsu użytkownika do renderowania danych. Aby uzyskać więcej informacji, zobacz Stateful Client Overview (Omówienie klienta stanowego).
Uwaga
Te same składniki i składniki złożone oferowane w bibliotece interfejsu użytkownika są dostępne w zestawie Design Kit for Figma, dzięki czemu można szybko zaprojektować i zaprojektować środowiska rozmów i czatów.
Omówienie złożonych
Złożone są składnikami wyższego poziomu składającymi się z składników interfejsu użytkownika, które dostarczają kluczowe rozwiązania dla typowych scenariuszy komunikacyjnych przy użyciu usług Azure Communication Services. Deweloperzy mogą łatwo utworzyć wystąpienie złożone przy użyciu tokenu dostępu usług Azure Communication Services i wymaganej konfiguracji przypisanej do połączenia lub rozmowy.
| Złożone | Przypadki użycia |
|---|---|
| CallwithChatComposite | Doświadczenie w połączeniu funkcji rozmów i czatów, aby umożliwić użytkownikom rozpoczęcie lub dołączenie do rozmowy i wątku czatu. W środowisku użytkownik ma możliwość komunikowania się za pomocą głosu i wideo oraz dostępu do rozbudowanego wątku czatu, w którym można wymieniać wiadomości między uczestnikami. Obejmuje ona obsługę aplikacji Teams Interop. |
| CallComposite | Środowisko wywołujące, które umożliwia użytkownikom uruchamianie lub dołączanie do połączenia. Wewnątrz środowiska użytkownicy mogą konfigurować swoje urządzenia, uczestniczyć w połączeniu z wideo i zobaczyć innych uczestników, w tym tych uczestników z włączeniem wideo. W przypadku aplikacji Teams Interop jest włączona funkcja lobby, aby użytkownik czekał na przyjęcie. |
| ChatComposite | Środowisko czatu, w którym użytkownik może wysyłać i odbierać wiadomości. Zdarzenia wątku, takie jak wpisywanie, odczyty, uczestnicy wchodzący i opuszczający są wyświetlane użytkownikowi w ramach wątku czatu. |
Omówienie składnika interfejsu użytkownika
Składniki czystego interfejsu użytkownika mogą służyć deweloperom do tworzenia środowisk komunikacyjnych, od łączenia kafelków wideo w siatkę w celu zaprezentowania uczestników zdalnych, organizowania składników w celu dopasowania ich do specyfikacji aplikacji. Składniki interfejsu użytkownika obsługują dostosowywanie, aby zapewnić składnikom odpowiednie działanie i wygląd, aby dopasować znakowanie i styl aplikacji.
| Obszar | Składnik | opis |
|---|---|---|
| Wywołanie | Układ siatki | Składnik siatki do organizowania kafelków wideo w siatce NxN |
| Kafelek wideo | Składnik, który wyświetla strumień wideo, gdy jest dostępny i domyślny składnik statyczny, gdy nie | |
| Pasek sterowania | Kontener do organizowania elementu DefaultButtons w celu podłączenia do określonych akcji wywołań, takich jak wyciszenie lub ekran udostępniania | |
| VideoGallery | Składnik galerii wideo z kluczem, który dynamicznie zmienia się podczas dodawania uczestników | |
| Dialpad | Składnik do obsługi numeru telefonu wejściowego i tonów DTMF | |
| Czat | Wątek komunikatu | Kontener, który renderuje komunikaty czatu, komunikaty systemowe i niestandardowe wiadomości |
| Wyślij pole | Składnik wprowadzania tekstu z dyskretnym przyciskiem wysyłania | |
| Pole wysyłania tekstu sformatowanych | Składnik wprowadzania tekstu sformatowanego z opcjami formatowania i dyskretnym przyciskiem wysyłania | |
| Wskaźnik stanu komunikatu | Składnik potwierdzenia odczytu z wieloma stanami w celu wyświetlenia stanu wysłanej wiadomości | |
| Wskaźnik wpisywania | Składnik tekstowy renderujący uczestników, którzy aktywnie wpisać w wątku | |
| Popularny | Element uczestnika | Wspólny składnik renderowania połączenia lub uczestnika czatu, w tym awatar i nazwa wyświetlana |
| Lista uczestników | Wspólny składnik renderowania listy uczestników rozmów lub rozmów, w tym awatara i nazwy wyświetlanej |
Instalowanie biblioteki interfejsu użytkownika sieci Web
Klienci stanowi są znajdowani w ramach @azure/communication-react pakietu.
npm i --save @azure/communication-react
Jaki artefakt interfejsu użytkownika jest najlepszy dla mojego projektu?
Zrozumienie tych wymagań pomaga wybrać odpowiednią bibliotekę klienta:
- Jak bardzo chcesz dostosować? Podstawowe biblioteki klienckie usługi Azure Communication nie mają środowiska użytkownika i są zaprojektowane tak, aby można było tworzyć dowolne środowiska użytkownika. Składniki biblioteki interfejsu użytkownika zapewniają zasoby interfejsu użytkownika kosztem mniejszego dostosowywania.
- Jakie platformy są przeznaczone dla Ciebie? Różne platformy mają różne możliwości.
Szczegółowe informacje o dostępności funkcji w bibliotece interfejsu użytkownika są dostępne tutaj, ale kluczowe kompromisy zostały podsumowane w następnej tabeli.
| Biblioteka klienta/zestaw SDK | Złożoność implementacji | Możliwość dostosowywania | Wywołanie | Czat | Teams Interop |
|---|---|---|---|---|---|
| Składniki złożone | Niski | Niski | ✔ | ✔ | ✔ |
| Podstawowe składniki | Śred. | Śred. | ✔ | ✔ | ✔ |
| Podstawowe biblioteki klienckie | Wys. | Wys. | ✔ | ✔ | ✔ |
Złożone to przełomowe rozwiązania, które implementują typowe scenariusze komunikacji. Możesz dodawać środowiska rozmów wideo do aplikacji. Złożone są składnikami o wyższej kolejności typu open source, które deweloperzy mogą wykorzystać, aby skrócić czas programowania i złożoność inżynieryjną.
Omówienie złożonych
| Złożone | Przypadki użycia |
|---|---|
| CallComposite | Środowisko wywołujące, które umożliwia użytkownikom uruchamianie lub dołączanie do połączenia. W środowisku użytkownicy mogą konfigurować swoje urządzenia, uczestniczyć w połączeniu z wideo i zobaczyć innych uczestników, w tym tych z włączonym wideo. W przypadku współdziałania usługi Teams obejmuje funkcje lobby, CallComposite dzięki czemu użytkownicy mogą czekać na przyjęcie. |
| ChatComposite | Dzięki funkcji ChatComposite wiadomości sms w czasie rzeczywistym użytkownicy mogą korzystać z funkcji obsługi komunikatów tekstowych. W szczególności użytkownicy mogą wysyłać i odbierać wiadomość na czacie z zdarzeniami z wpisywania wskaźników i odczytywania potwierdzenia. Ponadto użytkownicy mogą również odbierać komunikaty systemowe, takie jak dodany lub usunięty uczestnik, oraz zmiany tytułu czatu. |
Scenariusze złożone do wywoływania
Dołączanie do połączenia wideo/audio
Użytkownicy mogą dołączyć do połączenia przy użyciu adresu URL spotkania usługi Teams lub skonfigurować połączenie usług Azure Communication Services. To podejście oferuje prostsze środowisko, podobnie jak aplikacja Teams.
Środowisko przed wywołaniem
Jako uczestnik połączenia możesz podać nazwę i skonfigurować domyślną konfigurację dla urządzeń audio i wideo. Następnie możesz przejść do połączenia.
Środowisko połączeń
Wywołanie złożone zapewnia kompleksowe środowisko, optymalizuje czas programowania i koncentruje się na czystym układzie.
Środowisko wywołujące zapewnia wszystkie te możliwości w jednym składniku złożonym, zapewniając wyraźną ścieżkę bez złożonego kodu, co prowadzi do szybszego czasu programowania.
Jakość i bezpieczeństwo
Złożone urządzenia przenośne do wywoływania są inicjowane przy użyciu tokenów dostępu usług Azure Communication Services.
Więcej szczegółów
Jeśli potrzebujesz więcej szczegółowych informacji na temat złożonych urządzeń przenośnych do wywoływania, zobacz przypadki użycia.
Scenariusze złożone na potrzeby czatu
Ważne
Ta funkcja usług Azure Communication Services jest obecnie dostępna w wersji zapoznawczej.
Interfejsy API i zestawy SDK w wersji zapoznawczej są udostępniane bez umowy dotyczącej poziomu usług. Zalecamy, aby nie używać ich w przypadku obciążeń produkcyjnych. Niektóre funkcje mogą nie być obsługiwane lub mogą mieć ograniczone możliwości.
Aby uzyskać więcej informacji, zapoznaj się z dodatkowymi warunkami użytkowania dla wersji zapoznawczych platformy Microsoft Azure.
Środowisko czatu
Zapewnia ChatComposite obsługę komunikatów tekstowych w czasie rzeczywistym. Mając na uwadze elastyczność i skalowalność, ChatComposite można dostosować go do różnych układów lub widoków z aplikacji bez złożoności. Możesz również nie mieć wyświetlanego ChatComposite widoku i otrzymywać tylko powiadomienia spełniające różne potrzeby biznesowe.
| iOS | Android |
|---|---|
|
|
Jakość i bezpieczeństwo
Podobnie jak w przypadku CallCompositeprogramu , ChatComposite usługa korzysta również z tokenów dostępu usług Azure Communication Services. Aby mieć pewność, że tylko użytkownicy z odpowiednimi uprawnieniami będą mogli uzyskiwać dostęp do czatu, przed rozpoczęciem korzystania z czatu należy dodać tokeny użytkowników do prawidłowego wątku czatu.
Więcej szczegółów
Jeśli potrzebujesz dodatkowych szczegółów dotyczących złożonych aplikacji mobilnych na potrzeby czatu, zobacz przypadki użycia.
Jaki artefakt interfejsu użytkownika jest najlepszy dla mojego projektu?
Te wymagania pomagają wybrać odpowiednią bibliotekę klienta:
Jak bardzo chcesz dostosować? Podstawowe biblioteki klienckie usług Azure Communication Services nie mają środowiska użytkownika i są zaprojektowane tak, aby można było tworzyć dowolne środowiska użytkownika. Składniki biblioteki interfejsu użytkownika zapewniają zasoby interfejsu użytkownika kosztem mniejszego dostosowywania.
Jakie platformy są przeznaczone dla Ciebie? Różne platformy mają różne możliwości.
Oto kilka kluczowych kompromisów:
| Biblioteka klienta/zestaw SDK | Złożoność implementacji | Możliwość dostosowywania | Wywołanie | Czat | Współdziałanie usługi Teams |
|---|---|---|---|---|---|
| Składniki złożone | Niski | Niski | ✔ | ✔ | ✔ |
| Podstawowe biblioteki klienckie | Wys. | Wys. | ✔ | ✔ | ✔ |
Aby uzyskać więcej informacji na temat dostępności funkcji w bibliotece interfejsu użytkownika, zobacz Przypadki użycia biblioteki interfejsu użytkownika.