Přehled knihovny uživatelského rozhraní

Knihovna uživatelského rozhraní usnadňuje vytváření moderních komunikačních uživatelských prostředí pomocí služeb Azure Communication Services. Také můžete použít knihovnu uživatelského rozhraní k připojení k OpenAI nebo jakémukoli jinému modelu. Naše sada SDK poskytuje knihovnu komponent uživatelského rozhraní připravených pro produkční prostředí, které můžete do svých aplikací umístit:

Poznámka:

Podrobnou dokumentaci ke knihovně webového uživatelského rozhraní naleznete v článku o knihovně webových uživatelských rozhraní. Najdete zde další koncepční dokumentaci, rychlá zprovoznění a příklady.

• Kompozity. Tyto komponenty jsou řešení na klíč, která implementují běžné komunikační scénáře. Do aplikací můžete rychle přidávat videohovory nebo chat (aktuálně dostupné jenom přes knihovnu webových uživatelských rozhraní). Složené komponenty jsou opensourcové komponenty vyššího řádu vytvořené pomocí komponent uživatelského rozhraní.

• Součásti uživatelského rozhraní. Tyto komponenty jsou opensourcové stavební bloky, které umožňují vytvářet vlastní komunikační prostředí. Komponenty jsou nabízeny pro možnosti volání i chatu, které je možné kombinovat a vytvářet prostředí.

Všechny tyto klientské knihovny uživatelského rozhraní používají jazyk a prostředky microsoftu pro návrh Fluent. Fluent UI poskytuje základní vrstvu pro knihovnu uživatelského rozhraní a aktivně se používá napříč produkty Microsoftu.

Ve spojení s komponentami uživatelského rozhraní knihovna uživatelského rozhraní zveřejňuje stavovou klientskou knihovnu pro volání a chat. Tento klient je nezávislý na jakékoli konkrétní rozhraní pro správu stavu a může být integrován s běžnými správci stavů, jako je Redux nebo React Context. Tuto stavovou klientskou knihovnu lze použít s komponentami uživatelského rozhraní k předávání vlastností a metod pro komponenty uživatelského rozhraní k vykreslení dat. Další informace naleznete v tématu Přehled stavových klientů.

Poznámka:

Stejné komponenty a složené součásti nabízené v knihovně uživatelského rozhraní jsou k dispozici v sadě Design Kit for Figma, takže můžete rychle navrhovat a prototypovat vaše volající a chatovací prostředí.

Přehled kompozitních materiálů

Složené komponenty jsou komponenty vyšší úrovně složené z komponent uživatelského rozhraní, které poskytují řešení pro běžné scénáře komunikace pomocí Azure Communication Services. Vývojáři mohou snadno vytvořit instanci komponenty Composite pomocí přístupového tokenu služby Azure Communication Services a požadované konfigurace určené pro volání nebo chat.

Kompozitní	Případy použití
CallwithChatComposite	Zkušenosti s kombinováním funkcí volání a chatu, které uživatelům umožňují zahájit nebo se připojit ke vláknu hovoru a chatu. V prostředí má uživatel možnost komunikovat pomocí hlasu i videa a přístup k bohatému vláknu chatu, kde se dají zprávy vyměňovat mezi účastníky. Zahrnuje podporu Teams Interop.
Volání Kompozitní	Prostředí volání, které uživatelům umožňuje zahájit hovor nebo se k němu připojit. Uvnitř prostředí můžou uživatelé nakonfigurovat svá zařízení, účastnit se hovoru s videem a zobrazit další účastníky, včetně účastníků s zapnutím videa. Pro funkci vzájemné spolupráce v Teams je zahrnuta předsálí funkce, která umožňuje uživateli čekat na přijetí.
ChatComposite	Prostředí chatu, ve kterém může uživatel posílat a přijímat zprávy. Události vlákna, jako je psaní, čtení, vstup účastníků a opuštění, se uživateli zobrazí jako součást vlákna chatu.

Přehled součástí uživatelského rozhraní

Čistě součásti uživatelského rozhraní je možné použít pro vývojáře k vytváření komunikačních prostředí, od spojování video dlaždic do mřížky až po prezentaci vzdálených účastníků až po uspořádání komponent tak, aby vyhovovaly specifikacím aplikací. Součásti uživatelského rozhraní podporují přizpůsobení, které komponentám dává správný pocit a vzhled tak, aby odpovídaly značkám a stylu aplikací.

Plocha	Komponenta	Popis
Volání	Rozložení mřížky	Komponenta mřížky pro uspořádání video dlaždic do formátu NxN
	Dlaždice videa	Komponenta, která zobrazuje video stream, pokud je k dispozici, a výchozí statickou komponentu, pokud ne
	Ovládací panel	Kontejner pro uspořádání výchozích tlačítek pro připojení ke konkrétním akcím volání, jako je ztlumení nebo sdílení obrazovky
	Videogalerie	Komponenta video galerie na klíč, která se dynamicky mění, jakmile jsou účastníci přidáváni
	Klávesnice telefonu	Součást pro podporu vstupu telefonního čísla a tónů DTMF
Konverzace	Vlákno zpráv	Kontejner, který vykresluje chatové zprávy, systémové zprávy a vlastní zprávy
	Odesílací schránka	Komponenta textového vstupu s samostatným tlačítkem pro odeslání
	Textové pole pro odesílání formátovaného textu	Součást pro zadávání formátovaného textu s možnostmi formátování a samostatným tlačítkem pro odeslání
	Ukazatel stavu zprávy	Součást potvrzení o přečtení ve více stavech pro zobrazení stavu odeslané zprávy
	Indikátor psaní	Textová komponenta pro vykreslení účastníků, kteří aktivně zapisují do vlákna
Běžný	Položka účastníka	Společná komponenta pro vykreslení hovoru nebo účastníka chatu včetně avataru a zobrazovaného jména
	Seznam účastníků	Společná součást pro vykreslení seznamu účastníků hovoru nebo chatu včetně avataru a zobrazovaného jména

Instalace knihovny webového uživatelského rozhraní

Stavoví klienti se nacházejí jako součást @azure/communication-react balíku.

npm i --save @azure/communication-react

Jaký artefakt uživatelského rozhraní je pro můj projekt nejvhodnější?

Vysvětlení těchto požadavků vám pomůže zvolit správnou klientskou knihovnu:

• Kolik přizpůsobení si přejete? Klientské knihovny Azure Communication Core nemají uživatelskou architekturu a jsou navržené tak, abyste mohli sestavit libovolné uživatelské rozhraní, které chcete. Komponenty knihovny uživatelského rozhraní poskytují prostředky uživatelského rozhraní za cenu sníženého přizpůsobení.
• Na jaké platformy cílíte? Různé platformy mají různé možnosti.

Podrobnosti o dostupnosti funkcí v knihovně uživatelského rozhraní jsou k dispozici tady, ale klíčové kompromisy jsou shrnuté v další tabulce.

Klientská knihovna / sada SDK	Složitost implementace	Možnost přizpůsobení	Volání	Konverzace	Interoperabilita Teams
Složené komponenty	Nízká	Nízká	✔	✔	✔
Základní komponenty	Střední	Střední	✔	✔	✔
Základní klientské knihovny	Vysoká	Vysoká	✔	✔	✔

Navštivte scénář knihovny uživatelského rozhraní.

Složené soubory jsou klíčová řešení, která implementují běžné komunikační scénáře. Do aplikací můžete přidat prostředí videohovorů. Složené komponenty jsou opensourcové komponenty vyššího řádu, které můžou vývojáři využít ke zkrácení doby vývoje a technické složitosti.

Přehled kompozitních materiálů

Kompozitní	Případy použití
Volání Kompozitní	Prostředí volání, které uživatelům umožňuje zahájit hovor nebo se k němu připojit. V prostředí můžou uživatelé nakonfigurovat svá zařízení, účastnit se hovoru s videem a zobrazit další účastníky, včetně těch se zapnutým videem. CallComposite zahrnuje funkcionalitu předsálí pro interoperabilitu Teams, aby uživatelé mohli čekat na povolení.
ChatComposite	ChatComposite přináší uživatelům zážitek z zasílání textových zpráv v reálném čase. Konkrétně můžou uživatelé posílat a přijímat chatovací zprávy s událostmi spojenými s indikátory psaní a potvrzením o přečtení. Kromě toho můžou uživatelé také přijímat systémové zprávy, jako je přidání nebo odebrání účastníka, a změny názvu chatu.

Složené scénáře pro volání

Připojení k videohovoru nebo zvukovému hovoru

Uživatelé se mohou připojit k hovoru pomocí adresy URL schůzky Microsoft Teams nebo se připojit k hovoru prostřednictvím služeb Azure Communication Services. Tento přístup nabízí jednodušší prostředí, stejně jako aplikace Teams.

Zkušenost před voláním

Jako účastník hovoru můžete zadat jméno a nastavit výchozí konfiguraci pro zvuková a obrazová zařízení. Pak jste připraveni skočit do hovoru.

Zážitek z hovoru

Telefonní komponenty poskytují komplexní zkušenost, efektivně zkracují čas potřebný k vývoji a zaměřují se na přehledné uspořádání.

Prostředí volání poskytuje všechny tyto funkce v jedné složené komponentě a poskytuje jasnou cestu bez složitého kódu, což vede k rychlejšímu vývoji.

Kvalita a zabezpečení

Mobilní komponenty pro volání se inicializují pomocí přístupových tokenů Azure Communication Services.

Další podrobnosti

Pokud potřebujete další podrobnosti o mobilních složených souborech pro volání, podívejte se na případy použití.

Scénáře složených objektů pro chat

Důležité

Tato funkce služeb Azure Communication Services je aktuálně ve verzi Preview. Funkce ve verzi Preview jsou veřejně dostupné a můžou je používat všichni noví a stávající zákazníci Microsoftu.

Rozhraní API a sady SDK verze Preview jsou poskytovány bez smlouvy o úrovni služeb. Doporučujeme je nepoužívat pro produkční úlohy. Některé funkce nemusí být podporované nebo můžou být omezené.

Další informace najdete v dodatečných podmínkách použití pro verze Preview v Microsoft Azure.

Zážitek z chatu

Poskytuje ChatComposite zážitky z posílání textových zpráv v reálném čase. S ohledem na flexibilitu a škálovatelnost ChatComposite se může přizpůsobit různým rozložením nebo zobrazením vašich aplikací bez složitosti. Můžete se také rozhodnout nezobrazit pohled ChatComposite a místo toho dostávat oznámení, která by vyhovovala vašim různým obchodním potřebám.

Ios	Android

Kvalita a zabezpečení

Podobně jako CallComposite také ChatComposite využívá přístupové tokeny služby Azure Communication Services. Aby měli přístup k chatu jenom uživatelé s příslušnými oprávněními, před zahájením chatu je potřeba jejich tokeny uživatelů přidat do platného vlákna chatu.

Další podrobnosti

Pokud potřebujete další podrobnosti o mobilních složených souborech pro chat, podívejte se na případy použití.

Jaký artefakt uživatelského rozhraní je pro můj projekt nejvhodnější?

Tyto požadavky vám pomůžou zvolit správnou klientskou knihovnu:

• Kolik přizpůsobení si přejete? Základní klientské knihovny Azure Communication Services nemají uživatelskou architekturu a jsou navržené tak, abyste mohli sestavit libovolné uživatelské rozhraní, které chcete. Komponenty knihovny uživatelského rozhraní poskytují prostředky uživatelského rozhraní za cenu sníženého přizpůsobení.

• Na jaké platformy cílíte? Různé platformy mají různé možnosti.

Tady jsou některé klíčové kompromisy:

Klientská knihovna / sada SDK	Složitost implementace	Možnost přizpůsobení	Volání	Konverzace	Interoperabilita Teams
Složené komponenty	Nízká	Nízká	✔	✔	✔
Základní klientské knihovny	Vysoká	Vysoká	✔	✔	✔

Další informace o dostupnosti funkcí v knihovně uživatelského rozhraní najdete v tématu Případy použití knihovny uživatelského rozhraní.

Příručky pro rychlý start

Známé problémy

• Známé problémy s iOSem
• Známé problémy s Androidem