libdap-qt-ui-qml.qrc

@@ -18,5 +18,7 @@
         <file>widgets/DapTopPanel.qml</file>
         <file>widgets/DapTopPanelForm.ui.qml</file>
         <file>Device.qml</file>
+        <file>widgets/DapRadioButton.qml</file>
+        <file>widgets/DapRadioButtonForm.ui.qml</file>
     </qresource>
 </RCC>

widgets/DapButtonForm.ui.qml

@@ -3,79 +3,80 @@ import QtQuick.Controls 2.0
 
 Button {
     ///@detalis heightButton Button height.
-    property int heightButton: 36 * pt
+    property int heightButton
     ///@detalis widthButton Button width.
-    property int widthButton: 120 * pt
+    property int widthButton
     ///@detalis normalImageButton The picture on the Button is in normal state.
-    property string normalImageButton: "qrc:/res/icons/new-wallet_icon_dark.png"
+    property string normalImageButton
     ///@detalis hoverImageButton The image on the Button is in the mouseover state.
-    property string hoverImageButton: "qrc:/res/icons/new-wallet_icon_dark_hover.png"
+    property string hoverImageButton
     ///@detalis widthImageButton Image width.
-    property int widthImageButton: 28 * pt
+    property int widthImageButton
     ///@detalis heightImageButton Image height.
-    property int heightImageButton: 28 * pt
+    property int heightImageButton
     ///@detalis indentImageLeftButton: Indentation of the image from the left edge.
-    property int indentImageLeftButton: 10 * pt
+    property int indentImageLeftButton
     ///@detalis colorBackgroundNormal Button background color in normal state.
-    property string colorBackgroundNormal:"#070023"
+    property string colorBackgroundNormal
     ///@detalis colorBackgroundHover Button background color in hover state.
-    property string colorBackgroundHover: "#D51F5D"
+    property string colorBackgroundHover
     ///@detalis textButton Text button.
-    property string textButton: "New Wallet"
+    property string textButton
     ///@detalis colorButtonTextNormal Button text color in normal state.
-    property string colorButtonTextNormal: "#FFFFFF"
+    property string colorButtonTextNormal
     ///@detalis colorButtonTextHover Button text color in hover state.
-    property string colorButtonTextHover: "#FFFFFF"
+    property string colorButtonTextHover
     ///@detalis indentTextRight: Indentation of the text from the right edge.
-    property int indentTextRight: 20 * pt
-    ///@detalis fontSizeButton Font size.
-    property int fontSizeButton: 14 * pt
+    property int indentTextRight
+    ///@detalis fontButton Font setting.
+    property alias fontButton:buttonText.font
     ///@detalis existenceImage Indicates the presence of an image.
-    property bool existenceImage:true
+    property bool existenceImage: true
     ///@detalis horizontalAligmentText Horizontal alignment.
-    property alias horizontalAligmentText:templateText.horizontalAlignment
+    property alias horizontalAligmentText:buttonText.horizontalAlignment
     ///@detalis colorBackgroundButton This property overrides the background color.
     property alias colorBackgroundButton: dapBackgroundButton.color
     ///@detalis colorTextButton This property overrides the color of the text.
-    property alias colorTextButton: templateText.color
+    property alias colorTextButton: buttonText.color
     ///@detalis borderColorButton Sets the color of the border.
-    property string borderColorButton: "#000000"
+    property string borderColorButton
     ///@detalis borderWidthButton Sets the width of the border.
-    property int borderWidthButton: 0
+    property int borderWidthButton
 
     id: dapButton
 
-    contentItem: Rectangle {
-        id: dapBackgroundButton
-        anchors.fill: parent
-        color: dapButton.hovered ? colorBackgroundHover : colorBackgroundNormal
-        implicitWidth: widthButton
-        implicitHeight: heightButton
-        border.color: borderColorButton
-        border.width: borderWidthButton
-        ///button text
-        Text {
-            id: templateText
+    contentItem: 
+        Rectangle 
+        {
+            id: dapBackgroundButton
             anchors.fill: parent
-            verticalAlignment: Qt.AlignVCenter
-            horizontalAlignment: Qt.AlignRight
-            anchors.rightMargin: indentTextRight
-            font.pixelSize: fontSizeButton
-            font.family: "Roboto"
-            font.weight: Font.Normal
-            color: dapButton.hovered ? colorButtonTextHover : colorButtonTextNormal
-            text: qsTr(textButton)
+            color: dapButton.hovered ? colorBackgroundHover : colorBackgroundNormal
+            implicitWidth: widthButton
+            implicitHeight: heightButton
+            border.color: borderColorButton
+            border.width: borderWidthButton
+            ///button text
+            Text 
+            {
+                id: buttonText
+                anchors.fill: parent
+                verticalAlignment: Qt.AlignVCenter
+                horizontalAlignment: Qt.AlignRight
+                anchors.rightMargin: indentTextRight
+                color: dapButton.hovered ? colorButtonTextHover : colorButtonTextNormal
+                text: qsTr(textButton)
+            }
+    
+            ///button picture
+            Image
+            {
+                id: iconNewWallet
+                anchors.verticalCenter: if(existenceImage)parent.verticalCenter
+                anchors.left: if(existenceImage)parent.left
+                anchors.leftMargin:if(existenceImage) indentImageLeftButton
+                source: if(existenceImage) dapButton.hovered ? hoverImageButton : normalImageButton
+                width: if(existenceImage)widthImageButton
+                height:if(existenceImage) heightImageButton
+            }
         }
-
-        ///button picture
-        Image {
-            id: iconNewWallet
-            anchors.verticalCenter: if(existenceImage)parent.verticalCenter
-            anchors.left: if(existenceImage)parent.left
-            anchors.leftMargin:if(existenceImage) indentImageLeftButton
-            source: if(existenceImage) dapButton.hovered ? hoverImageButton : normalImageButton
-            width: if(existenceImage)widthImageButton
-            height:if(existenceImage) heightImageButton
-        }
-    }
 }

widgets/DapComboBox.qml

@@ -3,20 +3,23 @@ import QtQuick.Controls 2.0
 
 DapComboBoxForm
 {
+    id:dapComboBox
+
     delegate:ItemDelegate
     {
+
         width: parent.width
 
         //Adjusting the height of the line, taking into account that the second element from the end may be the last
         height:{
             if(index != currentIndex)
             {
-                if(index == customComboBox.count - 2)
+                if(index == (count - 2))
                 {
                     if(index+1 == currentIndex) return heightListElement + bottomIntervalListElement
                     else return heightListElement + intervalListElement
                 }
-                if (index == customComboBox.count - 1) return heightListElement + bottomIntervalListElement
+                if (index == count - 1) return heightListElement + bottomIntervalListElement
                 return heightListElement + intervalListElement
             }
             else return 0
@@ -27,9 +30,10 @@ DapComboBoxForm
             anchors.fill: parent
             anchors.topMargin: paddingTopItemDelegate
             anchors.leftMargin: popup.visible ? sidePaddingActive : sidePaddingNormal
-            font.family: fontRobotoRegular.name
-            font.pixelSize: fontSizeComboBox
-            text: {if(index != currentIndex) return modelData;}
+            font:dapComboBox.font
+            text: if(index != currentIndex)
+                      return modelData;
+                  else return ""
             color: hovered ? hilightColorText : normalColorText
         }
 
@@ -38,12 +42,12 @@ DapComboBoxForm
         background: Rectangle {
             anchors.fill: parent
             anchors.bottomMargin: {
-                if(index == countComboBox - 2)
+                if(index == count - 2)
                 {
                     if(index+1 == currentIndex) return bottomIntervalListElement
                     else return intervalListElement
                 }
-                if (index == countComboBox - 1) return bottomIntervalListElement
+                if (index == count - 1) return bottomIntervalListElement
                 return intervalListElement
             }
             color: hovered ? hilightColor : normalColor

widgets/DapComboBoxForm.ui.qml

-import QtQuick 2.0
+import QtQuick 2.0
 import QtQuick.Controls 2.2
 import QtQuick.Controls.Styles 1.4
 import QtGraphicalEffects 1.0
 
-ComboBox {
+ComboBox 
+{
     ///@detalis normalColorText Text color in normal state.
-    property string normalColorText: "#070023"
+    property string normalColorText
     ///@detalis hilightColorText Text color in selected state.
-    property string hilightColorText: "#FFFFFF"
+    property string hilightColorText
     ///@detalis normalColorTopText Text color in the main line in normal state.
-    property string normalColorTopText: normalColorText
+    property string normalColorTopText
     ///@detalis hilightColorTopText Text color in the main line in active state.
-    property string hilightColorTopText: normalColorText
+    property string hilightColorTopText
     ///@detalis normalColor Item color in normal state.
-    property string normalColor: "#FFFFFF"
+    property string normalColor
     ///@detalis hilightColor Item color in selected state.
-    property string hilightColor: "#330F54"
+    property string hilightColor
     ///@detalis normalTopColor Top string color in normal state.
-    property string normalTopColor: normalColor
+    property string normalTopColor
     ///@detalis hilightTopColor Top string color in selected state.
-    property string hilightTopColor: normalColor
-    ///@detalis fontSizeComboBox Font size for the entire widget.
-    property int fontSizeComboBox: 16 * pt
+    property string hilightTopColor
     ///@detalis widthPopupComboBoxNormal Width of the combo box in the normal state.
-    property int widthPopupComboBoxNormal: parent.width
+    property int widthPopupComboBoxNormal
     ///@detalis widthPopupComboBoxActive Width of the ComboBox in the active state.
-    property int widthPopupComboBoxActive: widthPopupComboBoxNormal
+    property int widthPopupComboBoxActive
     ///@detalis heightComboBoxNormal Height of the ComboBox in the normal state.
-    property int heightComboBoxNormal: parent.height
+    property int heightComboBoxNormal
     ///@detalis heightComboBoxActive Height of the ComboBox in the active state.
-    property int heightComboBoxActive: heightComboBoxNormal
+    property int heightComboBoxActive
     ///@detalis sidePaddingNormal: Sets the indent from the edge of the right and left edges of the parent in the normal state.
-    property int sidePaddingNormal: 16 * pt
+    property int sidePaddingNormal
     ///@detalis sidePaddingActive Sets the indent from the edge of the right and left edges of the parent in the active state.
-    property int sidePaddingActive: sidePaddingNormal
+    property int sidePaddingActive
     ///@detalis topIndentNormal Sets the indent from the edge of the upper of the parent in the normal state.
-    property int topIndentNormal: 12 * pt
+    property int topIndentNormal
     ///@detalis topIndentActive Sets the indent from the edge of the upper of the parent in the active state.
-    property int topIndentActive: topIndentNormal
+    property int topIndentActive
     ///@detalis bottomIndentNormal Sets the indent from the edge of the lower of the parent in the normal state.
-    property int bottomIndentNormal: 14 * pt
+    property int bottomIndentNormal
     ///@detalis bottomIndentActive Sets the indent from the edge of the lower of the parent in the active state.
-    property int bottomIndentActive: bottomIndentNormal
+    property int bottomIndentActive
     ///@detalis paddingTopItemDelegate Indent above from item delegate.
-    property int paddingTopItemDelegate: 8 * pt
+    property int paddingTopItemDelegate
     ///@detalis paddingBottomItemDelegate Indent below from item delegate.
-    property int paddingBottomItemDelegate: paddingTopItemDelegate
+    property int paddingBottomItemDelegate
     ///@detalis heightListElement List item height.
-    property int heightListElement: 32 * pt
+    property int heightListElement
     ///@detalis intervalListElement Spacing between items in a list.
-    property int intervalListElement: 10 * pt
+    property int intervalListElement
     ///@detalis bottomIntervalListElement Spacing from bottom to bottom.
-    property int bottomIntervalListElement: intervalListElement
+    property int bottomIntervalListElement
     ///@detalis topEffect Using an effect for the top element.
-    property bool topEffect: true
+    property bool topEffect
     ///@detalis indicatorImageNormal Indicator picture address for normal state.
-    property string indicatorImageNormal: "qrc:/res/icons/ic_arrow_drop_down_dark_blue.png"
+    property string indicatorImageNormal
     ///@detalis indicatorImageActive Indicator picture address for active state.
-    property string indicatorImageActive: "qrc:/res/icons/ic_arrow_drop_up_dark_blue.png"
+    property string indicatorImageActive
     ///@detalis indicatorWidth Indicator width.
-    property int indicatorWidth: 24 * pt
+    property int indicatorWidth
     ///@detalis indicatorHeight Indicator height.
-    property int indicatorHeight: indicatorWidth
+    property int indicatorHeight
     /// colorTopNormalDropShadow Color of the shadow effect of the combo box when minimized.
-    property string colorTopNormalDropShadow: "#00000000"
+    property string colorTopNormalDropShadow
     ///@detalis colorDropShadow Unboxed shadow color in expanded state.
-    property string colorDropShadow: "#40ABABAB"
-    ///@detalis countComboBox this variable indicates the number of lines in the list for
-    ///the delegate in the file DapComboBox.qml.
-    property int countComboBox: customComboBox.count
+    property string colorDropShadow
+    ///@detalis fontComboBox Font setting combobox.
+    property alias fontComboBox:customComboBox.font
 
     id: customComboBox
     width: popup.visible ? widthPopupComboBoxActive : widthPopupComboBoxNormal
@@ -76,74 +74,92 @@ ComboBox {
     anchors.verticalCenter: parent.verticalCenter
 
     //Icon icon near the text (arrow)
-    indicator: Image {
-        source: parent.popup.visible ? indicatorImageActive : indicatorImageNormal
-        width: indicatorWidth
-        height: indicatorHeight
-        anchors.verticalCenter: parent.verticalCenter
-        anchors.right: parent.right
-        anchors.rightMargin: popup.visible ? sidePaddingActive : sidePaddingNormal
-    }
+    indicator: 
+        Image 
+        {
+            source: parent.popup.visible ? indicatorImageActive : indicatorImageNormal
+            width: indicatorWidth
+            height: indicatorHeight
+            anchors.verticalCenter: parent.verticalCenter
+            anchors.right: parent.right
+            anchors.rightMargin: popup.visible ? sidePaddingActive : sidePaddingNormal
+        }
 
     //Defining the background for the main line
-    background: Rectangle {
-        anchors.fill: parent
-        color: parent.popup.visible ? hilightTopColor : normalTopColor
-        radius: 2 * pt
-        height: parent.height
-    }
+    background: 
+        Rectangle 
+        {
+            anchors.fill: parent
+            color: parent.popup.visible ? hilightTopColor : normalTopColor
+            radius: 2 * pt
+            height: parent.height
+        }
     //Main line text settings
-    contentItem: Text {
-        anchors.fill: parent
-        anchors.leftMargin: popup.visible ? sidePaddingActive : sidePaddingNormal
-        text: parent.displayText
-        font.family: fontRobotoRegular.name
-        font.pixelSize: fontSizeComboBox
-        color: popup.visible ? hilightColorTopText : normalColorTopText
-        verticalAlignment: Text.AlignVCenter
-    }
+    contentItem: 
+        Text 
+        {
+            id:textTopComboBox
+            anchors.fill: parent
+            anchors.leftMargin: popup.visible ? sidePaddingActive : sidePaddingNormal
+            text: parent.displayText
+            font: parent.font
+            color: popup.visible ? hilightColorTopText : normalColorTopText
+            verticalAlignment: Text.AlignVCenter
+        }
 
     //Customize drop-down list with shadow effect
-    popup: Popup {
-        y: parent.height - 1
-        width: parent.width + 1
-        padding: 1
-        contentItem: ListView {
-            clip: true
-            implicitHeight: contentHeight
-            model: customComboBox.popup.visible ? customComboBox.delegateModel : null
-            ScrollIndicator.vertical: ScrollIndicator {}
+    popup: 
+        Popup 
+        {
+            y: parent.height - 1
+            width: parent.width + 1
+            padding: 1
+            contentItem:
+                ListView 
+                {
+                    clip: true
+                    implicitHeight: contentHeight
+                    model: customComboBox.popup.visible ? customComboBox.delegateModel : null
+                    ScrollIndicator.vertical: ScrollIndicator {}
+                }
+    
+            background: 
+                Rectangle
+                {
+                    width: customComboBox.background.width
+                    color: normalColor
+                    Rectangle 
+                    {
+                        id: contentCorner
+                        anchors.fill: parent
+                    }
+        
+                    DropShadow 
+                    {
+                        anchors.fill: parent
+                        source: contentCorner
+                        verticalOffset: 9 * pt
+                        samples: 13 * pt
+                        color: colorDropShadow
+                    }
+                }
         }
 
-        background: Rectangle {
-            width: customComboBox.background.width
-            color: parent.color
-            Rectangle {
-                id: contentCorner
-                anchors.fill: parent
-            }
-
-            DropShadow {
-                anchors.fill: parent
-                source: contentCorner
-                verticalOffset: 9 * pt
-                samples: 13 * pt
-                color: colorDropShadow
-            }
+        //Shadow effect for the top element.
+        DropShadow 
+        {
+            anchors.fill: if (topEffect)
+                              parent
+            source: if (topEffect)
+                        background
+            verticalOffset: if (topEffect)
+                                9 * pt
+                            else 0
+            samples: if (topEffect)
+                         13 * pt
+                        else 0
+            color: if (topEffect)
+                       customComboBox.popup.visible ? colorDropShadow : colorTopNormalDropShadow
+                    else "#00000000"
         }
     }
-
-    //Shadow effect for the top element.
-    DropShadow {
-        anchors.fill: if (topEffect)
-                          parent
-        source: if (topEffect)
-                    background
-        verticalOffset: if (topEffect)
-                            9 * pt
-        samples: if (topEffect)
-                     13 * pt
-        color: if (topEffect)
-                   customComboBox.popup.visible ? colorDropShadow : colorTopNormalDropShadow
-    }
-}

widgets/DapRadioButton.qml

+import QtQuick 2.4
+
+DapRadioButtonForm {
+}

widgets/DapRadioButtonForm.ui.qml

+import QtQuick 2.0
+import QtQuick.Controls 2.0
+
+RadioButton
+{
+    ///@detalis textButton Text RadioButton.
+    property alias nameRadioButton: nameButton.text
+    ///@detalis fontText Font setting.
+    property alias fontRadioButton:nameButton.font
+    ///@detalis nameTextColor Text color.
+    property alias nameTextColor: nameButton.color
+    ///@detalis widthRadioButton Width RadioButton.
+    property alias widthRadioButton: customRadioButton.implicitWidth
+    ///@detalis heightRadioButton Height RadioButton.
+    property alias heightRadioButton: customRadioButton.implicitHeight
+    ///@detalis backgroundColor RadioButton background color
+    property alias backgroundColor:backgroundColor.color
+    ///@detalis spaceIndicatorText The gap between the indicator and the text.
+    property int spaceIndicatorText
+    ///@detalis indicatorBorderColor Border color indicator.
+    property string indicatorBorderColor
+    ///@detalis indicatorBackgroundColor Background color indicator.
+    property string indicatorBackgroundColor
+    ///@detalis indicatorInnerColorActiv Color of the inner circle in checked condition.
+    property string indicatorInnerColorActiv
+    ///@detalis indicatorInnerColorNormal Color of the inner circle in normal condition.
+    property string indicatorInnerColorNormal
+    ///@detalis indicatorSize The size of the main circle of the indicator.
+    property int indicatorSize
+    ///@detalis indicatorInnerSize The size of the inner circle of the indicator.
+    property int indicatorInnerSize   
+
+
+    id: customRadioButton
+
+    ///Text Options.
+    contentItem: Text {
+        id: nameButton
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.leftMargin: customRadioButton.indicator.width + spaceIndicatorText
+        verticalAlignment: Text.AlignVCenter
+        anchors.verticalCenter: parent.verticalCenter
+        color: "#3E3853"
+        horizontalAlignment: Text.AlignLeft
+        text: qsTr("template")
+    }
+        ///Indicator Options.
+        indicator: Rectangle {
+            id: indicatorRadioButton
+            implicitWidth: indicatorSize
+            implicitHeight: indicatorSize
+            x: 0
+            y: parent.height / 2 - height / 2
+            radius: indicatorSize/2
+            color: indicatorBackgroundColor
+            border.color: indicatorBorderColor
+
+            ///Indicator inner options.
+            Rectangle {
+                width: indicatorInnerSize
+                height: indicatorInnerSize
+                x: (indicatorRadioButton.width/2)-(width/2)
+                y: (indicatorRadioButton.height/2)-(height/2)
+                radius: indicatorInnerSize/2
+                color: customRadioButton.checked ? indicatorInnerColorActiv : indicatorInnerColorNormal
+            }
+        }
+    ///Background options.
+    background: Rectangle
+    {
+        id:backgroundColor
+        anchors.fill:parent
+        color:"transparent"
+    }
+
+    checked: false
+    autoExclusive: true
+}