Skróty klawiaturowe

 

UWAGA: Tłumaczenie tej strony nie zostało zakończone.
Może być ona niekompletna lub wymagać korekty.
Chcesz pomóc? | Dokończ tłumaczenie | Sprawdź ortografię | Więcej takich stron+.

XUL umożliwia także użycie obsługi zdarzeń związanych z klawiaturą. Jednak byłoby to nudne w odniesieniu do każdego przycisku oraz każdej pozycji znajdującej się w menu.

Tworzenie skrótu klawiaturowego

XUL dostarcza metod, za pomocą których jesteśmy w stanie zdefiniować skróty klawiaturowe. Widzieliśmy już w artykule o menu, że jesteśmy w stanie zdefiniować atrybut zwany accesskey, który określa klawisz po wciśnięciu którego aktywowane będzie menu lub też któraś z jego pozycji. W poniższym przykładzie, menu Plik może zostać wybrane poprzez wciśnięcie Alt i F (lub innej kombinacji dla danej platformy). Kiedy otworzy się menu Plik, jesteśmy w stanie wybrać pozycję Zakończ za pomocą wciśnięcia klawisza Z.

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

<menubar id="sample-menubar">
  <menu id="file-menu" label="Plik" accesskey="p">
    <menupopup id="file-popup">
      <menuitem id="close-command" label="Zakończ" accesskey="z"/>
    </menupopup>
  </menu>
</menubar>

Można także zastosować atrybut accesskey dla przycisków. W tym przypadku kiedy klawisz zostanie wciśnięty, przycisk zostanie wybrany.

Możesz jednak zechcieć ustawić więcej skrótów klawiaturowych. Przykładowo, wciśnięcie Control+C, które spowoduje skopiowanie tekstu do schowka. Chociaż skróty takie jak ten mogą nie zawsze być poprawne, to zazwyczaj działają w dowolnej chwili, w której okno jest otwarte. Skrót klawiaturowy będzie dostępny przez większość czasu, w ciągu którego możemy sprawdzić czy w jakimś sensie wykorzystuje skrypt. Przykładowo, kopiowanie tekstu do schowka powinno działać tylko w chwili, w której tekst jest zaznaczony.

Element key

XUL dostarcza element key, który pozwala nam na zdefiniowanie skrótów klawiaturowych dla okna. Posiada atrybuty określające klawisz, który powinien zostać wciśnięty, wraz z którym klawiszem modyfikującym (takie jak - Shifth lub Control). Przykład poniżej:

<keyset>
  <key id="sample-key" modifiers="shift" key="R"/>
</keyset>

Ten przykład definiuje skrót klawiaturowy, który jest aktywowany w chwili, w której użytkownik wciśnie klawisze Shift i R. Atrybut key (warto zaznaczyć, że posiada taką samą nazwę jak sam element) może być użyty w celu wykrycia, który klawisz powinien zostać wciśnięty. W tym przypadku jest to R. Możemy także dla tego atrybutu dodać dowolny znak, który ma być wciśnięty. Klawisze modyfikujące, które należy wcisnąć określa natomiast atrybut modifiers (możesz podać kilka rozdzielając spacją). Poniżej lista klawiszy modyfikujących.

alt 
The user must press the Alt key. On the Macintosh, this is the Option key.
control 
The user must press the Control key.
meta 
The user must press the Meta key. This is the Command key on the Macintosh.
shift 
The user must press the Shift key.
accel 
The user must press the special accelerator key. The key used for keyboard shortcuts on the user's platform. Usually, this would be the value you would use.

Twoja klawiatura niekoniecznie musi posiadać wszystkie klawisze. W tym przypadku będą one dostosowane do klawiszy modyfikujących, które posiadamy.

Element key musi zostać umieszczony wewnątrz elementu keyset. Ten element został zaprojektowany z myślą o przechowywaniu zestawu elementów key i służy do do grupowania wszystkich definicji klawiszy w jednym miejscu (jednym pliku). Jakiekolwiek elementy key poza elementem keyset nie będą funkcjonować.

Każda platforma używa innych klawiszy dla skrótów klawiaturowych. Przykładowo Windows używa klawisza Control, natomiast Macintosh używa klawisza Command. Byłoby zapewne niewygodne definiować oddzielnie elementy key da każdej platformy. Na szczęście, istnieje rozwiązanie. Modyfikator accel, odnosi się do specjalnego i specyficznego dla danej platformy klawisza używanego dla skrótów. Działa jak każdy inny modyfikator, ale nie dla każdej platformy tak samo.

Poniżej kilka dodatkowych przykładów:

<keyset>
  <key id="copy-key" modifiers="control" key="C"/>
  <key id="explore-key" modifiers="control alt" key="E"/>
  <key id="paste-key" modifiers="accel" key="V"/>
</keyset>

Atrybut key jest używany w celu określenia klawisza, który powinien zostać wciśnięty. Jednak, istnieją przypadki w których chcemy się odwołać do klawiszy które nie mogą zostać określone za pomocą znaków (np: klawisze funkcyjne lub klawisz Enter). Atrybut key może zostać używa dla znaków dających się wyświetlić. Natomiast dla nie możliwych do wyświetlenia znaków służy nam atrybut keycode.

Atrybut keycode powinien być ustawiony zgodnie ze specjalnym kodem, który reprezentuje klawisz jaki chcesz wykorzystać. Poniżej przedstawiamy tablicę klawiszy. Nie wszystkie z wymienionych klawiszy są dostępne dla każdej klawiatury.

VK_CANCEL VK_BACK VK_TAB VK_CLEAR
VK_RETURN VK_ENTER VK_SHIFT VK_CONTROL
VK_ALT VK_PAUSE VK_CAPS_LOCK VK_ESCAPE
VK_SPACE VK_PAGE_UP VK_PAGE_DOWN VK_END
VK_HOME VK_LEFT VK_UP VK_RIGHT
VK_DOWN VK_PRINTSCREEN VK_INSERT VK_DELETE
VK_0 VK_1 VK_2 VK_3
VK_4 VK_5 VK_6 VK_7
VK_8 VK_9 VK_SEMICOLON VK_EQUALS
VK_A VK_B VK_C VK_D
VK_E VK_F VK_G VK_H
VK_I VK_J VK_K VK_L
VK_M VK_N VK_O VK_P
VK_Q VK_R VK_S VK_T
VK_U VK_V VK_W VK_X
VK_Y VK_Z VK_NUMPAD0 VK_NUMPAD1
VK_NUMPAD2 VK_NUMPAD3 VK_NUMPAD4 VK_NUMPAD5
VK_NUMPAD6 VK_NUMPAD7 VK_NUMPAD8 VK_NUMPAD9
VK_MULTIPLY VK_ADD VK_SEPARATOR VK_SUBTRACT
VK_DECIMAL VK_DIVIDE VK_F1 VK_F2
VK_F3 VK_F4 VK_F5 VK_F6
VK_F7 VK_F8 VK_F9 VK_F10
VK_F11 VK_F12 VK_F13 VK_F14
VK_F15 VK_F16 VK_F17 VK_F18
VK_F19 VK_F20 VK_F21 VK_F22
VK_F23 VK_F24 VK_NUM_LOCK VK_SCROLL_LOCK
VK_COMMA VK_PERIOD VK_SLASH VK_BACK_QUOTE
VK_OPEN_BRACKET VK_BACK_SLASH VK_CLOSE_BRACKET VK_QUOTE
VK_HELP      

Na przykład, aby stworzyć skrót, który jest aktywowany w chwili, w której użytkownik naciśnie Alt i F5, należy użyć poniższego kodu:

<keyset>
  <key id="test-key" modifiers="alt" keycode="VK_F5"/>
</keyset>

Poniższy przykład demonstruje więcej skrótów klawiaturowych:

<keyset>
  <key id="copy-key" modifiers="accel" key="C"/>
  <key id="find-key" keycode="VK_F3"/>
  <key id="switch-key" modifiers="control alt" key="1"/>
</keyset>

Pierwszy klawisz został wywołany w chwili, w której użytkownik wcisnął określony dla swojej platformy klawisz skrótu i C. Drugi został wywołany poprzez wciśnięcie F3. Trzeci jest wywołany poprzez wciśnięcie klawisza Control, klawisza Alt i 1. Jeśli chcesz oddzielić klawiszze głównej części klawiatury i klawisze numeryczne, zastosuj klawisze VK_NUMPAD (takie jak VK_NUMPAD1).

Po więcej informacji na temat skrótów klawiaturowych zajrzyj do Mozilla Keyboard Planning FAQ and Cross Reference.

Zastosowanie skrótów klawiaturowych

Kiedy już wiemy jak zdefiniować skróty klawiaturowe, nauczymy się jak ich używać. Istanieją dwa sposoby. Pierwszy, najprostrzy, wymaga skorzystania z obsługi zdarzenia keypress dla elementu key. Kiedy użytkownik wciśnie klawisz, skrypt zostanie wywołany. Przykład poniżej:

<keyset>
  <key id="copy-key" modifiers="accel" key="C" oncommand="DoCopy();"/>
</keyset>

Funkcja DoCopy będzie wywołana w chwili w której użytkownik wciśnie klawisz wyspecyfikowany przez element key. W tym przypadku są to klawisze przewidziane do operacji kopiowania do schowka (takie jak Control i C). Będzie to działać jeśli tylko okno jest otwarte. Funkcja DoCopy powinna sprawdzać czy text jest zaznaczony, a następnie kopiować go do schowka. Zauważmy, że pola tekstowe posiadają wbudowane skróty klawiaturowe, więc nie musimy ich sami implementować.

Przypisanie skrótu w menu

Jeśli przypisujemy skróty klawiaturowe, które wykonują komendy, które także znajdują się w menu, jesteśmy w stanie powiązać element key bezpośrednio z menu command. Aby to zrobić, dodajemy atrybut key dla pozycji w menuitem. Przypiszmy jej wartość id klawisza, którego chcemy użyć. Poniżej przykład:

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

grafika:keyshort1.png
<keyset>
  <key id="paste-key" modifiers="accel" key="V"
          oncommand="alert('Paste invoked')"/>
</keyset>

<menubar id="sample-menubar">
  <menu id="edit-menu" label="Edit" accesskey="e">
    <menupopup id="edit-popup">
      <menuitem id="paste-command" 
         accesskey="p" key="paste-key" 
         label="Paste" oncommand="alert('Paste invoked')"/>
    </menupopup>
  </menu>
</menubar>

Atrybut key przypisany do pozycji w menu, który w tym przypadku jest klawiszem odpowiadającym z opcję wklejenia, jest równy id zdefiniowanego klawisza. Możemy go użyć dla dodatkowych klawiszy, jak i dla zdefiniowania skrótów klawiaturowych dowolnej liczby pozycji znajdujących się w menu.

Warto także zauważyć na obrazku, że tekst został umieszczony zaraz przy polecanie Paste (znajdującym się w menu), w celu wykrycia czy klawisze Control i V zostały wciśnięte, aby wywołać polecenie menu. Skróty klawiaturowe dodane do menu będą działać nawet jeśli menu nie jest otwarte.

Kolejną dodaktową cechą definicji klawiszy jest prosta możliwość ich dezaktywacji. Aby to zrobić wystarczy dodać atrybut disabled do elementu key i ustawić jego wartość na true. Wyłącza to skrót klawiaturowy, pozbawiając go możliwości wywołania. Wygodnie jest zmieniać wartość atrybutu disabled poprzez użycie skryptów.

Nasz przykład: Znajdź pliki

Dodajmy skróty klawiaturowe do naszego przykładu okna dialogowego Znajdź pliki. Dodamy ich cztery, po jednym dla poleceń Wytnij, Kopiuj, Wklej i Zamknij (kiedy użytkownik wciśnie Escape).

<keyset>
  <key id="cut_cmd" modifiers="accel" key="X"/>
  <key id="copy_cmd" modifiers="accel" key="C"/>
  <key id="paste_cmd" modifiers="accel" key="V"/>
  <key id="close_cmd" keycode="VK_ESCAPE" oncommand="window.close();"/>
</keyset>

<vbox flex="1">
 <toolbox>
  <menubar id="findfiles-menubar">
   <menu id="file-menu" label="Plik" accesskey="f">
     <menupopup id="file-popup">
       <menuitem label="Otwórz szukanie..." accesskey="o"/>
       <menuitem label="Zapisz szukanie..." accesskey="s"/>
       <menuseparator/>
       <menuitem label="Zakończ" accesskey="c" key="close_cmd"
         oncommand="window.close();"/>
     </menupopup>
   </menu>
   <menu id="edit-menu" label="Edycja" accesskey="e">
     <menupopup id="edit-popup">
       <menuitem label="Wytnij" accesskey="t" key="cut_cmd"/>
       <menuitem label="Kopiuj" accesskey="c" key="copy_cmd"/>
       <menuitem label="Wklej" accesskey="p" key="paste_cmd" disabled="true"/>
     </menupopup>
   </menu>

Teraz możemy użyć tych skrótów klawiaturowych w celu aktywacji komend. Oczywiście, komendy schowka, nie robią na razie nic, ponieważ nie napisaliśmy na razie żadnych skryptów.

Zdarzenia klawiszy

Istnieją trzy zdarzenia związane z klawiaturą, które mogą zostać użyte w przypadku, w którym cechy klawiszy opisane wyżej nie są odpowiednie. Tymi zdarzeniami są:

keypress 
Wywoływany gdy klawisz został wciśnięty i puszczony na aktywnym elemencie. Można wykorzystać do weryfikacji dozwolonych znaków w polu.
keydown 
Wywoływany gdy klawisz został wciśnięty na aktywnym elemencie. Zwróć uwagę, że zostanie wywołany jak tylko przycisk zostanie wciśnięty, nawet jeśli nie został puszczony.
keyup 
Wywoływany gdy klawisz został puszczony na aktywnym elemencie.

Zdarzenia klawiszy będą wysyłane tylko do tych elementów na których skupiona jest uwaga (focus). Typowo, będą to textboxy, przyciski, checkboy itp. Jeśli uwaga nie jest skupiona na żadnym z elementów to zdarzenie klawisza, będzie się odnosiło w stosunku do dokumentu XUL. W tym przypadku, można dodać nasłuch zdarzenia do znacznika window . Jeśli jednak chcesz odpowiadać na działanie klawiszy globalnie, będziesz zmuszony do wykorzystania skrótów klawiaturowych, zgodnie z powyższymi wskazówkami.

Obiekt zdarzenia klawisza posiada dwie własności, które przechowują klawisz, który został wciśnięty. Własność keyCode przetrzymuje kod klawisza i może posłużyć do porównania z jedną ze stałych wymienionych w tabelce powyżej. Natomiast charCode, jest używana dla możliwych do wyświetlenia znaków i przechowuje kod znaku wciśniętego klawisza.

Następnie dowiemy się jak podtrzymać zaznaczenie i aktywację elementu.

 

 

Autorzy i etykiety dokumentu

 Autorzy tej strony: jigs12, teoli, Ptak82, Peyn, Mgjbot, Bedi, Sadek
 Ostatnia aktualizacja: jigs12,