Skip to content

Commit 3f42c9a

Browse files
danfickledanfickle
authored
Merge pull request #542 from syjer/478-li-style-decoration-positioning
#478 change list decoration placement logic
2 parents 2af0abb + 5600297 commit 3f42c9a

File tree

7 files changed

+119
-6
lines changed

7 files changed

+119
-6
lines changed

‎openhtmltopdf-core/src/main/java/com/openhtmltopdf/render/ListItemPainter.java

Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -103,17 +103,25 @@ private static void drawGlyph(RenderingContext c, BlockBox box,
103103
RenderingHints.VALUE_ANTIALIAS_ON);
104104

105105
// calculations for bullets
106-
StrutMetrics strutMetrics = box.getMarkerData().getStructMetrics();
107-
MarkerData.GlyphMarker marker = box.getMarkerData().getGlyphMarker();
106+
MarkerData markerData = box.getMarkerData();
107+
StrutMetrics strutMetrics = markerData.getStructMetrics();
108+
MarkerData.GlyphMarker marker = markerData.getGlyphMarker();
108109
int x = getReferenceX(c, box);
110+
// see issue 478. To be noted, the X positioning does not consider the available padding space
111+
// (like all the browsers it seems), so if the font is too big, the list decoration will be cut or outside
112+
// the viewport.
109113
if (style.getDirection() == IdentValue.LTR) {
110-
x += -marker.getLayoutWidth();
114+
x += -marker.getLayoutWidth() + marker.getDiameter() * 1.1;
111115
}
112116
if (style.getDirection() == IdentValue.RTL){
113-
x += box.getMarkerData().getReferenceLine().getWidth() + marker.getLayoutWidth();
117+
x += markerData.getReferenceLine().getWidth() + marker.getDiameter() * 1.1;
114118
}
115-
int y = getReferenceBaseline(c, box)
116-
- (int)strutMetrics.getAscent() / 2 - marker.getDiameter() / 2;
119+
120+
// see issue https://github.com/danfickle/openhtmltopdf/issues/478#issuecomment-682066113
121+
int bottomLine = getReferenceBaseline(c, box);
122+
int top = bottomLine - (int) (strutMetrics.getAscent() / 1.5);
123+
124+
int y = bottomLine - (bottomLine-top) / 2 - marker.getDiameter() / 2 ;
117125
if (listStyle == IdentValue.DISC) {
118126
c.getOutputDevice().fillOval(x, y, marker.getDiameter(), marker.getDiameter());
119127
} else if (listStyle == IdentValue.SQUARE) {

‎openhtmltopdf-examples/src/main/resources/visualtest/expected/issue-478-list-decoration-position.pdf

10.7 KB
Binary file not shown.

‎openhtmltopdf-examples/src/main/resources/visualtest/expected/replaced-plugin-latex.pdf

29 Bytes
Binary file not shown.

‎openhtmltopdf-examples/src/main/resources/visualtest/expected/running-nested-list-items.pdf

2 Bytes
Binary file not shown.

‎openhtmltopdf-examples/src/main/resources/visualtest/expected/text/columns-nested-unbalanced.pdf

-212 Bytes
Binary file not shown.

‎openhtmltopdf-examples/src/main/resources/visualtest/html/issue-478-list-decoration-position.html

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
<html>
2+
<head>
3+
<style>
4+
5+
@page {
6+
size: 550px 450px;
7+
}
8+
9+
body {
10+
padding:0;
11+
margin:0;
12+
}
13+
14+
@font-face {
15+
src: url(fonts/NotoNaskhArabic-Regular.ttf);
16+
font-family: 'arabic';
17+
}
18+
19+
@font-face {
20+
src: url(fonts/SourceSansPro-Regular.ttf);
21+
font-family: 'source-sans-pro';
22+
}
23+
24+
@font-face {
25+
src: url(fonts/Karla-Bold.ttf);
26+
font-family: 'karla-bold';
27+
}
28+
29+
.source-sans-pro {
30+
font-family:source-sans-pro;
31+
}
32+
33+
.karla-bold {
34+
font-family:karla-bold;
35+
}
36+
37+
.arabic {
38+
font-family:arabic
39+
}
40+
41+
.serif {
42+
font-family:serif;
43+
}
44+
45+
.sans-serif {
46+
font-family:sans-serif;
47+
}
48+
49+
li {
50+
margin:0;
51+
padding:0;
52+
}
53+
54+
.e1 {
55+
font-size: 40px;
56+
}
57+
.e2 {
58+
font-size: 55px;
59+
}
60+
</style>
61+
</head>
62+
<body>
63+
64+
<!--
65+
To be noted, like in chrome, if the font is _too big_ the decoration will be cut.
66+
Padding left/right can be adjusted if the current heuristic is not good enough.
67+
-->
68+
<ul >
69+
<li class="serif" >A</li>
70+
<li class="e1 serif">
71+
<p>B</p>
72+
<p>C</p>
73+
</li>
74+
<li class="e2 serif">D</li>
75+
<li class="e3 serif">E</li>
76+
</ul>
77+
78+
<ul class="arabic" style="direction:rtl; padding-right:40px;padding-left:0px">
79+
<li>التنازلي 1234 بحق</li>
80+
<li class="e1">التنازلي 1234 بحق</li> <!-- the decoration is partially cut-->
81+
<li class="e2">التنازلي 1234 بحق</li> <!-- the decoration is nearly all cut-->
82+
</ul>
83+
84+
<ul style="list-style-type:square">
85+
<li class="karla-bold" >A</li>
86+
<li class="e1 source-sans-pro">
87+
<p>B</p>
88+
<p>C</p>
89+
</li>
90+
<li class="e2 source-sans-pro">D</li> <!-- the decoration is partially cut-->
91+
<li class="karla-bold">E</li>
92+
</ul>
93+
94+
</body>
95+
</html>

‎openhtmltopdf-examples/src/test/java/com/openhtmltopdf/visualregressiontests/VisualRegressionTest.java

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,8 @@
77
import java.nio.charset.StandardCharsets;
88
import java.util.Collections;
99

10+
import com.openhtmltopdf.bidi.support.ICUBidiReorderer;
11+
import com.openhtmltopdf.bidi.support.ICUBidiSplitter;
1012
import com.openhtmltopdf.extend.FSStream;
1113
import com.openhtmltopdf.objects.zxing.ZXingObjectDrawer;
1214
import org.junit.Before;
@@ -1240,6 +1242,14 @@ public void testBarcode() throws IOException {
12401242

12411243
}
12421244

1245+
@Test
1246+
public void testIssue478ListDecorationPosition() throws IOException {
1247+
assertTrue(vt.runTest("issue-478-list-decoration-position", builder -> {
1248+
builder.useUnicodeBidiSplitter(new ICUBidiSplitter.ICUBidiSplitterFactory());
1249+
builder.useUnicodeBidiReorderer(new ICUBidiReorderer());
1250+
}));
1251+
}
1252+
12431253
// TODO:
12441254
// + Elements that appear just on generated overflow pages.
12451255
// + content property (page counters, etc)

0 commit comments

Comments
 (0)