Restyling the dialog boxes a bit more

This commit is contained in:
Sander Ferdinand 2018-03-23 21:51:28 +01:00 committed by moneromooo-monero
parent 2d7ef434be
commit 28608e4ce0
3 changed files with 129 additions and 114 deletions

View file

@ -26,8 +26,8 @@
// STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF // STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF
// THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. // THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
import QtQuick 2.0 import QtQuick 2.7
import QtQuick.Controls 1.4 import QtQuick.Controls 2.0
import QtQuick.Dialogs 1.2 import QtQuick.Dialogs 1.2
import QtQuick.Layouts 1.1 import QtQuick.Layouts 1.1
import QtQuick.Controls.Styles 1.4 import QtQuick.Controls.Styles 1.4
@ -38,14 +38,6 @@ import "../components" as MoneroComponents
Item { Item {
id: root id: root
visible: false visible: false
Rectangle {
id: bg
z: parent.z + 1
anchors.fill: parent
color: "white"
opacity: 0.9
}
property alias labelText: label.text property alias labelText: label.text
property alias inputText: input.text property alias inputText: input.text
@ -78,42 +70,45 @@ Item {
ColumnLayout { ColumnLayout {
id: column id: column
//anchors {fill: parent; margins: 16 }
Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.maximumWidth: 400 * scaleRatio
Label { Label {
id: label id: label
Layout.alignment: Qt.AlignHCenter anchors.left: parent.left
// Layout.columnSpan: 2
Layout.fillWidth: true Layout.fillWidth: true
horizontalAlignment: Text.AlignHCenter
font.pixelSize: 18 * scaleRatio font.pixelSize: 16 * scaleRatio
font.family: "Arial" font.family: Style.fontLight
color: "#555555"
color: Style.defaultFontColor
} }
TextField { TextField {
id : input id : input
focus: true focus: true
Layout.topMargin: 6
Layout.fillWidth: true Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter anchors.left: parent.left
horizontalAlignment: TextInput.AlignHCenter horizontalAlignment: TextInput.AlignLeft
verticalAlignment: TextInput.AlignVCenter verticalAlignment: TextInput.AlignVCenter
font.family: "Arial" font.family: Style.fontLight
font.pixelSize: 32 * scaleRatio font.pixelSize: 24 * scaleRatio
// echoMode: TextInput.Password
KeyNavigation.tab: okButton KeyNavigation.tab: okButton
bottomPadding: 10
leftPadding: 10
topPadding: 10
color: Style.defaultFontColor
style: TextFieldStyle { background: Rectangle {
renderType: Text.NativeRendering radius: 2
textColor: "#35B05A" border.color: Qt.rgba(255, 255, 255, 0.35)
// passwordCharacter: "" border.width: 1
// no background color: "black"
background: Rectangle {
radius: 0
border.width: 0
}
} }
Keys.onReturnPressed: { Keys.onReturnPressed: {
root.close() root.close()
root.accepted() root.accepted()
@ -123,51 +118,47 @@ Item {
root.rejected() root.rejected()
} }
} }
// underline
Rectangle { // Ok/Cancel buttons
height: 1 RowLayout {
color: "#DBDBDB" id: buttons
Layout.fillWidth: true spacing: 16 * scaleRatio
Layout.alignment: Qt.AlignHCenter Layout.topMargin: 16
anchors.bottomMargin: 3 Layout.alignment: Qt.AlignRight
}
// padding MoneroComponents.StandardButton {
Rectangle { id: cancelButton
Layout.fillWidth: true small: true
Layout.alignment: Qt.AlignHCenter width: 120
height: 10 fontSize: 14
opacity: 0 text: qsTr("Cancel") + translationManager.emptyString
color: "black" KeyNavigation.tab: input
} onClicked: {
} root.close()
// Ok/Cancel buttons root.rejected()
RowLayout { }
id: buttons
spacing: 60
Layout.alignment: Qt.AlignHCenter
MoneroComponents.StandardButton {
id: cancelButton
width: 120
fontSize: 14
text: qsTr("Cancel") + translationManager.emptyString
KeyNavigation.tab: input
onClicked: {
root.close()
root.rejected()
} }
} MoneroComponents.StandardButton {
MoneroComponents.StandardButton { id: okButton
id: okButton small: true
width: 120 width: 120
fontSize: 14 fontSize: 14
text: qsTr("Ok") text: qsTr("Ok")
KeyNavigation.tab: cancelButton KeyNavigation.tab: cancelButton
onClicked: { onClicked: {
root.close() root.close()
root.accepted() root.accepted()
}
} }
} }
} }
} }
Rectangle {
id: bg
z: parent.z + 1
anchors.fill: parent
color: "black"
opacity: 0.8
}
} }

View file

@ -26,8 +26,8 @@
// STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF // STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF
// THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. // THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
import QtQuick 2.0 import QtQuick 2.7
import QtQuick.Controls 1.4 import QtQuick.Controls 2.0
import QtQuick.Dialogs 1.2 import QtQuick.Dialogs 1.2
import QtQuick.Layouts 1.1 import QtQuick.Layouts 1.1
import QtQuick.Controls.Styles 1.4 import QtQuick.Controls.Styles 1.4
@ -93,42 +93,54 @@ Item {
ColumnLayout { ColumnLayout {
id: column id: column
//anchors {fill: parent; margins: 16 }
Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.maximumWidth: 400 * scaleRatio
Label { Label {
text: qsTr("Please enter new password") text: qsTr("Please enter new password")
Layout.alignment: Qt.AlignHCenter anchors.left: parent.left
Layout.columnSpan: 2
Layout.fillWidth: true Layout.fillWidth: true
horizontalAlignment: Text.AlignHCenter
font.pixelSize: 18 * scaleRatio font.pixelSize: 16 * scaleRatio
font.family: Style.fontLight font.family: Style.fontLight
color: Style.defaultFontColor color: Style.defaultFontColor
} }
TextField { TextField {
id : passwordInput1 id : passwordInput1
Layout.topMargin: 6
Layout.fillWidth: true Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter anchors.left: parent.left
Layout.maximumWidth: 400 * scaleRatio horizontalAlignment: TextInput.AlignLeft
horizontalAlignment: TextInput.AlignHCenter
verticalAlignment: TextInput.AlignVCenter verticalAlignment: TextInput.AlignVCenter
font.family: "Arial" font.family: Style.fontLight
font.pixelSize: 32 * scaleRatio font.pixelSize: 24 * scaleRatio
echoMode: TextInput.Password echoMode: TextInput.Password
bottomPadding: 10
leftPadding: 10
topPadding: 10
color: Style.defaultFontColor
KeyNavigation.tab: passwordInput2 KeyNavigation.tab: passwordInput2
style: TextFieldStyle { background: Rectangle {
renderType: Text.NativeRendering radius: 2
textColor: "black" border.color: Qt.rgba(255, 255, 255, 0.35)
passwordCharacter: "•" border.width: 1
// no background color: "black"
background: Rectangle {
radius: 0 Image {
border.width: 0 width: 12
height: 16
source: "../images/lockIcon.png"
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: 20
} }
} }
Keys.onEscapePressed: { Keys.onEscapePressed: {
root.close() root.close()
root.rejected() root.rejected()
@ -146,37 +158,47 @@ Item {
Label { Label {
text: qsTr("Please confirm new password") text: qsTr("Please confirm new password")
Layout.alignment: Qt.AlignHCenter anchors.left: parent.left
Layout.columnSpan: 2
Layout.fillWidth: true Layout.fillWidth: true
horizontalAlignment: Text.AlignHCenter
font.pixelSize: 18 * scaleRatio font.pixelSize: 16 * scaleRatio
font.family: Style.fontLight font.family: Style.fontLight
color: Style.defaultFontColor color: Style.defaultFontColor
} }
TextField { TextField {
id : passwordInput2 id : passwordInput2
Layout.topMargin: 6
Layout.fillWidth: true Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter anchors.left: parent.left
Layout.maximumWidth: 400 * scaleRatio horizontalAlignment: TextInput.AlignLeft
horizontalAlignment: TextInput.AlignHCenter
verticalAlignment: TextInput.AlignVCenter verticalAlignment: TextInput.AlignVCenter
font.family: "Arial" font.family: Style.fontLight
font.pixelSize: 32 * scaleRatio font.pixelSize: 24 * scaleRatio
echoMode: TextInput.Password echoMode: TextInput.Password
KeyNavigation.tab: okButton KeyNavigation.tab: okButton
bottomPadding: 10
leftPadding: 10
topPadding: 10
color: Style.defaultFontColor
style: TextFieldStyle { background: Rectangle {
renderType: Text.NativeRendering radius: 2
textColor: "black" border.color: Qt.rgba(255, 255, 255, 0.35)
passwordCharacter: "•" border.width: 1
// no background color: "black"
background: Rectangle {
radius: 0 Image {
border.width: 0 width: 12
height: 16
source: "../images/lockIcon.png"
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: 20
} }
} }
Keys.onReturnPressed: { Keys.onReturnPressed: {
if (passwordInput1.text === passwordInput2.text) { if (passwordInput1.text === passwordInput2.text) {
root.close() root.close()
@ -201,8 +223,9 @@ Item {
// Ok/Cancel buttons // Ok/Cancel buttons
RowLayout { RowLayout {
id: buttons id: buttons
spacing: 60 * scaleRatio spacing: 16 * scaleRatio
Layout.alignment: Qt.AlignHCenter Layout.topMargin: 16
Layout.alignment: Qt.AlignRight
MoneroComponents.StandardButton { MoneroComponents.StandardButton {
id: cancelButton id: cancelButton

View file

@ -74,7 +74,7 @@ Item {
ColumnLayout { ColumnLayout {
id: column id: column
//anchors {fill: parent; margins: 16 }
Layout.fillWidth: true Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.maximumWidth: 400 * scaleRatio Layout.maximumWidth: 400 * scaleRatio
@ -104,7 +104,8 @@ Item {
bottomPadding: 10 bottomPadding: 10
leftPadding: 10 leftPadding: 10
topPadding: 10 topPadding: 10
color: "white" color: Style.defaultFontColor
background: Rectangle { background: Rectangle {
radius: 2 radius: 2
border.color: Qt.rgba(255, 255, 255, 0.35) border.color: Qt.rgba(255, 255, 255, 0.35)