Oprettelse af HTML5-widgets til iBooks Author

Læs mere om, hvordan du opretter HTML5-widgets, som du kan bruge i de bøger, du opretter i iBooks Author.

iBooks Author understøtter HTML5-widgets, der har arkivendelsen .wdgt. Hvis du vil oprette en HTML5-widget, skal du bruge et tekstbehandlingsprogram eller et program til oprettelse af indhold til at oprette disse tre arkiver:

  • HTML-hovedarkiv: Arkivet udgør hoveddelen af widget'en. Navnet er valgfrit, men arkivendelsen skal være ".html". Du kan placere CSS og JavaScript i HTML-hovedarkivet. Du kan også tilføje arkiver af typen .css og .js til widget-pakken og indlæse dem fra HTML-hovedarkivet. Du kan bruge alle de teknikker, du normalt bruger til at designe en webside. Brug HTML til at definere widget'ens opbygning, CSS til at angive den visuelle stil og JavaScript til at gøre den interaktiv. 
  • Default.png-arkiv: Den nemmeste måde at oprette Default.png er at tage et skærmbillede af HTML-hovedarkivet i et program til oprettelse af webindhold eller en webbrowser. Det er det billede, som læserne ser på siden og trykker på for at åbne widget'en. Tag et skærmbillede af HTML-hovedarkivet i en webbrowser eller et program til oprettelse af webindhold. Giv den navnet "Default.png" med stort "D". Når din widget er aktiv, er den på størrelse med arkivet Default.png. Du kan ændre dens størrelse i arkivet Info.plist.
  • Arkivet Info.plist: Dette arkiv giver iBooks Author og iBooks de nødvendige oplysninger til at køre widget'en. Arkivnavnet skal være "Info.plist".

Når du har oprettet disse nødvendige arkiver, kan du oprette alle de arkiver, som du ønsker, f.eks. CSS- eller JavaScript-arkiver. Derefter kan du føje dem til en widget-pakke:

  1. Opret en mappe i Finder.
  2. Føj arkiverne til din nye mappe.
  3. Omdøb mappen, og føj arkivendelsen .wdgt til mappenavnet for at oprette en widget-pakke. Mappesymbolet skifter til et widget-symbol.
  4. Føj din widget til iBooks Author.

Tip til oprettelse af widgets

Før du opretter din widget-pakke, skal du sørge for, at ingen af arkiverne i pakken indeholder et kontroltegn i arkivnavnet. Hvis det er tilfældet, kan du ikke publicere bogen i iBooks Store.

Hvis du indstiller din widget til automatisk afspilning, kan den ikke få forbindelse til internettet. 

Du må ikke bruge brugertilpassede mappesymboler, og du skal undgå følgende mappenavne i din widget:

  • Resources/
  • Support Files/Resources/
  • Contents/Resources/

Sådan optimerer du din widget til en Retina-skærm:

  • Brug standardprotokollen for websteder med Retina-grafik (2x) i HTML-, CSS- og JavaScript-arkiver. 
  • Medtag et arkiv af typen Default@2x.png i widget'en. Giv arkivet en opløsning, der er dobbelt så stor som Default.png. Du kan ikke se dette arkiv i iBooks Author, men du kan se det i iBooks på en Retina-skærm.

Læs mere om, hvordan du optimerer de bøger, som du opretter med iBooks Author.

Info.plist

I en almindelig widget indeholder arkivet Info.plist obligatoriske nøgler og valgfrie nøgler. Denne tabel er en oversigt over disse nøgler, deres definitioner og nogle eksempelværdier for en widget, der hedder "Hej verden". 

Nøgle Eksempelværdi Obligatorisk Definition
CFBundleDevelopmentRegion Danish Valgfrit En streng, der angiver pakkens oprindelige region. Er normalt modersmålet for den person, der har oprettet pakken. 
CFBundleDisplayName Hej verden Obligatorisk En streng, der indeholder navnet på en widget. Dette vises i iBooks Author og iBooks.
CFBundleIdentifier com.apple.widget.HelloWorld Obligatorisk En streng, der indeholder en entydig identifikation af widget'en i reverse domain-format.
CFBundleName Hej verden Valgfrit En streng, der indeholder navnet på widget'en. Navnet skal svare til navnet på widget-pakken i Finder bortset fra arkivendelsen .wdgt.
CFBundleShortVersionString 1,0 Valgfrit En streng, der angiver widget'ens forkortede versionsnummer. Det er ofte det samme som CFBundleVersion.
CFBundleVersion 1,0 Valgfrit En streng, der angiver widget'ens versionsnummer.
Height 768 Valgfrit Et tal, der angiver widget'ens højde målt i pixel. Hvis der ikke angives et tal, bruges højden fra Default.png.
MainHTML HejVerden.html Obligatorisk En streng, der indeholder navnet på det HTML-arkiv, der implementerer widget'en.
Width 1024 Valgfrit Et tal, der angiver widget'ens bredde målt i pixel. Hvis der ikke angives et tal, bruges bredden fra Default.png.
IBNotifiesOnReady <true/> Valgfrit Hvis nøglen sættes til "true", giver den iBooks besked om, hvornår der skal skiftes fra visning af Default.png-arkivet til visning af den kørende HTML-widget. 

 

Hele Info.plist for en widget ser sådan ud: 

<?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>

Restriktioner og begrænsninger for nøgler

Du må ikke bruge disse nøgler – funktionerne er ikke kompatible:

Nøgle Beskrivelse
AllowFileAccessOutsideOfWidget Widgets i bøger, der er oprettet i iBooks Author, kan ikke anvende arkiver i det almindelige arkivsystem.
AllowFullAccess Kort navn for en liste med andre adgangsnøgler, hvoraf nogle ikke er kompatible.
AllowInternetPlugins Internettilbehør, f.eks. Flash, kan ikke bruges i bøger, der er oprettet i iBooks Author. Du kan medtage film og lyd ved at bruge <video>- og <lydelementerne> i HTML5.
Film og lyd i HTML-widgets er ikke DRM-beskyttet.
AllowJava Widgets i bøger, der er oprettet i iBooks Author, kan ikke have Java-indhold.
AllowSystem Widgets i bøger, der er oprettet i iBooks Author, kan ikke anvende systemkommandoer.
Tilbehør Widgets i bøger, der er oprettet i iBooks Author, kan ikke indeholde en Cocoa-tilbehørskomponent.

iBooks Author ignorerer følgende nøgler: 

Nøgle Beskrivelse
CloseBoxInsetX Widgets i iBooks Author og iBooks kan ikke vise tætte dekorationer.
CloseBoxInsetY  

 

Skrifter Widgets i iBooks Author kan ikke anvende skriftpakker.

Krav til video og lyd

Det er ikke muligt at bruge medier med arkivendelserne .m4v eller .m4p. Brug et af følgende formater med arkivendelsen .mp4:

  • H.264-video: Op til 720p, 60 billeder pr. sekund. High Profile-niveau 4.2 med AAC-LC-lyd op til 160 kbps, 48 kHz, stereolyd. Videoer, der åbnes i iMovie 10 med indstillingen HD 720p bruger disse indstillinger.
  • MPEG-4-video: Op til 2,5 Mbps, 640 x 480 pixels, 30 billeder pr. sekund. Simple Profile med AAC-LC-lyd op til 160 kbps pr. kanal, 48 kHz, stereolyd.

Lyd: Brug AAC (8 til 320 Kbps, 48 kHz stereo) med .m4a-arkivendelse.

Video- og lydmedier i pakker med HTML-widgets er ikke DRM-beskyttede.

Hvis en film eller et lydarkiv ikke afspilles i din widget i iBooks Author, kan du få vist en eksempelvisning på din iPhone, iPad eller Mac-computer. På den måde kan du se, hvordan arkivet afspilles i den færdige bog.

Lokalisering

iBooks Author understøtter ikke lokaliserede strenge og aktiver. Medtag tekststrenge på målsproget, som læseren kan se integreret.

Ret beskårne elementer

Et element, f.eks. <video>, kan se beskåret ud i den ene side. Det kan ske, hvis dimensionerne er større end den tilgængelige plads. Find "width:auto" i #video-vælgeren i CSS, og vælg den faktiske opløsning. Din widget kan f.eks. indeholde en video med dimensionerne 960 x 540. Kontroller den relevante vælger i CSS, og indstil bredde og højde til de korrekte værdier:

#video   {
	width: 960;
	height: 540;
}

Udvikling til iOS og macOS

iOS og macOS bruger forskellige inputtyper. Du kan kompensere for input via trykfunktion og mus, når du opretter dine HTML-widgets til iBooks Author.

Undgå et blink, når læseren åbner HTML-widget'en

Hvis din HTML-widget er meget kompliceret, ser dine læsere muligvis et blink, når de åbner den i iBooks. Hvis du vil undgå dette, skal du opdatere din widget, så den giver iBooks besked om, hvornår der skal skiftes fra Default.png-arkivet til HTML-widget'en.

1. Tilføj et "IBNotifiesOnReady"-element, der er indstillet til "true" i widget'ens Info.plist-arkiv. Det fortæller iBooks, at widget'en giver besked, når der skal skiftes til HTML-widget'en.

<key>IBNotifiesOnReady</key>
 <true/>






2. Indstil widget'en til at indlæse Apple JavaScript-biblioteket i <head>-delen af HTML-arkivet:

<script type="text/javascript" src="AppleClasses/AppleWidget.js"> </script>

iOS og macOS har allerede AppleWidget.js, så det behøver du ikke inkludere i din widget-pakke.

3. Indstil din widget til at give iBooks besked, når HTML-initialiseringen er afsluttet. I JavaScript-koden er det <head>-delen af HTML-arkivet:

widget.notifyContentIsReady()

Publicer på en ekstern webtjeneste

Du kan kun publicere HTML-widgets på eksterne webtjenester, hvis de bruger de korrekte CORS-headere (Cross-Origin Resource Sharing).

Udgivelsesdato: