|
Průvodce tvorbou
nápovědy – 12. díl |
Vážení čtenáři,
dnes se podíváme na
pokročilejší prvky světa HTML nápovědy. Uvidíte, jak pracují asociativní linky,
dozvíte se, jak sestrojit rejstřík jiným způsobem a nakonec se podíváme i na
to, jak opatřit stromovou strukturu témat nápovědy vlastními ikonami.
Pokud jste měli to
potěšení pracovat s nápovědou typu Windows 95 (WinHelp 4.0), možná si
vzpomenete na podivně vyhlížející makro ALink. Toto makro prohledávalo
specifikovaná slova v celém systému nápovědy a poté nabízelo seznam témat
nápovědy, která obsahovala zadaná slova v poznámce pod čarou, ve
speciálním dialogovém okně. Prostřednictvím této techniky bylo poměrně snadné
opatřit téma nápovědy tlačítkem nebo jiným citlivým místem, po aktivací kterého
se automaticky vyhledaly další „příbuzná“ témata se souvisejícími informacemi.
Popsaná technika se označuje jako asociativní linkování témat nápovědy. Když se
přeneseme do prostředí HTML nápovědy, můžeme konstatovat, že i tady se uvedený
algoritmus vyhledávání příbuzných témat nápovědy využívá. Implementační postup
je zde sice poněkud odlišný, zdaleka však ne náročný a úsilí, jenž věnujete
pochopení problematiky asociativního přepojování témat nápovědy se vám
v budoucnosti zcela jistě vrátí i s pomyslnými úroky.
Jak pracuje asociativní linkování témat
Idea je docela
jednoduchá: Je potřebné všechny HTML soubory opatřit vhodnými textovými
identifikátory, aby je později mohl HTML Help engine najít a rozeznat. Proto do
každého žádaného HTML souboru vkládáme určité klíčové slovo, případně specifická
slovní spojení, která charakterizují daný soubor. Poté využijeme dovedností ovládacího
prvku HTML Help ActiveX a zařadíme možnost dynamického prohledávání témat
nápovědy. Jakmile vše úspěšně proběhne, vygenerujeme platný soubor HTML
nápovědy a veškeré funkční starosti asociativního linkování témat přenecháme
HTML Help enginu. Když pak uživatel klepne na tlačítko pro další, podrobnější
informace, HTML Help engine se nastartuje, přebere vstupní parametr (klíčové
slovo, případně slova, která se budou vyhledávat), a následně prohledá všechna
dostupná témata nápovědy. Jestli se mu podaří najít alespoň jedno téma podle
zadaných kriterií, zobrazí jej, nebo poskytne seznam všech nalezených témat. Dobrou
zprávou je, že se prohledávají všechna „viditelná“ témata, to znamená například
i všechna témata modulárního systému HTML nápovědy, na která odkazuje obsahová
struktura nápovědy. Výhodnou vlastností klíčových slov pro A-linkování je
jejich neviditelnost z pohledu koncového uživatele. Protože tato klíčová
slova (říkejme jim A-klíčová slova) jsou vkládána do ryzího HTML kódu, nikdy
nebudou přímo k dispozici uživateli. Konstrukci uvedené techniky linkování
zobrazuje obr. 1.
Obr. 1 – Jak pracuje
asociativní linkování témat nápovědy
V následujících sekcích probádáme, jak se asociativní propojování
témat nápovědy využívá v praxi.
Asociativní linkování témat nápovědy
Krok 1: Vkládání A-klíčových slov do HTML souborů
Prvním krokem je
vložení odpovídajících klíčových slov přímo do HTML kódu příslušných souborů
s tématy.
|
Pomocné soubory
pro následující cvičení si můžete zkopírovat
zde. |
Postupujte
následovně:
Obr. 2 –
Proces vkládání A-klíčového slova do HTML souboru
Všimněte si, že do HTML kódu se vložila
značka <OBJECT> s příslušnými parametry.
<Object
type="application/x-oleobject"
classid="clsid:1e2a7bd0-dab9-11d0-b93a-00c04fc99f9e">
<param name="ALink
Name" value="informace">
</OBJECT>
Hodnota parametru Name nám říká, že jde o A-klíčové slovo a hodnota
parametru Value toto klíčové slovo blíže specifikuje.
Asociativní linkování témat nápovědy
Krok 2: Použití ovládacího prvku HTML Help ActiveX
Ve druhé etapě je
zapotřebí vložit do HTML souboru instanci ovládacího prvku, který zajišťuje
veškerou funkcionalitu asociativního propojení témat nápovědy. Připomínám, že
instance tohoto prvku se vkládá do toho souboru, ve kterém chceme zpřístupnit
tlačítko s názvem „Další informace“. Postupujte takto:
Obr. 3 –
Průvodce vložením instance ovládacího prvku ActiveX: Krok 1
Obr. 4 –
Průvodce vložením instance ovládacího prvku ActiveX: Krok 2
Obr. 5 –
Průvodce vložením instance ovládacího prvku ActiveX: Krok 3
Obr. 6 –
Editace A-klíčového slova ve 4. kroku průvodce
Když se podíváte do HTML kódu vašeho souboru, uvidíte v něm několik
řádek, které za vás vytvořil průvodce. Měly by vypadat asi takto:
<OBJECT
id=hhctrl type="application/x-oleobject"
classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"
codebase="hhctrl.ocx#Version=4,74,8875,0"
width=100
height=100
>
<PARAM name="Command"
value="ALink">
<PARAM name="Button"
value="Text:Další informace">
<PARAM name="Flags"
value=",,1">
<PARAM name="Item1"
value="">
<PARAM name="Item2" value="informace">
</OBJECT>
Obr. 7 – Asociativní linkování v praxi
Tvorba
rejstříku podruhé: Dynamický rejstřík
Možná si vzpomínáte,
jak jsme v 9. dílu našeho seriálu společně vytvářeli rejstřík pro HTML
nápovědu. Při tvorbě jsme používali vestavěný editor, jenž je součástí kompilačního
programu HHW. Ve skutečnosti ovšem existuje ještě další způsob, jak lze
rejstřík sestrojit. Ano, uhodli jste, jde o takzvaný dynamický rejstřík. Hlavní
pointou tvorby dynamického rejstříku je právě jeho „dynamická“ povaha: Finální
rejstřík je poskládán za pomoci kompilátoru z klíčových slov, která se
nacházejí v jednotlivých HTML souborech. Analýzou můžeme proces tvorby
dynamického rejstříku rozdělit do dvou etap:
Uvedenou situaci
demonstruje obr. 8.
Obr. 8 – Principy tvorby dynamického rejstříku
Možná se ptáte,
k čemu je takovýto způsob tvorby rejstříku dobrý, když editace rejstříku
pomocí editoru je určitě pohodlnější. Odpovědí je rozšířená funkčnost a
manipulovatelnost. Pokud se totiž rozhodnete pro cestu vkládání K-klíčových
slov do vašich HTML souborů, můžete počítat s těmito výhodami navíc:
|
K-klíčová slova jsou v HTML nápovědě vždy
viditelná, protože tvoří položky rejstříku, a tedy je uživatel může přímo
prohlížet. Na druhé straně, A-klíčová
slova nejsou pro koncového
uživatele viditelná. Právě tato „viditelnost“ je hlavním rozlišovacím
znakem mezi A a K-klíčovými slovy. |
Krok
1: Vkládání K-klíčových slov do HTML souborů
|
Pomocné soubory
pro následující cvičení si můžete zkopírovat
zde. |
Obr. 9 – Vkládání K-klíčového slova do HTML souboru
Kompilační program následně vloží do HTML souboru tyto řádky:
<Object
type="application/x-oleobject"
classid="clsid:1e2a7bd0-dab9-11d0-b93a-00c04fc99f9e">
<param name="Keyword" value="Téma1">
</OBJECT>
Krok
2: Úprava vlastností projektového souboru nápovědy
Nyní musíme
kompilátoru říct, aby pracoval s K-klíčovými slovy, které získá z příslušných
HTML souborů. Udělejte proto následovní:
Obr. 10 – Začlenění K-klíčových slov do rejstříku
Když spustíte soubor
nápovědy, uvidíte, že se v rejstříku nacházejí i ta K-klíčová slova, která
jste začlenili od HTML souborů.
|
I když chcete
rejstřík vytvářet z K-klíčových slov, která se budou nacházet
v HTML souborech, musíte vytvořit
standardní rejstřík a jeho název sdělit kompilátoru nápovědy. Název
rejstříku musí být uveden jak v okně Options na záložce Files, tak i v okně Window Types na záložce Files. Standardní rejstřík
sice musíte vytvořit, no můžete ho nechat prázdný (zaplní se později
K-klíčovými slovy). Jde bohužel o omezení programu, které ovšem musíme
respektovat. |
Vlastní
ikony v obsahové struktuře témat nápovědy (TOC)
Autoři nápovědy
zpravidla velmi rádi vylepšují a rozšiřují svá „díla“ všemožnými způsoby. A
právě možnost změnit standardní ikony stromové struktury témat za své vlastní
se ukazuje jako vysoce výhodná v procesu odlišení se od konkurence. Protože
se mnoho čtenářů zajímá o tuto problematiku, ukážeme si na následujících
řádcích, jak na to.
Jak pravděpodobně
již velmi dobře víte, kompilátor vám nabízí 42 ikonových obrázků, které můžete
ve stromové struktuře využít. Pokud se ovšem rozhodnete pro zařazení vlastních
ikon, limit „42“ můžete docela snadno překročit. První, co si musíte při tvorbě
nových ikon uvědomit, je skutečnost, že všechny ikony jsou uspořádány
v tzv. ikonovém proužku. Tento ikonový proužek si můžete představit jako
sekvenci filmových políček, ve které každé políčko představuje jeden obrázek. Druhou
podstatnou věcí je, že tato filmová políčka mají stejnou výšku a šířku rovnou
16 pixelům. A konečně, třetí nezbytnou indicií je obrazový formát souboru
filmových políček, který počítá se 16 barvami. Příklad ikonového proužku je na
obr. 11.
Obr. 11 – Ilustrace ikonového proužku
I když můžete
vytvořit ikonový proužek se zcela novými ikonami a ten poté začlenit do
projektového souboru nápovědy, měli byste mít na paměti jistá doporučení, která
se k této tematice vážou. Je všeobecně výhodné, když několik prvních
políček přenecháte standardním ikonám a teprve za ně přidáte své vlastní
obrázky. Dále pamatujte na to, že při kompilačním procesu se nezačleňuje obsah
souboru s ikonovým proužkem do finálního souboru nápovědy. To tedy
znamená, že společně se souborem nápovědy musíte distribuovat i soubor
s ikonovým proužkem. Rovněž nezapomeňte, že vlastní ikony v TOC
nemůžete použít, když při kompilaci máte aktivovanou volbu Create a binary TOC. Dobrá, to je na začátek vše, a teď si předveďme,
jak postupovat v praxi.
Krok
1: Tvorba souboru s ikonovým proužkem
|
Ikonový proužek
můžete vytvořit v libovolném grafickém editoru. Abyste věděli, jak
takový proužek vypadá,
zkopírujte jej do
složky, ve které se nachází váš projekt nápovědy. |
Krok
2: Začlenění souboru s ikonovým proužkem do projektu
Po provedených změnách by měla sekce General vypadat takto:
Obr. 12 – Editace záložky
General
|
Možná jste
překvapeni, proč je zapotřebí kompilační program zavírat. Jde bohužel o další
omezení programu. Aby totižto kompilátor diagnostikoval nový soubor
s ikonovým proužkem, je nutno zavřít program HHW, zvonu jej spustit a
opětovně otevřít i váš projektový soubor. |
Krok
3: Nastavení vlastních ikon v TOC
Obr. 13 – Výběr ikony
Obr. 14 – Uživatelské ikony v TOC
Věřím, že dnešní
hodina „nápovědní výchovy“ se vám líbila.
Těším se na
shledanou příště.