Testbed
// Copyright (C) 2023 The Qt Company Ltd. // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause import QtQuick import QtGraphs Rectangle { anchors.fill: parent gradient: Gradient { GradientStop { position: 0.0; color: "#d0d020" } GradientStop { position: 1.0; color: "#406020" } } GraphsView { id: chartView anchors.fill: parent anchors.margins: 20 * px anchors.rightMargin: settingsView.posX + 20 * px theme: GraphTheme { id: myTheme colorTheme: GraphTheme.ColorThemeDark axisXLabelsFont.pixelSize: 20 gridMajorBarsColor: "#ffffff" gridMinorBarsColor: "#eeeeee" axisYMajorColor: "#ffffff" axisYMinorColor: "#eeeeee" axisXMajorColor: "#ffffff" axisXMinorColor: "#eeeeee" shadowEnabled: checkBoxShadowEnabled.checked shadowColor: "#80404040" } SeriesTheme { id: customSeriesTheme colors: ["#dd444444", "#dd555555", "#dd666666", "#dd777777", "#dd888888"] borderColors: ["#111111", "#222222", "#333333", "#444444", "#555555"] borderWidth: 2 } BarSeries { id: mySeries theme: customSeriesTheme axisX: BarCategoryAxis { id: xAxis visible: checkBoxAxisXVisible.checked lineVisible: checkBoxAxisXLineVisible.checked labelsVisible: checkBoxAxisXLabelsVisible.checked categories: [1, 2, 3, 4, 5, 6] gridVisible: checkBoxGridXMajor.checked minorGridVisible: checkBoxGridXMinor.checked } axisY: ValueAxis { id: yAxis visible: checkBoxAxisYVisible.checked lineVisible: checkBoxAxisYLineVisible.checked labelsVisible: checkBoxAxisYLabelsVisible.checked max: 10 minorTickCount: 1 // Alternative tick formatting //tickInterval: 1.0 //labelFormat: "g" //labelDecimals: 3 gridVisible: checkBoxGridYMajor.checked minorGridVisible: checkBoxGridYMinor.checked } BarSet { id: set1; label: "Bob"; values: [1, 2, 3, 4, 5, 6] } BarSet { id: set2; label: "Frank"; values: [8, 8, 6, 0, 5, 3] } BarSet { id: set3; label: "James"; values: [4, 3, 2, 6, 4, 2] } BarSet { id: set5; label: "Frank"; values: [8, 4, 3, 1, 8, 5] } BarSet { id: set6; label: "James"; values: [5, 2, 5, 7, 1, 2] } } } SettingsView { id: settingsView CustomLabel { text: "Margin: Left" } CustomSlider { sliderValue: chartView.marginLeft fromValue: 0 toValue: 60 onSliderValueChanged: chartView.marginLeft = sliderValue; } CustomLabel { text: "Margin: Right" } CustomSlider { sliderValue: chartView.marginRight fromValue: 0 toValue: 60 onSliderValueChanged: chartView.marginRight = sliderValue; } CustomLabel { text: "Margin: Top" } CustomSlider { sliderValue: chartView.marginTop fromValue: 0 toValue: 60 onSliderValueChanged: chartView.marginTop = sliderValue; } CustomLabel { text: "Margin: Bottom" } CustomSlider { sliderValue: chartView.marginBottom fromValue: 0 toValue: 60 onSliderValueChanged: chartView.marginBottom = sliderValue; } CustomLabel { text: "Y-coordinate: Max" } CustomSlider { id: sliderYMaxValue sliderValue: yAxis.max fromValue: 0.1 toValue: 110 onSliderValueChanged: yAxis.max = sliderValue; } CustomLabel { text: "Y-coordinate: Min" } CustomSlider { id: sliderYMinValue sliderValue: yAxis.min fromValue: -3 toValue: 3 onSliderValueChanged: yAxis.min = sliderValue; } CustomLabel { text: "Y-coordinate: Anchor" } CustomSlider { id: sliderYAnchorValue sliderValue: yAxis.tickAnchor fromValue: -10 toValue: 10 onSliderValueChanged: yAxis.tickAnchor = sliderValue; } CustomLabel { text: "Y-coordinate: Decimals" } CustomSlider { id: sliderYAnchorDecimals sliderValue: yAxis.labelDecimals sliderStepSize: 1 fromValue: -1 toValue: 4 onSliderValueChanged: yAxis.labelDecimals = sliderValue; } CustomCheckBox { id: checkBoxAxisXVisible text: "Axis X: Visible" checked: true } CustomCheckBox { id: checkBoxAxisXLineVisible text: "Axis X: Line visible" checked: true } CustomCheckBox { id: checkBoxAxisXLabelsVisible text: "Axis X: Labels visible" checked: true } CustomCheckBox { id: checkBoxAxisYVisible text: "Axis Y: Visible" checked: true } CustomCheckBox { id: checkBoxAxisYLineVisible text: "Axis Y: Line visible" checked: true } CustomCheckBox { id: checkBoxAxisYLabelsVisible text: "Axis Y: Labels visible" checked: true } CustomCheckBox { id: checkBoxGridYMajor text: "Grid Y: Major lines" checked: true } CustomCheckBox { id: checkBoxGridYMinor text: "Grid Y: Minor lines" checked: true } CustomCheckBox { id: checkBoxGridXMajor text: "Grid X: Major lines" checked: false } CustomCheckBox { id: checkBoxGridXMinor text: "Grid X: Minor lines" checked: false } CustomLabel { text: "Y-coordinate: Minor Ticks" } CustomSlider { id: sliderYTicksValue sliderValue: yAxis.minorTickCount sliderStepSize: 1 fromValue: 0 toValue: 9 onSliderValueChanged: yAxis.minorTickCount = sliderValue; } CustomLabel { text: "Major bars width" } CustomSlider { sliderValue: myTheme.gridMajorBarsWidth fromValue: 1.0 toValue: 4.0 onSliderValueChanged: { myTheme.gridMajorBarsWidth = sliderValue; myTheme.axisYMajorBarWidth = sliderValue; myTheme.axisXMajorBarWidth = sliderValue; } } CustomLabel { text: "Minor bars width" } CustomSlider { sliderValue: myTheme.gridMinorBarsWidth fromValue: 1.0 toValue: 4.0 onSliderValueChanged: { myTheme.gridMinorBarsWidth = sliderValue; myTheme.axisYMinorBarWidth = sliderValue; myTheme.axisXMinorBarWidth = sliderValue; } } CustomCheckBox { id: checkBoxShadowEnabled text: "Shadow: Enabled" checked: true } CustomLabel { text: "Shadow: Opacity" } CustomSlider { id: sliderShadowOpacity sliderValue: myTheme.shadowColor.a fromValue: 0 toValue: 1 onSliderValueChanged: myTheme.shadowColor.a = sliderValue; } CustomLabel { text: "Shadow: Smoothing" } CustomSlider { id: sliderShadowSmoothing sliderValue: myTheme.shadowSmoothing fromValue: 0 toValue: 10 onSliderValueChanged: myTheme.shadowSmoothing = sliderValue; } CustomLabel { text: "Shadow: OffsetX" } CustomSlider { id: sliderShadowOffsetX sliderValue: myTheme.shadowXOffset fromValue: -2 toValue: 2 onSliderValueChanged: myTheme.shadowXOffset = sliderValue; } CustomLabel { text: "Shadow: OffsetY" } CustomSlider { id: sliderShadowOffsetY sliderValue: myTheme.shadowYOffset fromValue: -2 toValue: 2 onSliderValueChanged: myTheme.shadowYOffset = sliderValue; } } }