Jak přizpůsobit tlačítko Asistivní čtečka

Tento článek ukazuje, jak přizpůsobit tlačítko, které spustí Asistivní čtečka, aby vyhovovalo potřebám vaší aplikace.

Tlačítko Přidat Asistivní čtečka

Sada ASISTIVNÍ ČTEČKA SDK poskytuje výchozí styl tlačítka, které spustí Asistivní čtečka. Pokud chcete tento styl povolit, použijte immersive-reader-button atribut třídy.

<div class='immersive-reader-button'></div>

Přizpůsobení stylu tlačítka

Pokud chcete nastavit styl tlačítka, použijte data-button-style atribut. Povolené hodnoty jsou icon, texta iconAndText. Výchozí hodnota je icon.

Tlačítko Ikona

Pomocí následujícího kódu vykreslíte tlačítko ikony.

<div class='immersive-reader-button' data-button-style='icon'></div>

Screenshot of the rendered button icon.

Tlačítko Text

K vykreslení textu tlačítka použijte následující kód.

<div class='immersive-reader-button' data-button-style='text'></div>

Screenshot of the text in the button.

Ikona a tlačítko textu

K vykreslení tlačítka i textu použijte následující kód.

<div class='immersive-reader-button' data-button-style='iconAndText'></div>

Screenshot of the icon and text together.

Přizpůsobení textu tlačítka

Ke konfiguraci jazyka a alternativního textu tlačítka použijte data-locale atribut. Výchozí jazyk je angličtina.

<div class='immersive-reader-button' data-locale='fr-FR'></div>

Přizpůsobení velikosti ikony

Ke konfiguraci velikosti ikony Asistivní čtečka použijte data-icon-px-size atribut. Tím se nastaví velikost ikony v pixelech. Výchozí velikost je 20 pixelů.

<div class='immersive-reader-button' data-icon-px-size='50'></div>

Další krok