Compare commits

..

No commits in common. "af573b71a4fcd40bfb09e110e4284d5802f90f3b" and "6b9f7a1c9913714a147476d130eac34526b8030d" have entirely different histories.

8 changed files with 104 additions and 240 deletions

View File

@ -2487,8 +2487,8 @@ Some contents...</source>
<location filename="qml/page/T_TextBox.qml" line="33"/>
<location filename="qml/page/T_TextBox.qml" line="64"/>
<location filename="qml/page/T_TextBox.qml" line="97"/>
<location filename="qml/page/T_TextBox.qml" line="135"/>
<location filename="qml/page/T_TextBox.qml" line="168"/>
<location filename="qml/page/T_TextBox.qml" line="128"/>
<location filename="qml/page/T_TextBox.qml" line="157"/>
<source>Disabled</source>
<translation type="unfinished"></translation>
</message>
@ -2507,11 +2507,6 @@ Some contents...</source>
<source>AutoSuggestBox</source>
<translation type="unfinished"></translation>
</message>
<message>
<location filename="qml/page/T_TextBox.qml" line="131"/>
<source>Show suggest when pressed</source>
<translation type="unfinished"></translation>
</message>
</context>
<context>
<name>T_Theme</name>

View File

@ -2676,8 +2676,8 @@ Some contents...</source>
<location filename="qml/page/T_TextBox.qml" line="33"/>
<location filename="qml/page/T_TextBox.qml" line="64"/>
<location filename="qml/page/T_TextBox.qml" line="97"/>
<location filename="qml/page/T_TextBox.qml" line="135"/>
<location filename="qml/page/T_TextBox.qml" line="168"/>
<location filename="qml/page/T_TextBox.qml" line="128"/>
<location filename="qml/page/T_TextBox.qml" line="157"/>
<source>Disabled</source>
<translation type="unfinished"></translation>
</message>
@ -2696,11 +2696,6 @@ Some contents...</source>
<source>AutoSuggestBox</source>
<translation type="unfinished"></translation>
</message>
<message>
<location filename="qml/page/T_TextBox.qml" line="131"/>
<source>Show suggest when pressed</source>
<translation></translation>
</message>
</context>
<context>
<name>T_Theme</name>

View File

@ -26,8 +26,7 @@ FluScrollablePage{
width: parent.width
text: qsTr("It usually appears in the upper right corner of the notification icon or avatar to display the number of messages that need to be processed")
}
Flow{
width: parent.width
Row{
spacing: 20
Rectangle{
width: 40
@ -35,7 +34,7 @@ FluScrollablePage{
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topRight"
topRight: true
showZero: true
count:0
}
@ -47,7 +46,7 @@ FluScrollablePage{
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topRight"
topRight: true
showZero: true
count:5
}
@ -58,7 +57,7 @@ FluScrollablePage{
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topRight"
topRight: true
showZero: true
count:50
}
@ -69,10 +68,9 @@ FluScrollablePage{
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topRight"
topRight: true
showZero: true
count:1000
max: 999
count:100
}
}
Rectangle{
@ -81,7 +79,7 @@ FluScrollablePage{
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topRight"
topRight: true
showZero: true
isDot:true
}
@ -92,7 +90,7 @@ FluScrollablePage{
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topRight"
topRight: true
showZero: true
count:99
color: Qt.rgba(250/255,173/255,20/255,1)
@ -104,71 +102,12 @@ FluScrollablePage{
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topRight"
topRight: true
showZero: true
count:99
color: Qt.rgba(82/255,196/255,26/255,1)
}
}
Rectangle{
width: 40
height: 40
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topRight"
showZero: true
count:100
color: Qt.rgba(84/255,169/255,1,1)
}
}
Rectangle{
width: 40
height: 40
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "bottomLeft"
showZero: true
count:100
color: Qt.rgba(84/255,169/255,1,1)
}
}
Rectangle{
width: 40
height: 40
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topLeft"
showZero: true
count:100
color: Qt.rgba(84/255,169/255,1,1)
}
}
Rectangle{
width: 40
height: 40
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "bottomRight"
showZero: true
count:100
color: Qt.rgba(84/255,169/255,1,1)
}
}
Rectangle{
width: 40
height: 40
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topRight"
count: "NEW"
color: Qt.rgba(84/255,169/255,1,1)
}
}
}
}
}
@ -181,9 +120,7 @@ FluScrollablePage{
radius: 8
color: Qt.rgba(191/255,191/255,191/255,1)
FluBadge{
position: "topRight"
count: 100
max: 99
isDot: false
color: Qt.rgba(82/255,196/255,26/255,1)
}

View File

@ -114,26 +114,18 @@ FluScrollablePage{
placeholderText: qsTr("AutoSuggestBox")
items: generateRandomNames(100)
disabled: text_box_suggest_switch.checked
itemRows: 12
showSuggestWhenPressed: text_box_show_suggest_switch.checked
anchors{
verticalCenter: parent.verticalCenter
left: parent.left
}
}
RowLayout{
FluToggleSwitch{
id:text_box_suggest_switch
anchors{
verticalCenter: parent.verticalCenter
right: parent.right
}
FluToggleSwitch{
id:text_box_show_suggest_switch
text: qsTr("Show suggest when pressed")
}
FluToggleSwitch{
id:text_box_suggest_switch
text: qsTr("Disabled")
}
text: qsTr("Disabled")
}
}
CodeExpander{
@ -141,9 +133,6 @@ FluScrollablePage{
Layout.topMargin: -6
code:'FluAutoSuggestBox{
placeholderText: qsTr("AutoSuggestBox")
itemRows: 12
itemHeight: 38
showSuggestWhenPressed: false
}'
}

View File

@ -7,12 +7,9 @@ FluTextBox{
property var items:[]
property string emptyText: qsTr("No results found")
property int autoSuggestBoxReplacement: FluentIcons.Search
property int itemHeight: 38
property int itemRows: 8
property bool showSuggestWhenPressed: false
property string textRole: "title"
property var filter: function(item){
if(item[textRole].indexOf(control.text)!==-1){
if(item.title.indexOf(control.text)!==-1){
return true
}
return false
@ -32,11 +29,17 @@ FluTextBox{
control.updateText(modelData[textRole])
}
function loadData(){
var result = []
if(items==null){
list_view.model = []
list_view.model = result
return
}
list_view.model = items.filter(item => control.filter(item))
items.map(function(item){
if(control.filter(item)){
result.push(item)
}
})
list_view.model = result
}
}
onActiveFocusChanged: {
@ -66,7 +69,7 @@ FluTextBox{
ScrollBar.vertical: FluScrollBar {}
header: Item{
width: control.width
height: visible ? control.itemHeight : 0
height: visible ? 38 : 0
visible: list_view.count === 0
FluText{
text: emptyText
@ -79,7 +82,7 @@ FluTextBox{
}
delegate:FluControl{
id: item_control
height: control.itemHeight
height: 38
width: control.width
onClicked: {
d.handleClick(modelData)
@ -111,7 +114,7 @@ FluTextBox{
background:Rectangle{
id: rect_background
implicitWidth: control.width
implicitHeight: control.itemHeight*Math.min(Math.max(list_view.count,1),control.itemRows)
implicitHeight: 38*Math.min(Math.max(list_view.count,1),8)
radius: 5
color: FluTheme.dark ? Qt.rgba(43/255,43/255,43/255,1) : Qt.rgba(1,1,1,1)
border.color: FluTheme.dark ? Qt.rgba(26/255,26/255,26/255,1) : Qt.rgba(191/255,191/255,191/255,1)
@ -121,14 +124,6 @@ FluTextBox{
}
}
onTextChanged: {
control.showSuggest()
}
onPressed: {
if(control.showSuggestWhenPressed){
control.showSuggest()
}
}
function showSuggest(){
d.loadData()
if(d.flagVisible){
var pos = control.mapToItem(null, 0, 0)

View File

@ -5,15 +5,19 @@ import FluentUI 1.0
Rectangle{
property bool isDot: false
property bool showZero: false
property var count: 0
property int max: 99
property string position: "" // topLeft, topRight, bottomLeft, bottomRight
property int count: 0
property bool topRight: false
id:control
color:Qt.rgba(255/255,77/255,79/255,1)
width: {
if(isDot)
return 10
return content_text.implicitWidth + 12
if(count<10){
return 20
}else if(count<100){
return 30
}
return 40
}
height: {
if(isDot)
@ -27,74 +31,49 @@ Rectangle{
}
border.width: 1
border.color: Qt.rgba(1,1,1,1)
anchors {
left: {
if(!parent){
return undefined
}
return (position === "topLeft" || position === "bottomLeft") ? parent.left : undefined
}
anchors{
right: {
if(!parent){
return undefined
}
return (position === "topRight" || position === "bottomRight") ? parent.right : undefined
if(parent && topRight)
return parent.right
return undefined
}
top: {
if(!parent){
return undefined
}
return (position === "topLeft" || position === "topRight") ? parent.top : undefined
}
bottom: {
if(!parent){
return undefined
}
return (position === "bottomLeft" || position === "bottomRight") ? parent.bottom : undefined
}
leftMargin: {
if(!parent){
return 0
}
return (position === "topLeft" || position === "bottomLeft") ? (isDot ? -2.5 : -(width / 2)) : 0
if(parent && topRight)
return parent.top
return undefined
}
rightMargin: {
if(!parent){
return 0
if(parent && topRight){
if(isDot){
return -2.5
}
return -(control.width/2)
}
return (position === "topRight" || position === "bottomRight") ? (isDot ? -2.5 : -(width / 2)) : 0
return 0
}
topMargin: {
if(!parent){
return 0
if(parent && topRight){
if(isDot){
return -2.5
}
return -10
}
return (position === "topLeft" || position === "topRight") ? (isDot ? -2.5 : -10) : 0
}
bottomMargin: {
if(!parent){
return 0
}
return (position === "bottomLeft" || position === "bottomRight") ? (isDot ? -2.5 : -10) : 0
return 0
}
}
visible: {
if(typeof(count) === "number"){
return showZero ? true : count !== 0
}
return true
if(showZero)
return true
return count!==0
}
FluText{
id: content_text
anchors.centerIn: parent
color: Qt.rgba(1,1,1,1)
visible: !isDot
text:{
if(typeof(count) === "string"){
if(count<100)
return count
}else if(typeof(count) === "number"){
return count <= max ? count.toString() : "%1+".arg(max.toString())
}
return ""
return "100+"
}
}
}

View File

@ -6,12 +6,9 @@ FluTextBox{
property var items:[]
property string emptyText: qsTr("No results found")
property int autoSuggestBoxReplacement: FluentIcons.Search
property int itemHeight: 38
property int itemRows: 8
property bool showSuggestWhenPressed: false
property string textRole: "title"
property var filter: function(item){
if(item[textRole].indexOf(control.text)!==-1){
if(item.title.indexOf(control.text)!==-1){
return true
}
return false
@ -31,11 +28,17 @@ FluTextBox{
control.updateText(modelData[textRole])
}
function loadData(){
var result = []
if(items==null){
list_view.model = []
list_view.model = result
return
}
list_view.model = items.filter(item => control.filter(item))
items.map(function(item){
if(control.filter(item)){
result.push(item)
}
})
list_view.model = result
}
}
onActiveFocusChanged: {
@ -65,7 +68,7 @@ FluTextBox{
ScrollBar.vertical: FluScrollBar {}
header: Item{
width: control.width
height: visible ? control.itemHeight : 0
height: visible ? 38 : 0
visible: list_view.count === 0
FluText{
text: emptyText
@ -78,7 +81,7 @@ FluTextBox{
}
delegate:FluControl{
id: item_control
height: control.itemHeight
height: 38
width: control.width
onClicked: {
d.handleClick(modelData)
@ -110,7 +113,7 @@ FluTextBox{
background:Rectangle{
id: rect_background
implicitWidth: control.width
implicitHeight: control.itemHeight*Math.min(Math.max(list_view.count,1),control.itemRows)
implicitHeight: 38*Math.min(Math.max(list_view.count,1),8)
radius: 5
color: FluTheme.dark ? Qt.rgba(43/255,43/255,43/255,1) : Qt.rgba(1,1,1,1)
border.color: FluTheme.dark ? Qt.rgba(26/255,26/255,26/255,1) : Qt.rgba(191/255,191/255,191/255,1)
@ -120,14 +123,6 @@ FluTextBox{
}
}
onTextChanged: {
control.showSuggest()
}
onPressed: {
if(control.showSuggestWhenPressed){
control.showSuggest()
}
}
function showSuggest(){
d.loadData()
if(d.flagVisible){
var pos = control.mapToItem(null, 0, 0)

View File

@ -5,15 +5,19 @@ import FluentUI
Rectangle{
property bool isDot: false
property bool showZero: false
property var count: 0
property int max: 99
property string position: "" // topLeft, topRight, bottomLeft, bottomRight
property int count: 0
property bool topRight: false
id:control
color:Qt.rgba(255/255,77/255,79/255,1)
width: {
if(isDot)
return 10
return content_text.implicitWidth + 12
if(count<10){
return 20
}else if(count<100){
return 30
}
return 40
}
height: {
if(isDot)
@ -27,74 +31,49 @@ Rectangle{
}
border.width: 1
border.color: Qt.rgba(1,1,1,1)
anchors {
left: {
if(!parent){
return undefined
}
return (position === "topLeft" || position === "bottomLeft") ? parent.left : undefined
}
anchors{
right: {
if(!parent){
return undefined
}
return (position === "topRight" || position === "bottomRight") ? parent.right : undefined
if(parent && topRight)
return parent.right
return undefined
}
top: {
if(!parent){
return undefined
}
return (position === "topLeft" || position === "topRight") ? parent.top : undefined
}
bottom: {
if(!parent){
return undefined
}
return (position === "bottomLeft" || position === "bottomRight") ? parent.bottom : undefined
}
leftMargin: {
if(!parent){
return 0
}
return (position === "topLeft" || position === "bottomLeft") ? (isDot ? -2.5 : -(width / 2)) : 0
if(parent && topRight)
return parent.top
return undefined
}
rightMargin: {
if(!parent){
return 0
if(parent && topRight){
if(isDot){
return -2.5
}
return -(control.width/2)
}
return (position === "topRight" || position === "bottomRight") ? (isDot ? -2.5 : -(width / 2)) : 0
return 0
}
topMargin: {
if(!parent){
return 0
if(parent && topRight){
if(isDot){
return -2.5
}
return -10
}
return (position === "topLeft" || position === "topRight") ? (isDot ? -2.5 : -10) : 0
}
bottomMargin: {
if(!parent){
return 0
}
return (position === "bottomLeft" || position === "bottomRight") ? (isDot ? -2.5 : -10) : 0
return 0
}
}
visible: {
if(typeof(count) === "number"){
return showZero ? true : count !== 0
}
return true
if(showZero)
return true
return count!==0
}
FluText{
id: content_text
anchors.centerIn: parent
color: Qt.rgba(1,1,1,1)
visible: !isDot
text:{
if(typeof(count) === "string"){
if(count<100)
return count
}else if(typeof(count) === "number"){
return count <= max ? count.toString() : "%1+".arg(max.toString())
}
return ""
return "100+"
}
}
}