Declarative hyperlinks, bookmarks, tab stops and page breaks
This commit is contained in:
@ -244,10 +244,15 @@ The above example will create a heading with a page break directly under it.
|
||||
|
||||
## Page Break
|
||||
|
||||
To move to a new page (insert a page break), simply add `.pageBreak()` on a paragraph:
|
||||
To move to a new page (insert a page break):
|
||||
|
||||
```ts
|
||||
const paragraph = new docx.Paragraph("Amazing Heading").pageBreak();
|
||||
const paragraph = new docx.Paragraph({
|
||||
children: [
|
||||
new TextRun("Amazing Heading"),
|
||||
new PageBreak(),
|
||||
]
|
||||
});
|
||||
```
|
||||
|
||||
The above example will create a heading and start a new page immediately afterwards.
|
||||
|
@ -2,7 +2,7 @@
|
||||
|
||||
> Tab stops are useful, if you are unclear of what they are, [here is a link explaining](https://en.wikipedia.org/wiki/Tab_stop). It enables side by side text which is nicely laid out without the need for tables, or constantly pressing space bar.
|
||||
|
||||
!> **Note**: At the moment, the unit of measurement for a tab stop is counter intuitive for a human. It is using OpenXMLs own measuring system. For example, 2268 roughly translates to 3cm. Therefore in the future, I may consider changing it to percentages or even cm.
|
||||
!> **Note**: The unit of measurement for a tab stop is in [DXA](https://stackoverflow.com/questions/14360183/default-wordml-unit-measurement-pixel-or-point-or-inches)
|
||||
|
||||

|
||||
|
||||
@ -11,44 +11,86 @@ Simply call the relevant methods on the paragraph listed below. Then just add a
|
||||
## Example
|
||||
|
||||
```ts
|
||||
const paragraph = new docx.Paragraph().maxRightTabStop();
|
||||
const leftText = new docx.TextRun("Hey everyone").bold();
|
||||
const rightText = new docx.TextRun("11th November 2015").tab();
|
||||
paragraph.addRun(leftText);
|
||||
paragraph.addRun(rightText);
|
||||
const paragraph = new Paragraph({
|
||||
children: [new TextRun("Hey everyone").bold(), new TextRun("11th November 1999").tab()],
|
||||
tabStop: {
|
||||
right: {
|
||||
position: TabStopPosition.MAX,
|
||||
},
|
||||
},
|
||||
});
|
||||
```
|
||||
The example above will create a left aligned text, and a right aligned text on the same line. The laymans approach to this problem would be to either use text boxes or tables. YUK!
|
||||
|
||||
The example above will create a left aligned text, and a right aligned text on the same line. The laymans approach to this problem would be to either use text boxes or tables. Not ideal!
|
||||
|
||||
```ts
|
||||
const paragraph = new docx.Paragraph();
|
||||
paragraph.maxRightTabStop();
|
||||
paragraph.leftTabStop(1000);
|
||||
const text = new docx.TextRun("Second tab stop here I come!").tab().tab();
|
||||
paragraph.addRun(text);
|
||||
const paragraph = new Paragraph({
|
||||
children: [new TextRun("Second tab stop here I come!").tab().tab()],
|
||||
tabStop: {
|
||||
right: {
|
||||
position: TabStopPosition.MAX,
|
||||
},
|
||||
left: {
|
||||
position: 1000,
|
||||
},
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
The above shows the use of two tab stops, and how to select/use it.
|
||||
|
||||
## Left Tab Stop
|
||||
|
||||
```ts
|
||||
paragraph.leftTabStop(2268);
|
||||
const paragraph = new Paragraph({
|
||||
tabStop: {
|
||||
left: {
|
||||
position: 2268,
|
||||
},
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
2268 is the distance from the left side.
|
||||
|
||||
## Center Tab Stop
|
||||
|
||||
```ts
|
||||
paragraph.centerTabStop(2268);
|
||||
const paragraph = new Paragraph({
|
||||
tabStop: {
|
||||
center: {
|
||||
position: 2268,
|
||||
},
|
||||
},
|
||||
});
|
||||
```
|
||||
2268 is the distance from the left side.
|
||||
|
||||
2268 is the distance from the center.
|
||||
|
||||
## Right Tab Stop
|
||||
|
||||
```ts
|
||||
paragraph.rightTabStop(2268);
|
||||
const paragraph = new Paragraph({
|
||||
tabStop: {
|
||||
right: {
|
||||
position: 2268,
|
||||
},
|
||||
},
|
||||
});
|
||||
```
|
||||
2268 is the distance from the left side.
|
||||
|
||||
2268 is the distance fro0oum the left side.
|
||||
|
||||
## Max Right Tab Stop
|
||||
|
||||
```ts
|
||||
paragraph.maxRightTabStop();
|
||||
const paragraph = new Paragraph({
|
||||
tabStop: {
|
||||
right: {
|
||||
position: TabStopPosition.MAX,
|
||||
},
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
This will create a tab stop on the very edge of the right hand side. Handy for right aligning and left aligning text on the same line.
|
||||
|
@ -47,30 +47,6 @@ Here is the list of all options that you can use to generate your tables of cont
|
||||
|
||||
## Examples
|
||||
|
||||
```ts
|
||||
// Let's define the options for generate a TOC for heading 1-5 and MySpectacularStyle,
|
||||
// making the entries be hyperlinks for the paragraph
|
||||
const toc = new TableOfContents("Summary", {
|
||||
hyperlink: true,
|
||||
headingStyleRange: "1-5",
|
||||
stylesWithLevels: [new StyleLevel("MySpectacularStyle", 1)],
|
||||
});
|
||||
|
||||
doc.addTableOfContents(toc);
|
||||
|
||||
doc.add(new Paragraph("Header #1").heading1().pageBreakBefore());
|
||||
doc.add(new Paragraph("I'm a little text, very nicely written.'"));
|
||||
|
||||
doc.add(new Paragraph("Header #2").heading1().pageBreakBefore());
|
||||
doc.add(new Paragraph("I'm another text very nicely written.'"));
|
||||
doc.add(new Paragraph("Header #2.1").heading2());
|
||||
doc.add(new Paragraph("I'm another text very nicely written.'"));
|
||||
|
||||
doc.add(new Paragraph("My Spectacular Style #1").style("MySpectacularStyle").pageBreakBefore());
|
||||
```
|
||||
|
||||
### Complete example
|
||||
|
||||
[Example](https://raw.githubusercontent.com/dolanmiu/docx/master/demo/28-table-of-contents.ts ':include')
|
||||
|
||||
_Source: https://github.com/dolanmiu/docx/blob/master/demo/28-table-of-contents.ts_
|
||||
|
Reference in New Issue
Block a user