FluentUI/example/qml/page/T_Typography.qml

90 lines
2.1 KiB
QML
Raw Normal View History

2023-03-30 21:52:55 +08:00
import QtQuick
import QtQuick.Layouts
import QtQuick.Controls
import FluentUI
2023-02-26 23:47:07 +08:00
2023-03-10 18:08:32 +08:00
FluContentPage {
2023-03-09 23:11:59 +08:00
2023-03-10 18:08:32 +08:00
title: "Typography"
2023-05-10 00:27:53 +08:00
property real textScale: 1
2023-03-28 17:53:46 +08:00
leftPadding:10
rightPadding:10
bottomPadding:20
2023-03-09 23:11:59 +08:00
2023-03-25 20:45:33 +08:00
Component.onCompleted: {
2023-03-29 21:43:01 +08:00
slider.seek(0)
2023-03-25 20:45:33 +08:00
}
2023-04-06 17:32:21 +08:00
FluArea{
anchors{
top:parent.top
left: parent.left
right: parent.right
bottom: parent.bottom
topMargin: 20
}
paddings: 10
2023-03-06 18:08:01 +08:00
ColumnLayout{
2023-03-09 23:11:59 +08:00
spacing: 0
2023-05-10 00:27:53 +08:00
scale: textScale
transformOrigin: Item.TopLeft
2023-03-06 18:08:01 +08:00
FluText{
2023-05-10 00:27:53 +08:00
id:text_Display
2023-03-06 18:08:01 +08:00
text:"Display"
2023-03-09 23:11:59 +08:00
padding: 0
2023-05-10 00:27:53 +08:00
font: FluTextStyle.Display
2023-03-06 18:08:01 +08:00
}
FluText{
2023-05-10 00:27:53 +08:00
id:text_TitleLarge
2023-03-06 18:08:01 +08:00
text:"Title Large"
2023-03-09 23:11:59 +08:00
padding: 0
2023-05-10 00:27:53 +08:00
font: FluTextStyle.TitleLarge
2023-03-06 18:08:01 +08:00
}
FluText{
2023-05-10 00:27:53 +08:00
id:text_Title
2023-03-06 18:08:01 +08:00
text:"Title"
2023-03-09 23:11:59 +08:00
padding: 0
2023-05-10 00:27:53 +08:00
font: FluTextStyle.Title
2023-03-06 18:08:01 +08:00
}
FluText{
2023-05-10 00:27:53 +08:00
id:text_Subtitle
2023-03-06 18:08:01 +08:00
text:"Subtitle"
2023-03-09 23:11:59 +08:00
padding: 0
2023-05-10 00:27:53 +08:00
font: FluTextStyle.Subtitle
2023-03-06 18:08:01 +08:00
}
FluText{
2023-05-10 00:27:53 +08:00
id:text_BodyStrong
2023-03-06 18:08:01 +08:00
text:"Body Strong"
2023-03-09 23:11:59 +08:00
padding: 0
2023-05-10 00:27:53 +08:00
font: FluTextStyle.BodyStrong
2023-03-06 18:08:01 +08:00
}
FluText{
2023-05-10 00:27:53 +08:00
id:text_Body
2023-03-06 18:08:01 +08:00
text:"Body"
2023-03-09 23:11:59 +08:00
padding: 0
2023-05-10 00:27:53 +08:00
font: FluTextStyle.Body
2023-03-06 18:08:01 +08:00
}
FluText{
2023-05-10 00:27:53 +08:00
id:text_Caption
2023-03-06 18:08:01 +08:00
text:"Caption"
2023-03-09 23:11:59 +08:00
padding: 0
2023-05-10 00:27:53 +08:00
font: FluTextStyle.Caption
2023-03-06 18:08:01 +08:00
}
2023-02-26 23:47:07 +08:00
}
2023-03-09 23:11:59 +08:00
2023-04-06 17:32:21 +08:00
FluSlider{
id:slider
vertical:true
anchors{
right: parent.right
rightMargin: 45
top: parent.top
topMargin: 30
}
onValueChanged:{
2023-05-10 00:27:53 +08:00
textScale = 1+value/100
2023-04-06 17:32:21 +08:00
}
2023-03-09 23:11:59 +08:00
}
}
2023-02-26 23:47:07 +08:00
}