diff --git a/app/gui/NavigableToolButton.qml b/app/gui/NavigableToolButton.qml index 57400cb8..ce01255a 100644 --- a/app/gui/NavigableToolButton.qml +++ b/app/gui/NavigableToolButton.qml @@ -2,8 +2,27 @@ import QtQuick 2.0 import QtQuick.Controls 2.2 ToolButton { + property string iconSource + activeFocusOnTab: true + // FIXME: We're using an Image here rather than icon.source because + // icons don't work on Qt 5.9 LTS. + Image { + id: image + source: iconSource + anchors.centerIn: parent.background + sourceSize { + width: parent.background.width * 1.10 + height: parent.background.height * 1.10 + } + } + + // This determines the size of the Material highlight. We increase it + // from the default because we use larger than normal icons for TV readability. + background.width: (parent.height - parent.anchors.bottomMargin - parent.anchors.topMargin) * 0.60 + background.height: (parent.height - parent.anchors.bottomMargin - parent.anchors.topMargin) * 0.60 + Keys.onReturnPressed: { clicked() } diff --git a/app/gui/main.qml b/app/gui/main.qml index 8dd59938..72fc5f95 100644 --- a/app/gui/main.qml +++ b/app/gui/main.qml @@ -175,28 +175,21 @@ ApplicationWindow { header: ToolBar { id: toolBar + height: 60 anchors.topMargin: 5 anchors.bottomMargin: 5 RowLayout { spacing: 20 + anchors.leftMargin: 10 + anchors.rightMargin: 10 anchors.fill: parent NavigableToolButton { // Only make the button visible if the user has navigated somewhere. visible: stackView.depth > 1 - // FIXME: We're using an Image here rather than icon.source because - // icons don't work on Qt 5.9 LTS. - Image { - source: "qrc:/res/arrow_left.svg" - anchors.centerIn: parent - sourceSize { - // The icon should be square so use the height as the width too - width: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - height: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - } - } + iconSource: "qrc:/res/arrow_left.svg" onClicked: stackView.pop() @@ -219,14 +212,7 @@ ApplicationWindow { id: addPcButton visible: stackView.currentItem.objectName === "Computers" - Image { - source: "qrc:/res/ic_add_to_queue_white_48px.svg" - anchors.centerIn: parent - sourceSize { - width: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - height: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - } - } + iconSource: "qrc:/res/ic_add_to_queue_white_48px.svg" ToolTip.delay: 1000 ToolTip.timeout: 3000 @@ -253,14 +239,7 @@ ApplicationWindow { id: updateButton - Image { - source: "qrc:/res/update.svg" - anchors.centerIn: parent - sourceSize { - width: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - height: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - } - } + iconSource: "qrc:/res/update.svg" ToolTip.delay: 1000 ToolTip.timeout: 3000 @@ -293,14 +272,7 @@ ApplicationWindow { id: helpButton visible: SystemProperties.hasBrowser - Image { - source: "qrc:/res/question_mark.svg" - anchors.centerIn: parent - sourceSize { - width: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - height: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - } - } + iconSource: "qrc:/res/question_mark.svg" ToolTip.delay: 1000 ToolTip.timeout: 3000 @@ -330,14 +302,7 @@ ApplicationWindow { ToolTip.visible: hovered ToolTip.text: "Gamepad Mapper" - Image { - source: "qrc:/res/ic_videogame_asset_white_48px.svg" - anchors.centerIn: parent - sourceSize { - width: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - height: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - } - } + iconSource: "qrc:/res/ic_videogame_asset_white_48px.svg" onClicked: navigateTo("qrc:/gui/GamepadMapper.qml", "Gamepad Mapping") @@ -349,14 +314,7 @@ ApplicationWindow { NavigableToolButton { id: settingsButton - Image { - source: "qrc:/res/settings.svg" - anchors.centerIn: parent - sourceSize { - width: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - height: toolBar.height - toolBar.anchors.bottomMargin - toolBar.anchors.topMargin - } - } + iconSource: "qrc:/res/settings.svg" onClicked: navigateTo("qrc:/gui/SettingsView.qml", "Settings")