Skip to content

Commit 92f00ec

Browse files
mcukstormmcukstorm
committed
Use source image ratios when partial sizing via attributes
1 parent 9af883c commit 92f00ec

File tree

2 files changed

+70
-13
lines changed

2 files changed

+70
-13
lines changed

‎Source/Core/Elements/ElementImage.cpp

Lines changed: 30 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -52,28 +52,45 @@ bool ElementImage::GetIntrinsicDimensions(Vector2f& _dimensions, float& _ratio)
5252
{
5353
EnsureSourceLoaded();
5454

55-
// Calculate the x dimension.
56-
if (HasAttribute("width"))
57-
dimensions.x = GetAttribute<float>("width", -1);
58-
else if (rect_source == RectSource::None)
55+
if (rect_source == RectSource::None)
56+
{
5957
dimensions.x = (float)texture.GetDimensions().x;
60-
else
61-
dimensions.x = rect.Width();
62-
63-
// Calculate the y dimension.
64-
if (HasAttribute("height"))
65-
dimensions.y = GetAttribute<float>("height", -1);
66-
else if (rect_source == RectSource::None)
6758
dimensions.y = (float)texture.GetDimensions().y;
68-
else
59+
} else
60+
{
61+
dimensions.x = rect.Width();
6962
dimensions.y = rect.Height();
63+
}
64+
65+
//Calculate the source ratio
66+
_ratio = dimensions.x / dimensions.y;
67+
68+
//Scale based on attributes (this only appears to be done by LayoutDetails for CSS set height/width)
69+
auto requested_width = GetAttribute<float>("width", -1);
70+
auto requested_height = GetAttribute<float>("height", -1);
71+
if (requested_height>0 && requested_width>0)
72+
{
73+
//If both a height and width are set update the ratio to match
74+
_ratio = requested_width / requested_height;
75+
dimensions.x = requested_width;
76+
dimensions.y = requested_height;
77+
}
78+
else if (requested_height>0)
79+
{
80+
dimensions.x = requested_height * _ratio;
81+
dimensions.y = requested_height;
82+
}
83+
else if (requested_width>0)
84+
{
85+
dimensions.x = requested_width;
86+
dimensions.y = requested_width / _ratio;
87+
}
7088

7189
dimensions *= dimensions_scale;
7290

7391
// Return the calculated dimensions. If this changes the size of the element, it will result in
7492
// a call to 'onresize' below which will regenerate the geometry.
7593
_dimensions = dimensions;
76-
_ratio = dimensions.x / dimensions.y;
7794

7895
return true;
7996
}

‎Tests/Data/VisualTests/image_ratio.rml

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<rml>
2+
<head>
3+
<title>Image Ratio Sizing - Attribute</title>
4+
<link type="text/rcss" href="../style.rcss"/>
5+
<meta name="Description" content="When a width or height is set the image should be scaled keeping its aspect ratio. All but the last example should be a square." />
6+
<style>
7+
.width-50 { width: 50px; }
8+
.height-50 { height: 50px; }
9+
.height-100 { height: 100px; }
10+
</style>
11+
</head>
12+
13+
<body>
14+
<table>
15+
<tr><td>Attribute</td><td>CSS</td></tr>
16+
<tr><td colspan="2">Original size (square 100x100):</td></tr>
17+
<tr>
18+
<td colspan="2"><img src="/assets/present.tga" alt="no width/height set" /></td>
19+
</tr>
20+
21+
<tr><td colspan="2">Set height to 50, width auto, expect half sized square:</td></tr>
22+
<tr>
23+
<td><img src="/assets/present.tga" height="50" alt="height 50 only, attribute" /></td>
24+
<td><img src="/assets/present.tga" class="height-50" /></td>
25+
</tr>
26+
27+
<tr><td colspan="2">Set width to 50, height auto, expect half sized square:</td></tr>
28+
<tr>
29+
<td><img src="/assets/present.tga" width="50" alt="width 50 only, attribute" /></td>
30+
<td><img src="/assets/present.tga" class="width-50" /></td>
31+
</tr>
32+
33+
<tr><td colspan="2">Set width to 50 and height to 100 (via attributes), expect rectangular:</td></tr>
34+
<tr>
35+
<td><img src="/assets/present.tga" width="50" height="100" alt="height 100, width 50, attribute" /></td>
36+
<td><img src="/assets/present.tga" class="height-100 width-50" /></td>
37+
</tr>
38+
</table>
39+
</body>
40+
</rml>

0 commit comments

Comments
 (0)