Starting new tooltip design in QML

This commit is contained in:
Niraj Venkat 2015-06-23 10:08:48 -07:00
parent 98fa996752
commit d1526c25b2
4 changed files with 30 additions and 4 deletions

View file

@ -0,0 +1,3 @@
<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xl="http://www.w3.org/1999/xlink" version="1.1" viewBox="618 289 264 186" width="22pc" height="186pt"><metadata xmlns:dc="http://purl.org/dc/elements/1.1/"><dc:date>2015-06-22 17:35Z</dc:date><!-- Produced by OmniGraffle Professional 5.4.4 --></metadata><defs><font-face font-family="Helvetica" font-size="19" units-per-em="1000" underline-position="-75.683594" underline-thickness="49.316406" slope="0" x-height="522.94922" cap-height="717.28516" ascent="770.01953" descent="-229.98047" font-weight="500"><font-face-src><font-face-name name="Helvetica"/></font-face-src></font-face></defs><g stroke="none" stroke-opacity="1" stroke-dasharray="none" fill="none" fill-opacity="1"><title>Canvas 1</title><g><title>No info</title><path d="M 620 291 L 879.5 291 L 879.5 473 L 620 473 Z" stroke="#999" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" stroke-dasharray="4,4"/><text transform="translate(625 370.5)" fill="#ccc"><tspan font-family="Helvetica" font-size="19" font-weight="500" fill="#ccc" x="40.265863" y="19" textLength="174.24707">No Picture Provided </tspan></text></g></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View file

@ -0,0 +1,3 @@
<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xl="http://www.w3.org/1999/xlink" version="1.1" viewBox="624 233 250 8" width="250pt" height="8pt"><metadata xmlns:dc="http://purl.org/dc/elements/1.1/"><dc:date>2015-06-22 17:35Z</dc:date><!-- Produced by OmniGraffle Professional 5.4.4 --></metadata><defs></defs><g stroke="none" stroke-opacity="1" stroke-dasharray="none" fill="none" fill-opacity="1"><title>Canvas 1</title><g><title>No info</title><line x1="627" y1="236.4375" x2="871" y2="236.4375" stroke="white" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/></g></g></svg>

After

Width:  |  Height:  |  Size: 715 B

View file

@ -0,0 +1,3 @@
<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xl="http://www.w3.org/1999/xlink" version="1.1" viewBox="594 183 323 423" width="323pt" height="423pt"><metadata xmlns:dc="http://purl.org/dc/elements/1.1/"><dc:date>2015-06-22 17:35Z</dc:date><!-- Produced by OmniGraffle Professional 5.4.4 --></metadata><defs></defs><g stroke="none" stroke-opacity="1" stroke-dasharray="none" fill="none" fill-opacity="1"><title>Canvas 1</title><g><title>Info</title><path d="M 603 183 L 908 183 C 912.97056 183 917 187.02944 917 192 L 917 597 C 917 601.97056 912.97056 606 908 606 L 603 606 C 598.02944 606 594 601.97056 594 597 L 594 192 C 594 187.02944 598.02944 183 603 183 Z" fill="#333" fill-opacity=".67"/></g></g></svg>

After

Width:  |  Height:  |  Size: 830 B

View file

@ -6,17 +6,19 @@ import "styles"
Hifi.Tooltip {
id: root
HifiConstants { id: hifi }
x: (lastMousePosition.x > surfaceSize.width/2) ? lastMousePosition.x - 140 : lastMousePosition.x + 20
y: (lastMousePosition.y > surfaceSize.height/2) ? lastMousePosition.y - 70 : lastMousePosition.y + 5
x: (lastMousePosition.x > surfaceSize.width/2) ? lastMousePosition.x - root.width : lastMousePosition.x + 20
y: (lastMousePosition.y > surfaceSize.height/2) ? lastMousePosition.y - root.height : lastMousePosition.y + 5
implicitWidth: border.implicitWidth
implicitHeight: border.implicitHeight
Border {
id: border
anchors.fill: parent
implicitWidth: text.implicitWidth
implicitHeight: Math.max(text.implicitHeight, 64)
implicitWidth: tooltipBackground.implicitWidth
//implicitHeight: Math.max(text.implicitHeight, 64)
implicitHeight: tooltipBackground.implicitHeight
/*
Text {
id: text
anchors.fill: parent
@ -24,6 +26,21 @@ Hifi.Tooltip {
font.pixelSize: hifi.fonts.pixelSize / 2
text: root.text
wrapMode: Original.Text.WordWrap
}*/
Image {
id: tooltipBackground
source: "../images/NoPictureProvided.svg"
width: 323
height: 423
anchors.fill: parent
/*
Image {
id: tooltipBackground
source: "../images/NoPictureProvided.svg"
anchors.fill: parent
}*/
}
}
}