itextsharp pdf to xml c# : How to create bookmark in pdf automatically software Library project winforms asp.net web page UWP documentation0-part1688

Xia
Create HTML5 interactive images
April 9, 2015
How to create bookmark in pdf automatically - add, remove, update PDF bookmarks in C#.net, ASP.NET, MVC, Ajax, WinForms, WPF
Empower Your C# Project with Rapid PDF Internal Navigation Via Bookmark and Outline
bookmark pdf reader; bookmarks pdf
How to create bookmark in pdf automatically - VB.NET PDF bookmark library: add, remove, update PDF bookmarks in vb.net, ASP.NET, MVC, Ajax, WinForms, WPF
Empower Your VB.NET Project with Rapid PDF Internal Navigation Via Bookmark and Outline
add bookmark to pdf reader; add bookmarks to pdf file
Contents
I
IntroducingXia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
a
Whatis Xia? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
b
Generalprocess . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
c
InstallingInkscapeandXia . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
II
CreatingyourfirstinteractiveimageusingInkscapeandXia: Basic
features . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2
a
Buildingthesvgsourcefiletogenerateaninteractiveimage
2
b
Generatingtheinteractive image withXia . . . . . . . . . . . . . . . . 5
c
FirefoxOSexport: howdoes itwork?. . . . . . . . . . . . . . . . . . . . . 5
d
Abstract . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
III Enrichedinteractiveimage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
a
Formattingtext . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
b
Insertingmultimediaresources intodetails . . . . . . . . . . . . . . . . 10
c
The"audioBrown"template: soundsinsteadoftext . . . . . . . . 11
d
Insertingimagesintoyourinteractiveimage . . . . . . . . . . . . . . 11
e
Displayingaquestionandunveilingananswer . . . . . . . . . . . . 12
f
Controlling details behavior : automatic display and dis-
abledzoom . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
g
Controlling order of details display in the lateral comment
zone . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
h
Abstract . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
IV
CreatinggameswithXia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
a
Firstgameprinciple: selecting,findingelements intheimage 15
b
Secondgameprinciple: classyfying,ordering,ranking . . . . . . 16
c
Thirdgameprinciple: collisions . . . . . . . . . . . . . . . . . . . . . . . . . 17
d
Advanced interactive games creation tips: Magnet effect,
tooltips,double-scoring... . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
e
Abstract . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
V
FrequentlyaskedquestionsandInkscapetips. . . . . . . . . . . . . . . . . . . . . 21
a
FAQ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
b
Inkscapetips . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
I Introducing Xia
a What is Xia ?
Xiaisafreesoftwaredeveloppedbyteachers fromthefrenchacademyofVer-
sailles. ItisreleasedunderGPLv3license. Xiaconvertertakesasvg fileasinput
andoutputsaninteractiveimageinhtml5. Xiaallowstogenerateanimationsand
interactiveactivities: draganddropgames,discrimination,selection,etc.
1
C# PDF Form Data fill-in Library: auto fill-in PDF form data in C#
project. On this C# tutorial, you will learn how to fill-in field data to PDF automatically in your C#.NET application. Following
adding bookmarks to pdf; bookmarks pdf files
VB.NET PDF Form Data fill-in library: auto fill-in PDF form data
NET Annotate PDF in WPF, C#.NET PDF Create, C#.NET search text in PDF, C#.NET edit PDF bookmark, C#.NET how to fill-in field data to PDF automatically in your
bookmarks in pdf from word; add bookmarks pdf
First sections of this documentation (see sectionII) are dedicated to make a
verysimpleinteractiveimage: croppeddetailswithcommentsonlymadeofplain
text. Then,youwilllearnhowtocreateanenrichedinteractiveimage(seesection
III).Finalsections(section IV)willteachyoutocreategames.
All examples are on line (links and downloads available at the
beginningofeachsection). At the endofeachsection,aheading
"Abstract" presents the essential guide lines to remember when
creatinganinteractiveimage.
b
General process
Xiaisonlyneededattheendoftheprocess. Aswecanseeonfigure1,mostof
theworkisdonewithavectorgraphicseditor. Werecommendusingthefreeopen-
sourceandmuliplatform softwareInkscape,whichis really easy touse (Inkscape
willbeusedinthisdocument)
1
.
OpenanImageinInkscape
Create detailsinimage
Foreachdetail,editmetadata
Saveproject
Inkscape
Createaninteractiveimageinhtml5
Xia
Figure1–CreationprocessofaninteractiveimagewithXia
If you have "image active" project files (with a .xia extension),
you can change their extension to .zip, unzip them, get the svg
filelocated intheunzippedfolder,andopenit withInkscape. If
you are using GNU/Linux, just explore the .xia file and extract
the svgfile.
c Installing Inkscape and Xia
Having Inkscape and Xia installed on your computer is the only thing you
needtoreadthisdocumentation. Youwillfindanyrelevantinformationaboutthe
installationofInkscapeonitswebsite
2
1. ItisalsopossibletouseLibreOfficeDraw.
2. http://www.inkscape.org/.
2
C# PDF Print Library: Print PDF documents in C#.net, ASP.NET
Annotate PDF in WPF, C#.NET PDF Create, C#.NET text in PDF, C#.NET edit PDF bookmark, C#.NET library control SDK for automatically printing PDF document online
pdf bookmarks; convert word pdf bookmarks
C# HTML5 PDF Viewer SDK deployment on Visual Studio .NET
C#.NET Annotate PDF in WPF, C#.NET PDF Create, C#.NET search text in PDF, C#.NET edit PDF bookmark, C#.NET XDoc.PDF.HTML5 Viewer Demo or XDoc.PDF.HTML5 Editor
bookmarks pdf documents; copy pdf bookmarks to another pdf
Make sure to installXia after Inkscape. Otherwise you willnot
beabletoaccess Xiadirectly inInkscape.
If you work on a Windows system, use the portable version to
access XiaoutsideofInkscape.
GNU/Linux Inaterminal:
$ sudo echo "deb http://repository.crdp.ac-versailles.fr/debian
xia main" | sudo tee /etc/apt/sources.list.d/xia.list
$ wget -q http://repository.crdp.ac-versailles.fr/crdp.gpg -O -
| sudo apt-key add -
$ sudo apt-get update && sudo apt-get install xia
Mac OS X Downloadandinstallthepackage:
http://xia.dane.ac-versailles.fr/download/xia.pkg
Windows Download andinstallthe Inkscape extension(http://xia.dane.ac-
versailles.fr/download/setup.exe)ortheportableversion(http://xia.dane.ac-
versailles.fr/download/xia-windows.zip).
II Creatingyourfirst interactiveimageusing Inkscape
and Xia: Basic features
a Building the svg source file to generate an interactive
image
Explore theinteractiveimage createdforthis sectionofthe doc-
umentation.
Downloadthesvg sourcefile.
Manipulationsdescribedinthissectionwillhelpyoutocreatea"basic"inter-
activeimagefeaturing:
— Zoom-inenableddetails
— Comments ondetails only made ofplaintext
Onceyouhavechosenthe image youwillwork with,openitwithInkscape:
File → Open
When asked by the software if you wish to "Link" or "Incorporate image",
choose "Incorporate".
Theinformationfilledinthedocument Metadata(Filemenu)willbeincluded
in the interactive image once generated : title, creator, rights, .... It is highly
recommended to type in this information. You can see what it looks like once
generatedontheimagebelow
3
:
3. Thefields"author"and"rights"appearinthewindow"About",symbolizedbyaclickable
buttonshapedliketheletter"i"
3
VB.NET PDF - Deploy VB.NET HTML5 PDF Viewer on Visual Studio.NET
C#.NET Annotate PDF in WPF, C#.NET PDF Create, C#.NET C#.NET search text in PDF, C#.NET edit PDF bookmark, C#.NET to How to Build Online VB.NET PDF Viewer in
adding bookmarks in pdf; creating bookmarks in pdf files
VB.NET PDF - Acquire or Save PDF Image to File
NET Annotate PDF in WPF, C#.NET PDF Create, C#.NET search text in PDF, C#.NET edit PDF bookmark, C#.NET NET TWAIN Scanning DLLs: Scan Many Pages into One PDF.
bookmarks in pdf reader; create bookmark pdf
Thetitleenteredinthemetadataofthedocumentappearsabovetheinteractive
image andgives its nameto thewebpage. The creator and rights appear in the
pop up associatedwith the "i"buttonon the right of the title of the interactive
image.
Youcansavetheimageinsvgformatintheearlywork,throughFile → → Save
as....
For more clarity, you should remove the current extension of the image in
the fieldName of the dialog window. Finally,in the dropdownmenu, choose the
Inkscapesvgfileformat:
SVG Inkscape (*.svg).
SeveralInkscape tools canbe usedto clip the details that willbecomeactive
intheanimationgeneratedby Xia. Amongthese:
Create rectangles and squares
Create circles, ellipses and arcs
Draw freehand lines
Bezier curves and straight lines
Withoutgoinginthedetailofhowthesetoolswork
4
notethatthe tool"Draw
Bezier curves and straight lines"allowstocrop"clickbyclick"(workpoints
are called "nodes"). You close the figure by clickingon the start node. You can
draw"Bezier curves"bykeepingthemousebuttonpressedaftercreatinganode,
thenmovingthecursortobringupthecontrolhandlestoshapethecurvesegment
asdesired.
Ifyouseta leftopenshapeinInkscape(forexample aline),Xia
will automatically close it by connecting a straight line between
thebeginningandtheendofit.
TheorderofcreationofdetailsinInkscapewillbethesameinthe
html5 interactive image (for example: the first created detail in
Inkscape willappear at the top oftheinteractive image). Ifyou
wishto changethesequencewithouthavingtocreatethedetails
oncemore,see sectiong.
Once youhave cut out a detail
5
,youcan select it with the toolSelect and
transform objecttoresizeit,moveit...
4. Forthis,refertoInkscapemanualorFlossmanual.
5. ThecolouroftheborderwillbethesameinInkscapeandintheanimationgeneratedby
Xia.
4
C# PDF - Acquire or Save PDF Image to File
scanners and digital cameras) automatically and saving the images to file in C#.NET application. C#.NET TWAIN Scanning DLLs: Scan Many Pages into One PDF.
bookmark pdf in preview; pdf export bookmarks
C#: How to Add HTML5 Document Viewer Control to Your Web Page
this file Default.aspx and Visual Studio will automatically create a code take RE default var _userCmdDemoPdf = new UserCommand("pdf"); _userCmdDemoPdf.addCSS
export pdf bookmarks to text; create bookmark pdf file
Ifyouhavesomedifficultiestoselectthedetailsyouhave drawn,
apply acolour backgroundtothem. Choosewhatevercolour you
like,except forblackandwhite(seewhyinsectionf).
YoucanaccesstotheObject propertiesbyright-clickingonthecut-outde-
tail. Thusyoualsoaccess tothe dialogwindowinwhichyouaddthe text tobe
associatedwiththedetailintheinteractiveimage:
The two fields to be filled in this windowareTitle andDescription. The
title filledinhere will bethat ofthe detail,descriptionwillbeits comment. Do
notforgettoclickontheDefinebuttonbeforeyouclosetheObject Properties
dialogwindow.
The process described above must also be done with the background image
: the title and description indicated here will serve as an introduction to the
interactiveimage(titleandcommentnotrelatedtoaparticulardetail).
b
Generating the interactive image with Xia
When all the details are clipped and their metadata indicated, Xia can be
launched (see figure 2). You must select the svg source file with the top left
icon
6
,choose the export options (see figure3),and then choose a template and
thedestinationfolderoftheinteractiveimage.
Clicking on one of the template icons generates a series of files and folders.
Opentheindex.htmlfileinawebbrowser toseethehtml5interactiveimage.
6. Whenlaunchedas anInkscapeextension,thetoplefticonhasadifferentlook,andcan
notbeselected,sinceXiaassumesyouwanttocreatethehtml5animationfromtheimageyou
areworkingoninInkscape.
5
VB Imaging - VB ISBN Barcode Tutorial
use .NET solution that is designed to create ISBN barcode Automatically compute and add check digit for ISBN barcode document files in VB.NET like PDF & Word.
edit pdf bookmarks; how to add bookmarks on pdf
C# Imaging - Scan Linear ISSN in C#.NET
Detect orientation of scanned ISSN barcode automatically from image files using C#. Integrated with PDF controlling library to scan ISSN barcode from PDF
bookmark a pdf file; delete bookmarks pdf
This file will not display anything if used alone. All the other
files anddirectoriesgeneratedduringtheexportprocess must be
stored inthesame folder (seefigure4)as the index.html fileso
thattheanimationworksproperly. Itis therefore essential to
dedicate a specific directory foreach exported image.
Select the svg
sourcefile
Definethe optionsof
theexport (seefigure
3)
accordionBlack
Largecommentzone,
suitablefor the in-
sertionofmultimedia
resources;tobeused
withverticalimages
(portrait)
accordionCloud
Narrowcomment
zone,withmore space
fortheimageitself;
tobe usedwithhor-
izontalimages(land-
scape)
popYellow
Nolateralcomment
zone;afirstclick
onthedetailreveals
it,andasecondone
simultaneously un-
veilsthecomment
andtriggersthezoom
function
buttonBlue
Nolateralcomment
zone;commentsap-
pear abovetheim-
age(suitableforlong
comments);theusers
access thecomments
throughicons placed
abovethe interactive
image
popBlue
Nolateralcomment
zone;afirst click
onthedetailreveals
it,andasecondone
pops upthecomment
(nozoom)
Figure2–Xia’stemplates
In fact, since Xia is also an Inkscape plugin, you can generate your project
directly inInkscape: justclickonPlugins → Various s → → Xia a Édu,andchoose
your template anddestinationfolder.
6
Select the
qualityofthe
exportona
scalefrom 1
to4
ActivateorDeacti-
vatethecreationof
theFirefoxOSfiles
(default: deactivated)
Inthe uniquefileconfiguration,youwillneedaninter-
netconnectiontoaccesstheresource. Thexiaengine
usedintheuniquefileconfigurationishostedonVer-
saillesacademy serversandisautomaticallyupdated.
Inthisconfiguration,youcannot controltheback-
groundimageandicons (default: deactivated)
Figure3–Xia’sexportationoptions
my_project/
index.html
deploy.html
manifest.webapp
css/
data/
font/
img/
js/
videos/
video.mp4
video.ogv
video.webm
Thesefilesandfoldershave
beenmanuallycreatedby
the interactiveimagede-
signer. Thefoldervideos
was alsomanually created,
inorder tohost videosin-
sertedinthecommentsof
the interactiveimageusing
relativelinks.
Filesandfoldersgenerated
byXiafromthesvgsource
file.
FilesgeneratedwithFire-
foxOSexport activated
Figure4–FilesofaninteractiveimagewithFirefoxOSexportactivated
7
IfyouuseGNU/LinuxorMacOSX,youcangenerateyourhtml5
animationusingtheterminalwiththecommandxia-converter.
The parameters are -i to indicate the input file, -o to indicate
the exportationfolder,and-t toindicatethetemplate.
GNU/Linux
$ xia-converter -i myfile.svg -o export_folder/ -t
accordionBlack
MacOS X
$ cd /Applications/xia.app/Contents/Resources/
$ python xia.py -i myfile.svg -o export_folder/ -t
gameDragAndDrop
The template accordionBlack willbe chosen if a syntax error is
madeinthe-tparameter.
c Firefox OS export: how does it work?
If you do not intend to create FirefoxOS applications, skip this
section.
OnceyouhavegeneratedtheinteractiveimagewiththeFirefoxOSoption(see
figure3),youhavetomodifythecontentof deploy.htmlandmanifest.webapp.
1. Inthedeploy.htmlfile,modifythisline:
var manifestUrl = ’http://my-webserver.com/manifest.webapp’;
Andindicatethefutureurlofthemanifest.webapp file.
2. Inthemanifest.webappfile,modify theselines:
"name": "XIA",
"size" : define_package.zip_size_here,
"release_notes" : "generated with XIA",
"launch_path": "/index.html",
"package_path" : "http://my-webserver.com/package.zip",
"developer": {
"name": "Académie de Versailles"
The"name","size",and"package_path"lines aremandatory
7
.
Onceyouhavemadethesemodifications,zipalltheexportationfilesandupload
thearchive,thedeploy.html andthemanifest.webappfiles toawebserver.
When the user opens the deploy.html file in the Firefox OS browser, their
phonewilldownloadtheinteractiveimageandtransformintoahtml5application.
ApplicationsmadewiththeFirefoxOSexportcanalsobeinstalled
onGNU/Linux,MacOSXandWindows operating systems.
7. Thetrickypartis the "size"line,where youmust indicatethesize of the packageeven
beforeyouhavezippedit.
8
d
Abstract
1. Aninteractive imageisfirst builtinInkscape(svg format). Xiaonly con-
vertsthesvgsourcefileintoanhtml5animation;
2. The title of the interactive image must be indicated in theMetadata of
the document;
3. The text of the details must be filled in theObject properties, in the
TitleandDescriptionfieldsofthecutoutdetails;
4. The generaldescription of the interactive image must be indicated in the
Object propertiesofthebackgroundimage.
III Enriched interactive image
Explore theinteractiveimage createdforthis sectionofthe doc-
umentation.
Downloadthesvg sourcefile.
In this section,the goalis stillto createa "traditional"interactive image (ie.
inwhichadetailmatcheswithacomment),butthecontentofthecommentswill
beenrichedwithformattedtext or multimediaresources.
9
Documents you may be interested
Documents you may be interested