File:Gui box model.png
From Vintage Story Wiki
No higher resolution available.
Gui_box_model.png (485 × 370 pixels, file size: 30 KB, MIME type: image/png)
Summary
Describes the box model of ElementBounds.
SVG source
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="485"
height="370"
viewBox="0 0 128.32292 97.895829"
version="1.1"
id="svg1"
inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
sodipodi:docname="gui box model.svg"
inkscape:export-filename="gui box model.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="px"
showguides="true"
inkscape:zoom="1.4142136"
inkscape:cx="260.21529"
inkscape:cy="232.99168"
inkscape:window-width="2560"
inkscape:window-height="1371"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="layer1" />
<defs
id="defs1">
<marker
style="overflow:visible"
id="Triangle"
refX="0"
refY="0"
orient="auto-start-reverse"
inkscape:stockid="Triangle arrow"
markerWidth="1"
markerHeight="1"
viewBox="0 0 1 1"
inkscape:isstock="true"
inkscape:collect="always"
preserveAspectRatio="xMidYMid">
<path
transform="scale(0.5)"
style="fill:context-stroke;fill-rule:evenodd;stroke:context-stroke;stroke-width:1pt"
d="M 5.77,0 -2.88,5 V -5 Z"
id="path135" />
</marker>
</defs>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-13.607958,-14.578953)">
<rect
style="fill:#c6d9eb;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-dasharray:none"
id="rect33"
width="128.05833"
height="97.631248"
x="13.74025"
y="14.711245" />
<rect
style="fill:#edd400;fill-opacity:1;stroke:#000000;stroke-width:0.264583;stroke-dasharray:none"
id="rect24"
width="76.797714"
height="46.906269"
x="40.897507"
y="47.102226" />
<rect
style="fill:#729fcf;fill-opacity:1;stroke-width:0.209215;-inkscape-stroke:none"
id="rect13"
width="39.799122"
height="18.662426"
x="58.638275"
y="60.995243" />
<text
xml:space="preserve"
style="font-size:4.23333px;fill:#000000;fill-opacity:1;stroke-width:0.209172;-inkscape-stroke:none"
x="65.783066"
y="72.033333"
id="text1"><tspan
sodipodi:role="line"
style="font-size:4.23333px;fill:#000000;fill-opacity:1;stroke-width:0.209172"
x="65.783066"
y="72.033333"
id="tspan2">child content</tspan></text>
<text
xml:space="preserve"
style="font-size:4.23333px;fill:#000000;fill-opacity:1;stroke-width:0.209172;-inkscape-stroke:none"
x="62.97393"
y="55.076225"
id="text3"><tspan
sodipodi:role="line"
style="stroke-width:0.209172"
x="62.97393"
y="55.076225"
id="tspan4">child padding</tspan></text>
<text
xml:space="preserve"
style="font-size:4.23333px;fill:#000000;fill-opacity:1;stroke-width:0.209172;-inkscape-stroke:none"
x="41.292324"
y="42.361958"
id="text5"><tspan
sodipodi:role="line"
style="stroke-width:0.209172"
x="41.292324"
y="42.361958"
id="tspan3">(fixedOffsetX, fixedOffsetY)</tspan></text>
<text
xml:space="preserve"
style="font-size:4.23333px;fill:#000000;fill-opacity:1;stroke-width:0.209172;-inkscape-stroke:none"
x="101.8461"
y="70.326454"
id="text6"><tspan
sodipodi:role="line"
id="tspan6"
style="stroke-width:0.209172"
x="101.8461"
y="70.326454"> inner</tspan><tspan
sodipodi:role="line"
style="stroke-width:0.209172"
x="101.8461"
y="75.618118"
id="tspan8"> height</tspan></text>
<text
xml:space="preserve"
style="font-size:4.23333px;fill:#000000;fill-opacity:1;stroke-width:0.209172;-inkscape-stroke:none"
x="68.536743"
y="87.377617"
id="text9"><tspan
sodipodi:role="line"
style="stroke-width:0.209172"
x="68.536743"
y="87.377617"
id="tspan10">inner width</tspan></text>
<text
xml:space="preserve"
style="font-size:4.23333px;fill:#000000;fill-opacity:1;stroke-width:0.209172;-inkscape-stroke:none"
x="67.82222"
y="101.81549"
id="text11"><tspan
sodipodi:role="line"
id="tspan11"
style="stroke-width:0.209172"
x="67.82222"
y="101.81549">outer width</tspan></text>
<text
xml:space="preserve"
style="font-size:4.23333px;fill:#000000;fill-opacity:1;stroke-width:0.209172;-inkscape-stroke:none"
x="121.04286"
y="70.555367"
id="text12"><tspan
sodipodi:role="line"
id="tspan12"
style="stroke-width:0.209172"
x="121.04286"
y="70.555367"> outer</tspan><tspan
sodipodi:role="line"
style="stroke-width:0.209172"
x="121.04286"
y="75.847031"
id="tspan13"> height</tspan></text>
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="M 58.638276,82.580743 H 98.437395"
id="path17" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="M 58.638276,84.50297 V 80.658516"
id="path18" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="M 98.437395,84.50297 V 80.658516"
id="path19" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="M 101.8461,60.99524 V 79.65766"
id="path22" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="m 99.923866,79.65766 h 3.844464"
id="path23" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="m 99.923866,60.99524 h 3.844464"
id="path24" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="m 121.04286,47.102223 v 46.90628"
id="path27" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="m 119.12063,94.0085 h 3.84446"
id="path28" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="m 119.12063,47.10222 h 3.84446"
id="path29" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="M 40.897508,97.282692 H 117.69522"
id="path30" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="M 40.897508,99.204919 V 95.360465"
id="path31" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="M 117.69522,99.204919 V 95.360465"
id="path32" />
<text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:5.64444px;font-family:Sans;-inkscape-font-specification:Sans;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.529167;stroke-dasharray:none"
x="98.348053"
y="22.365814"
id="text33"><tspan
sodipodi:role="line"
id="tspan33"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:5.64444px;font-family:Sans;-inkscape-font-specification:Sans;fill:#000000;stroke:none;stroke-width:0.529167"
x="98.348053"
y="22.365814">parent content</tspan></text>
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;marker-end:url(#Triangle);stop-color:#000000;stop-opacity:1"
d="M 15.273134,16.439869 33.932916,33.383817"
id="path37"
sodipodi:nodetypes="cc" />
<text
xml:space="preserve"
style="font-size:4.23333px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.529167;stroke-dasharray:none"
x="28.411976"
y="21.402893"
id="text39"><tspan
sodipodi:role="line"
id="tspan39"
style="stroke-width:0.529167"
x="28.411976"
y="21.402893">(fixedX, fixedY) or</tspan><tspan
sodipodi:role="line"
style="stroke-width:0.529167"
x="28.411976"
y="26.694555"
id="tspan40">(marginX, marginY)</tspan></text>
<g
id="g2"
style="fill:#000000;stroke:#000000"
transform="translate(-0.48599203,-0.07052366)">
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="m 35.089583,35.76708 h 3.84446"
id="path1" />
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;stop-color:#000000;stop-opacity:1"
d="M 37.011813,37.689307 V 33.844853"
id="path2" />
</g>
<path
style="font-variation-settings:normal;opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#5d0000;stroke-width:0.529167;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;-inkscape-stroke:none;marker-end:url(#Triangle);stop-color:#000000;stop-opacity:1"
d="m 38.145859,37.482689 1.791252,7.231415"
id="path3"
sodipodi:nodetypes="cc" />
</g>
</svg>
File history
Click on a date/time to view the file as it appeared at that time.
| Date/Time | Thumbnail | Dimensions | User | Comment | |
|---|---|---|---|---|---|
| current | 12:15, 31 December 2023 | | 485 × 370 (30 KB) | Bluelightning32 (talk | contribs) | show the offset as a vector instead of a box |
| 11:47, 31 December 2023 |  | 480 × 350 (23 KB) | Bluelightning32 (talk | contribs) | Describes the box model of ElementBounds. |
You cannot overwrite this file.
File usage
The following page uses this file:
