update
zhuzihcu
parent
f4cebb5c14
commit
bdf4da81dd
|
|
@ -31,6 +31,33 @@ Item {
|
|||
Layout.preferredWidth: 300
|
||||
placeholderText: "多行输入框"
|
||||
}
|
||||
FluAutoSuggestBox{
|
||||
Layout.topMargin: 20
|
||||
values:generateRandomNames(100)
|
||||
placeholderText: "AutoSuggestBox"
|
||||
Layout.preferredWidth: 300
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function generateRandomNames(numNames) {
|
||||
const alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
|
||||
const names = [];
|
||||
function generateRandomName() {
|
||||
const nameLength = Math.floor(Math.random() * 5) + 4;
|
||||
let name = '';
|
||||
for (let i = 0; i < nameLength; i++) {
|
||||
const letterIndex = Math.floor(Math.random() * 26);
|
||||
name += alphabet.charAt(letterIndex);
|
||||
}
|
||||
return name;
|
||||
}
|
||||
for (let i = 0; i < numNames; i++) {
|
||||
const name = generateRandomName();
|
||||
names.push(name);
|
||||
}
|
||||
return names;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -33,6 +33,7 @@ void Fluent::registerTypes(const char *uri){
|
|||
qmlRegisterType<WindowHelper>(uri,major,minor,"WindowHelper");
|
||||
qmlRegisterType<FluColorSet>(uri,major,minor,"FluColorSet");
|
||||
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluAutoSuggestBox.qml"),uri,major,minor,"FluAutoSuggestBox");
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluExpander.qml"),uri,major,minor,"FluExpander");
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluTreeView.qml"),uri,major,minor,"FluTreeView");
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluContentDialog.qml"),uri,major,minor,"FluContentDialog");
|
||||
|
|
|
|||
|
|
@ -16,7 +16,6 @@ public:
|
|||
|
||||
FramelessView::FramelessView(QWindow *parent) : Super(parent), d(new FramelessViewPrivate)
|
||||
{
|
||||
setResizeMode(SizeRootObjectToView);
|
||||
refreshWindow();
|
||||
setIsMax(windowState() == Qt::WindowMaximized);
|
||||
setIsFull(windowState() == Qt::WindowFullScreen);
|
||||
|
|
@ -36,6 +35,8 @@ void FramelessView::refreshWindow(){
|
|||
}else{
|
||||
setFlags(Qt::Window);
|
||||
}
|
||||
setResizeMode(SizeViewToRootObject);
|
||||
setResizeMode(SizeRootObjectToView);
|
||||
}
|
||||
|
||||
FramelessView::~FramelessView()
|
||||
|
|
|
|||
|
|
@ -0,0 +1,134 @@
|
|||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
TextField{
|
||||
id:input
|
||||
width: 300
|
||||
property var values:[]
|
||||
color: FluTheme.isDark ? "#FFFFFF" : "#1A1A1A"
|
||||
selectionColor: {
|
||||
if(FluTheme.isDark){
|
||||
return FluTheme.primaryColor.lighter
|
||||
}else{
|
||||
return FluTheme.primaryColor.dark
|
||||
}
|
||||
}
|
||||
rightPadding: 30
|
||||
selectByMouse: true
|
||||
|
||||
background: FluTextBoxBackground{
|
||||
inputItem: input
|
||||
|
||||
FluIconButton{
|
||||
icon:FluentIcons.FA_close
|
||||
iconSize: 14
|
||||
width: 20
|
||||
height: 20
|
||||
opacity: 0.5
|
||||
visible: input.text !== ""
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
rightMargin: 5
|
||||
}
|
||||
onClicked:{
|
||||
input.text = ""
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component.onCompleted: {
|
||||
searchData()
|
||||
}
|
||||
|
||||
Popup{
|
||||
id:input_popup
|
||||
visible: input.focus
|
||||
y:input.height
|
||||
onClosed: {
|
||||
input.focus = false
|
||||
}
|
||||
background: Rectangle{
|
||||
width: input.width
|
||||
radius: 4
|
||||
FluShadow{
|
||||
radius: 4
|
||||
}
|
||||
color: FluTheme.isDark ? Qt.rgba(51/255,48/255,48/255,1) : Qt.rgba(243/255,241/255,240/255,1)
|
||||
height: 38*Math.min(Math.max(list_view.count,1),8)
|
||||
ListView{
|
||||
id:list_view
|
||||
signal closePopup
|
||||
anchors.fill: parent
|
||||
boundsBehavior: ListView.StopAtBounds
|
||||
clip: true
|
||||
header: Item{
|
||||
width: input.width
|
||||
height: visible ? 38 : 0
|
||||
visible: list_view.count === 0
|
||||
FluText{
|
||||
text:"没有找到结果"
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
leftMargin: 15
|
||||
}
|
||||
}
|
||||
}
|
||||
ScrollBar.vertical: ScrollBar { }
|
||||
delegate: Item{
|
||||
height: 38
|
||||
width: input.width
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
anchors.topMargin: 2
|
||||
anchors.bottomMargin: 2
|
||||
anchors.leftMargin: 5
|
||||
anchors.rightMargin: 5
|
||||
color: {
|
||||
if(item_mouse.containsMouse){
|
||||
return FluTheme.isDark ? Qt.rgba(63/255,60/255,61/255,1) : Qt.rgba(234/255,234/255,234/255,1)
|
||||
}
|
||||
return FluTheme.isDark ? Qt.rgba(51/255,48/255,48/255,1) : Qt.rgba(243/255,241/255,240/255,1)
|
||||
}
|
||||
radius: 3
|
||||
MouseArea{
|
||||
id:item_mouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
input_popup.close()
|
||||
input.text = modelData
|
||||
}
|
||||
}
|
||||
FluText{
|
||||
text:modelData
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
leftMargin: 10
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onTextChanged: {
|
||||
searchData()
|
||||
}
|
||||
|
||||
function searchData(){
|
||||
var result = []
|
||||
values.map(function(item){
|
||||
if(item.indexOf(input.text)!==-1){
|
||||
result.push(item)
|
||||
}
|
||||
})
|
||||
list_view.model = result
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -23,10 +23,12 @@ Popup {
|
|||
anchors.centerIn: Overlay.overlay
|
||||
closePolicy: Popup.CloseOnEscape
|
||||
background: Rectangle {
|
||||
id:layout_content
|
||||
implicitWidth:minWidth
|
||||
implicitHeight: text_title.height + text_message.height + layout_actions.height
|
||||
color:FluTheme.isDark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(249/255,249/255,249/255,1)
|
||||
radius:5
|
||||
|
||||
FluShadow{
|
||||
radius: 5
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ Popup {
|
|||
implicitHeight: container.height
|
||||
color:FluTheme.isDark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(237/255,237/255,237/255,1)
|
||||
radius: 5
|
||||
|
||||
FluShadow{
|
||||
radius: 5
|
||||
}
|
||||
|
|
|
|||
|
|
@ -35,5 +35,6 @@
|
|||
<file>controls/FluContentDialog.qml</file>
|
||||
<file>controls/FluTreeView.qml</file>
|
||||
<file>controls/FluExpander.qml</file>
|
||||
<file>controls/FluAutoSuggestBox.qml</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
|
|
|||
Loading…
Reference in New Issue