diff options
author | Titta Heikkala <titta.heikkala@qt.io> | 2017-09-05 13:29:11 +0300 |
---|---|---|
committer | Titta Heikkala <titta.heikkala@qt.io> | 2017-09-06 10:55:33 +0000 |
commit | 71245a106ddb7c07a9cb305bb1e3904860d8af0b (patch) | |
tree | 434084cfaff48dc5bf96516c7750960daa384ff9 | |
parent | efc0d85236bd2408649ef4467f0ec702c95263c9 (diff) |
Improve the documentation of Chart Themes Example
Added more detailed documentation and code snippets to Chart Themes
Example.
Change-Id: I206b65038b369d0eaa5fb128b872328ec43de7a2
Task-number: QTBUG-60662
Reviewed-by: Miikka Heikkinen <miikka.heikkinen@qt.io>
Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>
Reviewed-by: Topi Reiniƶ <topi.reinio@qt.io>
-rw-r--r-- | examples/charts/chartthemes/themewidget.cpp | 26 | ||||
-rw-r--r-- | src/charts/doc/src/examples-chartthemes.qdoc | 69 |
2 files changed, 90 insertions, 5 deletions
diff --git a/examples/charts/chartthemes/themewidget.cpp b/examples/charts/chartthemes/themewidget.cpp index 47a6ea63..ed49ce9b 100644 --- a/examples/charts/chartthemes/themewidget.cpp +++ b/examples/charts/chartthemes/themewidget.cpp @@ -82,8 +82,10 @@ ThemeWidget::ThemeWidget(QWidget *parent) : m_ui->gridLayout->addWidget(chartView, 1, 1); m_charts << chartView; + //![5] chartView = new QChartView(createLineChart()); m_ui->gridLayout->addWidget(chartView, 1, 2); + //![5] m_charts << chartView; chartView = new QChartView(createBarChart(m_valueCount)); @@ -229,9 +231,12 @@ QChart *ThemeWidget::createBarChart(int valueCount) const QChart *ThemeWidget::createLineChart() const { + //![1] QChart *chart = new QChart(); chart->setTitle("Line chart"); + //![1] + //![2] QString name("Series "); int nameIndex = 0; for (const DataList &list : m_dataTable) { @@ -242,12 +247,17 @@ QChart *ThemeWidget::createLineChart() const nameIndex++; chart->addSeries(series); } + //![2] + //![3] chart->createDefaultAxes(); chart->axisX()->setRange(0, m_valueMax); chart->axisY()->setRange(0, m_valueCount); + //![3] + //![4] // Add space to label to add space between labels and axis static_cast<QValueAxis *>(chart->axisY())->setLabelFormat("%.1f "); + //![4] return chart; } @@ -324,19 +334,25 @@ QChart *ThemeWidget::createScatterChart() const void ThemeWidget::updateUI() { + //![6] QChart::ChartTheme theme = static_cast<QChart::ChartTheme>( m_ui->themeComboBox->itemData(m_ui->themeComboBox->currentIndex()).toInt()); - + //![6] const auto charts = m_charts; if (!m_charts.isEmpty() && m_charts.at(0)->chart()->theme() != theme) { - for (QChartView *chartView : charts) + for (QChartView *chartView : charts) { + //![7] chartView->chart()->setTheme(theme); + //![7] + } // Set palette colors based on selected theme + //![8] QPalette pal = window()->palette(); if (theme == QChart::ChartThemeLight) { pal.setColor(QPalette::Window, QRgb(0xf0f0f0)); pal.setColor(QPalette::WindowText, QRgb(0x404044)); + //![8] } else if (theme == QChart::ChartThemeDark) { pal.setColor(QPalette::Window, QRgb(0x121218)); pal.setColor(QPalette::WindowText, QRgb(0xd6d6d6)); @@ -363,19 +379,24 @@ void ThemeWidget::updateUI() } // Update antialiasing + //![11] bool checked = m_ui->antialiasCheckBox->isChecked(); for (QChartView *chart : charts) chart->setRenderHint(QPainter::Antialiasing, checked); + //![11] // Update animation options + //![9] QChart::AnimationOptions options( m_ui->animatedComboBox->itemData(m_ui->animatedComboBox->currentIndex()).toInt()); if (!m_charts.isEmpty() && m_charts.at(0)->chart()->animationOptions() != options) { for (QChartView *chartView : charts) chartView->chart()->setAnimationOptions(options); } + //![9] // Update legend alignment + //![10] Qt::Alignment alignment( m_ui->legendComboBox->itemData(m_ui->legendComboBox->currentIndex()).toInt()); @@ -388,5 +409,6 @@ void ThemeWidget::updateUI() chartView->chart()->legend()->show(); } } + //![10] } diff --git a/src/charts/doc/src/examples-chartthemes.qdoc b/src/charts/doc/src/examples-chartthemes.qdoc index bc9612bb..fc87f765 100644 --- a/src/charts/doc/src/examples-chartthemes.qdoc +++ b/src/charts/doc/src/examples-chartthemes.qdoc @@ -34,13 +34,76 @@ \brief The example shows the look and feel of the different built-in themes. - This example shows the look and feel of the different built-in themes for all supported chart - types. In order to give the result a more harmonious look, the background palette of the - application is customized to the theme selected. + This example shows the look and feel of the different built-in themes for some of the supported + chart types. \image examples_chartthemes_light.png \image examples_chartthemes_brown_sand.png \image examples_chartthemes_blue_cerulean.png \include examples-run.qdocinc + + \section1 Creating Charts + + The charts of different types are generated and added to the layout separately. For example, the + line chart is created as follows. The creation of other chart types is similar. + + First a chart is created. + + \snippet chartthemes/themewidget.cpp 1 + + A common set of random data is generated and placed in a list. This list is used in each chart + type to add data to the series of the chart. For the line series, QLineSeries instances are + created and added to the chart. + + \snippet chartthemes/themewidget.cpp 2 + + Default axes are created for the line series. We also specify ranges for the axes based on the + range of the data used for the series. + + \snippet chartthemes/themewidget.cpp 3 + + We also want to add more space between the labels and the y-axes. For this we specify a label + format that adds space characters to the labels. + + \snippet chartthemes/themewidget.cpp 4 + + Finally the line chart is added to the grid layout. + + \snippet chartthemes/themewidget.cpp 5 + + \section1 Changing Theme + + The user can select a built-in theme to be used in the example. This theme is then applied to + all charts in the layout. + + \snippet chartthemes/themewidget.cpp 6 + + \snippet chartthemes/themewidget.cpp 7 + + In order to give the result a more harmonious look, the background palette of the application is + customized to match the selected theme. The QPalette::Window and QPalette::WindowText roles are + set based on the selected theme. + + \snippet chartthemes/themewidget.cpp 8 + + \section1 Changing Animation, Legend and Anti-Aliasing + + In this example, it is also possible to see how changing animation, legend and anti-aliasing + affects the appearance of the chart. + + Based on the user's selection, the used animation type is set on each chart. It is possible to have + no animations in the chart, or have animations for grid axis or series, or both. + + \snippet chartthemes/themewidget.cpp 9 + + The chart can be shown with a legend. The legend can be aligned to different sides of the chart. + + \snippet chartthemes/themewidget.cpp 10 + + The user can also see how changing anti-aliasing option changes the appearance of the chart. + Anti-aliasing is updated based on the user's selection. + + \snippet chartthemes/themewidget.cpp 11 + */ |