Vytváření HTML5 widgetů pro iBooks Author
Přečtěte si, jak vytvářet HTML5 widgety použitelné v knížkách, které vytvoříte v iBooks Authoru.
iBooks Author podporuje HTML5 widgety, které mají koncovku souboru .wdgt. Při tvorbě HTML5 widgetu použijte textový editor nebo aplikaci pro tvorbu obsahu k vytvoření následujících tří souborů:
Hlavní HTML soubor: Tento soubor je hlavním obsahem widgetu. Může mít jakýkoli název, ale jeho přípona musí být .html. CSS a JavaScript můžete vložit do hlavního souboru HTML. Anebo můžete soubory .css a .js přidat do balíčku widgetu a načíst je z hlavního souboru HTML. Můžete použít kteroukoli techniku, která se dá použít při navrhování webových stránek. Jazyk HTML použijte k definici struktury widgetu, CSS k vytvoření vizuálního stylu a JavaScript k zajištění interaktivity.
Soubor Default.png: Nejjednodušší způsob, jak soubor Default.png vytvořit, je pořízení snímku obrazovky hlavního HTML souboru v aplikaci pro vytváření webového obsahu nebo ve webovém prohlížeči. Tohle je obrázek, který uživatelé na stránce uvidí a na který klepnou, když chtějí widget otevřít. Ve webovém prohlížeči nebo v aplikaci pro vytváření webového obsahu vytvořte snímek obrazovky s hlavním souborem HTML. Pojmenujte ho „Default.png“ a dávejte pozor, aby název začínal velkým D. Když je widget aktivní, má velikost obrázku Default.png. Jeho velikost můžete změnit v souboru Info.plist.
Soubor Info.plist: Tento soubor poskytuje iBooks Authoru a Apple Books informace potřebné ke spuštění widgetu. Název souboru musí být „Info.plist“.
Až tyto potřebné soubory vytvoříte, můžete vytvářet volitelné soubory podle libosti – třeba soubory CSS a JavaScriptu. Potom je všechny přidejte do balíčku widgetu:
Ve Finderu vytvořte složku.
Do téhle nové složky soubory přesuňte.
Přejmenujte složku a přidejte k jejímu názvu koncovku .wdgt, aby vznikl balíček widgetu. Ikona složky se změní na ikonu widgetu.
Přidejte widget do iBooks Authoru.
Tipy pro vytváření widgetů
Ještě než balíček widgetu vytvoříte, zkontrolujte, že žádný ze souborů v balíčku nemá v názvu řídicí znak. Pokud ano, nemůžete knihu publikovat v Knihkupectví Apple Books.
Když widget nastavíte na automatické spuštění, nebude mít přístup k internetu.
Nepoužívejte pro složky vlastní ikony a vyhněte se ve widgetu následujícím názvům složek:
Resources/
Support Files/Resources/
Contents/Resources/
Optimalizace widgetu pro displej Retina:
V HTML, CSS a JavaScript souborech používejte standardní postupy pro vytváření webových stránek s grafikou pro Retina displej (dvojnásobné rozlišení).
Přidejte do widgetu soubor Default@2x.png. Nastavte mu dvakrát větší rozlišení, než má soubor Default.png. Tento soubor v iBooks Authoru neuvidíte, ale zobrazí se v Apple Books na Retina displejích.
Přečtěte si další informace o optimalizaci knih vytvořených v iBooks Authoru.
Soubor Info.plist
Základní soubor Info.plist obsahuje několik povinných a několik nepovinných klíčů. Následující tabulka uvádí tyto klíče, jejich definice a několik vzorových hodnot pro widget nazvaný „Hello World“.
Klíč | Ukázková hodnota | Povinné | Definice |
CFBundleDevelopmentRegion | Angličtina | Volitelné | Řetězec určující nativní oblast balíku. Obvykle odpovídá rodnému jazyku osoby, která balík vytvořila. |
CFBundleDisplayName | Hello World | Povinné | Řetězec obsahující samotný název widgetu. Ten se zobrazí v iBooks Authoru a v Apple Books. |
CFBundleIdentifier | com.apple.widget.HelloWorld | Povinné | Jedinečný řetězec sloužící k identifikaci widgetu, zadaný v reverzním doménovém tvaru. |
CFBundleName | Hello World | Volitelné | Řetězec obsahující název widgetu. Musí být shodný s názvem balíku widgetu ve Finderu, ale bez přípony souboru .wdgt. |
CFBundleShortVersionString | 1.0 | Volitelné | Řetězec udávající zkrácené číslo verze widgetu. Často jde o stejnou hodnotu jako CFBundleVersion. |
CFBundleVersion | 1.0 | Volitelné | Řetězec udávající číslo verze widgetu. |
Výšku | 768 | Volitelné | Číslo udávající výšku widgetu v pixelech. Pokud není zadáno, použije se výška obrázku Default.png. |
MainHTML | HelloWorld.html | Povinné | Řetězec obsahující název HTML souboru, kterým je widget implementován.Width1024Volitelné |
Width | 1024 | Volitelné | Číslo udávající šířku widgetu v pixelech. Pokud není zadáno, použije se šířka obrázku Default.png. |
IBNotifiesOnReady | Volitelné | Je-li tento klíč nastaven na true, widget oznámí Apple Books, kdy má přepnout ze zobrazení souboru Default.png na zobrazení spuštěného HTML widgetu. |
Úplný soubor Info.plist widgetu vypadá třeba takto:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> <plist version="1.0"> <dict> <key>CFBundleDevelopmentRegion</key> <string>English</string> <key>CFBundleDisplayName</key> <string>Hello World</string> <key>CFBundleIdentifier</key> <string>com.apple.widget.HelloWorld</string> <key>CFBundleName</key> <string>Hello World</string> <key>CFBundleShortVersionString</key> <string>1.0</string> <key>CFBundleVersion</key> <string>1.0</string> <key>Height</key> <integer>768</integer> <key>MainHTML</key> <string>HelloWorld.html</string> <key>Width</key> <integer>1024</integer> <key>IBNotifiesOnReady</key> <true/> </dict> </plist>
Omezení klíčů
Tyto klíče nepoužívejte; funkce nejsou kompatibilní:
Klíč | Popis |
AllowFileAccessOutsideOfWidget | Widgety v knihách vytvořených pomocí iBooks Authoru nemůžou přistupovat k souborům v obecném souborovém systému. |
AllowFullAccess | Zkratka pro seznam jiných přístupových klíčů, z nichž některé nejsou kompatibilní. |
AllowInternetPlugins | V knihách vytvořených pomocí iBooks Authoru nejsou dostupné některé internetové plug-iny, například Flash. Filmy a zvuk můžete připojovat pomocí HTML5. Filmy a zvuk uvnitř HTML widgetů nejsou chráněny pomocí DRM. |
AllowJava | Widgety v knihách vytvořených pomocí iBooks Authoru nemůžou obsahovat Javu. |
AllowSystem | Widgety v knihách vytvořených pomocí iBooks Authoru nemají přístup k systémovým příkazům. |
Plug-in | Widgety v knihách vytvořených pomocí iBooks Authoru nemůžou obsahovat komponentu plug-inu Cocoa. |
iBooks Author ignoruje tyto klíče:
Klíč | Popis |
CloseBoxInsetX | Widgety v iBooks Authoru a Apple Books nezobrazují efekt tlačítka pro zavření. |
CloseBoxInsetY | |
Písma | Widgety vytvořené v iBooks Author nesmí používat přibalená písma. |
Požadavky zvuku a videa
Soubory médií s příponami .m4v nebo .m4p nelze použít. Místo nich použijte některý z těchto formátů s příponou .mp4:
Video H.264: až 720p, 60 snímků za sekundu, High Profile úrovně 4.2 se zvukem AAC-LC až 160 kb/s, 48 kHz, stereo. Videa, která se otevírají v iMovie 10 s možností rozlišení HD 720p, používají tato nastavení.
Video MPEG-4: až 2,5 Mb/s, 640 x 480 pixelů, 30 snímků za sekundu, Simple Profile se zvukem AAC-LC až 160 kb/s na kanál, 48 kHz, stereo.
Pro zvuk použijte formát AAC (8 až 320 kb/s, 48 kHz, stereo) s příponou souboru .m4a.
Video a zvuk v HTML widgetech nejsou chráněné pomocí DRM.
Pokud se soubor se zvukem nebo videem ve widgetu v iBooks Authoru nepřehrává, zkuste ho přehrát na iPhonu, iPadu nebo Macu. Tam uvidíte, jak se bude soubor přehrávat v dokončené knize.
Lokalizace
iBooks Author nepodporuje lokalizaci řetězců a zdrojů. Zahrňte textové řetězce v cílovém jazyce, které čtenář uvidí vložené.
Oprava oříznutých prvků
Prvek, jako je třeba
#video { width: 960; height: 540; }
Vývoj pro iOS a macOS
iOS a macOS používají rozdílné typy vstupů. Při vytváření HTML widgetů pro iBooks Author můžete začlenit dotykový vstup i vstup myší.
Jak zabránit zobrazení blesku, když čtenář HTML widget otevírá
Když je HTML widget hodně složitý, čtenářům se může zobrazit blesk, když ho v Apple Books otevírají. Abyste tomu zabránili, aktualizujte svůj widget, aby Apple Books oznámil, kdy je možné přepnout ze souboru Default.png na HTML widget:
1. Přidejte ve widgetu do souboru Info.plist položku „IBNotifiesOnReady“ a nastavte ji na hodnotu true. Podle toho Apple Books zjistí, že se od widgetu dozví, kdy bude možné přepnout na HTML widget.
<key>IBNotifiesOnReady</key>
2. Nastavte widget tak, aby načítal javascriptovou knihovnu Apple uvedenou
iOS a macOS už soubor AppleWidget.js mají, takže ho do balíčku nemusíte vkládat.
3. Nastavte widget tak, aby oznámil Apple Books, kdy je inicializace HTML hotová. V kódu JavaScriptu, který je
widget.notifyContentIsReady()
Uložení do externí webové služby
HTML widgety můžete ukládat do externích webových služeb, pouze pokud mají správné hlavičky Cross-Origin Resource Sharing (CORS).
