O iBooks Author suporta widgets HTML5 (com a extensão .wdgt).
Para criar um widget HTML para o iBooks Author, use um editor de texto ou uma app de criação de conteúdo web para criar os seguintes ficheiros:
- Ficheiro HTML principal: este ficheiro é a parte principal do widget. Pode ter o nome que desejar, mas a extensão deve ser ".html". Pode colocar CSS e JavaScript no ficheiro HTML principal ou adicionar ficheiros .css e .js ao bundle do widget e definir o ficheiro HTML principal para carregá-los. Nestes ficheiros, pode usar qualquer tipo de truque ou técnica que utilizaria para criar uma página web. Em geral, o HTML é utilizado para definir a estrutura do seu widget, o CSS para lhe conferir o estilo visual e o JavaScript para suportar a interactividade.
- Default.png: esta é a imagem que aparecerá na página e que os utilizadores tocarão para abrir o seu widget. O nome deve ser "Default.png", com o "D" maiúsculo. A forma mais simples de criar um Default.png é criar uma captura de ecrã do seu ficheiro HTML principal a ser executado numa app de criação de conteúdo web ou num navegador. Quando o seu widget estiver activo ficará do tamanho da Default.png, a menos que especifique um tamanho diferente em Info.plist.
- Info.plist: este ficheiro dá ao iBooks Author e ao iBooks a informação necessária para executar o seu widget. O nome deve ser "Info.plist." Detalhes e exemplo em baixo.
Quando tiver criado os três ficheiros necessários (e talvez alguns ficheiros opcionais, como CSS ou JavaScript), junte-os num bundle do widget:
- Com o Finder, crie uma pasta onde colocará os ficheiros.
- Dê um nome à pasta e adicione-lhe a extensão .wdgt. Isto criará o bundle do widget e o ícone da pasta mudará para um ícone do widget.
O seu widget está agora pronto para ser adicionado ao iBooks Author.
Notas
- Se o seu livro tiver widgets HTML que contêm ficheiros com caracteres de controlo nos nomes dos ficheiros, não poderá ser publicado na iBooks Store. Antes de criar o seu pacote de widgets, certifique-se de que nenhum dos ficheiros no pacote utiliza estes caracteres no nome do ficheiro. Não utilize ícones de pasta personalizados.
- Evite incluir páginas com estes nomes no seu pacote de widgets:
- Resources/
- Support Files/Resources/
- Contents/Resources/
- Se está a criar conteúdos para iPads ou para Macs que tenham ecrãs Retina:
- Ao codificar os seus ficheiros HTML, CSS e JavaScript, siga o protocolo padrão de criação de sites com gráficos Retina (2x).
- O seu bundle widget deve incluir um ficheiro Default@2x.png, que deverá ter o dobro da resolução do ficheiro Default.png. Não poderá ver este ficheiro no iBooks Author, mas ficará disponível no iBooks para iPads ou Macs com um ecrã Retina.
- Se quiser que o seu widget passe para ecrã inteiro quando ampliada, escolha as dimensões 768 x 1024 píxeis para o ficheiro Default.png e 1536 x 2048 píxeis para o ficheiro Default@2x.png. Se quiser que o seu widget seja mais reduzido do que a vista de ecrã inteiro, seleccione as dimensões que pretende para o Default.png (por exemplo: 600x900) e seleccione o dobro dessa dimensão para o Default@2x.png.
- Saiba mais acerca de como optimizar livros criados com o iBooks Author.
O Info.plist
Um Info.plist básico do widget contém algumas chaves necessárias e outras opcionais. Estas chaves estão indicadas abaixo com as respectivas definições e alguns exemplos para um widget chamado “Hello World”.
| Chave | Exemplo | Definição |
| CFBundleDevelopmentRegion | Inglês | Opcional. Uma cadeia que especifica a região nativa para o bundle. Geralmente corresponde à língua nativa da pessoa que criou o bundle. |
| CFBundleDisplayName | Hello World | Necessária. Uma cadeia que contém o nome do widget que será apresentado no iBooks Author e no iBooks. |
| CFBundleIdentifier | com.apple.widget.HelloWorld | Necessária. Uma cadeia que identifica o widget, em formato de domínio inverso. |
| CFBundleName | Hello World | Opcional. Uma cadeia que contém o nome do seu widget. Deve ser igual ao nome do bundle do widget no Finder, menos a extensão .wdgt. |
| CFBundleShortVersionString | 1.0 | Opcional. Uma cadeia que dá o número da versão do widget reduzido. É geralmente igual ao do CFBundleVersion. |
| CFBundleVersion | 1.0 | Opcional. Uma cadeia que dá o número da versão do widget. |
| Height | 768 | Opcional. Um número que dá a altura do seu widget, em píxeis. Se não for indicado, é usada a altura do ficheiro Default.png. |
| MainHTML | HelloWorld.html | Necessária. Uma cadeia que dá o nome do ficheiro HTML que executa o seu widget. |
| Width | 1024 | Opcional. Um número que dá a largura do seu widget, em píxeis. Se não for indicado, é usada a largura do ficheiro Default.png. |
| IBNotifiesOnReady | <true/> | Opcional. Quando definido como "true", o widget informa o iBooks sobre quando alterar a apresentação do Default.png para o widget HTML em execução. |
O Info.plist completo para um widget terá este aspecto:
<?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>
Restrições e limitações
Algumas funcionalidades não são compatíveis. Não deverá utilizar as seguintes chaves:
| Chave | Descrição |
| AllowFileAccessOutsideOfWidget | Os widgets em livros criados no iBooks Author não conseguem aceder a ficheiros no sistema de ficheiros geral. |
| AllowFullAccess | Abreviatura de uma lista de outras chaves de acesso, algumas das quais não são compatíveis. |
| AllowInternetPlugins | Plugins da Internet, como o Flash, não estão disponíveis em livros criados no iBooks Author. Filmes e áudio podem ser incluídos através dos elementos <vídeo> e <áudio> HTML5, respectivamente. Nota: os filmes e áudio incluídos em widgets HTML não estarão protegidos por DRM (Gestão de direitos digitais). |
| AllowJava | Os widgets em livros criados no iBooks Author não podem incluir conteúdo Java. |
| AllowSystem | Os widgets em livros criados no iBooks Author não podem aceder a comandos do sistema. |
| Plugin | Os widgets em livros criados no iBooks Author não podem incluir um componente de plug-ins Cocoa. |
O iBooks Author ignora as seguintes chaves:
| Chave | Descrição |
| CloseBoxInsetX | Os widgets no iBooks Author e no iBooks não apresentam uma formatação correcta. |
| CloseBoxInsetY |
|
| Tipos de letra | Os widgets do iBooks Author não conseguem utilizar tipos de letra agregados. |
Requisitos para Filmes e Áudio
Não pode utilizar ficheiros com as extensões ".m4v" ou ".m4p".
Recomenda-se o uso de vídeo H.264 num contentor MPEG-4, com uma extensão de ficheiro ".mp4".
Para o áudio, recomenda-se o uso de áudio AAC num contentor MPEG-4, com uma extensão de ficheiro ".m4a".
Nota: o vídeo e o áudio multimédia em bundles de widget HTML não estão protegidos por DRM (gestão de direitos digitais).
Nota: em alguns casos, ficheiros de áudio e filmes em widgets HTML poderão não ser reproduzidos no iBooks Author, mas serem reproduzidos no iBooks. Se não conseguir reproduzir um ficheiro áudio ou um filme no seu widget no iBooks Author, tente pré-visualizar no iPad ou com o OS X Mavericks. Isto deverá demonstrar-lhe como o ficheiro será reproduzido no seu livro, assim que terminado.
Localização
Cadeias e recursos localizados não são suportados no iBooks Author. Portanto, cadeias de texto visíveis para o utilizador devem ser integradas na língua de chegada.
Elementos Cortados
Se um elemento, como um <vídeo>, aparecer cortado num dos lados, isto pode acontecer por estar a expandir-se para um espaço para lá do que é possível visualizar. Verifique o "width:auto" no #selector de vídeo, no CSS, e altere-o para as dimensões necessárias. Por exemplo, se o seu widget contiver um vídeo cujas dimensões são 960x540, verifique o selector, no CSS, e ajuste a largura e a altura especificamente para os valores correctos:
#video { width: 960; height: 540;}Criar para o iOS e para o OS X Mavericks
O iOS e o OS X utilizam tipos de entrada fundamentalmente diferentes e por isso, quando cria os seus widgets HTML para o iBooks Author, terá de se certificar que engloba tanto toques como cliques do rato, se quiser utilizar qualquer tipo de controlo não incluído nos gestos padrão.
Abrir o widget HTML
Dependendo da complexidade do seu widget HTML, os leitores poderão observar um flash durante a inicialização do HTML ao abrir o widget no iBooks. Para evitar o flash, modifique o seu widget de forma a informar o iBooks sobre quando mudar a apresentação do ficheiro Default.png, para passar a apresentar o widget HTML em execução.
Há três alterações que deve fazer para adicionar esta funcionalidade opcional:
- Adicione um elemento "IBNotifiesOnReady" definido como "true" ao ficheiro info.plist do widget, para que o iBooks saiba que este indicar-lhe-á quando alterar a apresentação para o widget HTML em execução:
<key>IBNotifiesOnReady</key><true/>
- Defina o seu widget para carregar a biblioteca JavaScript no CABEÇALHO do ficheiro HTML:
<script type="text/javascript" src="AppleClasses/AppleWidget.js"> </script>
Nota: o AppleWidget.js já se encontra no iPad e não necessita de o incluir no bundle do widget. - Defina o seu widget de forma a permitir que o iBooks saiba quando o HTML é iniciado. Assim, o iBooks poderá alterar a visualização do ficheiro Default.png para apresentar o widget HTML em execução, ao chamar (no JavaScript incluído no CABEÇALHO do ficheiro HTML):
widget.notifyContentIsReady()
Importante: se optar por modificar o seu widget HTML para evitar o flash, certifique-se de que executa os três passos descritos acima. É necessário concluir todos os passos para que o widget funcione correctamente.
Acerca de publicações em Serviços web externos
Os widgets HTML apenas podem publicar em serviços web externos se estes possuírem os cabeçalhos CORS (Cross-Origin Resource Sharing) adequados implementados.