229 lines
8.9 KiB
QML
229 lines
8.9 KiB
QML
// ===========================================
|
||
// =============== 字体修改面板 ===============
|
||
// ===========================================
|
||
|
||
import QtQuick 2.15
|
||
import QtQuick.Controls 2.15
|
||
|
||
import "../../Widgets"
|
||
|
||
ModalLayer {
|
||
id: fRoot
|
||
property var fontsList: []
|
||
|
||
// 主要UI文字字体,内容可控,可以用裁切的ttf
|
||
property string fontFamily: ""
|
||
// 数据显示文字字体,内容不可控,用兼容性好的系统字体
|
||
property string dataFontFamily: ""
|
||
// 不可加载的字体
|
||
property var illegalFonts: ["", "Terminal", "System", "Small Fonts", "Script", "Roman", "MS Serif", "MS Sans Serif", "Modern", "Fixedsys"]
|
||
|
||
function setFontFamily(f) {
|
||
fontFamily = f
|
||
qmlapp.globalConfigs.setValue("ui.fontFamily", f)
|
||
}
|
||
function setDataFontFamily(f) {
|
||
dataFontFamily = f
|
||
qmlapp.globalConfigs.setValue("ui.dataFontFamily", f)
|
||
}
|
||
|
||
Component.onCompleted: {
|
||
// 将此组件的引用传入全局设置
|
||
qmlapp.globalConfigs.fontPanel = this
|
||
fontFamily = qmlapp.globalConfigs.getValue("ui.fontFamily")
|
||
dataFontFamily = qmlapp.globalConfigs.getValue("ui.dataFontFamily")
|
||
}
|
||
|
||
contentItem: Item {
|
||
id: content
|
||
anchors.fill: parent
|
||
}
|
||
Loader {
|
||
id: panelLoader
|
||
asynchronous: true
|
||
sourceComponent: com
|
||
active: fRoot.visible
|
||
}
|
||
Component {
|
||
id: com
|
||
DoubleRowLayout {
|
||
parent: content
|
||
anchors.fill: parent
|
||
initSplitterX: 0.5
|
||
|
||
Component.onCompleted: {
|
||
// 获取字体列表,过滤出以中文字符开头的字体
|
||
let fList = Qt.fontFamilies()
|
||
let newList = fList.filter(function(str) {
|
||
return /^[\u4e00-\u9fa5]/.test(str);
|
||
})
|
||
// 补充剩余字体
|
||
for(let i in fList) {
|
||
if(illegalFonts.includes(fList[i]))
|
||
continue
|
||
if(!newList.includes(fList[i]))
|
||
newList.push(fList[i])
|
||
}
|
||
// 将当前选中的移到最前面
|
||
const i1 = newList.indexOf(dataFontFamily)
|
||
if (i1 > -1) {
|
||
newList.splice(i1, 1)
|
||
newList.unshift(dataFontFamily)
|
||
}
|
||
const i2 = newList.indexOf(fontFamily)
|
||
if (i2 > -1 && i2 !== i1) {
|
||
newList.splice(i2, 1)
|
||
newList.unshift(fontFamily)
|
||
}
|
||
fRoot.fontsList = newList
|
||
}
|
||
|
||
leftItem: Panel {
|
||
anchors.fill: parent
|
||
clip: true
|
||
|
||
Row {
|
||
id: leftTop
|
||
anchors.top: parent.top
|
||
anchors.right: parent.right
|
||
anchors.margins: size_.spacing
|
||
anchors.topMargin: 0
|
||
anchors.rightMargin: size_.spacing * 3
|
||
spacing: size_.spacing
|
||
height: size_.line * 2
|
||
|
||
// Text_ {
|
||
// anchors.top: parent.top
|
||
// anchors.bottom: parent.bottom
|
||
// verticalAlignment: Text.AlignVCenter
|
||
// text: qsTr("设置为:")
|
||
// }
|
||
Text_ {
|
||
anchors.top: parent.top
|
||
anchors.bottom: parent.bottom
|
||
verticalAlignment: Text.AlignVCenter
|
||
horizontalAlignment: Text.AlignHCenter
|
||
width: size_.line * 3
|
||
text: qsTr("界面")
|
||
}
|
||
Text_ {
|
||
anchors.top: parent.top
|
||
anchors.bottom: parent.bottom
|
||
verticalAlignment: Text.AlignVCenter
|
||
horizontalAlignment: Text.AlignHCenter
|
||
width: size_.line * 3
|
||
text: qsTr("内容")
|
||
font.family: theme.dataFontFamily
|
||
}
|
||
}
|
||
Panel {
|
||
anchors.top: leftTop.bottom
|
||
anchors.bottom: parent.bottom
|
||
anchors.left: parent.left
|
||
anchors.right: parent.right
|
||
anchors.margins: size_.spacing
|
||
anchors.topMargin: 0
|
||
color: theme.bgColor
|
||
|
||
TableView {
|
||
id: leftTable
|
||
anchors.fill: parent
|
||
anchors.margins: size_.spacing
|
||
clip: true
|
||
model: fRoot.fontsList
|
||
contentWidth: width // 内容宽度
|
||
rowSpacing: size_.spacing // 行间隔
|
||
flickableDirection: Flickable.VerticalFlick // 只允许垂直滚动
|
||
columnWidthProvider: ()=>leftTable.width
|
||
|
||
delegate: Rectangle {
|
||
height: size_.line * 2
|
||
implicitWidth: 100
|
||
implicitHeight: height
|
||
width: leftTable.width
|
||
color: fontMouseArea.containsMouse?theme.coverColor2:"#00000000"
|
||
|
||
Text_ {
|
||
text: modelData
|
||
anchors.fill: parent
|
||
anchors.leftMargin: size_.spacing
|
||
verticalAlignment: Text.AlignVCenter
|
||
font.family: modelData
|
||
}
|
||
MouseArea {
|
||
id: fontMouseArea
|
||
anchors.fill: parent
|
||
hoverEnabled: true
|
||
}
|
||
// 右边,内容字体
|
||
IconButton {
|
||
id: btn2
|
||
anchors.top: parent.top
|
||
anchors.bottom: parent.bottom
|
||
anchors.right: parent.right
|
||
anchors.margins: size_.smallSpacing
|
||
color: theme.yesColor
|
||
bgColor_: theme.coverColor1
|
||
width: size_.line * 3
|
||
borderWidth: 1
|
||
borderColor: theme.specialTextColor
|
||
bgHoverColor_: theme.coverColor3
|
||
icon_: dataFontFamily===modelData?"yes":""
|
||
onClicked: setDataFontFamily(modelData)
|
||
}
|
||
// 左边,界面字体
|
||
IconButton {
|
||
id: btn1
|
||
anchors.top: parent.top
|
||
anchors.bottom: parent.bottom
|
||
anchors.right: btn2.left
|
||
anchors.margins: size_.smallSpacing
|
||
anchors.rightMargin: size_.spacing
|
||
color: theme.yesColor
|
||
bgColor_: theme.coverColor1
|
||
width: size_.line * 3
|
||
borderWidth: 1
|
||
borderColor: theme.specialTextColor
|
||
bgHoverColor_: theme.coverColor3
|
||
icon_: fontFamily===modelData?"yes":""
|
||
onClicked: setFontFamily(modelData)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
rightItem: Panel {
|
||
anchors.fill: parent
|
||
|
||
Item {
|
||
anchors.fill: parent
|
||
anchors.margins: size_.spacing * 3
|
||
|
||
Column {
|
||
anchors.fill: parent
|
||
spacing: size_.line
|
||
|
||
Text_ {
|
||
anchors.left: parent.left
|
||
anchors.right: parent.right
|
||
wrapMode: Text.Wrap
|
||
font.family: fontFamily
|
||
text: qsTr("界面字体:\n软件中大部分UI的字体。")
|
||
}
|
||
|
||
Text_ {
|
||
anchors.left: parent.left
|
||
anchors.right: parent.right
|
||
wrapMode: Text.Wrap
|
||
font.family: dataFontFamily
|
||
text: qsTr("内容字体:\n识别结果内容的字体。")
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|