2010-11-17 3 views
8

Je saisis des données de texte à partir de fichiers XML, et je veux qu'il affiche au format de page de livre dans un UIWebView sur iPad. Les fichiers XML sortent d'un .epub, et chacun contient un seul chapitre d'un livre, divisé uniquement par les balises p. Je veux dynamiquement paginer ces fichiers dans des pages de type livre en fonction de la taille du UIWebView, qui est un écran complet de l'iPad, ainsi que par la taille de police sélectionnée par l'utilisateur. Je suis en train de charger une page html vierge avec des css connexes dans un UIWebView, en saisissant des paragraphes basés sur le nombre de caractères en tant que chaînes du XML, et en les imprimant dans le code HTML en utilisant StringByEvaluatingJavaScriptFromString et la propriété innerHTML. De toute évidence, faire cela en nombre de caractères crée des pages incorrectement espacées et bizarrement formatées, mais je ne sais pas comment «paginer» le texte.Ereader-Style Pagination

Ce que je cherche à faire est quelque chose de semblable à l'application "eReader" sur iPad: http://www.ereader.com/. Ils semblent briser dynamiquement un seul fichier dans les pages et le charger dans UIWebView s. Comment cela est-il fait?

Répondre

2

La plupart des lecteurs EPUB basés sur UIWebView utilisent simplement des colonnes CSS3 pour paginer le document.

Vous pouvez le voir en action à http://www.quirksmode.org/css/multicolumn.html

L'idée de base est que vous columnize du document, puis faire défiler horizontalement pour afficher une page spécifique. Ayant fait cela pour une application eReader populaire (canadienne) sur iPhone et iPad, je peux vous dire que la technique fonctionne mais qu'elle est loin d'être idéale.

+0

Ceci est très intéressant et certainement utile. Les questions suivantes sont alors: si CSS "colonne" tout le chapitre, existe-t-il un moyen d'accéder et de modifier le contenu des colonnes via DOM, afin de changer dynamiquement les numéros de page, etc.? De plus, comment empêchez-vous l'utilisateur de défiler librement horizontalement à travers la vue, de manière à ce qu'il soit "verrouillé" en regardant une page à la fois? – Chris

+0

En outre, les colonnes CSS3 semblent agir étrangement quand vous voulez une plus grande largeur de colonne (par exemple, sur la taille d'une fenêtre iPad). Quelle est ta solution? Fait une question distincte ici: http: //stackoverflow.com/questions/4217936/css3-columns-and-uiwebview – Chris

+0

c'est une approche vraiment intéressante. Pourriez-vous gérer les colonnes intégrées d'EPUB en utilisant cette approche ou est-ce que cela casserait le tour de «pagination»? –

1

Le code est déjà fait. Il s'appelle epubjs. C'est Javascript seulement lecteur epub.

+0

C'est assez chic. J'ai vérifié le svn et l'ai fonctionné avec quelques .epubs différents. Le problème est, quand je reçois les fichiers dans Xcode et que UIWebView charge l'index.html tout le monde tombe en morceaux. Seul le contenu de l'info-bulle est visible et il n'y a pas de style. – Chris

+0

Une autre option consiste à utiliser les fonctions de défilement lisse dans Motools, Jquery, etc. Rendez votre page Web dans plusieurs colonnes, puis naviguez jusqu'aux balises de hachage. Il y a une belle démo sur le site Web de Jquery qui permet de faire défiler n'importe quel contenu sur une page Web. –

0

Utilisez UITextView avec PageviewController. (spécifiez vos doutes s'il y en a)