mozilla
Wyniki wyszukiwania

    Paski postępu

    W tym artykule przyjrzymy się bliżej sposobom tworzenia pasków postępu.

    Dodanie paska postępu

    Pasek postępu jest paskiem, który wyświetla, jaka cześć zadania jest już wykonana. Najczęściej spotykamy się z paskiem postępu podczas pobierania plików lub podczas trwania długotrwałych operacji. XUL posiada zdefiniowany element progressmeter, który stosuje się do tworzenia nowego paska. Rozróżniamy dwa typy pasków postępu: określony i nieokreślony.

    Określone paski postępu są stosowane, gdy znamy długość czasu, jaki będzie potrzebny do wykonania danej operacji. Pasek postępu będzie się wypełniał, gdy będzie już pełny, operacja powinna zostać zakończona. Najczęściej wykorzystywanymi okienkami, które stosują ten typ paska, to okienka dialogowe pobierania pliku, oczywiście, jeśli znany jest rozmiar pliku.

    Nieokreślone paski postępu stosujemy, gdy nie znamy długości czasu, jaki będzie potrzebny do wykonania danej operacji. Pasek postępu będzie posiadał animację wypełniających się słupków lub wypełniającego się paska, zależy to od wykorzystywanej platformy systemowej oraz ustawionego motywu przeglądarki.

    Określony pasek postępu: Grafika:prog-det.png

    Nieokreślony pasek postępu: Grafika:prog-udet.png

    Pasek postępu posiada następującą składnię:

    <progressmeter
        id="identifier"
        mode="determined"
        value="50%"/>
    

    Atrybutami są:

    id 
    Unikalny identyfikator paska postępu,
    mode 
    Typ paska postępu. Jeśli jest ustawiony na wartość determined, pasek postępu jest określonym paskiem postępu, wypełniającym się do momentu ukończenia wykonywanego zadania. Jeśli jest ustawiony na wartość undetermined, pasek postępu jest nieokreślony, przy którym nieznany jest czas trwania operacji. Jeśli typ paska nie zostanie ustawiony, to przyjęta zostanie wartość domyślna - determined.
    value 
    Bieżąca wartość paska postępu. Stosujemy dla określonych pasków postępu. Wartość wyrażona w procentach powinna zawierać się w przedziale od 0% do 100%. Wartość byłaby zmieniana przez skrypt, kiedy zadanie zakończy się.
    Przykład okna: Znajdź pliki

    Dodajmy pasek postępu do naszego okna dialogowego Znajdź pliki. Normalnie powinno się stosować nieokreślony pasek postępu, ponieważ nie wiemy jak wiele plików będziemy szukać lub jak długo będzie trwało szukanie. Jednakże, możemy dodać jeden normalny pasek jako animowany pasek postępu, który może być nieokreślony podczas programowania. Pasek postępu będzie wyświetlany normalnie tylko podczas szukania. W kolejnych artykułach dodamy skrypty do uruchomienia paska postępu.

    <hbox>
    
      <progressmeter value="50%" style="margin: 4px;"/>
    
      <spacer flex="1"/>
    </hbox>
    


    Wartość ustawiona jest na 50%, aby widoczny był pasek postępu w oknie. Margines został ustawiony na 4 piksele tak, aby pasek był o tyle oddalony od brzegu okna. Jak wcześniej wspomniano, chcemy, aby pasek postępu był wyświetlany jedynie podczas szukania plików. Skrypt będzie go wyświetlał oraz ukrywał, zależnie od konieczności.


    Przykład: Źródła Podgląd

    Grafika:progress1.png

    W kolejnym artykule dowiemy się, w jaki sposób dodać elementy do okna, stosując język HTML.

    Autorzy i etykiety dokumentu

    Etykiety: 
    Contributors to this page: Takenbot, teoli, Witia, Mgjbot, Ptak82, Marcin Otorowski
    Ostatnia aktualizacja: teoli,