625 lines
23 KiB
QML
625 lines
23 KiB
QML
import QtQuick
|
|
import QtQuick.Layouts
|
|
import QtQuick.Controls
|
|
import FluentUI.Controls
|
|
import FluentUI.impl
|
|
import Gallery
|
|
|
|
Item{
|
|
property list<QtObject> originalItems: [
|
|
PaneItem{
|
|
id: item
|
|
key: "/"
|
|
title: qsTr("Home")
|
|
icon.name: FluentIcons.graph_Home
|
|
},
|
|
PaneItem{
|
|
id: item2
|
|
key: "/map"
|
|
title: "地图"
|
|
},
|
|
PaneItemSeparator{},
|
|
PaneItemHeader{
|
|
title: qsTr("Colorful components")
|
|
},
|
|
PaneItemExpander{
|
|
title: qsTr("Inputs")
|
|
icon.name: FluentIcons.graph_CheckboxComposite
|
|
icon.width: 15
|
|
icon.height: 15
|
|
PaneItemExpander{
|
|
title: qsTr("Button")
|
|
icon.name: FluentIcons.graph_ToggleBorder
|
|
PaneItem{
|
|
title: qsTr("InputValidation")
|
|
enabled: false
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/standard"
|
|
title: qsTr("Button")
|
|
count: 10
|
|
onTap: {
|
|
count = 0
|
|
}
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/filled"
|
|
title: qsTr("FilledButton")
|
|
count: 100
|
|
infoBadge: InfoBadge{
|
|
count: model.count
|
|
color: Colors.teal.defaultBrushFor()
|
|
}
|
|
onTap: {
|
|
count = 0
|
|
}
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/pill"
|
|
title: qsTr("PillButton")
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/delay"
|
|
title: qsTr("DelayButton")
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/icon"
|
|
title: qsTr("IconButton")
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/dropdown"
|
|
title: qsTr("DropDownButton")
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/hyperlink"
|
|
title: qsTr("HyperlinkButton")
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/toggle"
|
|
title: qsTr("ToggleButton")
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/radio"
|
|
title: qsTr("RadioButton")
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/progress"
|
|
title: qsTr("ProgressButton")
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/button/chip"
|
|
title: qsTr("Chip")
|
|
}
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/copyabletext"
|
|
title: qsTr("CopyableText")
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/checkbox"
|
|
title: qsTr("Checkbox")
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/slider"
|
|
title: qsTr("Slider")
|
|
count: 99
|
|
infoBadge: InfoBadge{
|
|
count: model.count
|
|
color: Colors.purple.defaultBrushFor()
|
|
}
|
|
onTap: {
|
|
count = 0
|
|
}
|
|
}
|
|
PaneItem{
|
|
key: "/inputs/toggleswitch"
|
|
title: qsTr("ToggleSwitch")
|
|
}
|
|
},
|
|
PaneItemExpander{
|
|
title: qsTr("Form")
|
|
icon.name: FluentIcons.graph_Recent
|
|
PaneItemExpander{
|
|
title: qsTr("Picker")
|
|
PaneItem{
|
|
key: "/form/timepicker"
|
|
title: qsTr("TimePicker")
|
|
}
|
|
PaneItem{
|
|
key: "/form/datepicker"
|
|
title: qsTr("DatePicker")
|
|
}
|
|
PaneItem{
|
|
key: "/form/calendarpicker"
|
|
title: qsTr("CalendarPicker")
|
|
}
|
|
PaneItem{
|
|
key: "/form/colorpicker"
|
|
title: qsTr("ColorPicker")
|
|
}
|
|
PaneItem{
|
|
key: "/form/shortcutpicker"
|
|
title: qsTr("ShortcutPicker")
|
|
}
|
|
}
|
|
PaneItem{
|
|
key: "/form/textbox"
|
|
title: qsTr("TextBox")
|
|
}
|
|
PaneItem{
|
|
key: "/form/multilinetextbox"
|
|
title: qsTr("MultiLineTextBox")
|
|
}
|
|
PaneItem{
|
|
key: "/form/passwordbox"
|
|
title: qsTr("PasswordBox")
|
|
}
|
|
PaneItem{
|
|
key: "/form/autosuggestbox"
|
|
title: qsTr("AutoSuggestBox")
|
|
}
|
|
PaneItem{
|
|
key: "/form/combobox"
|
|
title: qsTr("ComboBox")
|
|
}
|
|
PaneItem{
|
|
key: "/form/multiselectcombobox"
|
|
title: qsTr("MultiSelectComboBox")
|
|
}
|
|
PaneItem{
|
|
key: "/form/numberbox"
|
|
title: qsTr("NumberBox")
|
|
}
|
|
PaneItem{
|
|
key: "/form/spinbox"
|
|
title: qsTr("SpinBox")
|
|
}
|
|
},
|
|
PaneItemExpander{
|
|
title: qsTr("Navigation")
|
|
icon.name: FluentIcons.graph_AllApps
|
|
PaneItem{
|
|
key: "/navigation/breadcrumb"
|
|
title: qsTr("Breadcrumb")
|
|
}
|
|
PaneItem{
|
|
key: "/navigation/navigationview"
|
|
title: qsTr("NavigationView")
|
|
}
|
|
PaneItem{
|
|
key: "/navigation/tabbar"
|
|
title: qsTr("TabBar")
|
|
}
|
|
PaneItem{
|
|
key: "/navigation/segmentedcontrol"
|
|
title: qsTr("SegmentedControl")
|
|
}
|
|
PaneItem{
|
|
key: "/navigation/tabview"
|
|
title: qsTr("TabView")
|
|
}
|
|
PaneItem{
|
|
key: "/navigation/datagrid"
|
|
title: qsTr("DataGrid")
|
|
}
|
|
PaneItem{
|
|
key: "/navigation/treedatagrid"
|
|
title: qsTr("TreeDataGrid")
|
|
}
|
|
PaneItem{
|
|
key: "/navigation/filetreedata"
|
|
title: qsTr("FileTreeData")
|
|
}
|
|
PaneItem{
|
|
key: "/navigation/pagination"
|
|
title: qsTr("Pagination")
|
|
}
|
|
PaneItem{
|
|
key: "/navigation/multiwindow"
|
|
title: qsTr("MultiWindow")
|
|
}
|
|
},
|
|
PaneItemExpander{
|
|
title: qsTr("Layouts")
|
|
icon.name: FluentIcons.graph_DockLeft
|
|
PaneItem{
|
|
key: "/layouts/splitlayout"
|
|
title: qsTr("SplitLayout")
|
|
}
|
|
PaneItem{
|
|
key: "/layouts/staggeredlayout"
|
|
title: qsTr("StaggeredLayout")
|
|
}
|
|
PaneItem{
|
|
key: "/layouts/fliplayout"
|
|
title: qsTr("FlipLayout")
|
|
}
|
|
PaneItem{
|
|
key: "/layouts/bannerlayout"
|
|
title: qsTr("BannerLayout")
|
|
}
|
|
},
|
|
PaneItemExpander{
|
|
title: qsTr("Surfaces")
|
|
icon.name: FluentIcons.graph_Tiles
|
|
PaneItem{
|
|
key: "/surfaces/iconlabel"
|
|
title: qsTr("IconLabel")
|
|
}
|
|
PaneItem{
|
|
key: "/surfaces/infobar"
|
|
title: qsTr("InfoBar")
|
|
}
|
|
PaneItem{
|
|
key: "/surfaces/infobadge"
|
|
title: qsTr("InfoBadge")
|
|
}
|
|
PaneItem{
|
|
key: "/surfaces/expander"
|
|
title: qsTr("Expander")
|
|
}
|
|
PaneItem{
|
|
key: "/surfaces/progressbar"
|
|
title: qsTr("ProgressBar")
|
|
}
|
|
PaneItem{
|
|
key: "/surfaces/progressring"
|
|
title: qsTr("ProgressRing")
|
|
}
|
|
PaneItem{
|
|
key: "/surfaces/watermark"
|
|
title: qsTr("Watermark")
|
|
}
|
|
PaneItem{
|
|
key: "/surfaces/ratingcontrol"
|
|
title: qsTr("RatingControl")
|
|
}
|
|
PaneItem{
|
|
key: "/surfaces/shimmer"
|
|
title: qsTr("Shimmer")
|
|
}
|
|
},
|
|
PaneItemExpander{
|
|
title: qsTr("Popups")
|
|
icon.name: FluentIcons.graph_Message
|
|
PaneItem{
|
|
key: "/popups/menu"
|
|
title: qsTr("Menu")
|
|
}
|
|
PaneItem{
|
|
key: "/popups/contentdialog"
|
|
title: qsTr("ContentDialog")
|
|
}
|
|
PaneItem{
|
|
key: "/popups/dialogwindow"
|
|
title: qsTr("DialogWindow")
|
|
}
|
|
PaneItem{
|
|
key: "/popups/tooltip"
|
|
title: qsTr("ToolTip")
|
|
}
|
|
PaneItem{
|
|
key: "/popups/drawer"
|
|
title: qsTr("Drawer")
|
|
}
|
|
},
|
|
PaneItemExpander{
|
|
title: qsTr("Chart")
|
|
icon.name: FluentIcons.graph_AreaChart
|
|
PaneItem{
|
|
key: "/chart/bar"
|
|
title: qsTr("Bar Chart")
|
|
}
|
|
PaneItem{
|
|
key: "/chart/line"
|
|
title: qsTr("Line Chart")
|
|
}
|
|
PaneItem{
|
|
key: "/chart/pie"
|
|
title: qsTr("Pie Chart")
|
|
}
|
|
PaneItem{
|
|
key: "/chart/polararea"
|
|
title: qsTr("Polar Area Chart")
|
|
}
|
|
PaneItem{
|
|
key: "/chart/bubble"
|
|
title: qsTr("Bubble Chart")
|
|
}
|
|
PaneItem{
|
|
key: "/chart/scatter"
|
|
title: qsTr("Scatter Chart")
|
|
}
|
|
PaneItem{
|
|
key: "/chart/radar"
|
|
title: qsTr("Radar Chart")
|
|
}
|
|
},
|
|
PaneItemExpander{
|
|
title: qsTr("Theme")
|
|
icon.name: FluentIcons.graph_Color
|
|
PaneItem{
|
|
key: "/theme/acrylic"
|
|
title: qsTr("Acrylic")
|
|
}
|
|
PaneItem{
|
|
key: "/theme/colors"
|
|
title: qsTr("Colors")
|
|
}
|
|
PaneItem{
|
|
key: "/theme/typography"
|
|
title: qsTr("Typography")
|
|
}
|
|
PaneItem{
|
|
key: "/theme/icons"
|
|
title: qsTr("Icons")
|
|
}
|
|
},
|
|
PaneItemExpander{
|
|
title: qsTr("Other")
|
|
icon.name: FluentIcons.graph_Package
|
|
PaneItem{
|
|
key: "/other/timeline"
|
|
title: qsTr("Timeline")
|
|
}
|
|
PaneItem{
|
|
key: "/other/tour"
|
|
title: qsTr("Tour")
|
|
}
|
|
PaneItem{
|
|
key: "/other/Marquee"
|
|
title: qsTr("Marquee")
|
|
}
|
|
PaneItem{
|
|
key: "/other/syntaxview"
|
|
title: qsTr("SyntaxView")
|
|
}
|
|
PaneItem{
|
|
key: "/other/qrcode"
|
|
title: qsTr("QRCode")
|
|
}
|
|
PaneItem{
|
|
key: "/other/dial"
|
|
title: qsTr("Dial")
|
|
}
|
|
}
|
|
]
|
|
property list<QtObject> originalFooterItems : [
|
|
PaneItem{
|
|
icon.name: FluentIcons.graph_Contact
|
|
key: "/about"
|
|
title: qsTr("About")
|
|
},
|
|
PaneItem{
|
|
icon.name: FluentIcons.graph_Settings
|
|
key: "/settings"
|
|
title: qsTr("Settings")
|
|
}
|
|
]
|
|
PageRouter{
|
|
id: page_router
|
|
routes: {
|
|
"/": {url: R.resolvedUrl("res/qml/page/T_Home.qml"),singleton:true},
|
|
"/map": {url: R.resolvedUrl("res/qml/page/T_Map.qml"),singleton:true},
|
|
"/about": R.resolvedUrl("res/qml/page/T_About.qml"),
|
|
"/settings": R.resolvedUrl("res/qml/page/T_Settings.qml"),
|
|
"/inputs/button/standard": R.resolvedUrl("res/qml/page/T_StandardButton.qml"),
|
|
"/inputs/button/filled": R.resolvedUrl("res/qml/page/T_FilledButton.qml"),
|
|
"/inputs/button/pill": R.resolvedUrl("res/qml/page/T_PillButton.qml"),
|
|
"/inputs/button/delay": R.resolvedUrl("res/qml/page/T_DelayButton.qml"),
|
|
"/inputs/button/icon" : R.resolvedUrl("res/qml/page/T_IconButton.qml"),
|
|
"/inputs/button/dropdown": R.resolvedUrl("res/qml/page/T_DropDownButton.qml"),
|
|
"/inputs/button/hyperlink": R.resolvedUrl("res/qml/page/T_HyperlinkButton.qml"),
|
|
"/inputs/button/toggle": R.resolvedUrl("res/qml/page/T_ToggleButton.qml"),
|
|
"/inputs/button/radio": R.resolvedUrl("res/qml/page/T_RadioButton.qml"),
|
|
"/inputs/button/progress": R.resolvedUrl("res/qml/page/T_ProgressButton.qml"),
|
|
"/inputs/button/chip": R.resolvedUrl("res/qml/page/T_Chip.qml"),
|
|
"/inputs/checkbox": R.resolvedUrl("res/qml/page/T_Checkbox.qml"),
|
|
"/inputs/copyabletext": R.resolvedUrl("res/qml/page/T_CopyableText.qml"),
|
|
"/inputs/slider": R.resolvedUrl("res/qml/page/T_Slider.qml"),
|
|
"/inputs/toggleswitch": R.resolvedUrl("res/qml/page/T_ToggleSwitch.qml"),
|
|
"/form/textbox": R.resolvedUrl("res/qml/page/T_TextBox.qml"),
|
|
"/form/multilinetextbox": R.resolvedUrl("res/qml/page/T_MultiLineTextBox.qml"),
|
|
"/form/passwordbox": R.resolvedUrl("res/qml/page/T_PasswordBox.qml"),
|
|
"/form/autosuggestbox": R.resolvedUrl("res/qml/page/T_AutoSuggestBox.qml"),
|
|
"/form/combobox": R.resolvedUrl("res/qml/page/T_ComboBox.qml"),
|
|
"/form/multiselectcombobox": R.resolvedUrl("res/qml/page/T_MultiSelectComboBox.qml"),
|
|
"/form/numberbox": R.resolvedUrl("res/qml/page/T_NumberBox.qml"),
|
|
"/form/spinbox": R.resolvedUrl("res/qml/page/T_SpinBox.qml"),
|
|
"/form/timepicker": R.resolvedUrl("res/qml/page/T_TimePicker.qml"),
|
|
"/form/calendarpicker": R.resolvedUrl("res/qml/page/T_CalendarPicker.qml"),
|
|
"/form/colorpicker": R.resolvedUrl("res/qml/page/T_ColorPicker.qml"),
|
|
"/form/datepicker": R.resolvedUrl("res/qml/page/T_DatePicker.qml"),
|
|
"/form/shortcutpicker": R.resolvedUrl("res/qml/page/T_ShortcutPicker.qml"),
|
|
"/navigation/breadcrumb": R.resolvedUrl("res/qml/page/T_Breadcrumb.qml"),
|
|
"/navigation/navigationview": R.resolvedUrl("res/qml/page/T_NavigationView.qml"),
|
|
"/navigation/tabbar": R.resolvedUrl("res/qml/page/T_TabBar.qml"),
|
|
"/navigation/segmentedcontrol": R.resolvedUrl("res/qml/page/T_SegmentedControl.qml"),
|
|
"/navigation/tabview": R.resolvedUrl("res/qml/page/T_TabView.qml"),
|
|
"/navigation/datagrid": R.resolvedUrl("res/qml/page/T_DataGrid.qml"),
|
|
"/navigation/treedatagrid": R.resolvedUrl("res/qml/page/T_TreeDataGrid.qml"),
|
|
"/navigation/filetreedata": R.resolvedUrl("res/qml/page/T_FileTreeData.qml"),
|
|
"/navigation/pagination": R.resolvedUrl("res/qml/page/T_Pagination.qml"),
|
|
"/navigation/multiwindow": R.resolvedUrl("res/qml/page/T_MultiWindow.qml"),
|
|
"/surfaces/iconlabel": R.resolvedUrl("res/qml/page/T_IconLabel.qml"),
|
|
"/layouts/splitlayout": R.resolvedUrl("res/qml/page/T_SplitLayout.qml"),
|
|
"/layouts/staggeredlayout": R.resolvedUrl("res/qml/page/T_StaggeredLayout.qml"),
|
|
"/layouts/bannerlayout": R.resolvedUrl("res/qml/page/T_BannerLayout.qml"),
|
|
"/layouts/fliplayout": R.resolvedUrl("res/qml/page/T_FlipLayout.qml"),
|
|
"/surfaces/infobar": R.resolvedUrl("res/qml/page/T_InfoBar.qml"),
|
|
"/surfaces/infobadge": R.resolvedUrl("res/qml/page/T_InfoBadge.qml"),
|
|
"/surfaces/expander": R.resolvedUrl("res/qml/page/T_Expander.qml"),
|
|
"/surfaces/progressbar": R.resolvedUrl("res/qml/page/T_ProgressBar.qml"),
|
|
"/surfaces/progressring": R.resolvedUrl("res/qml/page/T_ProgressRing.qml"),
|
|
"/surfaces/watermark": R.resolvedUrl("res/qml/page/T_Watermark.qml"),
|
|
"/surfaces/ratingcontrol": R.resolvedUrl("res/qml/page/T_RatingControl.qml"),
|
|
"/surfaces/shimmer": R.resolvedUrl("res/qml/page/T_Shimmer.qml"),
|
|
"/popups/menu": R.resolvedUrl("res/qml/page/T_Menu.qml"),
|
|
"/popups/contentdialog": R.resolvedUrl("res/qml/page/T_ContentDialog.qml"),
|
|
"/popups/dialogwindow": R.resolvedUrl("res/qml/page/T_DialogWindow.qml"),
|
|
"/popups/tooltip": R.resolvedUrl("res/qml/page/T_ToolTip.qml"),
|
|
"/popups/drawer": R.resolvedUrl("res/qml/page/T_Drawer.qml"),
|
|
"/chart/bar": R.resolvedUrl("res/qml/chart/T_BarChart.qml"),
|
|
"/chart/line": R.resolvedUrl("res/qml/chart/T_LineChart.qml"),
|
|
"/chart/pie": R.resolvedUrl("res/qml/chart/T_PieChart.qml"),
|
|
"/chart/polararea": R.resolvedUrl("res/qml/chart/T_PolarAreaChart.qml"),
|
|
"/chart/bubble": R.resolvedUrl("res/qml/chart/T_BubbleChart.qml"),
|
|
"/chart/scatter": R.resolvedUrl("res/qml/chart/T_ScatterChart.qml"),
|
|
"/chart/radar": R.resolvedUrl("res/qml/chart/T_RadarChart.qml"),
|
|
"/theme/colors": R.resolvedUrl("res/qml/page/T_Colors.qml"),
|
|
"/theme/acrylic": R.resolvedUrl("res/qml/page/T_Acrylic.qml"),
|
|
"/theme/typography": R.resolvedUrl("res/qml/page/T_Typography.qml"),
|
|
"/theme/icons": R.resolvedUrl("res/qml/page/T_Icons.qml"),
|
|
"/other/timeline": R.resolvedUrl("res/qml/page/T_Timeline.qml"),
|
|
"/other/tour": R.resolvedUrl("res/qml/page/T_Tour.qml"),
|
|
"/other/Marquee": R.resolvedUrl("res/qml/page/T_Marquee.qml"),
|
|
"/other/syntaxview": R.resolvedUrl("res/qml/page/T_SyntaxView.qml"),
|
|
"/other/qrcode": R.resolvedUrl("res/qml/page/T_QRCode.qml"),
|
|
"/other/dial": R.resolvedUrl("res/qml/page/T_Dial.qml")
|
|
}
|
|
}
|
|
Menu{
|
|
id: item_menu
|
|
property var item
|
|
MenuItem{
|
|
text: qsTr("Open in Separate Window")
|
|
onClicked: {
|
|
var url = page_router.toUrl(item_menu.item.key)
|
|
var title = item_menu.item.title
|
|
if(url){
|
|
WindowRouter.go("/page",{url:url,title:title})
|
|
}
|
|
}
|
|
}
|
|
function showMenu(item){
|
|
item_menu.item = item
|
|
item_menu.popup()
|
|
}
|
|
}
|
|
NavigationView{
|
|
id: navigation_view
|
|
router: page_router
|
|
anchors.fill: parent
|
|
logo: "qrc:/qt/qml/Gallery/res/image/logo.png"
|
|
title: "FluentUI Gallery"
|
|
items: originalItems
|
|
footerItems: originalFooterItems
|
|
displayMode: Global.displayMode
|
|
appBarHeight: Qt.platform.os === "osx" ? 60 : 48
|
|
titleBarTopMargin: Qt.platform.os === "osx" ? 20 : 0
|
|
autoSuggestBox: AutoSuggestBox{
|
|
id: auto_suggset_search
|
|
placeholderText: qsTr("Search")
|
|
items: []
|
|
trailing: RowLayout{
|
|
IconButton{
|
|
implicitWidth: 30
|
|
implicitHeight: 20
|
|
icon.name: FluentIcons.graph_ChromeClose
|
|
icon.width: 10
|
|
icon.height: 10
|
|
visible: auto_suggset_search.text !== ""
|
|
onClicked: {
|
|
auto_suggset_search.clear()
|
|
}
|
|
}
|
|
IconButton{
|
|
implicitWidth: 30
|
|
implicitHeight: 20
|
|
icon.name: FluentIcons.graph_Search
|
|
enabled: false
|
|
icon.width: 14
|
|
icon.height: 14
|
|
}
|
|
}
|
|
onTap:
|
|
(item)=>{
|
|
if(item.key){
|
|
page_router.go(item.key)
|
|
}
|
|
}
|
|
Connections{
|
|
target: navigation_view
|
|
function onSourceItemsChanged(data){
|
|
auto_suggset_search.items = data.filter((item)=>{ return item instanceof PaneItem})
|
|
}
|
|
}
|
|
}
|
|
leading: comp_profile
|
|
trailing: Item{
|
|
height: 40
|
|
Label{
|
|
text: qsTr("Custom Content")
|
|
anchors.centerIn: parent
|
|
}
|
|
}
|
|
onTap:
|
|
(item)=>{
|
|
if(item.key){
|
|
page_router.go(item.key)
|
|
}
|
|
}
|
|
onRightTap:
|
|
(item)=>{
|
|
if(item.key){
|
|
item_menu.showMenu(item)
|
|
}
|
|
}
|
|
Component.onCompleted: {
|
|
var onNextButtonListnenr = function(tour){
|
|
page_router.go("/settings")
|
|
tour.next()
|
|
}
|
|
var homeId = function(){return navigation_view.sideBarView.itemAtIndex(0)}
|
|
var settingsId = function(){return navigation_view.sideBarFooterView.itemAtIndex(1)}
|
|
window.tourSteps.push({title:qsTr("Home"),description: qsTr("Here you can switch to Home."),target:homeId,onNextListener: onNextButtonListnenr})
|
|
window.tourSteps.push({title:qsTr("Settins"),description: qsTr("Here you can switch to Settins."),target:settingsId})
|
|
page_router.go("/")
|
|
}
|
|
}
|
|
Component{
|
|
id: comp_profile
|
|
Item{
|
|
height: 80
|
|
IconButton{
|
|
anchors{
|
|
fill: parent
|
|
leftMargin: 4
|
|
rightMargin: 4
|
|
}
|
|
RoundImageView{
|
|
id: avatar
|
|
width: 60
|
|
height: 60
|
|
radius: 30
|
|
sourceSize: Qt.size(120,120)
|
|
anchors{
|
|
verticalCenter: parent.verticalCenter
|
|
left: parent.left
|
|
leftMargin: 10
|
|
}
|
|
source: "qrc:/qt/qml/Gallery/res/image/ic_avatar.jpg"
|
|
}
|
|
Column{
|
|
spacing: 4
|
|
anchors{
|
|
left: avatar.right
|
|
leftMargin: 10
|
|
verticalCenter: parent.verticalCenter
|
|
}
|
|
Label{
|
|
text: "ZhuZiChu"
|
|
}
|
|
Label{
|
|
text: "zhuzichu520@outlook.com"
|
|
color: control.FluentUI.theme.res.textFillColorSecondary
|
|
}
|
|
}
|
|
onClicked: {
|
|
Qt.openUrlExternally("https://github.com/zhuzichu520/FluentUI")
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|