168492376
/
qskinny
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

use new Diagram class

This commit is contained in:
Peter Hartmann 2021-04-16 15:05:18 +02:00
parent 0df95fcb37
commit d4bc4e12f5
5 changed files with 52 additions and 157 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
examples/iot-dashboard/Diagram.h
View File

@ -1,3 +1,5 @@
// ### copyright Uwe
#pragma once
#include <QskControl.h>

10
examples/iot-dashboard/Skin.cpp
View File

@ -2,6 +2,8 @@
#include "Box.h"
#include "BoxWithButtons.h"
#include "Diagram.h"
#include "DiagramSkinlet.h"
#include "LightIntensity.h"
#include "MainContent.h"
#include "MenuBar.h"
@ -38,6 +40,8 @@ namespace
Skin::Skin( const Palette& palette, QObject* parent ) : QskSkin( parent )
{
declareSkinlet< Diagram, DiagramSkinlet >();
initHints( palette );
}
@ -151,6 +155,11 @@ void Skin::initHints( const Palette& palette )
ed.setPadding( CaptionBox::Panel, {10, 10, 20, 0} );
// new diagram:
ed.setMetric( Diagram::ChartLine | QskAspect::Size, 2 );
ed.setColor( Diagram::ChartArea, "#886776ff" );
// light intensity:
ed.setGradient( LightDisplay::ColdPart, { Qt::Horizontal, "#a7b0ff", "#6776ff" } );
ed.setGradient( LightDisplay::WarmPart, { Qt::Horizontal, "#feeeb7", "#ff3122" } );
@ -169,6 +178,7 @@ void Skin::initHints( const Palette& palette )
ed.setGradient( RoundButton::Panel, palette.roundButton );
ed.setBoxBorderColors( WeekdayBox::Panel, palette.weekdayBox );
ed.setColor( QskTextLabel::Text, palette.text );
ed.setColor( Diagram::ChartLine, Qt::transparent );
ed.setColor( WeekdayLabel::Text, palette.text );
ed.setColor( ShadowPositioner::Panel, palette.shadow );
}

167
examples/iot-dashboard/UsageDiagram.cpp
View File

@ -1,5 +1,7 @@
#include "UsageDiagram.h"
#include "Diagram.h"
#include <QskBoxBorderColors.h>
#include <QskBoxBorderMetrics.h>
#include <QskBoxShapeMetrics.h>
@ -11,6 +13,7 @@
#include <QPainterPath>
#include <cmath>
#include <boost/math/interpolators/cubic_b_spline.hpp>
QSK_SUBCONTROL( WeekdayLabel, Panel )
QSK_SUBCONTROL( WeekdayLabel, Text )
@ -56,92 +59,38 @@ CaptionItem::CaptionItem( QskAspect::State state, QQuickItem* parent )
box->setFixedSize( {size, size} );
}
namespace
{
float distance( const QPointF& pt1, const QPointF& pt2 )
{
float hd = ( pt1.x() - pt2.x() ) * ( pt1.x() - pt2.x() );
float vd = ( pt1.y() - pt2.y() ) * ( pt1.y() - pt2.y() );
return std::sqrt( hd + vd );
}
QPointF getLineStart( const QPointF& pt1, const QPointF& pt2 )
{
QPointF pt;
float rat = 10.0 / distance( pt1, pt2 );
if( rat > 0.5 )
{
rat = 0.5;
}
pt.setX( ( 1.0 - rat ) * pt1.x() + rat * pt2.x() );
pt.setY( ( 1.0 - rat ) * pt1.y() + rat * pt2.y() );
return pt;
}
QPointF getLineEnd( const QPointF& pt1, const QPointF& pt2 )
{
QPointF pt;
float rat = 10.0 / distance( pt1, pt2 );
if( rat > 0.5 )
{
rat = 0.5;
}
pt.setX( rat * pt1.x() + ( 1.0 - rat )*pt2.x() );
pt.setY( rat * pt1.y() + ( 1.0 - rat )*pt2.y() );
return pt;
}
QPainterPath smoothOut( const QPainterPath& path )
{
QList<QPointF> points;
QPointF p;
for( int i = 0; i < path.elementCount() - 1; i++ )
{
p = QPointF( path.elementAt( i ).x, path.elementAt( i ).y );
points.append( p );
}
QPointF pt1;
QPointF pt2;
QPainterPath newPath;
for( int i = 0; i < points.count() - 1; i++ )
{
pt1 = getLineStart( points[i], points[i + 1] );
if( i == 0 )
{
newPath.moveTo( points[0] );
}
else
{
newPath.quadTo( points[i], pt1 );
}
pt2 = getLineEnd( points[i], points[i + 1] );
newPath.lineTo( pt2 );
}
return newPath;
}
}
static constexpr int segments = 7;
UsageDiagram::UsageDiagram( QQuickItem* parent )
: Box( "", parent )
, m_diagram( new Diagram( this ) )
, m_weekdays( new QskGridBox( this ) )
, m_content( new DiagramContent( this ) )
{
setAutoAddChildren( false );
setAutoLayoutChildren( true );
m_diagram->setTypes( Diagram::Line | Diagram::Area );
m_diagram->setChartPosition( Qsk::Bottom );
int number = 100;
QVector<QPointF> dataPoints1;
dataPoints1.reserve( number );
std::vector<qreal> yValues1 = {40, 20, 30, 50, 30, 70, 80, 100, 90, 60};
qreal t0 = yValues1[0];
qreal step = 10;
boost::math::cubic_b_spline<qreal> spline1( yValues1.data(), yValues1.size(), t0, step );
for( int x = 0; x < number; ++x )
{
qreal y = spline1( x );
dataPoints1.append( QPointF( x, y ) );
}
m_diagram->setDataPoints( dataPoints1 );
m_diagram->setYMax( 100 );
addItem( m_diagram );
m_weekdays->setSpacing( 0 );
QStringList weekdays = {"Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"};
@ -162,72 +111,6 @@ UsageDiagram::UsageDiagram( QQuickItem* parent )
m_captionBox->addItem( new CaptionItem( CaptionItem::Water, this ) );
m_captionBox->addItem( new CaptionItem( CaptionItem::Electricity, this ) );
m_captionBox->addItem( new CaptionItem( CaptionItem::Gas, this ) );
addItem( m_content );
}
void UsageDiagram::updateLayout()
{
auto* firstWeekday = static_cast<QskControl*>( m_weekdays->itemAt( 1, 0 ) );
qreal w = size().width();
qreal h = size().height() - ( m_captionBox->size().height() + firstWeekday->size().height() );
m_content->setSize( { w, h } );
m_content->setPosition( { 0, m_captionBox->size().height() } );
m_content->update();
}
DiagramContent::DiagramContent( QQuickItem* parent ) : QQuickPaintedItem( parent )
{
}
void DiagramContent::paint( QPainter* painter )
{
painter->setRenderHint( QPainter::Antialiasing, true );
QPair<QColor, QColor> colors[] =
{
{"#996776FF", "#116776FF"},
{"#aaFF3122", "#11FF3122"},
{"#FF7D34", "#11FF7D34"}
};
qreal yValues[][8] =
{
{0.8, 0.85, 0.92, 0.5, 0.88, 0.7, 0.8, 0.3},
{0.2, 0.6, 0.5, 0.9, 0.3, 0.4, 0.8, 0.4},
{0.5, 0.4, 0.7, 0.1, 0.6, 0.9, 0.3, 0.1}
};
for( int i = 0; i < 3; i++ )
{
QLinearGradient myGradient( {width() / 2, 0}, {width() / 2, height()} );
myGradient.setColorAt( 0, colors[i].first );
myGradient.setColorAt( 1, colors[i].second );
QPen myPen( Qt::transparent );
QPainterPath myPath;
myPath.moveTo( 0, height() );
myPath.lineTo( 0, 50 );
qreal stepSize = width() / segments;
for( int j = 1; j < segments; j++ )
{
qreal x1 = j * stepSize + stepSize / 2;
qreal y = ( 1 - yValues[i][j] ) * height();
myPath.lineTo( x1, y );
}
myPath.lineTo( width(), ( 1 - yValues[i][7] ) * height() );
myPath.lineTo( width(), height() );
QPainterPath smoothPath = smoothOut( myPath );
smoothPath.lineTo( width(), height() );
painter->setBrush( myGradient );
painter->setPen( myPen );
painter->drawPath( smoothPath );
}
}
#include "Diagram.moc"

15
examples/iot-dashboard/UsageDiagram.h
View File

@ -7,6 +7,7 @@
#include <QQuickPaintedItem>
class Diagram;
class DiagramContent;
class QskGridBox;
@ -128,7 +129,6 @@ class UsageDiagram : public Box
QSK_SUBCONTROLS( Panel )
UsageDiagram( QQuickItem* parent );
void updateLayout() override;
QskAspect::Subcontrol effectiveSubcontrol(
QskAspect::Subcontrol subControl ) const override final
@ -142,20 +142,9 @@ class UsageDiagram : public Box
}
private:
Diagram* m_diagram;
QskLinearBox* m_captionBox;
QskGridBox* m_weekdays;
DiagramContent* m_content;
};
class DiagramContent : public QQuickPaintedItem
{
Q_OBJECT
public:
DiagramContent( QQuickItem* parent );
virtual void paint( QPainter* painter ) override;
};
#endif // USAGEDIAGRAM_H

15
examples/iot-dashboard/nodes/DiagramDataNode.cpp
View File

@ -49,8 +49,19 @@ void IdlChartNode::update( const QRectF& rect, Type type, const QColor& color, c
m_geometry.allocate( vertexCount );
auto vertexData = m_geometry.vertexDataAsPoint2D();
const qreal xMin = m_dataPoints.at( 0 ).x();
const qreal xMax = m_dataPoints.at( m_dataPoints.count() - 1 ).x();
qreal xMin;
qreal xMax;
if( m_dataPoints.count() > 0 )
{
xMin = m_dataPoints.at( 0 ).x();
xMax = m_dataPoints.at( m_dataPoints.count() - 1 ).x();
}
else
{
xMin = 0;
xMax = 0;
}
// ### we should have a different function for each chart type
for( int i = 0; i < m_dataPoints.size(); ++i )