MDUIDocs
Kopírovat odkaz llms.txtKopírovat odkaz llms-full.txtZobrazit tuto stránku jako MarkdownDiskutovat o této stránce s ChatGPTDiskutovat o úplné dokumentaci projektu s ChatGPT
Přednastavená barva
Vlastní barva
Extrahovat barvu z tapety
Vyberte prosím tapetu
Začínáme
Vývoj s pomocí AI
Styly
Integrace s frameworky
Komponenty
Avatar AvatarBadge OdznakBottomAppBar Spodní aplikační lištaButton TlačítkoButtonIcon Ikonové tlačítkoCard KartaCheckbox Zaškrtávací políčkoChip ChipCircularProgress Kruhový indikátor průběhuCollapse Sbalovací panelDialog DialogDivider OddělovačDropdown Rozbalovací nabídkaFab Plovoucí akční tlačítkoIcon IkonaLayout RozvrženíLinearProgress Lineární indikátor průběhuList SeznamMenu NabídkaNavigationBar Navigační lištaNavigationDrawer Boční navigační panelNavigationRail Postranní navigační lištaRadio PřepínačRangeSlider Posuvník rozsahuSelect VýběrSegmentedButton Segmentované tlačítkoSlider PosuvníkSnackbar SnackbarSwitch SpínačTabs ZáložkyTextField Textové poleTooltip TooltipTopAppBar Horní aplikační lišta
Funkce
Knihovny

LinearProgressLineární indikátor průběhu

Lineární indikátor průběhu je horizontální indikátor používaný k zobrazení průběhu úkolu uživateli, například načítání dat nebo odesílání formuláře.

Způsob použití

Importujte komponentu podle potřeby:

import 'mdui/components/linear-progress.js';

Importujte TypeScript typy komponenty podle potřeby:

import type { LinearProgress } from 'mdui/components/linear-progress.js';

Příklad použití:

<mdui-linear-progress></mdui-linear-progress>

Příklady

Nastavení průběhu

Lineární indikátor průběhu má standardně neurčitý průběh. Pomocí atributu value můžete nastavit aktuální průběh, standardní maximální hodnota průběhu je 1.

Pomocí atributu max můžete nastavit maximální hodnotu průběhu.

API

Vlastnosti

AtributVlastnostReflectTypVýchozí
maxmaxnumber1

Maximální hodnota indikátoru průběhu. Výchozí hodnota je 1.

valuevaluenumber-

Aktuální hodnota indikátoru průběhu. Pokud tato hodnota není zadána, je v neurčitém stavu.

CSS Parts

Název
indicator

Část indikátoru.

CSS Custom Properties

Název
--shape-corner

Velikost zaoblení rohů komponenty. Lze zadat konkrétní hodnotu v pixelech; doporučuje se však odkazovat na Designové tokeny.

Obsah na této stránce