From 6f42dae3e32347a5bc89f100bf1cc93478517c4e Mon Sep 17 00:00:00 2001 From: Clemens Manert Date: Thu, 17 Feb 2022 21:54:56 +0100 Subject: [PATCH 01/70] Improve material theme --- skins/material/QskMaterialSkin.cpp | 428 +++++++++------------- skins/material/QskMaterialSkin.h | 85 ++++- skins/material/QskMaterialSkinFactory.cpp | 26 +- skins/material/metadata.json | 2 +- src/controls/QskTextInput.cpp | 3 + 5 files changed, 287 insertions(+), 257 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 2bf3432d..78d30f05 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -35,7 +35,6 @@ #include #include #include -#include #include #include @@ -58,45 +57,6 @@ static inline QColor qskShadedColor( const QColor color, qreal opacity ) namespace { - class ColorPalette - { - public: - ColorPalette( const QColor base = QColor::fromRgba( QskRgb::Grey100 ), - const QColor& accent = QColor::fromRgba( QskRgb::Blue500 ), - const QColor& contrast = QColor::fromRgba( QskRgb::White ) ) - { - baseColor = base; - accentColor = accent; - contrastColor = contrast; - - darker125 = baseColor.darker( 125 ); - darker150 = baseColor.darker( 150 ); - darker200 = baseColor.darker( 200 ); - - lighter125 = baseColor.lighter( 125 ); - lighter150 = baseColor.lighter( 150 ); - lighter200 = baseColor.lighter( 200 ); - - textColor = ( baseColor.value() > 128 ) - ? QskRgb::Black : QskRgb::White; - } - - QColor accentColor; - QColor contrastColor; - - QColor baseColor; - - QColor lighter125; - QColor lighter150; - QColor lighter200; - - QColor darker125; - QColor darker150; - QColor darker200; - - QColor textColor; - }; - class Editor : private QskSkinHintTableEditor { public: @@ -134,6 +94,7 @@ namespace void setupTextLabel(); const ColorPalette& m_pal; + const uint rippleSize = 30; }; } @@ -169,20 +130,20 @@ void Editor::setupControl() using A = QskAspect; using Q = QskControl; - setPadding( A::Control, 4 ); + setPadding( A::Control, 11 ); - setGradient( A::Control, m_pal.baseColor ); - setColor( A::Control | A::StyleColor, m_pal.textColor ); + setGradient( A::Control, m_pal.background ); + setColor( A::Control | A::StyleColor, m_pal.onBackground ); setColor( A::Control | A::StyleColor | Q::Disabled, - qskShadedColor( m_pal.textColor, 0.6 ) ); + qskShadedColor( m_pal.onBackground, 0.6 ) ); } void Editor::setupBox() { using Q = QskBox; - setGradient( Q::Panel, m_pal.baseColor ); - setBoxShape( Q::Panel, 4 ); + setGradient( Q::Panel, m_pal.background ); + setBoxShape( Q::Panel, 14 ); setBoxBorderMetrics( Q::Panel, 0 ); } @@ -194,7 +155,8 @@ void Editor::setupPopup() setFlagHint( Q::Overlay | A::Style, true ); const QskGradient gradient( QskGradient::Vertical, - qskShadedColor( m_pal.accentColor, 0.45 ), qskShadedColor( m_pal.accentColor, 0.7 ) ); + qskShadedColor( m_pal.secondary, 0.45 ), + qskShadedColor( m_pal.secondary, 0.7 ) ); setGradient( Q::Overlay, gradient ); } @@ -204,60 +166,81 @@ void Editor::setupTextLabel() using Q = QskTextLabel; setAlignment( Q::Text, Qt::AlignCenter ); - setColor( Q::Text, m_pal.textColor ); + setColor( Q::Text, m_pal.onBackground ); setPadding( Q::Panel, 5 ); setBoxShape( Q::Panel, 4 ); setBoxBorderMetrics( Q::Panel, 2 ); - setBoxBorderColors( Q::Panel, m_pal.darker125 ); - setGradient( Q::Panel, m_pal.baseColor ); + setBoxBorderColors( Q::Panel, m_pal.primaryNoSaturation ); + setGradient( Q::Panel, m_pal.background ); } + void Editor::setupTextInput() { using Q = QskTextInput; setAlignment( Q::Text, Qt::AlignLeft | Qt::AlignTop ); - setColor( Q::Text, m_pal.textColor ); - setColor( Q::PanelSelected, m_pal.accentColor ); - setColor( Q::TextSelected, m_pal.contrastColor ); + setColor( Q::Text, m_pal.onBackground ); setPadding( Q::Panel, 5 ); - setBoxShape( Q::Panel, 4 ); - setBoxBorderMetrics( Q::Panel, 2 ); - setBoxBorderColors( Q::Panel, m_pal.darker125 ); - setGradient( Q::Panel, m_pal.baseColor ); + setBoxShape( Q::Panel, 4, 4, 0, 0 ); + setBoxBorderMetrics( Q::Panel, 0, 0, 0, 1 ); + setBoxBorderColors( Q::Panel, m_pal.onBackground ); + + setBoxBorderMetrics( Q::Panel | Q::Focused, 0, 0, 0, 2 ); + setBoxBorderColors( Q::Panel | Q::Focused, m_pal.primary ); + setBoxBorderMetrics( Q::Panel | Q::Editing, 0, 0, 0, 2 ); + setBoxBorderColors( Q::Panel | Q::Editing, m_pal.primary ); + + setBoxBorderColors( Q::Panel | Q::Focused, m_pal.primary ); + + setColor( Q::Panel, + m_pal.elevated( m_pal.background, 1 ) ); + setColor( Q::Panel | Q::Hovered, + m_pal.elevated( m_pal.background, 2 ) ); + setColor( Q::Panel | Q::Focused, + m_pal.elevated( m_pal.background, 3 ) ); + setColor( Q::Panel | Q::Editing, + m_pal.elevated( m_pal.background, 4 ) ); + + setColor( Q::Panel | Q::Disabled, + qskShadedColor( m_pal.secondaryVariantNoSaturation, m_pal.disabled ) ); + setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.onBackground, m_pal.disabled ) ); + setBoxBorderColors( Q::Panel, + qskShadedColor( m_pal.onBackground, m_pal.disabled ) ); } void Editor::setupProgressBar() { using A = QskAspect; - using namespace QskRgb; using Q = QskProgressBar; + auto size = qskDpiScaled( 5 ); + for ( auto subControl : { Q::Groove, Q::Bar } ) { - setMetric( subControl | A::Size, 5 ); + setMetric( subControl | A::Size, size ); setPadding( subControl, 0 ); setBoxShape( subControl, 0 ); setBoxBorderMetrics( subControl, 0 ); } - setGradient( Q::Groove, Grey ); - setMetric( Q::Groove | A::Size, 5 ); - setGradient( Q::Bar, m_pal.accentColor ); + setGradient( Q::Groove, m_pal.secondaryNoSaturation ); + setMetric( Q::Groove | A::Size, size ); + setGradient( Q::Bar, m_pal.secondary ); + + setGradient( Q::Groove | Q::Disabled, + qskShadedColor( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + setGradient( Q::Bar | Q::Disabled, + qskShadedColor( m_pal.secondary, m_pal.disabled ) ); } void Editor::setupFocusIndicator() { using Q = QskFocusIndicator; - - setPadding( Q::Panel, 5 ); - setBoxShape( Q::Panel, 4 ); - setBoxBorderMetrics( Q::Panel, 2 ); - setBoxBorderColors( Q::Panel, m_pal.accentColor ); setGradient( Q::Panel, QskGradient() ); } @@ -273,7 +256,7 @@ void Editor::setupSeparator() setMetric( aspect | A::Size, 4 ); setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); - setGradient( aspect, m_pal.baseColor ); + setGradient( aspect, m_pal.background ); } } @@ -288,10 +271,15 @@ void Editor::setupPageIndicator() setBoxShape( Q::Bullet, 100, Qt::RelativeSize ); setBoxBorderMetrics( Q::Bullet, 0 ); - setGradient( Q::Bullet, m_pal.lighter150 ); - setGradient( Q::Bullet | Q::Selected, m_pal.accentColor ); + setGradient( Q::Bullet, m_pal.secondaryNoSaturation ); + setGradient( Q::Bullet | Q::Selected, m_pal.secondary ); - setSpacing( Q::Panel, 5 ); + setGradient( Q::Bullet | Q::Disabled, + qskShadedColor( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + setGradient( Q::Bullet | Q::Selected | Q::Disabled, + qskShadedColor( m_pal.secondary, m_pal.disabled ) ); + + setSpacing( Q::Panel, qskDpiScaled( 3 ) ); setPadding( Q::Panel, 0 ); setGradient( Q::Panel, QskGradient() ); // invisible } @@ -303,7 +291,7 @@ void Editor::setupPushButton() using Q = QskPushButton; setStrutSize( Q::Panel, qskDpiScaled( 75.0 ), qskDpiScaled( 23.0 ) ); - setSpacing( Q::Panel, 4 ); + setSpacing( Q::Panel, qskDpiScaled( 4 ) ); const QskMargins margin( 4, 3 ); const QskMargins padding( 10, 6 ); @@ -311,42 +299,24 @@ void Editor::setupPushButton() setMargin( Q::Panel, margin ); setPadding( Q::Panel, padding ); - const QskBoxBorderColors borderColors( Grey400, Grey300, Grey400, Grey600 ); + setBoxShape( Q::Panel, 5 ); - QskBoxBorderColors noBorderColors = borderColors; - noBorderColors.setAlpha( 0 ); - - setBoxShape( Q::Panel, 0 ); - setBoxBorderMetrics( Q::Panel, QskMargins( 1, 2, 1, 2 ) ); - setBoxBorderColors( Q::Panel, noBorderColors ); - - setGradient( Q::Panel, White ); setGradient( Q::Panel | Q::Flat, White & ColorMask ); - setColor( Q::Text, m_pal.textColor ); - setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.textColor, 0.6 ) ); + setColor( Q::Text, m_pal.primary ); + setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.primary, 0.6 ) ); setFontRole( Q::Text, ButtonFontRole ); setAlignment( Q::Text, Qt::AlignCenter ); - for ( auto state1 : { A::NoState, Q::Focused } ) - { - setBoxBorderColors( Q::Panel | Q::Hovered | state1, borderColors ); - setBoxBorderColors( Q::Panel | Q::Hovered | Q::Flat | state1, borderColors ); + setBoxBorderMetrics( Q::Panel, 1 ); + setBoxBorderColors( Q::Panel, m_pal.primary ); - for ( auto state2 : { A::NoState, Q::Hovered } ) - { - for ( auto state3 : { Q::Pressed | A::NoState, Q::Checked | A::NoState, Q::Checked | Q::Pressed } ) - { - const auto states = state1 | state2 | state3; + setBoxBorderColors( Q::Panel | Q::Disabled, qskShadedColor( m_pal.onBackground, m_pal.disabled ) ); + setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.onBackground, m_pal.disabled ) ); - setGradient( Q::Panel | states, m_pal.accentColor ); - setColor( Q::Text | states, White ); - - setGradient( Q::Panel | Q::Flat | states, m_pal.accentColor ); - setColor( Q::Text | Q::Flat | states, White ); - } - } - } + setColor( Q::Panel | Q::Hovered, qskShadedColor( m_pal.primary, m_pal.hover ) ); + setColor( Q::Panel | Q::Focused, qskShadedColor( m_pal.primary, m_pal.focused ) ); + setColor( Q::Panel | Q::Pressed, qskShadedColor( m_pal.primary, m_pal.pressed ) ); setAnimation( Q::Panel | A::Color, qskDuration ); setAnimation( Q::Panel | A::Metric, qskDuration ); @@ -365,33 +335,25 @@ void Editor::setupDialogButton() setMargin( Q::Panel, QskMargins( 4, 3 ) ); setPadding( Q::Panel, QskMargins( 10, 6 ) ); - const QskBoxBorderColors borderColors( Grey400, Grey300, Grey400, Grey600 ); - - QskBoxBorderColors noBorderColors = borderColors; - noBorderColors.setAlpha( 0 ); - setBoxShape( Q::Panel, 0 ); - setBoxBorderMetrics( Q::Panel, QskMargins( 1, 2, 1, 2 ) ); - setBoxBorderColors( Q::Panel, noBorderColors ); - setGradient( Q::Panel, White ); - setColor( Q::Text, m_pal.textColor ); - setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.textColor, 0.6 ) ); + setGradient( Q::Panel, m_pal.primary ); + setColor( Q::Text, m_pal.onBackground ); + setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.onPrimary, 0.6 ) ); setFontRole( Q::Text, ButtonFontRole ); setAlignment( Q::Text, Qt::AlignCenter ); for ( auto state1 : { A::NoState, Q::Focused } ) { - setBoxBorderColors( Q::Panel | Q::Hovered | state1, borderColors ); - for ( auto state2 : { A::NoState, Q::Hovered } ) { - for ( auto state3 : { Q::Pressed | A::NoState, Q::Checked | A::NoState, Q::Checked | Q::Pressed } ) + for ( auto state3 : { Q::Pressed | A::NoState, + Q::Checked | A::NoState, Q::Checked | Q::Pressed } ) { const auto states = state1 | state2 | state3; - setGradient( Q::Panel | states, m_pal.accentColor ); - setColor( Q::Text | states, White ); + setGradient( Q::Panel | states, m_pal.secondary ); + setColor( Q::Text | states, m_pal.onSecondary ); } } } @@ -405,7 +367,7 @@ void Editor::setupDialogButtonBox() { using Q = QskDialogButtonBox; - setGradient( Q::Panel, m_pal.baseColor ); + setGradient( Q::Panel, m_pal.background ); setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); } @@ -423,7 +385,7 @@ void Editor::setupSlider() setMetric( Q::Panel | A::Size, extent ); setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); - setGradient( Q::Panel, QskGradient() ); + setGradient( Q::Panel, m_pal.background ); setPadding( Q::Panel | A::Horizontal, QskMargins( 0.5 * extent, 0 ) ); setPadding( Q::Panel | A::Vertical, QskMargins( 0, 0.5 * extent ) ); @@ -432,48 +394,42 @@ void Editor::setupSlider() for ( auto subControl : { Q::Groove, Q::Fill } ) { - setMetric( subControl | A::Size, 5 ); setPadding( subControl, 0 ); setBoxShape( subControl, 0 ); setBoxBorderMetrics( subControl, 0 ); } + setMetric( Q::Groove | A::Size, qskDpiScaled( 4 ) ); + setMetric( Q::Fill | A::Size, qskDpiScaled( 6 ) ); - setGradient( Q::Groove, Grey ); - setGradient( Q::Fill, m_pal.accentColor ); - setBoxBorderColors( Q::Fill, m_pal.accentColor ); + setGradient( Q::Groove, qskShadedColor( m_pal.secondary, .38 ) ); + setGradient( Q::Groove | Q::Disabled, + qskShadedColor( m_pal.secondaryNoSaturation, m_pal.disabled ) ); - // handle + setGradient( Q::Fill, m_pal.secondary ); + setGradient( Q::Fill | Q::Disabled, + qskShadedColor( m_pal.secondaryNoSaturation, m_pal.disabled ) ); setBoxShape( Q::Handle, 100, Qt::RelativeSize ); - setBoxBorderMetrics( Q::Handle, 4 ); + setBoxBorderMetrics( Q::Handle, 0 ); - // handle expanding, when being pressed - const QSize extentSize( extent, extent ); - setStrutSize( Q::Handle, 0.6 * extentSize ); - setStrutSize( Q::Handle | Q::Pressed, extentSize ); + setStrutSize( Q::Handle, qskDpiScaled( 20 + rippleSize ), + qskDpiScaled( 20 + rippleSize ) ); - setGradient( Q::Handle | Q::Disabled, Grey ); - setBoxBorderColors( Q::Handle | Q::Disabled, Grey ); + setGradient( Q::Handle | Q::Disabled, m_pal.secondaryNoSaturation ); - setGradient( Q::Handle, m_pal.accentColor ); - setGradient( Q::Handle | Q::Pressed, m_pal.accentColor ); + setGradient( Q::Handle, m_pal.secondary ); + setGradient( Q::Handle | Q::Pressed, m_pal.secondary ); - for ( auto state : { A::States(), Q::Pressed | A::NoState, Q::Pressed | Q::Hovered } ) - { - setBoxBorderColors( Q::Handle | state, m_pal.accentColor ); - } + setBoxBorderMetrics( Q::Handle, qskDpiScaled( rippleSize / 2 ) ); - for ( auto state : { A::States(), Q::Pressed | A::NoState, Q::Pressed | Q::Hovered } ) - { - const auto aspect = Q::Handle | Q::Minimum | state; - setGradient( aspect, Grey300 ); - setBoxBorderColors( aspect, Grey ); - } - - setAnimation( Q::Handle | A::Metric, qskDuration ); - setAnimation( Q::Handle | A::Color, qskDuration ); + setBoxBorderColors( Q::Handle | Q::Hovered, + qskShadedColor( m_pal.secondary, m_pal.hover ) ); + setBoxBorderColors( Q::Handle | Q::Focused, + qskShadedColor( m_pal.secondary, m_pal.focused ) ); + setBoxBorderColors( Q::Handle | Q::Pressed, + qskShadedColor( m_pal.secondary, m_pal.pressed ) ); // move the handle smoothly, when using keys setAnimation( Q::Handle | A::Metric | A::Position, 2 * qskDuration ); @@ -486,7 +442,6 @@ void Editor::setupSwitchButton() using Q = QskSwitchButton; const qreal radius = qskDpiScaled( 10 ); - const qreal handleSize = 2 * radius; setBoxShape( Q::Groove, 100, Qt::RelativeSize ); @@ -494,55 +449,48 @@ void Editor::setupSwitchButton() setStrutSize( Q::Groove | A::Horizontal, grooveSize ); setStrutSize( Q::Groove | A::Vertical, grooveSize.transposed() ); - setGradient( Q::Groove, m_pal.darker125 ); - setGradient( Q::Groove | Q::Disabled, m_pal.lighter150 ); - setGradient( Q::Groove | Q::Checked, m_pal.darker200 ); - - setBoxBorderColors( Q::Groove, m_pal.darker200 ); - setBoxBorderMetrics( Q::Groove, 2 ); - setBoxBorderColors( Q::Groove | Q::Disabled, m_pal.darker125 ); + setColor( Q::Groove, m_pal.secondaryNoSaturation ); + setGradient( Q::Groove | Q::Disabled, + qskShadedColor( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + setGradient( Q::Groove | Q::Checked, + m_pal.secondaryVariant ); + setGradient( Q::Groove | Q::Checked | Q::Disabled, + qskShadedColor( m_pal.secondaryVariant, m_pal.disabledOccupancy ) ); setBoxShape( Q::Handle, 100, Qt::RelativeSize ); - setStrutSize( Q::Handle, handleSize, handleSize ); - setBoxBorderMetrics( Q::Handle, 2 ); + setStrutSize( Q::Handle, qskDpiScaled( 2 * radius + rippleSize ), + qskDpiScaled( 2 * radius + rippleSize ) ); - setGradient( Q::Handle, QskGradient( Qt::Vertical, m_pal.lighter150, m_pal.lighter125 ) ); - setGradient( Q::Handle | Q::Checked, m_pal.accentColor ); + setGradient( Q::Handle, m_pal.background.lighter( 900 ) ); - setGradient( Q::Handle | Q::Disabled, m_pal.lighter125 ); - setBoxBorderColors( Q::Handle, m_pal.darker200 ); - setBoxBorderColors( Q::Handle | Q::Disabled, m_pal.darker125 ); + setGradient( Q::Handle | Q::Checked, m_pal.secondary ); - setBoxShape( Q::Ripple, 100, Qt::RelativeSize ); - setStrutSize( Q::Ripple, 2 * handleSize, 2 * handleSize ); - setGradient( Q::Ripple, QskRgb::Transparent ); + setGradient( Q::Handle | Q::Disabled, + m_pal.elevated( m_pal.secondaryNoSaturation, -2 ) ); + setGradient( Q::Handle | Q::Disabled | Q::Checked, + m_pal.elevated( m_pal.secondary, -3 ) ); - for ( auto state : { Q::Hovered, Q::Focused, Q::Pressed } ) - { - auto weak = m_pal.darker125; - auto strong = m_pal.accentColor; + setBoxBorderMetrics( Q::Handle, qskDpiScaled( rippleSize / 2 ) ); + setBoxBorderMetrics( Q::Handle, qskDpiScaled( rippleSize / 2 ) ); - if ( state == Q::Hovered ) - { - weak.setAlpha( 100 ); - strong.setAlpha( 50 ); - } - else if ( state == Q::Focused ) - { - weak.setAlpha( 150 ); - strong.setAlpha( 100 ); - } - else - { - weak.setAlpha( 200 ); - strong.setAlpha( 150 ); - } + setBoxBorderColors( Q::Handle | Q::Checked | Q::Hovered, + qskShadedColor( m_pal.secondary, m_pal.hover ) ); + setBoxBorderColors( Q::Handle | Q::Checked | Q::Focused, + qskShadedColor( m_pal.secondary, m_pal.focused ) ); + setBoxBorderColors( Q::Handle | Q::Checked | Q::Pressed, + qskShadedColor( m_pal.secondary, m_pal.pressed ) ); - setGradient( Q::Ripple | state, weak ); - setGradient( Q::Ripple | Q::Checked | state, strong ); - } + setBoxBorderColors( Q::Handle | Q::Hovered, + qskShadedColor( m_pal.secondaryVariantNoSaturation, + m_pal.hover ) ); + setBoxBorderColors( Q::Handle | Q::Focused, + qskShadedColor( m_pal.secondaryVariantNoSaturation, + m_pal.focused ) ); + setBoxBorderColors( Q::Handle | Q::Pressed, + qskShadedColor( m_pal.secondaryVariantNoSaturation, + m_pal.pressed ) ); - for( auto state : { A::NoState, Q::Disabled } ) + for ( auto state : { A::NoState, Q::Disabled } ) { auto aspect = Q::Handle | state; @@ -590,7 +538,8 @@ void Editor::setupTabButton() edge = Qt::Edge( 0 ); // making gcc4 happy } - setGradient( aspect, QskRgb::White ); + QskBoxBorderColors borderColors( m_pal.elevated( m_pal.background ) ); + auto borderColorsActive = m_pal.primary; // The highlighted button has a accented bar at one edge setBoxShape( aspect, 0 ); @@ -599,22 +548,28 @@ void Editor::setupTabButton() border.setWidthAt( edge, 3 ); setBoxBorderMetrics( aspect, border ); - QskBoxBorderColors borderColors( QskRgb::White ); setBoxBorderColors( aspect, borderColors ); - borderColors.setGradientAt( edge, m_pal.accentColor ); - for ( auto state : { Q::Checked, Q::Pressed, Q::Hovered } ) - setBoxBorderColors( aspect | state, borderColors ); + borderColors.setGradientAt( edge, borderColorsActive ); + setBoxBorderColors( aspect | Q::Checked, borderColors ); } + setColor( Q::Text, m_pal.onBackground ); + setColor( Q::Text | Q::Disabled, + qskShadedColor( m_pal.onBackground, + m_pal.widgetBackgroundDisabled ) ); + setColor( Q::Text | Q::Checked, m_pal.primary ); + setColor( Q::Text | Q::Hovered, m_pal.primary ); + + setColor( Q::Panel, m_pal.elevated( m_pal.background ) ); + setColor( Q::Panel | Q::Hovered, qskShadedColor( m_pal.primary, m_pal.hover ) ); + setColor( Q::Panel | Q::Focused, qskShadedColor( m_pal.primary, m_pal.focused ) ); + setColor( Q::Panel | Q::Pressed, qskShadedColor( m_pal.primary, m_pal.pressed ) ); + setAnimation( Q::Panel | A::Color, qskDuration ); - // text setFontRole( Q::Text, ButtonFontRole ); setAlignment( Q::Text, Qt::AlignCenter ); - - setColor( Q::Text, m_pal.textColor ); - setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.textColor, 0.6 ) ); } void Editor::setupTabBar() @@ -624,21 +579,17 @@ void Editor::setupTabBar() setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); - setGradient( Q::Panel, QskGradient() ); + + setGradient( Q::Panel, m_pal.elevated( m_pal.background ) ); + setPadding( Q::Panel, 0 ); // when flicking setAnimation( Q::Panel | A::Metric, QskAnimationHint( 200, QEasingCurve::InCubic ) ); } -void Editor::setupTabView() -{ +void Editor::setupTabView() { using Q = QskTabView; - setBoxShape( Q::Page, 0 ); - setBoxBorderMetrics( Q::Page, 0 ); - setGradient( Q::Page, m_pal.darker150 ); - setBoxBorderColors( Q::Page, m_pal.baseColor ); - setAnimation( Q::Page, qskDuration ); } @@ -648,8 +599,8 @@ void Editor::setupInputPanel() setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); - setGradient( Q::Panel, m_pal.darker150 ); - setBoxBorderColors( Q::Panel, m_pal.baseColor ); + setGradient( Q::Panel, m_pal.elevated( m_pal.background, 1 ) ); + setBoxBorderColors( Q::Panel, m_pal.background ); } void Editor::setupVirtualKeyboard() @@ -662,12 +613,11 @@ void Editor::setupVirtualKeyboard() setBoxShape( Q::ButtonPanel, 20.0, Qt::RelativeSize ); setBoxBorderMetrics( Q::ButtonPanel, 2 ); - - setGradient( Q::ButtonPanel, m_pal.darker125 ); - setBoxBorderColors( Q::ButtonPanel, m_pal.baseColor ); + setBoxBorderColors( Q::ButtonPanel, m_pal.background ); for ( auto state : { A::NoState, Q::Focused } ) - setBoxBorderColors( Q::ButtonPanel | QskPushButton::Pressed | state, m_pal.accentColor ); + setBoxBorderColors( Q::ButtonPanel | QskPushButton::Pressed | state, + m_pal.secondary ); setAnimation( Q::ButtonPanel | A::Color, qskDuration ); setAnimation( Q::ButtonPanel | A::Metric, qskDuration ); @@ -675,8 +625,8 @@ void Editor::setupVirtualKeyboard() // panel setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); - setGradient( Q::Panel, m_pal.darker150 ); - setBoxBorderColors( Q::Panel, m_pal.baseColor ); + setGradient( Q::Panel, m_pal.elevated( m_pal.background, 1 ) ); + setBoxBorderColors( Q::Panel, m_pal.background ); } void Editor::setupScrollView() @@ -684,16 +634,15 @@ void Editor::setupScrollView() using A = QskAspect; using Q = QskScrollView; - setSpacing( Q::Panel, 2 ); + setSpacing( Q::Panel, 5 ); - setBoxShape( Q::Viewport, 5 ); setBoxBorderMetrics( Q::Viewport, 1 ); - setGradient( Q::Viewport, QskRgb::White ); - setBoxBorderColors( Q::Viewport, Qt::black ); + setGradient( Q::Viewport, m_pal.background ); + setBoxBorderColors( Q::Viewport, m_pal.onBackground ); for ( auto subControl : { Q::HorizontalScrollBar, Q::VerticalScrollBar } ) { - setMetric( subControl | A::Size, 12 ); + setMetric( subControl | A::Size, 10 ); setPadding( subControl, 0 ); } @@ -704,10 +653,8 @@ void Editor::setupScrollView() for ( auto subControl : { Q::HorizontalScrollHandle, Q::VerticalScrollHandle } ) { setBoxShape( subControl, 3 ); - setBoxBorderMetrics( subControl, 1 ); - setGradient( subControl, m_pal.accentColor ); - setBoxBorderColors( subControl, QskRgb::White ); - + setBoxBorderMetrics( subControl, 0 ); + setColor( subControl, qskShadedColor( m_pal.onBackground, m_pal.hover ) ); setAnimation( subControl | A::Color, qskDuration ); } @@ -715,8 +662,8 @@ void Editor::setupScrollView() Q::HorizontalScrollHandle | Q::HorizontalHandlePressed, Q::VerticalScrollHandle | Q::VerticalHandlePressed } ) { - setGradient( subControl, m_pal.accentColor ); - setBoxBorderColors( subControl, m_pal.accentColor ); + setColor( subControl, + qskShadedColor( m_pal.onBackground, m_pal.pressed ) ); } // when changing the position by QskScrollView::scrollTo @@ -727,14 +674,13 @@ void Editor::setupListView() { using Q = QskListView; - // padding for each cell - setPadding( Q::Cell, QskMargins( 4, 8 ) ); + setPadding( Q::Cell, 0 ); - setColor( Q::Cell, m_pal.baseColor ); - setColor( Q::Text, m_pal.textColor ); + setColor( Q::Cell, m_pal.background ); + setColor( Q::Text, m_pal.onBackground ); - setColor( Q::Cell | Q::Selected, m_pal.accentColor ); - setColor( Q::Text | Q::Selected, m_pal.contrastColor ); + setColor( Q::Cell | Q::Selected, qskShadedColor( m_pal.onBackground, m_pal.focused ) ); + setColor( Q::Text | Q::Selected, m_pal.onBackground ); } void Editor::setupSubWindow() @@ -747,20 +693,16 @@ void Editor::setupSubWindow() setPadding( Q::Panel, 10 ); setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 2 ); - setGradient( Q::Panel, m_pal.baseColor ); + setGradient( Q::Panel, m_pal.onBackground ); - QskBoxBorderColors colors; - colors.setGradientAt( Qt::TopEdge | Qt::LeftEdge, m_pal.lighter125 ); - colors.setGradientAt( Qt::RightEdge | Qt::BottomEdge, m_pal.darker200 ); - - setBoxBorderColors( Q::Panel, colors ); + setBoxBorderColors( Q::Panel, m_pal.primary ); // TitleBarPanel setFlagHint( Q::TitleBarPanel | QskAspect::Style, Q::TitleBar | Q::Title | Q::Symbol ); - setGradient( Q::TitleBarPanel, m_pal.darker200 ); - setGradient( Q::TitleBarPanel | Q::Focused, m_pal.accentColor ); + setGradient( Q::TitleBarPanel, m_pal.primary ); + setGradient( Q::TitleBarPanel | Q::Focused, m_pal.primaryVariant ); // TitleBarText setFontRole( Q::TitleBarText, QskSkin::SmallFont ); @@ -777,13 +719,10 @@ class QskMaterialSkin::PrivateData ColorPalette palette; }; -QskMaterialSkin::QskMaterialSkin( QObject* parent ) +QskMaterialSkin::QskMaterialSkin( ColorPalette colors, QObject* parent ) : Inherited( parent ) - , m_data( new PrivateData() ) + , m_data( new PrivateData { colors } ) { - m_data->palette = ColorPalette( QskRgb::Grey100, - QskRgb::Blue500, QskRgb::White ); - // Default theme colors setupFonts( "Roboto" ); @@ -799,13 +738,4 @@ QskMaterialSkin::~QskMaterialSkin() { } -void QskMaterialSkin::resetColors( const QColor& accent ) -{ - m_data->palette = ColorPalette( m_data->palette.baseColor, - accent, m_data->palette.contrastColor ); - - Editor editor( &hintTable(), m_data->palette ); - editor.setup(); -} - #include "moc_QskMaterialSkin.cpp" diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index 1a08f89f..7c7a80a2 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -8,8 +8,89 @@ #include "QskMaterialGlobal.h" #include +#include #include +struct ColorPalette +{ + enum Lightness { light, dark } lightness; + + QColor primary; + QColor primaryVariant; + QColor onPrimary; + + QColor secondary; + QColor secondaryVariant; + QColor onSecondary; + + QColor background; + QColor onBackground; + + QColor error; + QColor onError; + + QColor primaryNoSaturation = QColor::fromHsl( primary.hslHue(), 0, + primary.lightness() ); + + QColor secondaryNoSaturation = + QColor::fromHsl( secondary.hslHue(), 0, + secondary.lightness() ); + + QColor secondaryVariantNoSaturation = + QColor::fromHsl( secondaryVariant.hslHue(), 0, + secondaryVariant.lightness() + + secondaryVariant.hslSaturation() ); + + qreal disabledOccupancy = 0.2; + qreal widgetBackgroundDisabled = 0.6; + + qreal hover = 0.1; + qreal focused = 0.4; + qreal pressed = 0.5; + qreal disabled = 0.3; + + ColorPalette( + Lightness lightness = light, + QColor primary = QColor::fromRgb( 0x6200EE ), + QColor primaryVariant = QColor::fromRgb( 0x3700B3 ), + QColor onPrimary = Qt::white, + QColor secondary = QColor::fromRgb( 0x03DAC6 ), + QColor secondaryVariant = QColor::fromRgb( 0x018786 ), + QColor onSecondary = Qt::white, + QColor background = QColor::fromRgba( QskRgb::Grey100 ), + QColor onBackground = Qt::black, + QColor error = QColor::fromRgb( 0xB00020 ), + QColor onError = Qt::white ): + lightness( lightness ), + primary( primary ), + primaryVariant( primaryVariant ), + onPrimary( onPrimary ), + secondary( secondary ), + secondaryVariant( secondaryVariant ), + onSecondary( onSecondary ), + background( background ), + onBackground( onBackground ), + error( error ), + onError( onError ) + { + primaryNoSaturation = QColor::fromHsl( primary.hslHue(), 0, + primary.lightness() ); + + secondaryNoSaturation = QColor::fromHsl( secondary.hslHue(), + 0, + secondary.lightness() ); + + secondaryVariantNoSaturation = + QColor::fromHsl( secondaryVariant.hslHue(), 0, + secondaryVariant.lightness() ); + } + + inline QColor elevated( const QColor target, const float level = 1 ) const { + return ( lightness == light ) ? target.darker( 100 + level * 15 ) + : target.lighter( 130 + level * 30 ); + } +}; + class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin { Q_OBJECT @@ -17,12 +98,10 @@ class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin using Inherited = QskSkin; public: - QskMaterialSkin( QObject* parent = nullptr ); + QskMaterialSkin( ColorPalette, QObject* parent = nullptr ); ~QskMaterialSkin() override; private: - void resetColors( const QColor& accent ) override; - class PrivateData; std::unique_ptr< PrivateData > m_data; }; diff --git a/skins/material/QskMaterialSkinFactory.cpp b/skins/material/QskMaterialSkinFactory.cpp index 1b68a4aa..04fb1bc7 100644 --- a/skins/material/QskMaterialSkinFactory.cpp +++ b/skins/material/QskMaterialSkinFactory.cpp @@ -6,7 +6,8 @@ #include "QskMaterialSkinFactory.h" #include "QskMaterialSkin.h" -static const QString materialSkinName = QStringLiteral( "material" ); +static const QString materialLightSkinName = QStringLiteral( "materialLight" ); +static const QString materialDarkSkinName = QStringLiteral( "materialDark" ); QskMaterialSkinFactory::QskMaterialSkinFactory( QObject* parent ) : QskSkinFactory( parent ) @@ -19,13 +20,30 @@ QskMaterialSkinFactory::~QskMaterialSkinFactory() QStringList QskMaterialSkinFactory::skinNames() const { - return { materialSkinName }; + return { materialLightSkinName, materialDarkSkinName }; } QskSkin* QskMaterialSkinFactory::createSkin( const QString& skinName ) { - if ( skinName.toLower() == materialSkinName ) - return new QskMaterialSkin(); + if ( QString::compare( skinName, materialLightSkinName, Qt::CaseInsensitive ) ) + return new QskMaterialSkin( ColorPalette() ); + + if ( QString::compare( skinName, materialDarkSkinName, Qt::CaseInsensitive ) ) + { + return new QskMaterialSkin( ColorPalette( + ColorPalette::dark, // lightness + QColor::fromRgb( 0xBB86FC ), // primary + QColor::fromRgb( 0x3700B3 ), // primaryVariant + Qt::black, // onPrimary + QColor::fromRgb( 0x03DAC6 ), // secondary + QColor::fromRgb( 0x018786 ), // secondaryVariant + Qt::black, // onSecondary + QColor::fromRgb( 0x121212 ), // background + Qt::white, // onBackground + QColor::fromRgb( 0xCF6679 ), // error + Qt::black // onError + ) ); + } return nullptr; } diff --git a/skins/material/metadata.json b/skins/material/metadata.json index 1812afd4..57af8644 100644 --- a/skins/material/metadata.json +++ b/skins/material/metadata.json @@ -1,4 +1,4 @@ { "FactoryId": "MaterialFactory", - "Skins": [ "material" ] + "Skins": [ "materialLight", "materialDark" ] } diff --git a/src/controls/QskTextInput.cpp b/src/controls/QskTextInput.cpp index 229d0def..ed9aec93 100644 --- a/src/controls/QskTextInput.cpp +++ b/src/controls/QskTextInput.cpp @@ -319,6 +319,9 @@ QskTextInput::QskTextInput( QQuickItem* parent ) m_data->textInput->setAcceptedMouseButtons( Qt::NoButton ); initSizePolicy( QskSizePolicy::Minimum, QskSizePolicy::Fixed ); + + setAcceptHoverEvents( true ); + } QskTextInput::QskTextInput( const QString& text, QQuickItem* parent ) From 5284880eaac4db8cdc3dd8b18c95c62efdbeebaf Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Sat, 26 Mar 2022 16:24:39 +0100 Subject: [PATCH 02/70] wip --- src/controls/QskTextInput.cpp | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/controls/QskTextInput.cpp b/src/controls/QskTextInput.cpp index dd3aaf3d..5a76f81d 100644 --- a/src/controls/QskTextInput.cpp +++ b/src/controls/QskTextInput.cpp @@ -295,6 +295,8 @@ QskTextInput::QskTextInput( QQuickItem* parent ) m_data->hasPanel = true; setPolishOnResize( true ); + + setAcceptHoverEvents( true ); setFocusPolicy( Qt::StrongFocus ); setFlag( QQuickItem::ItemAcceptsInputMethod ); @@ -313,9 +315,6 @@ QskTextInput::QskTextInput( QQuickItem* parent ) m_data->textInput->setAcceptedMouseButtons( Qt::NoButton ); initSizePolicy( QskSizePolicy::Minimum, QskSizePolicy::Fixed ); - - setAcceptHoverEvents( true ); - } QskTextInput::QskTextInput( const QString& text, QQuickItem* parent ) From 570d3d2d51dee26f20f1640e8bfcb6ad022c322f Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Thu, 31 Mar 2022 18:29:39 +0200 Subject: [PATCH 03/70] Uing RGB values instead of colors. QskSkinTransition reimplemented. Ongoing work --- examples/gallery/Page.cpp | 18 - examples/gallery/Page.h | 7 - examples/gallery/label/LabelPage.cpp | 1 - examples/gallery/main.cpp | 21 - .../gallery/progressbar/ProgressBarPage.cpp | 2 - examples/gallery/slider/SliderPage.cpp | 2 - .../gallery/switchbutton/SwitchButtonPage.cpp | 2 - skins/material/QskMaterialSkin.cpp | 123 +-- skins/material/QskMaterialSkin.h | 122 +-- skins/material/QskMaterialSkinFactory.cpp | 94 +- skins/squiek/QskSquiekSkin.cpp | 49 +- skins/squiek/QskSquiekSkinFactory.cpp | 2 +- src/common/QskArcMetrics.cpp | 4 + src/common/QskAspect.h | 51 + src/common/QskBoxBorderColors.cpp | 84 +- src/common/QskBoxBorderColors.h | 43 +- src/common/QskBoxBorderMetrics.cpp | 25 +- src/common/QskBoxBorderMetrics.h | 7 + src/common/QskBoxShapeMetrics.cpp | 4 + src/common/QskGradient.cpp | 61 +- src/common/QskGradient.h | 1 + src/common/QskGradientStop.cpp | 11 +- src/common/QskIntervalF.cpp | 4 + src/common/QskMargins.h | 6 + src/common/QskRgbValue.cpp | 26 + src/common/QskRgbValue.h | 24 +- src/common/QskScaleTickmarks.cpp | 4 + src/common/QskShadowMetrics.cpp | 4 + src/common/QskStateCombination.cpp | 14 - src/common/QskStateCombination.h | 14 +- src/controls/QskSkin.cpp | 17 - src/controls/QskSkin.h | 3 - src/controls/QskSkinHintTable.cpp | 57 +- src/controls/QskSkinHintTable.h | 15 +- src/controls/QskSkinTransition.cpp | 968 +++++++++--------- src/controls/QskSkinnable.cpp | 77 +- src/controls/QskSkinnable.h | 3 +- src/controls/QskVariantAnimator.cpp | 108 +- src/controls/QskVariantAnimator.h | 3 + src/src.pro | 1 - support/SkinnyShortcut.cpp | 25 +- 41 files changed, 1178 insertions(+), 929 deletions(-) delete mode 100644 src/common/QskStateCombination.cpp diff --git a/examples/gallery/Page.cpp b/examples/gallery/Page.cpp index 0dbbfcf3..078d96b3 100644 --- a/examples/gallery/Page.cpp +++ b/examples/gallery/Page.cpp @@ -4,29 +4,11 @@ *****************************************************************************/ #include "Page.h" -#include Page::Page( Qt::Orientation orientation, QQuickItem* parent ) : QskLinearBox( orientation, parent ) - , m_gradient( QskRgb::GhostWhite ) { setMargins( 20 ); setPadding( 10 ); setSpacing( 10 ); } - -void Page::setGradient( const QskGradient& gradient ) -{ - if ( gradient != m_gradient ) - { - m_gradient = gradient; - - if ( parentItem() && isVisibleToParent() ) - parentItem()->update(); - } -} - -QskGradient Page::gradient() const -{ - return m_gradient; -} diff --git a/examples/gallery/Page.h b/examples/gallery/Page.h index f0404294..f8f8bf83 100644 --- a/examples/gallery/Page.h +++ b/examples/gallery/Page.h @@ -6,16 +6,9 @@ #pragma once #include -#include class Page : public QskLinearBox { public: Page( Qt::Orientation, QQuickItem* parent = nullptr ); - - void setGradient( const QskGradient& ); - QskGradient gradient() const; - - private: - QskGradient m_gradient; }; diff --git a/examples/gallery/label/LabelPage.cpp b/examples/gallery/label/LabelPage.cpp index 84f2c438..8e4a2813 100644 --- a/examples/gallery/label/LabelPage.cpp +++ b/examples/gallery/label/LabelPage.cpp @@ -67,7 +67,6 @@ namespace LabelPage::LabelPage( QQuickItem* parent ) : Page( Qt::Vertical, parent ) { - setGradient( QskRgb::AliceBlue ); setSpacing( 40 ); (void) new TextBox( this ); diff --git a/examples/gallery/main.cpp b/examples/gallery/main.cpp index 58e52f7a..838d9106 100644 --- a/examples/gallery/main.cpp +++ b/examples/gallery/main.cpp @@ -30,27 +30,6 @@ namespace setMargins( 10 ); setTabPosition( Qsk::Left ); setAutoFitTabs( true ); - - connect( this, &QskTabView::currentIndexChanged, - this, &TabView::updateViewPanel ); - } - - protected: - void aboutToShow() override - { - updateViewPanel(); - } - - private: - void updateViewPanel() - { - /* - We should have a better way to set individual colors - for each tab page background - */ - - if ( auto page = dynamic_cast< const ::Page* >( currentItem() ) ) - setGradientHint( QskTabView::Page, page->gradient() ); } }; } diff --git a/examples/gallery/progressbar/ProgressBarPage.cpp b/examples/gallery/progressbar/ProgressBarPage.cpp index 75fad19e..18985ecf 100644 --- a/examples/gallery/progressbar/ProgressBarPage.cpp +++ b/examples/gallery/progressbar/ProgressBarPage.cpp @@ -45,9 +45,7 @@ namespace ProgressBarPage::ProgressBarPage( QQuickItem* parent ) : Page( Qt::Horizontal, parent ) { - setGradient( QskRgb::AliceBlue ); setSpacing( 40 ); - populate(); } diff --git a/examples/gallery/slider/SliderPage.cpp b/examples/gallery/slider/SliderPage.cpp index 4de7c647..8e164a5c 100644 --- a/examples/gallery/slider/SliderPage.cpp +++ b/examples/gallery/slider/SliderPage.cpp @@ -13,8 +13,6 @@ SliderPage::SliderPage( QQuickItem* parentItem ) : Page( Qt::Vertical, parentItem ) { - setGradient( QskRgb::PeachPuff ); - setMargins( 10 ); setSpacing( 20 ); diff --git a/examples/gallery/switchbutton/SwitchButtonPage.cpp b/examples/gallery/switchbutton/SwitchButtonPage.cpp index 169dac95..1fab35b1 100644 --- a/examples/gallery/switchbutton/SwitchButtonPage.cpp +++ b/examples/gallery/switchbutton/SwitchButtonPage.cpp @@ -15,9 +15,7 @@ SwitchButtonPage::SwitchButtonPage( QQuickItem* parent ) : Page( Qt::Horizontal, parent ) { - setGradient( QskRgb::AliceBlue ); setSpacing( 40 ); - populate(); } diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index e3a5eb1c..a8341aea 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -47,20 +47,12 @@ static const int ButtonFontRole = QskSkin::HugeFont + 77; static const int qskDuration = 150; -static inline QColor qskShadedColor( const QColor color, qreal opacity ) -{ - QColor c = color; - c.setAlphaF( opacity ); - - return c; -} - namespace { class Editor : private QskSkinHintTableEditor { public: - Editor( QskSkinHintTable* table, const ColorPalette& palette ) + Editor( QskSkinHintTable* table, const QskMaterialPalette& palette ) : QskSkinHintTableEditor( table ) , m_pal( palette ) { @@ -93,7 +85,7 @@ namespace void setupTextInput(); void setupTextLabel(); - const ColorPalette& m_pal; + const QskMaterialPalette& m_pal; const uint rippleSize = 30; }; } @@ -135,7 +127,7 @@ void Editor::setupControl() setGradient( A::Control, m_pal.background ); setColor( A::Control | A::StyleColor, m_pal.onBackground ); setColor( A::Control | A::StyleColor | Q::Disabled, - qskShadedColor( m_pal.onBackground, 0.6 ) ); + QskRgb::toTransparentF( m_pal.onBackground, 0.6 ) ); } void Editor::setupBox() @@ -155,8 +147,8 @@ void Editor::setupPopup() setFlagHint( Q::Overlay | A::Style, true ); const QskGradient gradient( QskGradient::Vertical, - qskShadedColor( m_pal.secondary, 0.45 ), - qskShadedColor( m_pal.secondary, 0.7 ) ); + QskRgb::toTransparentF( m_pal.secondary, 0.45 ), + QskRgb::toTransparentF( m_pal.secondary, 0.7 ) ); setGradient( Q::Overlay, gradient ); } @@ -196,20 +188,16 @@ void Editor::setupTextInput() setBoxBorderColors( Q::Panel | Q::Focused, m_pal.primary ); - setColor( Q::Panel, - m_pal.elevated( m_pal.background, 1 ) ); - setColor( Q::Panel | Q::Hovered, - m_pal.elevated( m_pal.background, 2 ) ); - setColor( Q::Panel | Q::Focused, - m_pal.elevated( m_pal.background, 3 ) ); - setColor( Q::Panel | Q::Editing, - m_pal.elevated( m_pal.background, 4 ) ); + setColor( Q::Panel, m_pal.elevated( m_pal.background, 1 ) ); + setColor( Q::Panel | Q::Hovered, m_pal.elevated( m_pal.background, 2 ) ); + setColor( Q::Panel | Q::Focused, m_pal.elevated( m_pal.background, 3 ) ); + setColor( Q::Panel | Q::Editing, m_pal.elevated( m_pal.background, 4 ) ); setColor( Q::Panel | Q::Disabled, - qskShadedColor( m_pal.secondaryVariantNoSaturation, m_pal.disabled ) ); - setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.onBackground, m_pal.disabled ) ); + QskRgb::toTransparentF( m_pal.secondaryVariantNoSaturation, m_pal.disabled ) ); + setColor( Q::Text | Q::Disabled, QskRgb::toTransparentF( m_pal.onBackground, m_pal.disabled ) ); setBoxBorderColors( Q::Panel, - qskShadedColor( m_pal.onBackground, m_pal.disabled ) ); + QskRgb::toTransparentF( m_pal.onBackground, m_pal.disabled ) ); } void Editor::setupProgressBar() @@ -233,9 +221,9 @@ void Editor::setupProgressBar() setGradient( Q::Bar, m_pal.secondary ); setGradient( Q::Groove | Q::Disabled, - qskShadedColor( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + QskRgb::toTransparentF( m_pal.secondaryNoSaturation, m_pal.disabled ) ); setGradient( Q::Bar | Q::Disabled, - qskShadedColor( m_pal.secondary, m_pal.disabled ) ); + QskRgb::toTransparentF( m_pal.secondary, m_pal.disabled ) ); } void Editor::setupFocusIndicator() @@ -275,9 +263,9 @@ void Editor::setupPageIndicator() setGradient( Q::Bullet | Q::Selected, m_pal.secondary ); setGradient( Q::Bullet | Q::Disabled, - qskShadedColor( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + QskRgb::toTransparentF( m_pal.secondaryNoSaturation, m_pal.disabled ) ); setGradient( Q::Bullet | Q::Selected | Q::Disabled, - qskShadedColor( m_pal.secondary, m_pal.disabled ) ); + QskRgb::toTransparentF( m_pal.secondary, m_pal.disabled ) ); setSpacing( Q::Panel, qskDpiScaled( 3 ) ); setPadding( Q::Panel, 0 ); @@ -304,19 +292,19 @@ void Editor::setupPushButton() setGradient( Q::Panel | Q::Flat, White & ColorMask ); setColor( Q::Text, m_pal.primary ); - setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.primary, 0.6 ) ); + setColor( Q::Text | Q::Disabled, QskRgb::toTransparentF( m_pal.primary, 0.6 ) ); setFontRole( Q::Text, ButtonFontRole ); setAlignment( Q::Text, Qt::AlignCenter ); setBoxBorderMetrics( Q::Panel, 1 ); setBoxBorderColors( Q::Panel, m_pal.primary ); - setBoxBorderColors( Q::Panel | Q::Disabled, qskShadedColor( m_pal.onBackground, m_pal.disabled ) ); - setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.onBackground, m_pal.disabled ) ); + setBoxBorderColors( Q::Panel | Q::Disabled, QskRgb::toTransparentF( m_pal.onBackground, m_pal.disabled ) ); + setColor( Q::Text | Q::Disabled, QskRgb::toTransparentF( m_pal.onBackground, m_pal.disabled ) ); - setColor( Q::Panel | Q::Hovered, qskShadedColor( m_pal.primary, m_pal.hover ) ); - setColor( Q::Panel | Q::Focused, qskShadedColor( m_pal.primary, m_pal.focused ) ); - setColor( Q::Panel | Q::Pressed, qskShadedColor( m_pal.primary, m_pal.pressed ) ); + setColor( Q::Panel | Q::Hovered, QskRgb::toTransparentF( m_pal.primary, m_pal.hover ) ); + setColor( Q::Panel | Q::Focused, QskRgb::toTransparentF( m_pal.primary, m_pal.focused ) ); + setColor( Q::Panel | Q::Pressed, QskRgb::toTransparentF( m_pal.primary, m_pal.pressed ) ); setAnimation( Q::Panel | A::Color, qskDuration ); setAnimation( Q::Panel | A::Metric, qskDuration ); @@ -339,7 +327,7 @@ void Editor::setupDialogButton() setGradient( Q::Panel, m_pal.primary ); setColor( Q::Text, m_pal.onBackground ); - setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.onPrimary, 0.6 ) ); + setColor( Q::Text | Q::Disabled, QskRgb::toTransparentF( m_pal.onPrimary, 0.6 ) ); setFontRole( Q::Text, ButtonFontRole ); setAlignment( Q::Text, Qt::AlignCenter ); @@ -385,7 +373,7 @@ void Editor::setupSlider() setMetric( Q::Panel | A::Size, extent ); setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); - setGradient( Q::Panel, m_pal.background ); + setGradient( Q::Panel, QskGradient() ); setPadding( Q::Panel | A::Horizontal, QskMargins( 0.5 * extent, 0 ) ); setPadding( Q::Panel | A::Vertical, QskMargins( 0, 0.5 * extent ) ); @@ -399,17 +387,17 @@ void Editor::setupSlider() setBoxShape( subControl, 0 ); setBoxBorderMetrics( subControl, 0 ); } + setMetric( Q::Groove | A::Size, qskDpiScaled( 4 ) ); setMetric( Q::Fill | A::Size, qskDpiScaled( 6 ) ); - - setGradient( Q::Groove, qskShadedColor( m_pal.secondary, .38 ) ); + setGradient( Q::Groove, QskRgb::toTransparentF( m_pal.secondary, .38 ) ); setGradient( Q::Groove | Q::Disabled, - qskShadedColor( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + QskRgb::toTransparentF( m_pal.secondaryNoSaturation, m_pal.disabled ) ); setGradient( Q::Fill, m_pal.secondary ); setGradient( Q::Fill | Q::Disabled, - qskShadedColor( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + QskRgb::toTransparentF( m_pal.secondaryNoSaturation, m_pal.disabled ) ); setBoxShape( Q::Handle, 100, Qt::RelativeSize ); setBoxBorderMetrics( Q::Handle, 0 ); @@ -425,11 +413,13 @@ void Editor::setupSlider() setBoxBorderMetrics( Q::Handle, qskDpiScaled( rippleSize / 2 ) ); setBoxBorderColors( Q::Handle | Q::Hovered, - qskShadedColor( m_pal.secondary, m_pal.hover ) ); + QskRgb::toTransparentF( m_pal.secondary, m_pal.hover ) ); + setBoxBorderColors( Q::Handle | Q::Focused, - qskShadedColor( m_pal.secondary, m_pal.focused ) ); + QskRgb::toTransparentF( m_pal.secondary, m_pal.focused ) ); + setBoxBorderColors( Q::Handle | Q::Pressed, - qskShadedColor( m_pal.secondary, m_pal.pressed ) ); + QskRgb::toTransparentF( m_pal.secondary, m_pal.pressed ) ); // move the handle smoothly, when using keys setAnimation( Q::Handle | A::Metric | A::Position, 2 * qskDuration ); @@ -451,17 +441,17 @@ void Editor::setupSwitchButton() setColor( Q::Groove, m_pal.secondaryNoSaturation ); setGradient( Q::Groove | Q::Disabled, - qskShadedColor( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + QskRgb::toTransparentF( m_pal.secondaryNoSaturation, m_pal.disabled ) ); setGradient( Q::Groove | Q::Checked, m_pal.secondaryVariant ); setGradient( Q::Groove | Q::Checked | Q::Disabled, - qskShadedColor( m_pal.secondaryVariant, m_pal.disabledOccupancy ) ); + QskRgb::toTransparentF( m_pal.secondaryVariant, m_pal.disabledOccupancy ) ); setBoxShape( Q::Handle, 100, Qt::RelativeSize ); setStrutSize( Q::Handle, qskDpiScaled( 2 * radius + rippleSize ), qskDpiScaled( 2 * radius + rippleSize ) ); - setGradient( Q::Handle, m_pal.background.lighter( 900 ) ); + setGradient( Q::Handle, QskRgb::lighter( m_pal.background, 900 ) ); setGradient( Q::Handle | Q::Checked, m_pal.secondary ); @@ -474,20 +464,20 @@ void Editor::setupSwitchButton() setBoxBorderMetrics( Q::Handle, qskDpiScaled( rippleSize / 2 ) ); setBoxBorderColors( Q::Handle | Q::Checked | Q::Hovered, - qskShadedColor( m_pal.secondary, m_pal.hover ) ); + QskRgb::toTransparentF( m_pal.secondary, m_pal.hover ) ); setBoxBorderColors( Q::Handle | Q::Checked | Q::Focused, - qskShadedColor( m_pal.secondary, m_pal.focused ) ); + QskRgb::toTransparentF( m_pal.secondary, m_pal.focused ) ); setBoxBorderColors( Q::Handle | Q::Checked | Q::Pressed, - qskShadedColor( m_pal.secondary, m_pal.pressed ) ); + QskRgb::toTransparentF( m_pal.secondary, m_pal.pressed ) ); setBoxBorderColors( Q::Handle | Q::Hovered, - qskShadedColor( m_pal.secondaryVariantNoSaturation, + QskRgb::toTransparentF( m_pal.secondaryVariantNoSaturation, m_pal.hover ) ); setBoxBorderColors( Q::Handle | Q::Focused, - qskShadedColor( m_pal.secondaryVariantNoSaturation, + QskRgb::toTransparentF( m_pal.secondaryVariantNoSaturation, m_pal.focused ) ); setBoxBorderColors( Q::Handle | Q::Pressed, - qskShadedColor( m_pal.secondaryVariantNoSaturation, + QskRgb::toTransparentF( m_pal.secondaryVariantNoSaturation, m_pal.pressed ) ); for ( auto state : { A::NoState, Q::Disabled } ) @@ -556,15 +546,15 @@ void Editor::setupTabButton() setColor( Q::Text, m_pal.onBackground ); setColor( Q::Text | Q::Disabled, - qskShadedColor( m_pal.onBackground, + QskRgb::toTransparentF( m_pal.onBackground, m_pal.widgetBackgroundDisabled ) ); setColor( Q::Text | Q::Checked, m_pal.primary ); setColor( Q::Text | Q::Hovered, m_pal.primary ); setColor( Q::Panel, m_pal.elevated( m_pal.background ) ); - setColor( Q::Panel | Q::Hovered, qskShadedColor( m_pal.primary, m_pal.hover ) ); - setColor( Q::Panel | Q::Focused, qskShadedColor( m_pal.primary, m_pal.focused ) ); - setColor( Q::Panel | Q::Pressed, qskShadedColor( m_pal.primary, m_pal.pressed ) ); + setColor( Q::Panel | Q::Hovered, QskRgb::toTransparentF( m_pal.primary, m_pal.hover ) ); + setColor( Q::Panel | Q::Focused, QskRgb::toTransparentF( m_pal.primary, m_pal.focused ) ); + setColor( Q::Panel | Q::Pressed, QskRgb::toTransparentF( m_pal.primary, m_pal.pressed ) ); setAnimation( Q::Panel | A::Color, qskDuration ); @@ -587,9 +577,11 @@ void Editor::setupTabBar() setAnimation( Q::Panel | A::Metric, QskAnimationHint( 200, QEasingCurve::InCubic ) ); } -void Editor::setupTabView() { +void Editor::setupTabView() +{ using Q = QskTabView; + setGradient( Q::Page, m_pal.background ); setAnimation( Q::Page, qskDuration ); } @@ -654,7 +646,7 @@ void Editor::setupScrollView() { setBoxShape( subControl, 3 ); setBoxBorderMetrics( subControl, 0 ); - setColor( subControl, qskShadedColor( m_pal.onBackground, m_pal.hover ) ); + setColor( subControl, QskRgb::toTransparentF( m_pal.onBackground, m_pal.hover ) ); setAnimation( subControl | A::Color, qskDuration ); } @@ -663,7 +655,7 @@ void Editor::setupScrollView() Q::VerticalScrollHandle | Q::VerticalHandlePressed } ) { setColor( subControl, - qskShadedColor( m_pal.onBackground, m_pal.pressed ) ); + QskRgb::toTransparentF( m_pal.onBackground, m_pal.pressed ) ); } // when changing the position by QskScrollView::scrollTo @@ -679,7 +671,7 @@ void Editor::setupListView() setColor( Q::Cell, m_pal.background ); setColor( Q::Text, m_pal.onBackground ); - setColor( Q::Cell | Q::Selected, qskShadedColor( m_pal.onBackground, m_pal.focused ) ); + setColor( Q::Cell | Q::Selected, QskRgb::toTransparentF( m_pal.onBackground, m_pal.focused ) ); setColor( Q::Text | Q::Selected, m_pal.onBackground ); } @@ -713,15 +705,8 @@ void Editor::setupSubWindow() } -class QskMaterialSkin::PrivateData -{ - public: - ColorPalette palette; -}; - -QskMaterialSkin::QskMaterialSkin( ColorPalette colors, QObject* parent ) +QskMaterialSkin::QskMaterialSkin( const QskMaterialPalette& palette, QObject* parent ) : Inherited( parent ) - , m_data( new PrivateData { colors } ) { // Default theme colors setupFonts( QStringLiteral( "Roboto" ) ); @@ -730,7 +715,7 @@ QskMaterialSkin::QskMaterialSkin( ColorPalette colors, QObject* parent ) buttonFont.setCapitalization( QFont::AllUppercase ); setFont( ButtonFontRole, buttonFont ); - Editor editor( &hintTable(), m_data->palette ); + Editor editor( &hintTable(), palette ); editor.setup(); } diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index 7c7a80a2..a6f041b0 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -9,86 +9,56 @@ #include "QskMaterialGlobal.h" #include #include -#include -struct ColorPalette +class QSK_MATERIAL_EXPORT QskMaterialPalette { - enum Lightness { light, dark } lightness; - - QColor primary; - QColor primaryVariant; - QColor onPrimary; - - QColor secondary; - QColor secondaryVariant; - QColor onSecondary; - - QColor background; - QColor onBackground; - - QColor error; - QColor onError; - - QColor primaryNoSaturation = QColor::fromHsl( primary.hslHue(), 0, - primary.lightness() ); - - QColor secondaryNoSaturation = - QColor::fromHsl( secondary.hslHue(), 0, - secondary.lightness() ); - - QColor secondaryVariantNoSaturation = - QColor::fromHsl( secondaryVariant.hslHue(), 0, - secondaryVariant.lightness() + - secondaryVariant.hslSaturation() ); - - qreal disabledOccupancy = 0.2; - qreal widgetBackgroundDisabled = 0.6; - - qreal hover = 0.1; - qreal focused = 0.4; - qreal pressed = 0.5; - qreal disabled = 0.3; - - ColorPalette( - Lightness lightness = light, - QColor primary = QColor::fromRgb( 0x6200EE ), - QColor primaryVariant = QColor::fromRgb( 0x3700B3 ), - QColor onPrimary = Qt::white, - QColor secondary = QColor::fromRgb( 0x03DAC6 ), - QColor secondaryVariant = QColor::fromRgb( 0x018786 ), - QColor onSecondary = Qt::white, - QColor background = QColor::fromRgba( QskRgb::Grey100 ), - QColor onBackground = Qt::black, - QColor error = QColor::fromRgb( 0xB00020 ), - QColor onError = Qt::white ): - lightness( lightness ), - primary( primary ), - primaryVariant( primaryVariant ), - onPrimary( onPrimary ), - secondary( secondary ), - secondaryVariant( secondaryVariant ), - onSecondary( onSecondary ), - background( background ), - onBackground( onBackground ), - error( error ), - onError( onError ) + public: + enum Lightness { - primaryNoSaturation = QColor::fromHsl( primary.hslHue(), 0, - primary.lightness() ); + Light, + Dark + }; - secondaryNoSaturation = QColor::fromHsl( secondary.hslHue(), - 0, - secondary.lightness() ); - - secondaryVariantNoSaturation = - QColor::fromHsl( secondaryVariant.hslHue(), 0, - secondaryVariant.lightness() ); + QskMaterialPalette( Lightness lightness ) + : m_lightness( lightness ) + { } - inline QColor elevated( const QColor target, const float level = 1 ) const { - return ( lightness == light ) ? target.darker( 100 + level * 15 ) - : target.lighter( 130 + level * 30 ); + inline QRgb elevated( const QRgb rgb, const float level = 1 ) const + { + return ( m_lightness == Light ) + ? QskRgb::darker( rgb, 100 + level * 15 ) + : QskRgb::lighter( rgb, 130 + level * 30 ); } + + public: + QRgb primary; + QRgb primaryVariant; + QRgb onPrimary; + + QRgb secondary; + QRgb secondaryVariant; + QRgb onSecondary; + + QRgb background; + QRgb onBackground; + + QRgb error; + QRgb onError; + + QRgb primaryNoSaturation; + QRgb secondaryNoSaturation; + QRgb secondaryVariantNoSaturation; + + const qreal disabledOccupancy = 0.2; + const qreal widgetBackgroundDisabled = 0.6; + + const qreal hover = 0.1; + const qreal focused = 0.4; + const qreal pressed = 0.5; + const qreal disabled = 0.3; + + const Lightness m_lightness; }; class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin @@ -98,12 +68,8 @@ class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin using Inherited = QskSkin; public: - QskMaterialSkin( ColorPalette, QObject* parent = nullptr ); + QskMaterialSkin( const QskMaterialPalette&, QObject* parent = nullptr ); ~QskMaterialSkin() override; - - private: - class PrivateData; - std::unique_ptr< PrivateData > m_data; }; #endif diff --git a/skins/material/QskMaterialSkinFactory.cpp b/skins/material/QskMaterialSkinFactory.cpp index 04fb1bc7..038103d1 100644 --- a/skins/material/QskMaterialSkinFactory.cpp +++ b/skins/material/QskMaterialSkinFactory.cpp @@ -9,6 +9,42 @@ static const QString materialLightSkinName = QStringLiteral( "materialLight" ); static const QString materialDarkSkinName = QStringLiteral( "materialDark" ); +namespace +{ + inline int lightnessRgb( QRgb rgb ) + { + const int red = qRed( rgb ); + const int green = qGreen( rgb ); + const int blue = qBlue( rgb ); + + int min, max; + + if ( red > green ) + { + max = qMax( red, blue ); + min = qMin( green, blue ); + } + else + { + max = qMax( green, blue ); + min = qMin( red, blue ); + } + + return ( max + min ) / 2; + } + + inline QRgb toUnsaturated( QRgb rgb ) + { + /* + a saturation of 0 results in having the lightness as r,g,b + Is this intended ? + */ + + const auto l = lightnessRgb( rgb ); + return qRgba( l, l, l, qAlpha( rgb ) ); + } +} + QskMaterialSkinFactory::QskMaterialSkinFactory( QObject* parent ) : QskSkinFactory( parent ) { @@ -25,24 +61,48 @@ QStringList QskMaterialSkinFactory::skinNames() const QskSkin* QskMaterialSkinFactory::createSkin( const QString& skinName ) { - if ( QString::compare( skinName, materialLightSkinName, Qt::CaseInsensitive ) ) - return new QskMaterialSkin( ColorPalette() ); - - if ( QString::compare( skinName, materialDarkSkinName, Qt::CaseInsensitive ) ) + if ( QString::compare( skinName, materialLightSkinName, Qt::CaseInsensitive ) == 0 ) { - return new QskMaterialSkin( ColorPalette( - ColorPalette::dark, // lightness - QColor::fromRgb( 0xBB86FC ), // primary - QColor::fromRgb( 0x3700B3 ), // primaryVariant - Qt::black, // onPrimary - QColor::fromRgb( 0x03DAC6 ), // secondary - QColor::fromRgb( 0x018786 ), // secondaryVariant - Qt::black, // onSecondary - QColor::fromRgb( 0x121212 ), // background - Qt::white, // onBackground - QColor::fromRgb( 0xCF6679 ), // error - Qt::black // onError - ) ); + QskMaterialPalette pal( QskMaterialPalette::Light );; + + pal.primary = 0xff6200ee; + pal.primaryVariant = 0xff3700b3; + pal.onPrimary = QskRgb::White; + pal.secondary = 0xff03dac6; + pal.secondaryVariant = 0xff018786; + pal.onSecondary = QskRgb::White; + pal.background = QskRgb::Grey100; + pal.onBackground = QskRgb::Black; + pal.error = 0xffb00020; + pal.onError = QskRgb::White; + + pal.primaryNoSaturation = toUnsaturated( pal.primary ); + pal.secondaryNoSaturation = toUnsaturated( pal.secondary ); + pal.secondaryVariantNoSaturation = toUnsaturated( pal.secondaryVariant ); + + return new QskMaterialSkin( pal ); + } + + if ( QString::compare( skinName, materialDarkSkinName, Qt::CaseInsensitive ) == 0 ) + { + QskMaterialPalette pal( QskMaterialPalette::Dark ); + + pal.primary = 0xffbb86fc; + pal.primaryVariant = 0xff3700b3; + pal.onPrimary = QskRgb::Black; + pal.secondary = 0xff03dac6; + pal.secondaryVariant = 0xff018786; + pal.onSecondary = QskRgb::Black; + pal.background = 0xff121212; + pal.onBackground = QskRgb::White; + pal.error = 0xffcf6679; + pal.onError = QskRgb::Black; + + pal.primaryNoSaturation = toUnsaturated( pal.primary ); + pal.secondaryNoSaturation = toUnsaturated( pal.secondary ); + pal.secondaryVariantNoSaturation = toUnsaturated( pal.secondaryVariant ); + + return new QskMaterialSkin( pal ); } return nullptr; diff --git a/skins/squiek/QskSquiekSkin.cpp b/skins/squiek/QskSquiekSkin.cpp index f7031ae1..55ce1c0c 100644 --- a/skins/squiek/QskSquiekSkin.cpp +++ b/skins/squiek/QskSquiekSkin.cpp @@ -647,51 +647,38 @@ void Editor::setupSlider() // Panel - for ( auto placement : { A::Horizontal, A::Vertical } ) - { - const auto aspect = Q::Panel | placement; - - setMetric( aspect | A::Size, extent ); - setBoxBorderMetrics( aspect, 0 ); - setBoxShape( aspect, 0 ); - setGradient( aspect, QskGradient() ); - } + setMetric( Q::Panel | A::Size, extent ); + setBoxBorderMetrics( Q::Panel, 0 ); + setBoxShape( Q::Panel, 0 ); + setGradient( Q::Panel, QskGradient() ); setPadding( Q::Panel | A::Horizontal, QskMargins( 0.5 * extent, 0 ) ); setPadding( Q::Panel | A::Vertical, QskMargins( 0, 0.5 * extent ) ); // Groove, Fill - for ( auto placement : { A::Horizontal, A::Vertical } ) + for ( auto subControl : { Q::Groove, Q::Fill } ) { - for ( auto subControl : { Q::Groove, Q::Fill } ) - { - const auto aspect = subControl | placement; + const auto aspect = subControl; - setMetric( aspect | A::Size, 0.3 * extent ); - setPadding( aspect, 0 ); + setMetric( aspect | A::Size, 0.3 * extent ); + setPadding( aspect, 0 ); - setBoxBorderMetrics( aspect, 0 ); - setBoxShape( aspect, 0.1 * extent ); - } - - setGradient( Q::Groove | placement, m_pal.darker200 ); - setGradient( Q::Fill | placement, QskGradient() ); // no filling + setBoxBorderMetrics( aspect, 0 ); + setBoxShape( aspect, 0.1 * extent ); } + setGradient( Q::Groove, m_pal.darker200 ); + setGradient( Q::Fill, QskGradient() ); // no filling + // Handle - for ( auto placement : { A::Horizontal, A::Vertical } ) - { - const auto aspect = Q::Handle | placement; + setButton( Q::Handle, Raised, 1 ); + setBoxShape( Q::Handle, 20.0, Qt::RelativeSize ); + setButton( Q::Handle | Q::Pressed, Sunken, 1 ); - setButton( aspect, Raised, 1 ); - setBoxShape( aspect, 20.0, Qt::RelativeSize ); - setButton( aspect | Q::Pressed, Sunken, 1 ); - - const qreal sz = 0.75 * extent; - setStrutSize( aspect, sz, sz ); - } + const qreal sz = 0.75 * extent; + setStrutSize( Q::Handle, sz, sz ); setAnimation( Q::Handle | A::Color, qskDuration ); } diff --git a/skins/squiek/QskSquiekSkinFactory.cpp b/skins/squiek/QskSquiekSkinFactory.cpp index 16c27524..39074d24 100644 --- a/skins/squiek/QskSquiekSkinFactory.cpp +++ b/skins/squiek/QskSquiekSkinFactory.cpp @@ -24,7 +24,7 @@ QStringList QskSquiekSkinFactory::skinNames() const QskSkin* QskSquiekSkinFactory::createSkin( const QString& skinName ) { - if ( skinName.toLower() == squiekSkinName ) + if ( QString::compare( skinName, squiekSkinName, Qt::CaseInsensitive ) == 0 ) return new QskSquiekSkin(); return nullptr; diff --git a/src/common/QskArcMetrics.cpp b/src/common/QskArcMetrics.cpp index 991b075d..44d90fde 100644 --- a/src/common/QskArcMetrics.cpp +++ b/src/common/QskArcMetrics.cpp @@ -11,6 +11,10 @@ static void qskRegisterArcMetrics() { qRegisterMetaType< QskArcMetrics >(); + +#if QT_VERSION < QT_VERSION_CHECK( 6, 0, 0 ) + QMetaType::registerEqualsComparator< QskArcMetrics >(); +#endif } Q_CONSTRUCTOR_FUNCTION( qskRegisterArcMetrics ) diff --git a/src/common/QskAspect.h b/src/common/QskAspect.h index 94e5bd42..4b5f03bc 100644 --- a/src/common/QskAspect.h +++ b/src/common/QskAspect.h @@ -109,8 +109,18 @@ class QSK_EXPORT QskAspect constexpr QskAspect operator|( Type ) const noexcept; constexpr QskAspect operator|( Primitive ) const noexcept; constexpr QskAspect operator|( Placement ) const noexcept; + constexpr QskAspect operator|( State ) const noexcept; + QskAspect& operator|=( State ) noexcept; + + constexpr QskAspect operator&( State ) const noexcept; + QskAspect& operator&=( State ) noexcept; + constexpr QskAspect operator|( States ) const noexcept; + QskAspect& operator|=( States ) noexcept; + + constexpr QskAspect operator&( States ) const noexcept; + QskAspect& operator&=( States ) noexcept; constexpr QskAspect stateless() const noexcept; constexpr QskAspect trunk() const noexcept; @@ -283,12 +293,48 @@ inline constexpr QskAspect QskAspect::operator|( State state ) const noexcept m_bits.primitive, m_bits.placement, m_bits.states | state ); } +inline QskAspect& QskAspect::operator|=( State state ) noexcept +{ + m_bits.states |= state; + return *this; +} + +inline constexpr QskAspect QskAspect::operator&( State state ) const noexcept +{ + return QskAspect( m_bits.subControl, m_bits.type, m_bits.isAnimator, + m_bits.primitive, m_bits.placement, m_bits.states & state ); +} + +inline QskAspect& QskAspect::operator&=( State state ) noexcept +{ + m_bits.states &= state; + return *this; +} + inline constexpr QskAspect QskAspect::operator|( States states ) const noexcept { return QskAspect( m_bits.subControl, m_bits.type, m_bits.isAnimator, m_bits.primitive, m_bits.placement, m_bits.states | states ); } +inline QskAspect& QskAspect::operator|=( States states ) noexcept +{ + m_bits.states |= states; + return *this; +} + +inline constexpr QskAspect QskAspect::operator&( States states ) const noexcept +{ + return QskAspect( m_bits.subControl, m_bits.type, m_bits.isAnimator, + m_bits.primitive, m_bits.placement, m_bits.states & states ); +} + +inline QskAspect& QskAspect::operator&=( States states ) noexcept +{ + m_bits.states &= states; + return *this; +} + inline constexpr QskAspect QskAspect::stateless() const noexcept { return QskAspect( m_bits.subControl, m_bits.type, m_bits.isAnimator, @@ -538,6 +584,11 @@ namespace std }; } +inline QskHashValue qHash( const QskAspect aspect, QskHashValue seed = 0 ) noexcept +{ + return qHash( aspect.value(), seed ); +} + #ifndef QT_NO_DEBUG_STREAM class QDebug; diff --git a/src/common/QskBoxBorderColors.cpp b/src/common/QskBoxBorderColors.cpp index 054696dd..80493b20 100644 --- a/src/common/QskBoxBorderColors.cpp +++ b/src/common/QskBoxBorderColors.cpp @@ -13,6 +13,10 @@ static void qskRegisterBoxBorderColors() { qRegisterMetaType< QskBoxBorderColors >(); +#if QT_VERSION < QT_VERSION_CHECK( 6, 0, 0 ) + QMetaType::registerEqualsComparator< QskBoxBorderColors >(); +#endif + QMetaType::registerConverter< QColor, QskBoxBorderColors >( []( const QColor& color ) { return QskBoxBorderColors( color ); } ); @@ -110,6 +114,26 @@ void QskBoxBorderColors::setGradientAt( Qt::Edges edges, const QskGradient& grad m_gradients[ Qsk::Bottom ] = gradient; } +void QskBoxBorderColors::setLeft( const QskGradient& gradient ) +{ + m_gradients[ Qsk::Left ] = gradient; +} + +void QskBoxBorderColors::setTop( const QskGradient& gradient ) +{ + m_gradients[ Qsk::Top ] = gradient; +} + +void QskBoxBorderColors::setRight( const QskGradient& gradient ) +{ + m_gradients[ Qsk::Right ] = gradient; +} + +void QskBoxBorderColors::setBottom( const QskGradient& gradient ) +{ + m_gradients[ Qsk::Bottom ] = gradient; +} + const QskGradient& QskBoxBorderColors::gradientAt( Qt::Edge edge ) const { switch ( edge ) @@ -165,6 +189,14 @@ bool QskBoxBorderColors::isMonochrome() const && m_gradients[ 3 ].isMonochrome(); } +bool QskBoxBorderColors::isValid() const +{ + return m_gradients[ 0 ].isValid() + || m_gradients[ 1 ].isValid() + || m_gradients[ 2 ].isValid() + || m_gradients[ 3 ].isValid(); +} + QskBoxBorderColors QskBoxBorderColors::interpolated( const QskBoxBorderColors& to, qreal ratio ) const { @@ -172,8 +204,14 @@ QskBoxBorderColors QskBoxBorderColors::interpolated( for ( size_t i = 0; i < 4; i++ ) { - colors.m_gradients[ i ] = colors.m_gradients[ i ].interpolated( - to.m_gradients[ i ], ratio ); +#if 1 + /* + When one border has a width of 0 we would prefer to ignore + the color and use always use the other color. TODO ... + */ +#endif + auto& gradient = colors.m_gradients[ i ]; + gradient = gradient.interpolated( to.m_gradients[ i ], ratio ); } return colors; @@ -204,14 +242,44 @@ QDebug operator<<( QDebug debug, const QskBoxBorderColors& colors ) QDebugStateSaver saver( debug ); debug.nospace(); - debug << "BoxBorderColors" << '('; + debug << "BoxBorderColors"; - debug << " L" << colors.gradient( Qsk::Left ); - debug << ", T" << colors.gradient( Qsk::Top ); - debug << ", R" << colors.gradient( Qsk::Right ); - debug << ", B" << colors.gradient( Qsk::Bottom ); + if ( !colors.isValid() ) + { + debug << "()"; + } + else + { + debug << "( "; - debug << " )"; + if ( colors.isMonochrome() ) + { + const auto& gradient = colors.gradient( Qsk::Left ); + QskRgb::debugColor( debug, gradient.startColor() ); + } + else + { + const char prompts[] = { 'L', 'T', 'R', 'B' }; + + for ( int i = 0; i <= Qsk::Bottom; i++ ) + { + if ( i != 0 ) + debug << ", "; + + const auto& gradient = colors.gradient( + static_cast< Qsk::Position >( i ) ); + + debug << prompts[ i ] << ": "; + + if ( gradient.isValid() && gradient.isMonochrome() ) + QskRgb::debugColor( debug, gradient.startColor() ); + else + debug << gradient; + } + } + + debug << " )"; + } return debug; } diff --git a/src/common/QskBoxBorderColors.h b/src/common/QskBoxBorderColors.h index b6ca4b68..6011c2d9 100644 --- a/src/common/QskBoxBorderColors.h +++ b/src/common/QskBoxBorderColors.h @@ -12,10 +12,15 @@ #include #include -class QDebug; - class QSK_EXPORT QskBoxBorderColors { + Q_GADGET + + Q_PROPERTY( QskGradient left READ left WRITE setLeft ) + Q_PROPERTY( QskGradient top READ top WRITE setTop ) + Q_PROPERTY( QskGradient right READ right WRITE setRight ) + Q_PROPERTY( QskGradient bottom READ bottom WRITE setBottom ) + public: QskBoxBorderColors(); @@ -44,6 +49,18 @@ class QSK_EXPORT QskBoxBorderColors void setGradientAt( Qt::Edges, const QskGradient& ); const QskGradient& gradientAt( Qt::Edge ) const; + void setLeft( const QskGradient& ); + const QskGradient& left() const; + + void setTop( const QskGradient& ); + const QskGradient& top() const; + + void setRight( const QskGradient& ); + const QskGradient& right() const; + + void setBottom( const QskGradient& ); + const QskGradient& bottom() const; + QskBoxBorderColors interpolated( const QskBoxBorderColors&, qreal value ) const; static QVariant interpolate( const QskBoxBorderColors&, @@ -53,6 +70,7 @@ class QSK_EXPORT QskBoxBorderColors bool isMonochrome() const; bool isVisible() const; + bool isValid() const; private: QskGradient m_gradients[ 4 ]; @@ -78,8 +96,29 @@ inline const QskGradient& QskBoxBorderColors::gradient( Qsk::Position position ) return m_gradients[ position ]; } +inline const QskGradient& QskBoxBorderColors::left() const +{ + return m_gradients[ Qsk::Left ]; +} + +inline const QskGradient& QskBoxBorderColors::top() const +{ + return m_gradients[ Qsk::Top ]; +} + +inline const QskGradient& QskBoxBorderColors::right() const +{ + return m_gradients[ Qsk::Right ]; +} + +inline const QskGradient& QskBoxBorderColors::bottom() const +{ + return m_gradients[ Qsk::Bottom ]; +} + #ifndef QT_NO_DEBUG_STREAM +class QDebug; QSK_EXPORT QDebug operator<<( QDebug, const QskBoxBorderColors& ); #endif diff --git a/src/common/QskBoxBorderMetrics.cpp b/src/common/QskBoxBorderMetrics.cpp index 25de9fe6..18178062 100644 --- a/src/common/QskBoxBorderMetrics.cpp +++ b/src/common/QskBoxBorderMetrics.cpp @@ -12,6 +12,10 @@ static void qskRegisterBoxBorderMetrics() { qRegisterMetaType< QskBoxBorderMetrics >(); +#if QT_VERSION < QT_VERSION_CHECK( 6, 0, 0 ) + QMetaType::registerEqualsComparator< QskBoxBorderMetrics >(); +#endif + QMetaType::registerConverter< QskMargins, QskBoxBorderMetrics >( []( const QskMargins& margins ) { return QskBoxBorderMetrics( margins ); } ); @@ -109,9 +113,24 @@ QDebug operator<<( QDebug debug, const QskBoxBorderMetrics& metrics ) QDebugStateSaver saver( debug ); debug.nospace(); - debug << "BoxBorder" << '('; - debug << metrics.sizeMode() << ',' << metrics.widths(); - debug << ')'; + debug << "BoxBorder" << "( "; + + if ( metrics.sizeMode() != Qt::AbsoluteSize ) + debug << metrics.sizeMode() << ", "; + + const auto& w = metrics.widths(); + + if ( metrics.isEquidistant() ) + { + debug << w.left(); + } + else + { + const char s[] = ", "; + debug << w.left() << s << w.top() << s << w.right() << s << w.bottom(); + } + + debug << " )"; return debug; } diff --git a/src/common/QskBoxBorderMetrics.h b/src/common/QskBoxBorderMetrics.h index 10b7961c..802d2c75 100644 --- a/src/common/QskBoxBorderMetrics.h +++ b/src/common/QskBoxBorderMetrics.h @@ -60,6 +60,8 @@ class QSK_EXPORT QskBoxBorderMetrics static QVariant interpolate( const QskBoxBorderMetrics&, const QskBoxBorderMetrics&, qreal progress ); + constexpr bool isEquidistant() const noexcept; + private: QskMargins m_widths; Qt::SizeMode m_sizeMode; @@ -115,6 +117,11 @@ inline constexpr bool QskBoxBorderMetrics::isNull() const noexcept return m_widths.isNull(); } +inline constexpr bool QskBoxBorderMetrics::isEquidistant() const noexcept +{ + return m_widths.isEquidistant(); +} + inline constexpr const QskMargins& QskBoxBorderMetrics::widths() const noexcept { return m_widths; diff --git a/src/common/QskBoxShapeMetrics.cpp b/src/common/QskBoxShapeMetrics.cpp index 09e9cc70..17c21be1 100644 --- a/src/common/QskBoxShapeMetrics.cpp +++ b/src/common/QskBoxShapeMetrics.cpp @@ -14,6 +14,10 @@ static void qskRegisterBoxShapeMetrics() { qRegisterMetaType< QskBoxShapeMetrics >(); +#if QT_VERSION < QT_VERSION_CHECK( 6, 0, 0 ) + QMetaType::registerEqualsComparator< QskBoxShapeMetrics >(); +#endif + QMetaType::registerConverter< int, QskBoxShapeMetrics >( []( int radius ) { return QskBoxShapeMetrics( radius ); } ); diff --git a/src/common/QskGradient.cpp b/src/common/QskGradient.cpp index 4da8eff8..82661437 100644 --- a/src/common/QskGradient.cpp +++ b/src/common/QskGradient.cpp @@ -15,6 +15,10 @@ static void qskRegisterGradient() { qRegisterMetaType< QskGradient >(); +#if QT_VERSION < QT_VERSION_CHECK( 6, 0, 0 ) + QMetaType::registerEqualsComparator< QskGradient >(); +#endif + QMetaType::registerConverter< QColor, QskGradient >( []( const QColor& color ) { return QskGradient( color ); } ); } @@ -229,6 +233,11 @@ QskGradient::QskGradient( Orientation orientation, const QskGradientStops& stops setStops( stops ); } +QskGradient::QskGradient( Qt::Orientation orientation, QGradient::Preset preset ) + : QskGradient( qskOrientation( orientation ), preset ) +{ +} + QskGradient::QskGradient( Orientation orientation, QGradient::Preset preset ) : QskGradient( orientation ) { @@ -499,6 +508,14 @@ QskGradient QskGradient::interpolated( return QskGradient( gradient->orientation(), stops ); } + if ( isMonochrome() && to.isMonochrome() ) + { + const auto c = QskRgb::interpolated( + m_stops[ 0 ].color(), to.m_stops[ 0 ].color(), value ); + + return QskGradient( to.orientation(), c, c ); + } + if ( isMonochrome() ) { // we can ignore our stops @@ -624,7 +641,49 @@ void QskGradient::updateStatusBits() const QDebug operator<<( QDebug debug, const QskGradient& gradient ) { - debug << "GR:" << gradient.orientation() << gradient.stops().count(); + QDebugStateSaver saver( debug ); + debug.nospace(); + + debug << "Gradient"; + + if ( !gradient.isValid() ) + { + debug << "()"; + } + else + { + debug << "( "; + + if ( gradient.isMonochrome() ) + { + QskRgb::debugColor( debug, gradient.startColor() ); + } + else + { + const char o[] = { 'H', 'V', 'D' }; + debug << o[ gradient.orientation() ] << ", "; + + if ( gradient.stops().count() == 2 ) + { + QskRgb::debugColor( debug, gradient.startColor() ); + debug << ", "; + QskRgb::debugColor( debug, gradient.endColor() ); + } + else + { + const auto& s = gradient.stops(); + for ( int i = 0; i < s.count(); i++ ) + { + if ( i != 0 ) + debug << ", "; + + debug << s[i]; + } + } + } + debug << " )"; + } + return debug; } diff --git a/src/common/QskGradient.h b/src/common/QskGradient.h index 75005926..be90ad5a 100644 --- a/src/common/QskGradient.h +++ b/src/common/QskGradient.h @@ -52,6 +52,7 @@ class QSK_EXPORT QskGradient QskGradient( Qt::Orientation, const QVector< QskGradientStop >& ); QskGradient( Qt::Orientation, const QColor&, const QColor& ); + QskGradient( Qt::Orientation, QGradient::Preset ); QskGradient( Orientation, const QVector< QskGradientStop >& ); QskGradient( Orientation, const QColor&, const QColor& ); diff --git a/src/common/QskGradientStop.cpp b/src/common/QskGradientStop.cpp index 530a2a1d..48dbdac2 100644 --- a/src/common/QskGradientStop.cpp +++ b/src/common/QskGradientStop.cpp @@ -14,6 +14,10 @@ static void qskRegisterGradientStop() { qRegisterMetaType< QskGradientStop >(); + +#if QT_VERSION < QT_VERSION_CHECK( 6, 0, 0 ) + QMetaType::registerEqualsComparator< QskGradientStop >(); +#endif } Q_CONSTRUCTOR_FUNCTION( qskRegisterGradientStop ) @@ -78,7 +82,12 @@ QColor QskGradientStop::interpolated( QDebug operator<<( QDebug debug, const QskGradientStop& stop ) { - debug << stop.position() << ": " << stop.color(); + QDebugStateSaver saver( debug ); + debug.nospace(); + + debug << stop.position() << ": "; + QskRgb::debugColor( debug, stop.color() ); + return debug; } diff --git a/src/common/QskIntervalF.cpp b/src/common/QskIntervalF.cpp index a27a83c8..f4b19d38 100644 --- a/src/common/QskIntervalF.cpp +++ b/src/common/QskIntervalF.cpp @@ -12,6 +12,10 @@ static void qskRegisterIntervalF() { qRegisterMetaType< QskIntervalF >(); + +#if QT_VERSION < QT_VERSION_CHECK( 6, 0, 0 ) + QMetaType::registerEqualsComparator< QskIntervalF >(); +#endif } Q_CONSTRUCTOR_FUNCTION( qskRegisterIntervalF ) diff --git a/src/common/QskMargins.h b/src/common/QskMargins.h index e90c9338..3a3bb962 100644 --- a/src/common/QskMargins.h +++ b/src/common/QskMargins.h @@ -61,6 +61,7 @@ class QSK_EXPORT QskMargins : public QMarginsF QskMargins interpolated( const QskMargins&, qreal progress ) const noexcept; constexpr bool isExpanding() const noexcept; + constexpr bool isEquidistant() const noexcept; static QVariant interpolate( const QskMargins&, const QskMargins&, qreal progress ) noexcept; @@ -181,6 +182,11 @@ constexpr inline qreal QskMargins::height() const noexcept return top() + bottom(); } +inline constexpr bool QskMargins::isEquidistant() const noexcept +{ + return ( left() == top() ) && ( left() == right() ) && ( left() == bottom() ); +} + Q_DECLARE_TYPEINFO( QskMargins, Q_MOVABLE_TYPE ); Q_DECLARE_METATYPE( QskMargins ) diff --git a/src/common/QskRgbValue.cpp b/src/common/QskRgbValue.cpp index 49a87f96..7b4c0b8c 100644 --- a/src/common/QskRgbValue.cpp +++ b/src/common/QskRgbValue.cpp @@ -172,3 +172,29 @@ QRgb QskRgb::darker( QRgb rgb, int factor ) noexcept return QColor::fromRgba( rgb ).darker( factor ).rgba(); } +#ifndef QT_NO_DEBUG_STREAM + +#include + +void QskRgb::debugColor( QDebug debug, const QColor& color ) +{ + debugColor( debug, color.rgba() ); +} + +void QskRgb::debugColor( QDebug debug, QRgb rgb ) +{ + QDebugStateSaver saver( debug ); + debug.nospace(); + + debug << '['; + + debug << qRed( rgb ) << "r," << qGreen( rgb ) << "g," + << qBlue( rgb ) << 'b'; + + if ( qAlpha( rgb ) != 255 ) + debug << ',' << qAlpha( rgb ) << 'a'; + + debug << ']'; +} + +#endif diff --git a/src/common/QskRgbValue.h b/src/common/QskRgbValue.h index 6fea8d95..8a6059de 100644 --- a/src/common/QskRgbValue.h +++ b/src/common/QskRgbValue.h @@ -461,23 +461,35 @@ namespace QskRgb return ( rgb & ColorMask ) | ( ( static_cast< uint >( alpha ) & 0xffu ) << 24 ); } - inline QColor toTransparentF( const QColor& color, qreal alpha ) + inline QColor toTransparentF( const QColor& color, qreal opacity ) { - return toTransparent( color, qRound( alpha * 255 ) ); + return toTransparent( color, qRound( opacity * 255 ) ); } - inline QColor toTransparentF( Qt::GlobalColor color, qreal alpha ) + inline QColor toTransparentF( Qt::GlobalColor color, qreal opacity ) { - return toTransparent( QColor( color ), qRound( alpha * 255 ) ); + return toTransparent( QColor( color ), qRound( opacity * 255 ) ); } - inline constexpr QRgb toTransparentF( QRgb rgb, qreal alpha ) noexcept + inline constexpr QRgb toTransparentF( QRgb rgb, qreal opacity ) noexcept { - return toTransparent( rgb, qRound( alpha * 255 ) ); + return toTransparent( rgb, qRound( opacity * 255 ) ); } QSK_EXPORT QRgb lighter( QRgb, int factor = 150 ) noexcept; QSK_EXPORT QRgb darker( QRgb, int factor = 200 ) noexcept; } +#ifndef QT_NO_DEBUG_STREAM + +class QDebug; + +namespace QskRgb +{ + QSK_EXPORT void debugColor( QDebug, const QColor& ); + QSK_EXPORT void debugColor( QDebug, QRgb ); +} + +#endif + #endif diff --git a/src/common/QskScaleTickmarks.cpp b/src/common/QskScaleTickmarks.cpp index 836fc474..65f67089 100644 --- a/src/common/QskScaleTickmarks.cpp +++ b/src/common/QskScaleTickmarks.cpp @@ -9,6 +9,10 @@ static void qskRegisterTickmarks() { qRegisterMetaType< QskScaleTickmarks >(); + +#if QT_VERSION < QT_VERSION_CHECK( 6, 0, 0 ) + QMetaType::registerEqualsComparator< QskScaleTickmarks >(); +#endif } Q_CONSTRUCTOR_FUNCTION( qskRegisterTickmarks ) diff --git a/src/common/QskShadowMetrics.cpp b/src/common/QskShadowMetrics.cpp index 37b951b0..384104d3 100644 --- a/src/common/QskShadowMetrics.cpp +++ b/src/common/QskShadowMetrics.cpp @@ -12,6 +12,10 @@ static void qskRegisterShadowMetrics() { qRegisterMetaType< QskShadowMetrics >(); + +#if QT_VERSION < QT_VERSION_CHECK( 6, 0, 0 ) + QMetaType::registerEqualsComparator< QskShadowMetrics >(); +#endif } Q_CONSTRUCTOR_FUNCTION( qskRegisterShadowMetrics ) diff --git a/src/common/QskStateCombination.cpp b/src/common/QskStateCombination.cpp deleted file mode 100644 index 07a7b481..00000000 --- a/src/common/QskStateCombination.cpp +++ /dev/null @@ -1,14 +0,0 @@ -/****************************************************************************** - * QSkinny - Copyright (C) 2016 Uwe Rathmann - * This file may be used under the terms of the QSkinny License, Version 1.0 - *****************************************************************************/ - -#include "QskStateCombination.h" - -static void qskRegisterStateCombination() -{ - qRegisterMetaType< QskStateCombination >(); -} - -Q_CONSTRUCTOR_FUNCTION( qskRegisterStateCombination ) - diff --git a/src/common/QskStateCombination.h b/src/common/QskStateCombination.h index 8393c90b..13d64e22 100644 --- a/src/common/QskStateCombination.h +++ b/src/common/QskStateCombination.h @@ -21,6 +21,9 @@ class QSK_EXPORT QskStateCombination constexpr QskStateCombination( QskAspect::States = QskAspect::States() ) noexcept; constexpr QskStateCombination( Type, QskAspect::States = QskAspect::States() ) noexcept; + constexpr bool operator==( QskStateCombination ) const noexcept; + constexpr bool operator!=( QskStateCombination ) const noexcept; + constexpr bool isNull() const noexcept; void setType( Type ) noexcept; @@ -36,7 +39,6 @@ class QSK_EXPORT QskStateCombination }; Q_DECLARE_TYPEINFO( QskStateCombination, Q_MOVABLE_TYPE ); -Q_DECLARE_METATYPE( QskStateCombination ) constexpr inline QskStateCombination::QskStateCombination( QskAspect::State state ) noexcept @@ -90,4 +92,14 @@ constexpr inline QskAspect::States QskStateCombination::states() const noexcept return m_states; } +constexpr bool QskStateCombination::operator==( QskStateCombination other ) const noexcept +{ + return ( m_type == other.m_type ) && ( m_states == other.m_states ); +} + +constexpr bool QskStateCombination::operator!=( QskStateCombination other ) const noexcept +{ + return !( *this == other ); +} + #endif diff --git a/src/controls/QskSkin.cpp b/src/controls/QskSkin.cpp index f99dc41a..85215d98 100644 --- a/src/controls/QskSkin.cpp +++ b/src/controls/QskSkin.cpp @@ -128,7 +128,6 @@ class QskSkin::PrivateData std::unordered_map< const QMetaObject*, SkinletData > skinletMap; QskSkinHintTable hintTable; - QskAspect::States stateMask = QskAspect::AllStates; std::unordered_map< int, QFont > fonts; std::unordered_map< int, QskColorFilter > graphicFilters; @@ -345,22 +344,6 @@ const int* QskSkin::dialogButtonLayout( Qt::Orientation orientation ) const return QPlatformDialogHelper::buttonLayout( orientation, policy ); } -void QskSkin::setStateMask( QskAspect::States mask ) -{ - for ( auto state : { QskControl::Disabled, QskControl::Hovered, QskControl::Focused } ) - { - if ( mask & state ) - m_data->stateMask |= state; - else - m_data->stateMask &= ~state; - } -} - -QskAspect::States QskSkin::stateMask() const -{ - return m_data->stateMask; -} - QskSkinlet* QskSkin::skinlet( const QMetaObject* metaObject ) { while ( metaObject ) diff --git a/src/controls/QskSkin.h b/src/controls/QskSkin.h index adeb2c54..723b0115 100644 --- a/src/controls/QskSkin.h +++ b/src/controls/QskSkin.h @@ -77,9 +77,6 @@ class QSK_EXPORT QskSkin : public QObject virtual const int* dialogButtonLayout( Qt::Orientation ) const; virtual QString dialogButtonText( int button ) const; - void setStateMask( QskAspect::States ); - QskAspect::States stateMask() const; - QskSkinlet* skinlet( const QMetaObject* ); const QskSkinHintTable& hintTable() const; diff --git a/src/controls/QskSkinHintTable.cpp b/src/controls/QskSkinHintTable.cpp index 9bac96f0..7b654c65 100644 --- a/src/controls/QskSkinHintTable.cpp +++ b/src/controls/QskSkinHintTable.cpp @@ -64,41 +64,11 @@ QskSkinHintTable::QskSkinHintTable() { } -QskSkinHintTable::QskSkinHintTable( const QskSkinHintTable& other ) - : m_hints( nullptr ) - , m_animatorCount( other.m_animatorCount ) - , m_statefulCount( other.m_statefulCount ) -{ - if ( other.m_hints ) - m_hints = new HintMap( *( other.m_hints ) ); -} - QskSkinHintTable::~QskSkinHintTable() { delete m_hints; } -QskSkinHintTable& QskSkinHintTable::operator=( const QskSkinHintTable& other ) -{ - m_animatorCount = other.m_animatorCount; - m_statefulCount = other.m_statefulCount; - - if ( other.m_hints ) - { - if ( m_hints == nullptr ) - m_hints = new HintMap(); - - *m_hints = *other.m_hints; - } - else - { - delete m_hints; - m_hints = nullptr; - } - - return *this; -} - const std::unordered_map< QskAspect, QVariant >& QskSkinHintTable::hints() const { if ( m_hints ) @@ -126,11 +96,7 @@ bool QskSkinHintTable::setHint( QskAspect aspect, const QVariant& skinHint ) QSK_ASSERT_COUNTER( m_animatorCount ); } - if ( aspect.hasStates() ) - { - m_statefulCount++; - QSK_ASSERT_COUNTER( m_statefulCount ); - } + m_states |= aspect.states(); return true; } @@ -158,8 +124,7 @@ bool QskSkinHintTable::removeHint( QskAspect aspect ) if ( aspect.isAnimator() ) m_animatorCount--; - if ( aspect.hasStates() ) - m_statefulCount--; + // how to clear m_states ? TODO ... if ( m_hints->empty() ) { @@ -184,8 +149,7 @@ QVariant QskSkinHintTable::takeHint( QskAspect aspect ) if ( aspect.isAnimator() ) m_animatorCount--; - if ( aspect.hasStates() ) - m_statefulCount--; + // how to clear m_states ? TODO ... if ( m_hints->empty() ) { @@ -206,14 +170,14 @@ void QskSkinHintTable::clear() m_hints = nullptr; m_animatorCount = 0; - m_statefulCount = 0; + m_states = QskAspect::NoState; } const QVariant* QskSkinHintTable::resolvedHint( QskAspect aspect, QskAspect* resolvedAspect ) const { if ( m_hints != nullptr ) - return qskResolvedHint( aspect, *m_hints, resolvedAspect ); + return qskResolvedHint( aspect & m_states, *m_hints, resolvedAspect ); return nullptr; } @@ -223,7 +187,7 @@ QskAspect QskSkinHintTable::resolvedAspect( QskAspect aspect ) const QskAspect a; if ( m_hints != nullptr ) - qskResolvedHint( aspect, *m_hints, &a ); + qskResolvedHint( aspect & m_states, *m_hints, &a ); return a; } @@ -233,6 +197,8 @@ QskAspect QskSkinHintTable::resolvedAnimator( { if ( m_hints && m_animatorCount > 0 ) { + aspect &= m_states; + Q_FOREVER { auto it = m_hints->find( aspect ); @@ -268,15 +234,16 @@ bool QskSkinHintTable::setAnimation( bool QskSkinHintTable::isResolutionMatching( QskAspect aspect1, QskAspect aspect2 ) const { + // remove states we do not have early + aspect1 &= m_states; + aspect2 &= m_states; + if ( aspect1 == aspect2 ) return true; if ( aspect1.trunk() != aspect2.trunk() ) return false; - if ( !hasStates() ) - return false; - const auto a1 = aspect1; const auto a2 = aspect2; diff --git a/src/controls/QskSkinHintTable.h b/src/controls/QskSkinHintTable.h index c1e6a647..9ae56be9 100644 --- a/src/controls/QskSkinHintTable.h +++ b/src/controls/QskSkinHintTable.h @@ -17,12 +17,8 @@ class QSK_EXPORT QskSkinHintTable { public: QskSkinHintTable(); - QskSkinHintTable( const QskSkinHintTable& other ); - ~QskSkinHintTable(); - QskSkinHintTable& operator=( const QskSkinHintTable& ); - bool setAnimation( QskAspect, QskAnimationHint ); QskAnimationHint animation( QskAspect ) const; @@ -40,9 +36,10 @@ class QSK_EXPORT QskSkinHintTable const std::unordered_map< QskAspect, QVariant >& hints() const; bool hasAnimators() const; - bool hasStates() const; bool hasHints() const; + QskAspect::States states() const; + void clear(); const QVariant* resolvedHint( QskAspect, @@ -56,13 +53,15 @@ class QSK_EXPORT QskSkinHintTable bool isResolutionMatching( QskAspect, QskAspect ) const; private: + Q_DISABLE_COPY( QskSkinHintTable ) + static const QVariant invalidHint; typedef std::unordered_map< QskAspect, QVariant > HintMap; HintMap* m_hints = nullptr; unsigned short m_animatorCount = 0; - unsigned short m_statefulCount = 0; + QskAspect::States m_states; }; inline bool QskSkinHintTable::hasHints() const @@ -70,9 +69,9 @@ inline bool QskSkinHintTable::hasHints() const return m_hints != nullptr; } -inline bool QskSkinHintTable::hasStates() const +inline QskAspect::States QskSkinHintTable::states() const { - return m_statefulCount > 0; + return m_states; } inline bool QskSkinHintTable::hasAnimators() const diff --git a/src/controls/QskSkinTransition.cpp b/src/controls/QskSkinTransition.cpp index 9b769199..b96b6753 100644 --- a/src/controls/QskSkinTransition.cpp +++ b/src/controls/QskSkinTransition.cpp @@ -20,6 +20,51 @@ #include #include +static void qskAddCandidates( const QskSkinTransition::Type mask, + const QskSkin* skin, QSet< QskAspect >& candidates ) +{ + for ( const auto& entry : skin->hintTable().hints() ) + { + const auto aspect = entry.first.trunk(); + + if ( aspect.isAnimator() ) + continue; + + bool isCandidate = false; + + switch( aspect.type() ) + { + case QskAspect::Flag: + { + if ( aspect.flagPrimitive() == QskAspect::GraphicRole ) + { + isCandidate = mask & QskSkinTransition::Color; + } +#if 0 + else if ( aspect.flagPrimitive() == QskAspect::FontRole ) + { + isCandidate = mask & QskSkinTransition::Metric; + } +#endif + break; + } + case QskAspect::Color: + { + isCandidate = mask & QskSkinTransition::Color; + break; + } + case QskAspect::Metric: + { + isCandidate = mask & QskSkinTransition::Metric; + break; + } + } + + if ( isCandidate ) + candidates += aspect; + } +} + namespace { class UpdateInfo @@ -40,475 +85,85 @@ namespace int updateModes; }; - class AnimatorCandidate + class HintAnimator : public QskHintAnimator { public: - AnimatorCandidate() = default; - - inline AnimatorCandidate( QskAspect aspect, - const QVariant& from, const QVariant& to ) - : aspect( aspect ) - , from( from ) - , to( to ) + inline HintAnimator( const QskControl* control, const QskAspect aspect, + const QVariant& value1, const QVariant& value2, QskAnimationHint hint ) { - } + setAspect( aspect ); + setStartValue( value1 ); + setEndValue( value2 ); - QskAspect aspect; - QVariant from; - QVariant to; + setDuration( hint.duration ); + setEasingCurve( hint.type ); + setUpdateFlags( hint.updateFlags ); + + setWindow( control->window() ); + } }; -} -static QVector< AnimatorCandidate > qskAnimatorCandidates( - QskSkinTransition::Type mask, - const QskSkinHintTable& oldTable, - const std::unordered_map< int, QskColorFilter >& oldFilters, - const QskSkinHintTable& newTable, - const std::unordered_map< int, QskColorFilter >& newFilters ) -{ - // building a list of candidates for animations by comparing - // the old/new set of skin hints - - const QskColorFilter noFilter; - QVector< AnimatorCandidate > candidates; - - if ( !oldTable.hasHints() ) - return candidates; - - for ( const auto& entry : newTable.hints() ) - { - const auto aspect = entry.first; - - if ( aspect.isAnimator() ) - continue; - - const auto type = aspect.type(); - - if ( type == QskAspect::Flag ) - { - switch ( aspect.flagPrimitive() ) - { - case QskAspect::GraphicRole: - { - if ( !( mask & QskSkinTransition::Color ) ) - continue; - - int role1 = 0; - - const auto value = oldTable.resolvedHint( aspect ); - if ( value ) - role1 = value->toInt(); - - const int role2 = entry.second.toInt(); - - /* - When the role is the same we already have the animators - for the graphic filter table running - */ - if ( role1 != role2 ) - { - const auto it1 = oldFilters.find( role1 ); - const auto it2 = newFilters.find( role2 ); - - if ( it1 != oldFilters.end() || it2 != newFilters.end() ) - { - const auto& f1 = ( it1 != oldFilters.end() ) ? it1->second : noFilter; - const auto& f2 = ( it2 != newFilters.end() ) ? it2->second : noFilter; - - if ( f1 != f2 ) - { - candidates += AnimatorCandidate( aspect, - QVariant::fromValue( f1 ), QVariant::fromValue( f2 ) ); - } - } - } - break; - } - case QskAspect::FontRole: - { - if ( !( mask & QskSkinTransition::Metric ) ) - continue; - - break; - } - default: - ; - } - } - else - { - if ( ( ( type == QskAspect::Color ) && ( mask & QskSkinTransition::Color ) ) || - ( ( type == QskAspect::Metric ) && ( mask & QskSkinTransition::Metric ) ) ) - { - auto value = oldTable.resolvedHint( aspect ); - if ( value == nullptr && aspect.subControl() != QskAspect::Control ) - { - auto a = aspect; - a.setSubControl( QskAspect::Control ); - a.clearStates(); - value = oldTable.resolvedHint( a ); - } - - /* - We are missing transitions, when a hint in newTable - gets resolved from QskControl. TODO ... - */ - if ( value && *value != entry.second ) - candidates += AnimatorCandidate( aspect, *value, entry.second ); - } - } - } - - return candidates; -} - -namespace -{ - class AnimatorGroup + class WindowAnimator { public: - AnimatorGroup( QQuickWindow* window = nullptr ) - : m_window( window ) - { - } + WindowAnimator( QQuickWindow* = nullptr ); - inline const QQuickWindow* window() const - { - return m_window; - } + const QQuickWindow* window() const; - void start() - { - for ( auto& it : m_hintAnimatorMap ) - it.second.start(); + void start(); + bool isRunning() const; - for ( auto& it : m_graphicFilterAnimatorMap ) - it.second.start(); - } + QVariant animatedHint( QskAspect ) const; + QVariant animatedGraphicFilter( int graphicRole ) const; - bool isRunning() const - { - if ( !m_hintAnimatorMap.empty() ) - { - const auto& animator = m_hintAnimatorMap.begin()->second; - if ( animator.isRunning() ) - return true; - } + void addGraphicFilterAnimators( const QskAnimationHint&, + const QskSkin*, const QskSkin* ); - if ( !m_graphicFilterAnimatorMap.empty() ) - { - const auto& animator = m_graphicFilterAnimatorMap.begin()->second; - if ( animator.isRunning() ) - return true; - } + void addItemAspects( QQuickItem*, + const QskAnimationHint&, const QSet< QskAspect >&, + const QskSkin*, const QskSkin* ); - return false; - } - - inline QVariant animatedHint( QskAspect aspect ) const - { - auto it = m_hintAnimatorMap.find( aspect ); - if ( it != m_hintAnimatorMap.cend() ) - { - const auto& animator = it->second; - if ( animator.isRunning() ) - return animator.currentValue(); - } - - return QVariant(); - } - - inline QVariant animatedGraphicFilter( int graphicRole ) const - { - auto it = m_graphicFilterAnimatorMap.find( graphicRole ); - if ( it != m_graphicFilterAnimatorMap.cend() ) - { - const auto& animator = it->second; - if ( animator.isRunning() ) - return animator.currentValue(); - } - - return QVariant(); - } - - void addGraphicFilterAnimators( - const QskAnimationHint& animatorHint, - const std::unordered_map< int, QskColorFilter >& oldFilters, - const std::unordered_map< int, QskColorFilter >& newFilters ) - { - const QskColorFilter noFilter; - - for ( auto it2 = newFilters.begin(); it2 != newFilters.end(); ++it2 ) - { - auto it1 = oldFilters.find( it2->first ); - if ( it1 == oldFilters.cend() ) - it1 = oldFilters.find( 0 ); - - const auto& f1 = ( it1 != oldFilters.cend() ) ? it1->second : noFilter; - const auto& f2 = it2->second; - - if ( f1 != f2 ) - { - QskVariantAnimator animator; - animator.setWindow( m_window ); - animator.setDuration( animatorHint.duration ); - animator.setEasingCurve( animatorHint.type ); - animator.setStartValue( QVariant::fromValue( f1 ) ); - animator.setEndValue( QVariant::fromValue( f2 ) ); - - m_graphicFilterAnimatorMap.emplace( it2->first, animator ); - } - } - } - - void addAnimators( QQuickItem* item, const QskAnimationHint& animatorHint, - const QVector< AnimatorCandidate >& candidates, QskSkin* skin ) - { - if ( !item->isVisible() ) - return; - - if ( auto control = qskControlCast( item ) ) - { - if ( control->isInitiallyPainted() && ( skin == control->effectiveSkin() ) ) - { - addControlAnimators( control, animatorHint, candidates ); -#if 1 - /* - As it is hard to identify which controls depend on the animated - graphic filters we schedule an initial update and let the - controls do the rest: see QskSkinnable::effectiveGraphicFilter - */ - control->update(); -#endif - } - } - - const auto children = item->childItems(); - for ( auto child : children ) - addAnimators( child, animatorHint, candidates, skin ); - } - - void update() - { - for ( auto& info : m_updateInfos ) - { - if ( auto control = info.control ) - { - if ( info.updateModes & UpdateInfo::Polish ) - { - control->resetImplicitSize(); - control->polish(); - } - - if ( info.updateModes & UpdateInfo::Update ) - control->update(); - } - } - } + void update(); private: - void addControlAnimators( QskControl* control, const QskAnimationHint& animatorHint, - const QVector< AnimatorCandidate >& candidates ) - { - const auto subControls = control->subControls(); + bool isControlAffected( const QskControl*, + const QVector< QskAspect::Subcontrol >&, QskAspect ) const; - for ( const auto& candidate : candidates ) - { - if ( !candidate.aspect.isMetric() ) - { - if ( !( control->flags() & QQuickItem::ItemHasContents ) ) - { - // while metrics might have an effect on layouts, we - // can safely ignore others for controls without content - continue; - } - } + void addHints( const QskControl*, + const QskAnimationHint&, const QSet< QskAspect >& candidates, + const QskSkin* skin1, const QskSkin* skin2 ); - const auto subControl = candidate.aspect.subControl(); - if ( subControl != control->effectiveSubcontrol( subControl ) ) - { - // The control uses subcontrol redirection, so we can assume it - // is not interested in this subcontrol. - continue; - } + void storeAnimator( const QskControl*, const QskAspect, + const QVariant&, const QVariant&, QskAnimationHint ); - if ( subControl != QskAspect::Control ) - { - if ( !subControls.contains( subControl ) ) - { - // the control is not interested in the aspect - continue; - } - } - else - { - if ( !control->autoFillBackground() ) - { - // no need to animate the background unless we show it - continue; - } - } - - auto a = candidate.aspect; - a.setStates( control->skinStates() ); - - const auto requestState = control->hintStatus( a ); - - if ( requestState.source != QskSkinHintStatus::Skin ) - { - // The control does not resolve the aspect from the skin. - continue; - } - - if ( candidate.aspect != requestState.aspect ) - { - // the aspect was resolved to something else - continue; - } - - addAnimator( control->window(), candidate, animatorHint ); - storeUpdateInfo( control, candidate.aspect ); - } - } - - void addAnimator( QQuickWindow* window, - const AnimatorCandidate& candidate, QskAnimationHint animationHint ) - { - auto it = m_hintAnimatorMap.find( candidate.aspect ); - if ( it != m_hintAnimatorMap.end() ) - return; // already there - - it = m_hintAnimatorMap.emplace( candidate.aspect, QskHintAnimator() ).first; - auto& animator = it->second; - - animator.setAspect( candidate.aspect ); - animator.setStartValue( candidate.from ); - animator.setEndValue( candidate.to ); - - animator.setDuration( animationHint.duration ); - animator.setEasingCurve( animationHint.type ); - animator.setUpdateFlags( animationHint.updateFlags ); - - animator.setControl( nullptr ); - animator.setWindow( window ); - } - - inline void storeUpdateInfo( QskControl* control, QskAspect aspect ) - { - UpdateInfo info; - info.control = control; - - info.updateModes = UpdateInfo::Update; - if ( aspect.isMetric() ) - info.updateModes |= UpdateInfo::Polish; - - auto it = std::lower_bound( - m_updateInfos.begin(), m_updateInfos.end(), info, UpdateInfo::compare ); - - if ( ( it != m_updateInfos.end() ) && ( it->control == info.control ) ) - it->updateModes |= info.updateModes; - else - m_updateInfos.insert( it, info ); - } + void storeUpdateInfo( const QskControl*, QskAspect ); QQuickWindow* m_window; - std::unordered_map< QskAspect, QskHintAnimator > m_hintAnimatorMap; + std::unordered_map< QskAspect, HintAnimator > m_animatorMap; std::unordered_map< int, QskVariantAnimator > m_graphicFilterAnimatorMap; std::vector< UpdateInfo > m_updateInfos; // vector: for fast iteration }; - class AnimatorGroups : public QObject + class ApplicationAnimator : public QObject { Q_OBJECT public: - ~AnimatorGroups() - { - reset(); - } + ~ApplicationAnimator(); - inline AnimatorGroup* animatorGroup( const QQuickWindow* window ) - { - if ( !m_animatorGroups.empty() && window ) - { - for ( auto group : m_animatorGroups ) - { - if ( group->window() == window ) - return group; - } - } + WindowAnimator* windowAnimator( const QQuickWindow* ); - return nullptr; - } + void add( WindowAnimator* ); - void add( AnimatorGroup* group ) - { - m_animatorGroups.push_back( group ); - } - - void start() - { - m_connections[0] = QskAnimator::addAdvanceHandler( - this, SLOT(notify(QQuickWindow*)), Qt::UniqueConnection ); - - m_connections[1] = QskAnimator::addCleanupHandler( - this, SLOT(cleanup(QQuickWindow*)), Qt::UniqueConnection ); - - for ( auto& group : m_animatorGroups ) - group->start(); - } - - void reset() - { - qDeleteAll( m_animatorGroups ); - m_animatorGroups.clear(); - - disconnect( m_connections[0] ); - disconnect( m_connections[1] ); - } - - inline bool isRunning() const - { - return !m_animatorGroups.empty(); - } + void start(); + void reset(); + bool isRunning() const; private Q_SLOTS: - void notify( QQuickWindow* window ) - { - for ( auto& group : m_animatorGroups ) - { - if ( group->window() == window ) - { - group->update(); - return; - } - } - } - - void cleanup( QQuickWindow* window ) - { - for ( auto it = m_animatorGroups.begin(); - it != m_animatorGroups.end(); ++it ) - { - auto group = *it; - if ( group->window() == window ) - { - if ( !group->isRunning() ) - { - // The notification might be for other animators - - m_animatorGroups.erase( it ); - delete group; - } - - break; - } - } - - if ( m_animatorGroups.empty() ) - reset(); - } + // using functor slots ? + void notify( QQuickWindow* ); + void cleanup( QQuickWindow* ); private: /* @@ -518,12 +173,372 @@ namespace But as skin transitions are no operations, that happen often, we can accept the overhaed of the current implementation and do the finetuning later. */ - std::vector< AnimatorGroup* > m_animatorGroups; + std::vector< WindowAnimator* > m_windowAnimators; QMetaObject::Connection m_connections[2]; }; } -Q_GLOBAL_STATIC( AnimatorGroups, qskSkinAnimator ) +Q_GLOBAL_STATIC( ApplicationAnimator, qskApplicationAnimator ) + +WindowAnimator::WindowAnimator( QQuickWindow* window ) + : m_window( window ) +{ +} + +inline const QQuickWindow* WindowAnimator::window() const +{ + return m_window; +} + +void WindowAnimator::start() +{ + for ( auto& it : m_animatorMap ) + it.second.start(); + + for ( auto& it : m_graphicFilterAnimatorMap ) + it.second.start(); +} + +bool WindowAnimator::isRunning() const +{ + if ( !m_animatorMap.empty() ) + { + const auto& animator = m_animatorMap.begin()->second; + if ( animator.isRunning() ) + return true; + } + + if ( !m_graphicFilterAnimatorMap.empty() ) + { + const auto& animator = m_graphicFilterAnimatorMap.begin()->second; + if ( animator.isRunning() ) + return true; + } + + return false; +} + +inline QVariant WindowAnimator::animatedHint( QskAspect aspect ) const +{ + auto it = m_animatorMap.find( aspect ); + if ( it != m_animatorMap.cend() ) + { + const auto& animator = it->second; + if ( animator.isRunning() ) + return animator.currentValue(); + } + + return QVariant(); +} + +inline QVariant WindowAnimator::animatedGraphicFilter( int graphicRole ) const +{ + auto it = m_graphicFilterAnimatorMap.find( graphicRole ); + if ( it != m_graphicFilterAnimatorMap.cend() ) + { + const auto& animator = it->second; + if ( animator.isRunning() ) + return animator.currentValue(); + } + + return QVariant(); +} + +void WindowAnimator::addGraphicFilterAnimators( const QskAnimationHint& animatorHint, + const QskSkin* skin1, const QskSkin* skin2 ) +{ + const QskColorFilter noFilter; + + const auto& filter1 = skin1->graphicFilters(); + const auto& filter2 = skin2->graphicFilters(); + + for ( auto it2 = filter2.begin(); it2 != filter2.end(); ++it2 ) + { + auto it1 = filter1.find( it2->first ); + if ( it1 == filter1.cend() ) + it1 = filter1.find( 0 ); + + const auto& f1 = ( it1 != filter1.cend() ) ? it1->second : noFilter; + const auto& f2 = it2->second; + + if ( f1 != f2 ) + { + QskVariantAnimator animator; + animator.setWindow( m_window ); + animator.setDuration( animatorHint.duration ); + animator.setEasingCurve( animatorHint.type ); + animator.setStartValue( QVariant::fromValue( f1 ) ); + animator.setEndValue( QVariant::fromValue( f2 ) ); + + m_graphicFilterAnimatorMap.emplace( it2->first, animator ); + } + } +} + +void WindowAnimator::addItemAspects( QQuickItem* item, + const QskAnimationHint& animatorHint, const QSet< QskAspect >& candidates, + const QskSkin* skin1, const QskSkin* skin2 ) +{ + if ( !item->isVisible() ) + return; + + if ( auto control = qskControlCast( item ) ) + { + if ( control->isInitiallyPainted() && ( control->effectiveSkin() == skin2 ) ) + { + addHints( control, animatorHint, candidates, skin1, skin2 ); +#if 1 + /* + As it is hard to identify which controls depend on the animated + graphic filters we schedule an initial update and let the + controls do the rest: see QskSkinnable::effectiveGraphicFilter + */ + control->update(); +#endif + } + } + + const auto children = item->childItems(); + for ( auto child : children ) + addItemAspects( child, animatorHint, candidates, skin1, skin2 ); +} + +void WindowAnimator::update() +{ + for ( auto& info : m_updateInfos ) + { + if ( auto control = info.control ) + { + if ( info.updateModes & UpdateInfo::Polish ) + { + control->resetImplicitSize(); + control->polish(); + } + + if ( info.updateModes & UpdateInfo::Update ) + control->update(); + } + } +} + +void WindowAnimator::addHints( const QskControl* control, + const QskAnimationHint& animatorHint, const QSet< QskAspect >& candidates, + const QskSkin* skin1, const QskSkin* skin2 ) +{ + const auto subControls = control->subControls(); + + const auto& localTable = control->hintTable(); + + const auto& table1 = skin1->hintTable(); + const auto& table2 = skin2->hintTable(); + + for ( auto aspect : candidates ) + { + if ( !isControlAffected( control, subControls, aspect ) ) + continue; + + aspect.setPlacement( control->effectivePlacement() ); + aspect.setStates( control->skinStates() ); + + if ( localTable.resolvedHint( aspect ) ) + { + // value is not from the skin - ignored + continue; + } + + QskAspect r1, r2; + + const auto v1 = table1.resolvedHint( aspect, &r1 ); + const auto v2 = table2.resolvedHint( aspect, &r2 ); + + if ( v1 && v2 ) + { + if ( QskVariantAnimator::maybeInterpolate( *v1, *v2 ) ) + { + if ( r1.placement() == r2.placement() ) + aspect.setPlacement( r2.placement() ); + + if ( r1.states() == r2.states() ) + aspect.setStates( r2.states() ); + + storeAnimator( control, aspect, *v1, *v2, animatorHint ); + storeUpdateInfo( control, aspect ); + } + } + else if ( v1 ) + { + aspect.setPlacement( r1.placement() ); + aspect.setStates( r1.states() ); + + storeAnimator( control, aspect, *v1, QVariant(), animatorHint ); + storeUpdateInfo( control, aspect ); + } + else if ( v2 ) + { + aspect.setPlacement( r1.placement() ); + aspect.setStates( r1.states() ); + + storeAnimator( control, aspect, QVariant(), *v2, animatorHint ); + storeUpdateInfo( control, aspect ); + } + } +} + +inline bool WindowAnimator::isControlAffected( const QskControl* control, + const QVector< QskAspect::Subcontrol >& subControls, const QskAspect aspect ) const +{ + if ( !aspect.isMetric() ) + { + if ( !( control->flags() & QQuickItem::ItemHasContents ) ) + { + // while metrics might have an effect on layouts, we + // ignore all others for controls without content + return false; + } + } + + const auto subControl = aspect.subControl(); + if ( subControl != control->effectiveSubcontrol( subControl ) ) + { + // The control uses subcontrol redirection, so we can assume it + // is not interested in this subcontrol. + + return false; + } + + if ( subControl == QskAspect::Control ) + { + if ( !control->autoFillBackground() ) + { + // no need to animate the background unless we show it + return false; + } + } + else + { + if ( !subControls.contains( subControl ) ) + { + // the control is not interested in the aspect + return false; + } + } + + return true; +} + +inline void WindowAnimator::storeAnimator( const QskControl* control, const QskAspect aspect, + const QVariant& value1, const QVariant& value2, QskAnimationHint hint ) +{ + if ( m_animatorMap.find( aspect ) == m_animatorMap.cend() ) + { + m_animatorMap.emplace( aspect, + HintAnimator( control, aspect, value1, value2, hint ) ); + } +} + +inline void WindowAnimator::storeUpdateInfo( const QskControl* control, QskAspect aspect ) +{ + UpdateInfo info; + info.control = const_cast< QskControl* >( control ); + + info.updateModes = UpdateInfo::Update; + if ( aspect.isMetric() ) + info.updateModes |= UpdateInfo::Polish; + + auto it = std::lower_bound( + m_updateInfos.begin(), m_updateInfos.end(), info, UpdateInfo::compare ); + + if ( ( it != m_updateInfos.end() ) && ( it->control == info.control ) ) + it->updateModes |= info.updateModes; + else + m_updateInfos.insert( it, info ); +} + +ApplicationAnimator::~ApplicationAnimator() +{ + reset(); +} + +inline WindowAnimator* ApplicationAnimator::windowAnimator( const QQuickWindow* window ) +{ + if ( window ) + { + for ( auto animator : m_windowAnimators ) + { + if ( animator->window() == window ) + return animator; + } + } + + return nullptr; +} + +void ApplicationAnimator::add( WindowAnimator* animator ) +{ + m_windowAnimators.push_back( animator ); +} + +void ApplicationAnimator::start() +{ + m_connections[0] = QskAnimator::addAdvanceHandler( + this, SLOT(notify(QQuickWindow*)), Qt::UniqueConnection ); + + m_connections[1] = QskAnimator::addCleanupHandler( + this, SLOT(cleanup(QQuickWindow*)), Qt::UniqueConnection ); + + for ( auto& animator : m_windowAnimators ) + animator->start(); +} + +void ApplicationAnimator::reset() +{ + qDeleteAll( m_windowAnimators ); + m_windowAnimators.clear(); + + disconnect( m_connections[0] ); + disconnect( m_connections[1] ); +} + +inline bool ApplicationAnimator::isRunning() const +{ + return !m_windowAnimators.empty(); +} + +void ApplicationAnimator::notify( QQuickWindow* window ) +{ + for ( auto& animator : m_windowAnimators ) + { + if ( animator->window() == window ) + { + animator->update(); + return; + } + } +} + +void ApplicationAnimator::cleanup( QQuickWindow* window ) +{ + for ( auto it = m_windowAnimators.begin(); + it != m_windowAnimators.end(); ++it ) + { + auto animator = *it; + if ( animator->window() == window ) + { + if ( !animator->isRunning() ) + { + // The notification might be for other animators + + m_windowAnimators.erase( it ); + delete animator; + } + + break; + } + } + + if ( m_windowAnimators.empty() ) + reset(); +} class QskSkinTransition::PrivateData { @@ -589,38 +604,20 @@ void QskSkinTransition::updateSkin( QskSkin*, QskSkin* ) void QskSkinTransition::process() { - auto skinFrom = m_data->skins[ 0 ]; - auto skinTo = m_data->skins[ 1 ]; + qskApplicationAnimator->reset(); - if ( ( skinFrom == nullptr ) || ( skinTo == nullptr ) ) + auto skin1 = m_data->skins[ 0 ]; + auto skin2 = m_data->skins[ 1 ]; + + QSet< QskAspect > candidates; + + if ( skin1 && skin2 ) { - // do nothing - return; - } - - qskSkinAnimator->reset(); - - if ( ( m_data->animationHint.duration <= 0 ) || ( m_data->mask == 0 ) ) - { - // no animations, we can apply the changes - updateSkin( skinFrom, skinTo ); - return; - } - - QVector< AnimatorCandidate > candidates; - const auto oldFilters = skinFrom->graphicFilters(); - - { - // copy out all hints before updating the skin - // - would be good to have Copy on Write here - - const auto oldTable = skinFrom->hintTable(); - - // apply the changes - updateSkin( skinFrom, skinTo ); - - candidates = qskAnimatorCandidates( m_data->mask, oldTable, oldFilters, - skinTo->hintTable(), skinTo->graphicFilters() ); + if ( ( m_data->animationHint.duration > 0 ) && ( m_data->mask != 0 ) ) + { + qskAddCandidates( m_data->mask, skin1, candidates ); + qskAddCandidates( m_data->mask, skin2, candidates ); + } } if ( !candidates.isEmpty() ) @@ -631,21 +628,19 @@ void QskSkinTransition::process() for ( const auto window : windows ) { - if ( auto quickWindow = qobject_cast< QQuickWindow* >( window ) ) + if ( auto w = qobject_cast< QQuickWindow* >( window ) ) { - if ( !quickWindow->isVisible() || - ( qskEffectiveSkin( quickWindow ) != skinTo ) ) + if ( !w->isVisible() || ( qskEffectiveSkin( w ) != skin2 ) ) { continue; } - auto group = new AnimatorGroup( quickWindow ); + auto animator = new WindowAnimator( w ); if ( doGraphicFilter ) { - group->addGraphicFilterAnimators( - m_data->animationHint, oldFilters, - skinTo->graphicFilters() ); + animator->addGraphicFilterAnimators( + m_data->animationHint, skin1, skin2 ); doGraphicFilter = false; } @@ -655,21 +650,24 @@ void QskSkinTransition::process() over the the item trees. */ - group->addAnimators( quickWindow->contentItem(), - m_data->animationHint, candidates, skinTo ); + animator->addItemAspects( w->contentItem(), + m_data->animationHint, candidates, skin1, skin2 ); - qskSkinAnimator->add( group ); + qskApplicationAnimator->add( animator ); } } - qskSkinAnimator->start(); + qskApplicationAnimator->start(); } + + // apply the changes + updateSkin( skin1, skin2 ); } bool QskSkinTransition::isRunning() { - if ( qskSkinAnimator.exists() ) - return qskSkinAnimator->isRunning(); + if ( qskApplicationAnimator.exists() ) + return qskApplicationAnimator->isRunning(); return false; } @@ -677,10 +675,10 @@ bool QskSkinTransition::isRunning() QVariant QskSkinTransition::animatedHint( const QQuickWindow* window, QskAspect aspect ) { - if ( qskSkinAnimator.exists() ) + if ( qskApplicationAnimator.exists() ) { - if ( const auto group = qskSkinAnimator->animatorGroup( window ) ) - return group->animatedHint( aspect ); + if ( const auto animator = qskApplicationAnimator->windowAnimator( window ) ) + return animator->animatedHint( aspect ); } return QVariant(); @@ -689,10 +687,10 @@ QVariant QskSkinTransition::animatedHint( QVariant QskSkinTransition::animatedGraphicFilter( const QQuickWindow* window, int graphicRole ) { - if ( qskSkinAnimator.exists() ) + if ( qskApplicationAnimator.exists() ) { - if ( const auto group = qskSkinAnimator->animatorGroup( window ) ) - return group->animatedGraphicFilter( graphicRole ); + if ( const auto animator = qskApplicationAnimator->windowAnimator( window ) ) + return animator->animatedGraphicFilter( graphicRole ); } return QVariant(); diff --git a/src/controls/QskSkinnable.cpp b/src/controls/QskSkinnable.cpp index 1268fcde..15d8b0b5 100644 --- a/src/controls/QskSkinnable.cpp +++ b/src/controls/QskSkinnable.cpp @@ -38,17 +38,6 @@ static inline bool qskIsControl( const QskSkinnable* skinnable ) return skinnable->metaObject()->inherits( &QskControl::staticMetaObject ); } -static inline QVariant qskTypedNullValue( const QVariant& value ) -{ -#if QT_VERSION >= QT_VERSION_CHECK( 6, 0, 0 ) - const auto vType = static_cast< QMetaType >( value.userType() ); -#else - const auto vType = value.userType(); -#endif - - return QVariant( vType, nullptr ); -} - static inline bool qskSetFlag( QskSkinnable* skinnable, const QskAspect aspect, int flag ) { @@ -940,23 +929,12 @@ const QVariant& QskSkinnable::storedHint( { const auto skin = effectiveSkin(); - // clearing all state bits not being handled from the skin - aspect.clearStates( ~skin->stateMask() ); - QskAspect resolvedAspect; const auto& localTable = m_data->hintTable; if ( localTable.hasHints() ) { - auto a = aspect; - - if ( !localTable.hasStates() ) - { - // we don't need to clear the state bits stepwise - a.clearStates(); - } - - if ( const QVariant* value = localTable.resolvedHint( a, &resolvedAspect ) ) + if ( const auto value = localTable.resolvedHint( aspect, &resolvedAspect ) ) { if ( status ) { @@ -972,10 +950,7 @@ const QVariant& QskSkinnable::storedHint( const auto& skinTable = skin->hintTable(); if ( skinTable.hasHints() ) { - auto a = aspect; - - const QVariant* value = skinTable.resolvedHint( a, &resolvedAspect ); - if ( value ) + if ( const auto value = skinTable.resolvedHint( aspect, &resolvedAspect ) ) { if ( status ) { @@ -993,8 +968,7 @@ const QVariant& QskSkinnable::storedHint( aspect.setSubControl( QskAspect::Control ); aspect.clearStates(); - value = skinTable.resolvedHint( aspect, &resolvedAspect ); - if ( value ) + if ( const auto value = skinTable.resolvedHint( aspect, &resolvedAspect ) ) { if ( status ) { @@ -1171,27 +1145,11 @@ void QskSkinnable::startHintTransition( QskAspect aspect, if ( control->window() == nullptr || !isTransitionAccepted( aspect ) ) return; - /* - We might be invalid for one of the values, when an aspect - has not been defined for all states ( f.e. metrics are expected - to fallback to 0.0 ). In this case we create a default one. - */ - auto v1 = from; auto v2 = to; - if ( !v1.isValid() ) - { - v1 = qskTypedNullValue( v2 ); - } - else if ( !v2.isValid() ) - { - v2 = qskTypedNullValue( v1 ); - } - else if ( v1.userType() != v2.userType() ) - { + if ( !QskVariantAnimator::convertValues( v1, v2 ) ) return; - } if ( aspect.flagPrimitive() == QskAspect::GraphicRole ) { @@ -1257,7 +1215,8 @@ void QskSkinnable::setSkinStates( QskAspect::States newStates ) if ( skin ) { - const auto mask = skin->stateMask(); + const auto mask = skin->hintTable().states() | m_data->hintTable.states(); + if ( ( newStates & mask ) == ( m_data->skinStates & mask ) ) { // the modified bits are not handled by the skin @@ -1297,24 +1256,13 @@ void QskSkinnable::setSkinStates( QskAspect::States newStates ) const auto primitive = static_cast< QskAspect::Primitive >( i ); aspect.setPrimitive( type, primitive ); - auto a1 = aspect | m_data->skinStates; - auto a2 = aspect | newStates; + const auto a1 = aspect | m_data->skinStates; + const auto a2 = aspect | newStates; bool doTransition = true; - if ( !m_data->hintTable.hasStates() ) - { - /* - The hints are found by stripping the state bits one by - one until a lookup into the hint table is successful. - So for deciding whether two aspects lead to the same hint - we can stop as soon as the aspects have the same state bits. - This way we can reduce the number of lookups significantly - for skinnables with many state bits. - - */ + if ( m_data->hintTable.states() == QskAspect::NoState ) doTransition = !skinTable.isResolutionMatching( a1, a2 ); - } if ( doTransition ) { @@ -1343,12 +1291,7 @@ QskSkin* QskSkinnable::effectiveSkin() const if ( skin == nullptr ) { if ( const auto control = owningControl() ) - { - if ( auto window = qobject_cast< const QskWindow* >( control->window() ) ) - { - skin = window->skin(); - } - } + skin = qskEffectiveSkin( control->window() ); } return skin ? skin : qskSetup->skin(); diff --git a/src/controls/QskSkinnable.h b/src/controls/QskSkinnable.h index b73ea956..97324e2c 100644 --- a/src/controls/QskSkinnable.h +++ b/src/controls/QskSkinnable.h @@ -230,6 +230,8 @@ class QSK_EXPORT QskSkinnable bool resetGraphicRoleHint( QskAspect ); int graphicRoleHint( QskAspect, QskSkinHintStatus* = nullptr ) const; + const QskSkinHintTable& hintTable() const; + protected: virtual void updateNode( QSGNode* ); virtual bool isTransitionAccepted( QskAspect ) const; @@ -237,7 +239,6 @@ class QSK_EXPORT QskSkinnable virtual QskAspect::Subcontrol substitutedSubcontrol( QskAspect::Subcontrol ) const; QskSkinHintTable& hintTable(); - const QskSkinHintTable& hintTable() const; private: Q_DISABLE_COPY( QskSkinnable ) diff --git a/src/controls/QskVariantAnimator.cpp b/src/controls/QskVariantAnimator.cpp index 6372fbf0..a23fd356 100644 --- a/src/controls/QskVariantAnimator.cpp +++ b/src/controls/QskVariantAnimator.cpp @@ -76,6 +76,31 @@ QSK_DECL_INSANE static inline QVariant qskInterpolate( return f( from.constData(), to.constData(), progress ); } +#if QT_VERSION < QT_VERSION_CHECK( 6, 0, 0 ) + +using QskMetaType = int; +static inline QskMetaType qskMetaType( const QVariant& v ) { return v.userType(); } + +#else + +using QskMetaType = QMetaType; +static inline QskMetaType qskMetaType( const QVariant& v ) { return v.metaType(); } + +#endif + +static inline QVariant qskDefaultVariant( QskMetaType type ) +{ + return QVariant( type, nullptr ); +} + +static inline QVariant qskConvertedVariant( const QVariant& from, QskMetaType type ) +{ + auto v = from; + v.convert( type ); + + return v; +} + QskVariantAnimator::QskVariantAnimator() : m_interpolator( nullptr ) { @@ -100,16 +125,60 @@ void QskVariantAnimator::setCurrentValue( const QVariant& value ) m_currentValue = value; } +bool QskVariantAnimator::convertValues( QVariant& v1, QVariant& v2 ) +{ + if ( !v1.isValid() && !v2.isValid() ) + return false; + + const auto type1 = qskMetaType( v1 ); + const auto type2 = qskMetaType( v2 ); + + if ( !v1.isValid() ) + { + v1 = qskDefaultVariant( type2 ); + return true; + } + + if ( !v2.isValid() ) + { + v2 = qskDefaultVariant( type1 ); + return true; + } + + if ( type1 != type2 ) + { + if ( v1.canConvert( type2 ) ) + { + v1.convert( type2 ); + return true; + } + + if ( v2.canConvert( type1 ) ) + { + v2.convert( type1 ); + return true; + } + + return false; + } + + return true; +} + void QskVariantAnimator::setup() { m_interpolator = nullptr; - const auto type = m_startValue.userType(); - if ( type == m_endValue.userType() ) + if ( convertValues( m_startValue, m_endValue ) ) { - // all what has been registered by qRegisterAnimationInterpolator - m_interpolator = reinterpret_cast< void ( * )() >( - QVariantAnimationPrivate::getInterpolator( type ) ); + if ( m_startValue != m_endValue ) + { + const auto id = m_startValue.userType(); + + // all what has been registered by qRegisterAnimationInterpolator + m_interpolator = reinterpret_cast< void ( * )() >( + QVariantAnimationPrivate::getInterpolator( id ) ); + } } m_currentValue = m_interpolator ? m_startValue : m_endValue; @@ -131,3 +200,32 @@ void QskVariantAnimator::done() { m_interpolator = nullptr; } + +bool QskVariantAnimator::maybeInterpolate( + const QVariant& value1, const QVariant& value2 ) +{ + if ( !value1.isValid() && !value2.isValid() ) + return false; + + const auto type1 = qskMetaType( value1 ); + const auto type2 = qskMetaType( value2 ); + + if ( !value1.isValid() ) + return value2 != qskDefaultVariant( type2 ); + + if ( !value2.isValid() ) + return value1 != qskDefaultVariant( type1 ); + + if ( type1 != type2 ) + { + if ( value1.canConvert( type2 ) ) + return value2 != qskConvertedVariant( value1, type2 ); + + if ( value2.canConvert( type1 ) ) + return value1 != qskConvertedVariant( value2, type1 ); + + return false; + } + + return value1 != value2; +} diff --git a/src/controls/QskVariantAnimator.h b/src/controls/QskVariantAnimator.h index 1507670d..9e036b06 100644 --- a/src/controls/QskVariantAnimator.h +++ b/src/controls/QskVariantAnimator.h @@ -24,6 +24,9 @@ class QSK_EXPORT QskVariantAnimator : public QskAnimator void setEndValue( const QVariant& ); QVariant endValue() const; + static bool maybeInterpolate( const QVariant&, const QVariant& ); + static bool convertValues( QVariant&, QVariant& ); + protected: void setup() override; void advance( qreal value ) override; diff --git a/src/src.pro b/src/src.pro index a25be7da..0c00a0ec 100644 --- a/src/src.pro +++ b/src/src.pro @@ -63,7 +63,6 @@ SOURCES += \ common/QskScaleTickmarks.cpp \ common/QskShadowMetrics.cpp \ common/QskSizePolicy.cpp \ - common/QskStateCombination.cpp \ common/QskTextColors.cpp \ common/QskTextOptions.cpp diff --git a/support/SkinnyShortcut.cpp b/support/SkinnyShortcut.cpp index 670405ca..582827fb 100644 --- a/support/SkinnyShortcut.cpp +++ b/support/SkinnyShortcut.cpp @@ -77,30 +77,31 @@ void SkinnyShortcut::enable( Types types ) void SkinnyShortcut::rotateSkin() { - const QStringList names = qskSkinManager->skinNames(); + const auto names = qskSkinManager->skinNames(); if ( names.size() <= 1 ) return; int index = names.indexOf( qskSetup->skinName() ); index = ( index + 1 ) % names.size(); - QskSkin* oldSkin = qskSetup->skin(); + auto oldSkin = qskSetup->skin(); if ( oldSkin->parent() == qskSetup ) oldSkin->setParent( nullptr ); // otherwise setSkin deletes it - QskSkin* newSkin = qskSetup->setSkin( names[ index ] ); + if ( auto newSkin = qskSetup->setSkin( names[ index ] ) ) + { + QskSkinTransition transition; - QskSkinTransition transition; + //transition.setMask( QskAspect::Color ); // Metrics are flickering -> TODO + transition.setSourceSkin( oldSkin ); + transition.setTargetSkin( newSkin ); + transition.setAnimation( 500 ); - //transition.setMask( QskAspect::Color ); // Metrics are flickering -> TODO - transition.setSourceSkin( oldSkin ); - transition.setTargetSkin( newSkin ); - transition.setAnimation( 500 ); + transition.process(); - transition.process(); - - if ( oldSkin->parent() == nullptr ) - delete oldSkin; + if ( oldSkin->parent() == nullptr ) + delete oldSkin; + } } void SkinnyShortcut::showBackground() From 6f814edaec0fec7d58d8aa48ef2e20d33c48248c Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Fri, 1 Apr 2022 16:10:53 +0200 Subject: [PATCH 04/70] SwitchButtonPage moved to ButtonPage --- examples/gallery/button/ButtonPage.cpp | 54 ++++++++++++++++++++++++++ examples/gallery/button/ButtonPage.h | 17 ++++++++ 2 files changed, 71 insertions(+) create mode 100644 examples/gallery/button/ButtonPage.cpp create mode 100644 examples/gallery/button/ButtonPage.h diff --git a/examples/gallery/button/ButtonPage.cpp b/examples/gallery/button/ButtonPage.cpp new file mode 100644 index 00000000..a0247c27 --- /dev/null +++ b/examples/gallery/button/ButtonPage.cpp @@ -0,0 +1,54 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the 3-clause BSD License + *****************************************************************************/ + +#include "ButtonPage.h" + +#include +#include +#include +#include + +#include + +ButtonPage::ButtonPage( QQuickItem* parent ) + : Page( Qt::Horizontal, parent ) +{ + setSpacing( 40 ); + populate(); +} + +void ButtonPage::populate() +{ + auto hbox1 = new QskLinearBox(); + hbox1->setSizePolicy( Qt::Vertical, QskSizePolicy::Fixed ); + hbox1->setExtraSpacingAt( Qt::LeftEdge ); + + auto label = new QskTextLabel( "Disable the switches:", hbox1 ); + label->setSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::Fixed ); + + auto button0 = new QskSwitchButton( hbox1 ); + + auto hbox2 = new QskLinearBox( Qt::Horizontal ); + hbox2->setDefaultAlignment( Qt::AlignHCenter | Qt::AlignTop ); + hbox2->setMargins( 30 ); + + (void) new QskSwitchButton( Qt::Vertical, hbox2 ); + (void) new QskSwitchButton( Qt::Horizontal, hbox2 ); + + auto button3 = new QskSwitchButton( Qt::Vertical, hbox2 ); + button3->setInverted( true ); + + auto button4 = new QskSwitchButton( Qt::Horizontal, hbox2 ); + button4->setInverted( true ); + + auto vbox = new QskLinearBox( Qt::Vertical, this ); + vbox->addItem( hbox1 ); + vbox->addItem( new QskSeparator() ); + vbox->addItem( hbox2 ); + vbox->setExtraSpacingAt( Qt::BottomEdge ); + + QObject::connect( button0, &QskSwitchButton::checkedChanged, + hbox2, &QskQuickItem::setDisabled ); +} diff --git a/examples/gallery/button/ButtonPage.h b/examples/gallery/button/ButtonPage.h new file mode 100644 index 00000000..ad7cad86 --- /dev/null +++ b/examples/gallery/button/ButtonPage.h @@ -0,0 +1,17 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the 3-clause BSD License + *****************************************************************************/ + +#pragma once + +#include "Page.h" + +class ButtonPage : public Page +{ + public: + ButtonPage( QQuickItem* = nullptr ); + + private: + void populate(); +}; From c4ba1d320f52fb33bef9a89fbca5e95c757e00a3 Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Fri, 1 Apr 2022 16:18:30 +0200 Subject: [PATCH 05/70] wio --- examples/gallery/button/ButtonPage.cpp | 42 ++++++++++----- examples/gallery/gallery.pro | 4 +- examples/gallery/main.cpp | 4 +- .../gallery/switchbutton/SwitchButtonPage.cpp | 54 ------------------- .../gallery/switchbutton/SwitchButtonPage.h | 17 ------ 5 files changed, 34 insertions(+), 87 deletions(-) delete mode 100644 examples/gallery/switchbutton/SwitchButtonPage.cpp delete mode 100644 examples/gallery/switchbutton/SwitchButtonPage.h diff --git a/examples/gallery/button/ButtonPage.cpp b/examples/gallery/button/ButtonPage.cpp index a0247c27..267a0899 100644 --- a/examples/gallery/button/ButtonPage.cpp +++ b/examples/gallery/button/ButtonPage.cpp @@ -12,6 +12,35 @@ #include +namespace +{ + class ButtonBox : public QskLinearBox + { + public: + ButtonBox( QQuickItem* parent = nullptr ) + : QskLinearBox( Qt::Horizontal, parent ) + { + setDefaultAlignment( Qt::AlignHCenter | Qt::AlignTop ); + setMargins( 30 ); + + populate(); + } + + private: + void populate() + { + (void) new QskSwitchButton( Qt::Vertical, this ); + (void) new QskSwitchButton( Qt::Horizontal, this ); + + auto button3 = new QskSwitchButton( Qt::Vertical, this ); + button3->setInverted( true ); + + auto button4 = new QskSwitchButton( Qt::Horizontal, this ); + button4->setInverted( true ); + } + }; +} + ButtonPage::ButtonPage( QQuickItem* parent ) : Page( Qt::Horizontal, parent ) { @@ -30,18 +59,7 @@ void ButtonPage::populate() auto button0 = new QskSwitchButton( hbox1 ); - auto hbox2 = new QskLinearBox( Qt::Horizontal ); - hbox2->setDefaultAlignment( Qt::AlignHCenter | Qt::AlignTop ); - hbox2->setMargins( 30 ); - - (void) new QskSwitchButton( Qt::Vertical, hbox2 ); - (void) new QskSwitchButton( Qt::Horizontal, hbox2 ); - - auto button3 = new QskSwitchButton( Qt::Vertical, hbox2 ); - button3->setInverted( true ); - - auto button4 = new QskSwitchButton( Qt::Horizontal, hbox2 ); - button4->setInverted( true ); + auto hbox2 = new ButtonBox(); auto vbox = new QskLinearBox( Qt::Vertical, this ); vbox->addItem( hbox1 ); diff --git a/examples/gallery/gallery.pro b/examples/gallery/gallery.pro index 75cd1071..2c1eedb3 100644 --- a/examples/gallery/gallery.pro +++ b/examples/gallery/gallery.pro @@ -25,10 +25,10 @@ SOURCES += \ progressbar/ProgressBarPage.cpp \ HEADERS += \ - switchbutton/SwitchButtonPage.h + button/ButtonPage.h SOURCES += \ - switchbutton/SwitchButtonPage.cpp \ + button/ButtonPage.cpp \ HEADERS += \ Page.h diff --git a/examples/gallery/main.cpp b/examples/gallery/main.cpp index 838d9106..869f06ac 100644 --- a/examples/gallery/main.cpp +++ b/examples/gallery/main.cpp @@ -6,7 +6,7 @@ #include "label/LabelPage.h" #include "progressbar/ProgressBarPage.h" #include "slider/SliderPage.h" -#include "switchbutton/SwitchButtonPage.h" +#include "button/ButtonPage.h" #include #include @@ -52,7 +52,7 @@ int main( int argc, char* argv[] ) tabView->addTab( "Labels", new LabelPage() ); tabView->addTab( "Sliders", new SliderPage() ); tabView->addTab( "Progress\nBars", new ProgressBarPage() ); - tabView->addTab( "Switches", new SwitchButtonPage() ); + tabView->addTab( "Buttons", new ButtonPage() ); QSize size( 800, 600 ); size = size.expandedTo( tabView->sizeHint().toSize() ); diff --git a/examples/gallery/switchbutton/SwitchButtonPage.cpp b/examples/gallery/switchbutton/SwitchButtonPage.cpp deleted file mode 100644 index 1fab35b1..00000000 --- a/examples/gallery/switchbutton/SwitchButtonPage.cpp +++ /dev/null @@ -1,54 +0,0 @@ -/****************************************************************************** - * QSkinny - Copyright (C) 2016 Uwe Rathmann - * This file may be used under the terms of the 3-clause BSD License - *****************************************************************************/ - -#include "SwitchButtonPage.h" - -#include -#include -#include -#include - -#include - -SwitchButtonPage::SwitchButtonPage( QQuickItem* parent ) - : Page( Qt::Horizontal, parent ) -{ - setSpacing( 40 ); - populate(); -} - -void SwitchButtonPage::populate() -{ - auto hbox1 = new QskLinearBox(); - hbox1->setSizePolicy( Qt::Vertical, QskSizePolicy::Fixed ); - hbox1->setExtraSpacingAt( Qt::LeftEdge ); - - auto label = new QskTextLabel( "Disable the switches:", hbox1 ); - label->setSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::Fixed ); - - auto button0 = new QskSwitchButton( hbox1 ); - - auto hbox2 = new QskLinearBox( Qt::Horizontal ); - hbox2->setDefaultAlignment( Qt::AlignHCenter | Qt::AlignTop ); - hbox2->setMargins( 30 ); - - (void) new QskSwitchButton( Qt::Vertical, hbox2 ); - (void) new QskSwitchButton( Qt::Horizontal, hbox2 ); - - auto button3 = new QskSwitchButton( Qt::Vertical, hbox2 ); - button3->setInverted( true ); - - auto button4 = new QskSwitchButton( Qt::Horizontal, hbox2 ); - button4->setInverted( true ); - - auto vbox = new QskLinearBox( Qt::Vertical, this ); - vbox->addItem( hbox1 ); - vbox->addItem( new QskSeparator() ); - vbox->addItem( hbox2 ); - vbox->setExtraSpacingAt( Qt::BottomEdge ); - - QObject::connect( button0, &QskSwitchButton::checkedChanged, - hbox2, &QskQuickItem::setDisabled ); -} diff --git a/examples/gallery/switchbutton/SwitchButtonPage.h b/examples/gallery/switchbutton/SwitchButtonPage.h deleted file mode 100644 index 377092da..00000000 --- a/examples/gallery/switchbutton/SwitchButtonPage.h +++ /dev/null @@ -1,17 +0,0 @@ -/****************************************************************************** - * QSkinny - Copyright (C) 2016 Uwe Rathmann - * This file may be used under the terms of the 3-clause BSD License - *****************************************************************************/ - -#pragma once - -#include "Page.h" - -class SwitchButtonPage : public Page -{ - public: - SwitchButtonPage( QQuickItem* = nullptr ); - - private: - void populate(); -}; From bf2ad4ee13ce8cbc9bef879ac0dd51064b69b4ac Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Fri, 1 Apr 2022 17:00:50 +0200 Subject: [PATCH 06/70] merge from master --- examples/automotive/main.cpp | 2 - examples/boxes/main.cpp | 2 - examples/buttons/main.cpp | 2 - examples/colorswitch/main.cpp | 2 - examples/gallery/button/ButtonPage.cpp | 82 +++++++----- examples/gallery/label/LabelPage.cpp | 48 +++++-- examples/gallery/main.cpp | 89 +++++++++++-- examples/iotdashboard/main.cpp | 3 - examples/layouts/main.cpp | 2 - examples/listbox/main.cpp | 2 - examples/messagebox/main.cpp | 2 - examples/messageboxQml/main.cpp | 2 - examples/mycontrols/main.cpp | 2 - examples/qvgviewer/main.cpp | 2 - examples/tabview/main.cpp | 2 - playground/anchors/main.cpp | 2 - playground/dialogbuttons/main.cpp | 2 - playground/grids/main.cpp | 11 -- playground/images/images.qml | 3 +- playground/inputpanel/main.cpp | 2 - playground/webview/main.cpp | 2 - skins/squiek/QskSquiekSkin.cpp | 2 +- src/common/QskAspect.cpp | 2 +- src/controls/QskSkin.cpp | 8 +- support/SkinnyFont.cpp | 43 ------ support/SkinnyGlobal.h | 17 +-- support/SkinnyNamespace.cpp | 140 ++++++++++++++++++++ support/{SkinnyFont.h => SkinnyNamespace.h} | 13 +- support/SkinnyShapeFactory.h | 5 +- support/SkinnyShapeProvider.h | 5 +- support/SkinnyShortcut.cpp | 72 +--------- support/SkinnyShortcut.h | 7 +- support/support.pro | 4 +- 33 files changed, 333 insertions(+), 251 deletions(-) delete mode 100644 support/SkinnyFont.cpp create mode 100644 support/SkinnyNamespace.cpp rename support/{SkinnyFont.h => SkinnyNamespace.h} (63%) diff --git a/examples/automotive/main.cpp b/examples/automotive/main.cpp index ed93e224..d4fd90f2 100644 --- a/examples/automotive/main.cpp +++ b/examples/automotive/main.cpp @@ -7,7 +7,6 @@ #include "SkinFactory.h" #include -#include #include #include @@ -33,7 +32,6 @@ int main( int argc, char** argv ) */ qskSetup->setItemUpdateFlag( QskQuickItem::PreferRasterForTextures, true ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); MainWindow window; diff --git a/examples/boxes/main.cpp b/examples/boxes/main.cpp index bfe8678d..95261fc2 100644 --- a/examples/boxes/main.cpp +++ b/examples/boxes/main.cpp @@ -5,7 +5,6 @@ #include "Box.h" -#include #include #include @@ -555,7 +554,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::Quit | SkinnyShortcut::DebugShortcuts ); auto* tabView = new TabView(); diff --git a/examples/buttons/main.cpp b/examples/buttons/main.cpp index 26ee773f..373e695d 100644 --- a/examples/buttons/main.cpp +++ b/examples/buttons/main.cpp @@ -3,7 +3,6 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#include #include #include @@ -24,7 +23,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); QQmlApplicationEngine engine( QUrl( "qrc:/qml/buttons.qml" ) ); diff --git a/examples/colorswitch/main.cpp b/examples/colorswitch/main.cpp index 59a1361a..00d69450 100644 --- a/examples/colorswitch/main.cpp +++ b/examples/colorswitch/main.cpp @@ -5,7 +5,6 @@ #include "Theme.h" -#include #include #include @@ -28,7 +27,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::Quit | SkinnyShortcut::ChangeFonts | SkinnyShortcut::DebugShortcuts ); diff --git a/examples/gallery/button/ButtonPage.cpp b/examples/gallery/button/ButtonPage.cpp index 267a0899..9a347c37 100644 --- a/examples/gallery/button/ButtonPage.cpp +++ b/examples/gallery/button/ButtonPage.cpp @@ -6,11 +6,9 @@ #include "ButtonPage.h" #include -#include -#include +#include #include - -#include +#include namespace { @@ -18,10 +16,11 @@ namespace { public: ButtonBox( QQuickItem* parent = nullptr ) - : QskLinearBox( Qt::Horizontal, parent ) + : QskLinearBox( Qt::Horizontal, 4, parent ) { - setDefaultAlignment( Qt::AlignHCenter | Qt::AlignTop ); - setMargins( 30 ); + setSpacing( 20 ); + setExtraSpacingAt( Qt::BottomEdge ); + setDefaultAlignment( Qt::AlignCenter ); populate(); } @@ -29,20 +28,53 @@ namespace private: void populate() { - (void) new QskSwitchButton( Qt::Vertical, this ); - (void) new QskSwitchButton( Qt::Horizontal, this ); + const char* texts[] = { "Press Me", "Check Me" }; + const char* graphics[] = { "diamond/khaki", "ellipse/sandybrown" }; - auto button3 = new QskSwitchButton( Qt::Vertical, this ); - button3->setInverted( true ); + for ( int i = 0; i < 6; i++ ) + { + const int index = i % 2; - auto button4 = new QskSwitchButton( Qt::Horizontal, this ); - button4->setInverted( true ); + auto button = new QskPushButton( this ); + button->setCheckable( index != 0 ); + //button->setSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::Fixed ); + + if ( i > 1 ) + { + auto src = QStringLiteral( "image://shapes/" ) + graphics[ index ]; + button->setGraphicSource( src ); + } + + if ( i < 2 || i > 3 ) + { + button->setText( texts[ index ] ); + } + } + } + }; + + class SwitchButtonBox : public QskLinearBox + { + public: + SwitchButtonBox( QQuickItem* parent = nullptr ) + : QskLinearBox( Qt::Horizontal, parent ) + { + setSpacing( 20 ); + setExtraSpacingAt( Qt::LeftEdge | Qt::RightEdge | Qt::BottomEdge ); + + for ( auto orientation : { Qt::Vertical, Qt::Horizontal } ) + { + (void) new QskSwitchButton( orientation, this ); + + auto button = new QskSwitchButton( orientation, this ); + button->setInverted( true ); + } } }; } ButtonPage::ButtonPage( QQuickItem* parent ) - : Page( Qt::Horizontal, parent ) + : Page( Qt::Vertical, parent ) { setSpacing( 40 ); populate(); @@ -50,23 +82,7 @@ ButtonPage::ButtonPage( QQuickItem* parent ) void ButtonPage::populate() { - auto hbox1 = new QskLinearBox(); - hbox1->setSizePolicy( Qt::Vertical, QskSizePolicy::Fixed ); - hbox1->setExtraSpacingAt( Qt::LeftEdge ); - - auto label = new QskTextLabel( "Disable the switches:", hbox1 ); - label->setSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::Fixed ); - - auto button0 = new QskSwitchButton( hbox1 ); - - auto hbox2 = new ButtonBox(); - - auto vbox = new QskLinearBox( Qt::Vertical, this ); - vbox->addItem( hbox1 ); - vbox->addItem( new QskSeparator() ); - vbox->addItem( hbox2 ); - vbox->setExtraSpacingAt( Qt::BottomEdge ); - - QObject::connect( button0, &QskSwitchButton::checkedChanged, - hbox2, &QskQuickItem::setDisabled ); + new ButtonBox( this ); + new QskSeparator( Qt::Horizontal, this ); + new SwitchButtonBox( this ); } diff --git a/examples/gallery/label/LabelPage.cpp b/examples/gallery/label/LabelPage.cpp index 8e4a2813..7b945ce8 100644 --- a/examples/gallery/label/LabelPage.cpp +++ b/examples/gallery/label/LabelPage.cpp @@ -8,29 +8,51 @@ #include #include #include +#include namespace { + class TextLabel : public QskTextLabel + { + public: + TextLabel( int role, QQuickItem* parent = nullptr ) + : QskTextLabel( parent ) + { + setText( textFromRole( role ) ); + setFontRole( role ); + + setSizePolicy( Qt::Horizontal, QskSizePolicy::Ignored ); + } + + private: + QString textFromRole( int role ) const + { + static QMetaEnum metaEnum; + + if ( !metaEnum.isValid() ) + { + const auto& mo = QskSkin::staticMetaObject; + metaEnum = mo.enumerator( mo.indexOfEnumerator( "SkinFontRole" ) ); + } + + QString s( metaEnum.valueToKey( role ) ); + s.remove( QStringLiteral( "Font" ) ); + + return s; + } + }; + class TextBox : public QskLinearBox { public: TextBox( QQuickItem* parent = nullptr ) - : QskLinearBox( Qt::Vertical, 3, parent ) + : QskLinearBox( Qt::Horizontal, 3, parent ) { setMargins( 10 ); - //setDefaultAlignment( Qt::AlignTop ); - setExtraSpacingAt( Qt::BottomEdge ); + setDefaultAlignment( Qt::AlignCenter ); - const QStringList texts = - { "Default", "Tiny", "Small", "Medium", "Large", "Huge" }; - - for ( int i = 0; i < texts.size(); i++ ) - { - auto label = new QskTextLabel( texts[ i ] + " Font", this ); - - //label->setPanel( true ); - label->setFontRole( i ); - } + for ( int i = 0; i <= QskSkin::HugeFont; i++ ) + ( void ) new TextLabel( i, this ); } }; diff --git a/examples/gallery/main.cpp b/examples/gallery/main.cpp index 869f06ac..7123fe62 100644 --- a/examples/gallery/main.cpp +++ b/examples/gallery/main.cpp @@ -8,13 +8,16 @@ #include "slider/SliderPage.h" #include "button/ButtonPage.h" -#include #include #include +#include #include #include #include +#include +#include +#include #include #include @@ -31,6 +34,76 @@ namespace setTabPosition( Qsk::Left ); setAutoFitTabs( true ); } + + void setTabsEnabled( bool on ) + { + for ( int i = 0; i < count(); i++ ) + itemAt( i )->setEnabled( on ); + } + }; + + /* + Once QskApplicationView and friends are implemented we can replace + Header/ApplicationWindow with it. TODO ... + */ + class Header : public QskLinearBox + { + Q_OBJECT + + public: + Header( QQuickItem* parent = nullptr ) + : QskLinearBox( Qt::Horizontal, parent ) + { + initSizePolicy( QskSizePolicy::Ignored, QskSizePolicy::Fixed ); + + setMargins( 10 ); + setBackgroundColor( Qt::lightGray ); + + { + auto button = new QskPushButton( "Skin", this ); +#if 1 + button->setFlat( true ); // until we have the section bit in QskAspect +#endif + + // transition leads to errors, when changing the tab before being completed. TODO ... + connect( button, &QskSwitchButton::clicked, + [] { Skinny::changeSkin( 500 ); } ); + } + + addStretch( 10 ); + + { + new QskTextLabel( "Enabled", this ); + + auto button = new QskSwitchButton( this ); + button->setChecked( true ); + + connect( button, &QskSwitchButton::toggled, + this, &Header::enabledToggled ); + } + } + + Q_SIGNALS: + void enabledToggled( bool ); + }; + + class ApplicationView : public QskLinearBox + { + public: + ApplicationView( QQuickItem* parent = nullptr ) + : QskLinearBox( Qt::Vertical, parent ) + { + auto header = new Header( this ); + + auto tabView = new TabView( this ); + tabView->addTab( "Labels", new LabelPage() ); + tabView->addTab( "Buttons", new ButtonPage() ); + tabView->addTab( "Sliders", new SliderPage() ); + tabView->addTab( "Progress\nBars", new ProgressBarPage() ); + + connect( header, &Header::enabledToggled, + tabView, &TabView::setTabsEnabled ); + } }; } @@ -44,21 +117,15 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); - auto tabView = new TabView(); - - tabView->addTab( "Labels", new LabelPage() ); - tabView->addTab( "Sliders", new SliderPage() ); - tabView->addTab( "Progress\nBars", new ProgressBarPage() ); - tabView->addTab( "Buttons", new ButtonPage() ); + auto mainView = new ApplicationView(); QSize size( 800, 600 ); - size = size.expandedTo( tabView->sizeHint().toSize() ); + size = size.expandedTo( mainView->sizeHint().toSize() ); QskWindow window; - window.addItem( tabView ); + window.addItem( mainView ); window.addItem( new QskFocusIndicator() ); window.resize( size ); @@ -66,3 +133,5 @@ int main( int argc, char* argv[] ) return app.exec(); } + +#include "main.moc" diff --git a/examples/iotdashboard/main.cpp b/examples/iotdashboard/main.cpp index 80be72ba..a1457e0d 100644 --- a/examples/iotdashboard/main.cpp +++ b/examples/iotdashboard/main.cpp @@ -7,7 +7,6 @@ #include "GraphicProvider.h" #include "Skin.h" -#include #include #include @@ -61,8 +60,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); - Qsk::addGraphicProvider( QString(), new GraphicProvider() ); // disable default skins diff --git a/examples/layouts/main.cpp b/examples/layouts/main.cpp index f6d59be6..6c829fd5 100644 --- a/examples/layouts/main.cpp +++ b/examples/layouts/main.cpp @@ -10,7 +10,6 @@ #include "StackLayoutPage.h" #include "TestRectangle.h" -#include #include #include @@ -31,7 +30,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); auto tabView = new QskTabView(); diff --git a/examples/listbox/main.cpp b/examples/listbox/main.cpp index 487796aa..2c1e2099 100644 --- a/examples/listbox/main.cpp +++ b/examples/listbox/main.cpp @@ -3,7 +3,6 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#include #include #include @@ -65,7 +64,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); QskWindow window; diff --git a/examples/messagebox/main.cpp b/examples/messagebox/main.cpp index f5702319..f1b96068 100644 --- a/examples/messagebox/main.cpp +++ b/examples/messagebox/main.cpp @@ -3,7 +3,6 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#include #include #include @@ -126,7 +125,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); qskDialog->setPolicy( QskDialog::EmbeddedBox ); diff --git a/examples/messageboxQml/main.cpp b/examples/messageboxQml/main.cpp index 58d084a6..3e7a0694 100644 --- a/examples/messageboxQml/main.cpp +++ b/examples/messageboxQml/main.cpp @@ -3,7 +3,6 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#include #include #include @@ -22,7 +21,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); QQmlApplicationEngine engine( QUrl( "qrc:/qml/messagebox.qml" ) ); diff --git a/examples/mycontrols/main.cpp b/examples/mycontrols/main.cpp index 996bcd02..7102c1a7 100644 --- a/examples/mycontrols/main.cpp +++ b/examples/mycontrols/main.cpp @@ -6,7 +6,6 @@ #include "MySkin.h" #include "MyToggleButton.h" -#include #include #include @@ -136,7 +135,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::DebugBackground | SkinnyShortcut::DebugStatistics | SkinnyShortcut::Quit ); diff --git a/examples/qvgviewer/main.cpp b/examples/qvgviewer/main.cpp index c6a53784..31d62caa 100644 --- a/examples/qvgviewer/main.cpp +++ b/examples/qvgviewer/main.cpp @@ -5,7 +5,6 @@ #include "MainWindow.h" -#include #include #ifdef CONTEXT_MENU @@ -29,7 +28,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); QskFocusIndicator* focusIndicator = new QskFocusIndicator(); diff --git a/examples/tabview/main.cpp b/examples/tabview/main.cpp index 7afab28f..5fbd43dc 100644 --- a/examples/tabview/main.cpp +++ b/examples/tabview/main.cpp @@ -3,7 +3,6 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#include #include #include @@ -90,7 +89,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); auto tabView = new TabView(); diff --git a/playground/anchors/main.cpp b/playground/anchors/main.cpp index 7f758ec6..a75c279d 100644 --- a/playground/anchors/main.cpp +++ b/playground/anchors/main.cpp @@ -5,7 +5,6 @@ #include "AnchorBox.h" -#include #include #include @@ -153,7 +152,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::Quit | SkinnyShortcut::DebugShortcuts ); auto box = new MyBox(); diff --git a/playground/dialogbuttons/main.cpp b/playground/dialogbuttons/main.cpp index 7393099d..b55461f9 100644 --- a/playground/dialogbuttons/main.cpp +++ b/playground/dialogbuttons/main.cpp @@ -5,7 +5,6 @@ #include "Window.h" -#include #include #include @@ -21,7 +20,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); Window window( Qt::Horizontal ); diff --git a/playground/grids/main.cpp b/playground/grids/main.cpp index 40dd8a8a..ea81b96a 100644 --- a/playground/grids/main.cpp +++ b/playground/grids/main.cpp @@ -5,8 +5,6 @@ #include "TestBox.h" -#include - #include #include @@ -389,15 +387,6 @@ int main( int argc, char** argv ) { QApplication app( argc, argv ); -#if 1 - /* - we don't need the fonts, but by calling something from - the support library initializations regarding the skins - are loaded. TODO ... - */ - SkinnyFont::init( &app ); -#endif - int testcase = 0; if ( argc == 2 ) testcase = atoi( argv[1] ); diff --git a/playground/images/images.qml b/playground/images/images.qml index 1ee7fb4f..b5132ff5 100644 --- a/playground/images/images.qml +++ b/playground/images/images.qml @@ -17,7 +17,8 @@ Qsk.Window orientation: Qt.Horizontal dimension: 3 - margins: 10 + //margins: 10 // only possible with Qt <= 6.1 + margins { left: 10; top: 10; right: 10; bottom: 10 } spacing: 10 Repeater diff --git a/playground/inputpanel/main.cpp b/playground/inputpanel/main.cpp index d26e3361..af6994cd 100644 --- a/playground/inputpanel/main.cpp +++ b/playground/inputpanel/main.cpp @@ -3,7 +3,6 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#include #include #include @@ -285,7 +284,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); #if 1 diff --git a/playground/webview/main.cpp b/playground/webview/main.cpp index 0a6de6ec..454e3639 100644 --- a/playground/webview/main.cpp +++ b/playground/webview/main.cpp @@ -3,7 +3,6 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#include #include #include @@ -43,7 +42,6 @@ int main( int argc, char* argv[] ) QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling); QGuiApplication app( argc, argv ); - SkinnyFont::init( &app ); SkinnyShortcut::enable( SkinnyShortcut::Quit | SkinnyShortcut::DebugShortcuts ); QskWindow window; diff --git a/skins/squiek/QskSquiekSkin.cpp b/skins/squiek/QskSquiekSkin.cpp index 55ce1c0c..da74a7d3 100644 --- a/skins/squiek/QskSquiekSkin.cpp +++ b/skins/squiek/QskSquiekSkin.cpp @@ -879,7 +879,7 @@ void Editor::setupSwitchButton() using A = QskAspect; using Q = QskSwitchButton; - const qreal radius = qskDpiScaled( 18 ); + const qreal radius = qskDpiScaled( 12 ); const qreal handleSize = 2 * ( radius - 2 ); setBoxShape( Q::Groove, 100, Qt::RelativeSize ); diff --git a/src/common/QskAspect.cpp b/src/common/QskAspect.cpp index a45febbb..6162df0e 100644 --- a/src/common/QskAspect.cpp +++ b/src/common/QskAspect.cpp @@ -144,7 +144,7 @@ QVector< QskAspect::Subcontrol > QskAspect::subControls( const QMetaObject* meta static QByteArray qskEnumString( const char* name, int value ) { - const QMetaObject& mo = QskAspect::staticMetaObject; + const auto& mo = QskAspect::staticMetaObject; const QMetaEnum metaEnum = mo.enumerator( mo.indexOfEnumerator( name ) ); const char* key = metaEnum.valueToKey( value ); diff --git a/src/controls/QskSkin.cpp b/src/controls/QskSkin.cpp index 85215d98..e438816c 100644 --- a/src/controls/QskSkin.cpp +++ b/src/controls/QskSkin.cpp @@ -12,6 +12,7 @@ #include "QskGraphicProviderMap.h" #include "QskSkinHintTable.h" #include "QskStandardSymbol.h" +#include "QskPlatform.h" #include "QskMargins.h" @@ -216,13 +217,14 @@ void QskSkin::declareSkinlet( const QMetaObject* metaObject, void QskSkin::setupFonts( const QString& family, int weight, bool italic ) { + const int sizes[] = { 10, 15, 20, 32, 66 }; + static_assert( sizeof( sizes ) / sizeof( sizes[ 0 ] ) == HugeFont ); + QFont font( family, -1, weight, italic ); - const uint base = TinyFont; for ( int i = TinyFont; i <= HugeFont; i++ ) { - // TODO: make the scaling components configurable - font.setPixelSize( int( std::pow( uint( i ) - base + 2, 2.5 ) ) ); + font.setPixelSize( qskDpiScaled( sizes[i-1] ) ); m_data->fonts[ i ] = font; } diff --git a/support/SkinnyFont.cpp b/support/SkinnyFont.cpp deleted file mode 100644 index 7278c388..00000000 --- a/support/SkinnyFont.cpp +++ /dev/null @@ -1,43 +0,0 @@ -/****************************************************************************** - * QSkinny - Copyright (C) 2016 Uwe Rathmann - * This file may be used under the terms of the 3-clause BSD License - *****************************************************************************/ - -#include "SkinnyFont.h" - -#include -#include -#include -#include - -#define STRINGIFY(x) #x -#define STRING(x) STRINGIFY(x) - -void SkinnyFont::init( QGuiApplication* ) -{ -#ifdef FONTCONFIG_FILE - const char env[] = "FONTCONFIG_FILE"; - if ( !qEnvironmentVariableIsSet( env ) ) - qputenv( env, STRING( FONTCONFIG_FILE ) ); -#endif - - QElapsedTimer timer; - timer.start(); - - QFontDatabase(); - - const auto elapsed = timer.elapsed(); - - if ( elapsed > 20 ) - { - qWarning() << "Loading fonts needed" << elapsed << "ms" - << "- usually because of creating a font cache."; - } - - /* - The default initialization in QskSkin sets up its font table - with using the application font for the default font role. - */ - QGuiApplication::setFont( QFont( "DejaVuSans", 12 ) ); -} - diff --git a/support/SkinnyGlobal.h b/support/SkinnyGlobal.h index 4f5a9a17..9c350ab8 100644 --- a/support/SkinnyGlobal.h +++ b/support/SkinnyGlobal.h @@ -3,23 +3,20 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#ifndef SKINNY_GLOBAL_H -#define SKINNY_GLOBAL_H +#pragma once #include #ifdef QSK_DLL -#if defined( SKINNY_MAKEDLL ) // create a DLL library -#define SKINNY_EXPORT Q_DECL_EXPORT -#else // use a DLL library -#define SKINNY_EXPORT Q_DECL_IMPORT -#endif + #if defined( SKINNY_MAKEDLL ) // create a DLL library + #define SKINNY_EXPORT Q_DECL_EXPORT + #else // use a DLL library + #define SKINNY_EXPORT Q_DECL_IMPORT + #endif #endif // QSK_DLL #ifndef SKINNY_EXPORT -#define SKINNY_EXPORT -#endif - + #define SKINNY_EXPORT #endif diff --git a/support/SkinnyNamespace.cpp b/support/SkinnyNamespace.cpp new file mode 100644 index 00000000..baf2d6a6 --- /dev/null +++ b/support/SkinnyNamespace.cpp @@ -0,0 +1,140 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the 3-clause BSD License + *****************************************************************************/ + +#include "SkinnyNamespace.h" + +#include +#include +#include +#include +#include + +#include +#include + +#define STRINGIFY(x) #x +#define STRING(x) STRINGIFY(x) + +#if defined( ENSURE_SKINS ) + + #include + #include + + static void initSkins() + { + if ( qskSkinManager->skinNames().isEmpty() ) + { + /* + To avoid having problems with not finding the skin plugins + we manually add them here. + */ + + qskSkinManager->registerFactory( "SquiekFactory", new QskSquiekSkinFactory() ); + qskSkinManager->registerFactory( "MaterialFactory", new QskMaterialSkinFactory() ); + + qWarning() << "Couldn't find skin plugins, adding some manually."; + } + } + + Q_COREAPP_STARTUP_FUNCTION( initSkins ) + +#endif + +#define ENSURE_FONTS + +#if defined( ENSURE_FONTS ) + + #include + #include + + static void initFonts() + { + #ifdef FONTCONFIG_FILE + const char env[] = "FONTCONFIG_FILE"; + if ( !qEnvironmentVariableIsSet( env ) ) + qputenv( env, STRING( FONTCONFIG_FILE ) ); + #endif + + QElapsedTimer timer; + timer.start(); + + QFontDatabase(); + + const auto elapsed = timer.elapsed(); + + if ( elapsed > 20 ) + { + qWarning() << "Loading fonts needed" << elapsed << "ms" + << "- usually because of creating a font cache."; + } + + /* + The default initialization in QskSkin sets up its font table + with using the application font for the default font role. + */ + QGuiApplication::setFont( QFont( "DejaVuSans", 12 ) ); + } +#endif + +Q_COREAPP_STARTUP_FUNCTION( initFonts ) + +void Skinny::changeSkin( QskAnimationHint hint ) +{ + const auto names = qskSkinManager->skinNames(); + if ( names.size() <= 1 ) + return; + + int index = names.indexOf( qskSetup->skinName() ); + index = ( index + 1 ) % names.size(); + + auto oldSkin = qskSetup->skin(); + if ( oldSkin->parent() == qskSetup ) + oldSkin->setParent( nullptr ); // otherwise setSkin deletes it + + if ( auto newSkin = qskSetup->setSkin( names[ index ] ) ) + { + QskSkinTransition transition; + + //transition.setMask( QskAspect::Color ); // Metrics are flickering -> TODO + transition.setSourceSkin( oldSkin ); + transition.setTargetSkin( newSkin ); + transition.setAnimation( hint ); + + transition.process(); + + if ( oldSkin->parent() == nullptr ) + delete oldSkin; + } +} + +void Skinny::changeFonts( int increment ) +{ + auto skin = qskSetup->skin(); + + const auto fonts = skin->fonts(); + + for ( auto it = fonts.begin(); it != fonts.end(); ++it ) + { + auto role = it->first; + auto font = it->second; + + if ( font.pixelSize() > 0 ) + { + const auto newSize = font.pixelSize() + increment; + if ( newSize > 0 ) + font.setPixelSize( newSize ); + } + else + { + const auto newSize = font.pointSizeF() + increment; + if ( newSize > 0 ) + font.setPointSizeF( font.pointSizeF() + increment ); + } + + skin->setFont( role, font ); + } + + Q_EMIT qskSetup->skinChanged( skin ); +} diff --git a/support/SkinnyFont.h b/support/SkinnyNamespace.h similarity index 63% rename from support/SkinnyFont.h rename to support/SkinnyNamespace.h index db2675a9..072e60b2 100644 --- a/support/SkinnyFont.h +++ b/support/SkinnyNamespace.h @@ -3,16 +3,13 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#ifndef SKINNY_FONT_H_ -#define SKINNY_FONT_H_ +#pragma once #include "SkinnyGlobal.h" +#include -class QGuiApplication; - -namespace SkinnyFont +namespace Skinny { - SKINNY_EXPORT void init( QGuiApplication* ); + SKINNY_EXPORT void changeSkin( QskAnimationHint hint = 500 ); + SKINNY_EXPORT void changeFonts( int increment ); } - -#endif diff --git a/support/SkinnyShapeFactory.h b/support/SkinnyShapeFactory.h index 3cbb591d..42794218 100644 --- a/support/SkinnyShapeFactory.h +++ b/support/SkinnyShapeFactory.h @@ -3,8 +3,7 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#ifndef SKINNY_SHAPE_FACTORY_H_ -#define SKINNY_SHAPE_FACTORY_H_ +#pragma once #include "SkinnyGlobal.h" #include @@ -32,5 +31,3 @@ namespace SkinnyShapeFactory SKINNY_EXPORT QPainterPath shapePath( Shape, const QSizeF& ); } - -#endif diff --git a/support/SkinnyShapeProvider.h b/support/SkinnyShapeProvider.h index 3b5f7962..fb0a8155 100644 --- a/support/SkinnyShapeProvider.h +++ b/support/SkinnyShapeProvider.h @@ -3,8 +3,7 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#ifndef SKINNY_SHAPE_PROVIDER_H -#define SKINNY_SHAPE_PROVIDER_H +#pragma once #include "SkinnyGlobal.h" #include @@ -15,5 +14,3 @@ class SKINNY_EXPORT SkinnyShapeProvider : public QskGraphicProvider const QskGraphic* loadGraphic( const QString& id ) const override final; }; -#endif - diff --git a/support/SkinnyShortcut.cpp b/support/SkinnyShortcut.cpp index 582827fb..6226f559 100644 --- a/support/SkinnyShortcut.cpp +++ b/support/SkinnyShortcut.cpp @@ -1,15 +1,11 @@ #include "SkinnyShortcut.h" +#include "SkinnyNamespace.h" #include #include -#include #include -#include -#include #include #include -#include -#include #include #include @@ -17,7 +13,6 @@ #include #include -#include #include SkinnyShortcut::SkinnyShortcut( QObject* parent ): @@ -34,17 +29,17 @@ void SkinnyShortcut::enable( Types types ) if ( types & RotateSkin ) { QskShortcutMap::addShortcut( QKeySequence( Qt::CTRL | Qt::Key_S ), - false, &s_shortcut, &SkinnyShortcut::rotateSkin ); + false, &s_shortcut, [] { Skinny::changeSkin(); } ); cout << "CTRL-S to change the skin." << endl; } if ( types & ChangeFonts ) { QskShortcutMap::addShortcut( QKeySequence( Qt::CTRL | Qt::Key_F ), - false, &s_shortcut, [] { s_shortcut.changeFonts( +1 ); } ); + false, &s_shortcut, [] { Skinny::changeFonts( +1 ); } ); QskShortcutMap::addShortcut( QKeySequence( Qt::CTRL | Qt::Key_G ), - false, &s_shortcut, [] { s_shortcut.changeFonts( -1 ); } ); + false, &s_shortcut, [] { Skinny::changeFonts( -1 ); } ); cout << "CTRL-F to increase the font size." << endl; cout << "CTRL-G to decrease the font size." << endl; @@ -75,35 +70,6 @@ void SkinnyShortcut::enable( Types types ) } } -void SkinnyShortcut::rotateSkin() -{ - const auto names = qskSkinManager->skinNames(); - if ( names.size() <= 1 ) - return; - - int index = names.indexOf( qskSetup->skinName() ); - index = ( index + 1 ) % names.size(); - - auto oldSkin = qskSetup->skin(); - if ( oldSkin->parent() == qskSetup ) - oldSkin->setParent( nullptr ); // otherwise setSkin deletes it - - if ( auto newSkin = qskSetup->setSkin( names[ index ] ) ) - { - QskSkinTransition transition; - - //transition.setMask( QskAspect::Color ); // Metrics are flickering -> TODO - transition.setSourceSkin( oldSkin ); - transition.setTargetSkin( newSkin ); - transition.setAnimation( 500 ); - - transition.process(); - - if ( oldSkin->parent() == nullptr ) - delete oldSkin; - } -} - void SkinnyShortcut::showBackground() { #if 0 @@ -149,36 +115,6 @@ void SkinnyShortcut::showBackground() } } -void SkinnyShortcut::changeFonts( int increment ) -{ - auto skin = qskSetup->skin(); - - const auto fonts = skin->fonts(); - - for ( auto it = fonts.begin(); it != fonts.end(); ++it ) - { - auto role = it->first; - auto font = it->second; - - if ( font.pixelSize() > 0 ) - { - const auto newSize = font.pixelSize() + increment; - if ( newSize > 0 ) - font.setPixelSize( newSize ); - } - else - { - const auto newSize = font.pointSizeF() + increment; - if ( newSize > 0 ) - font.setPointSizeF( font.pointSizeF() + increment ); - } - - skin->setFont( role, font ); - } - - Q_EMIT qskSetup->skinChanged( skin ); -} - static inline void countNodes( const QSGNode* node, int& counter ) { if ( node ) diff --git a/support/SkinnyShortcut.h b/support/SkinnyShortcut.h index 52222f18..8f63781f 100644 --- a/support/SkinnyShortcut.h +++ b/support/SkinnyShortcut.h @@ -3,8 +3,7 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#ifndef SKINNY_SHORTCUT_H_ -#define SKINNY_SHORTCUT_H_ +#pragma once #include "SkinnyGlobal.h" #include @@ -34,12 +33,8 @@ class SKINNY_EXPORT SkinnyShortcut : public QObject private: SkinnyShortcut( QObject* parent = nullptr ); - void rotateSkin(); - void changeFonts( int increment ); void showBackground(); void debugStatistics(); }; Q_DECLARE_OPERATORS_FOR_FLAGS( SkinnyShortcut::Types ) - -#endif diff --git a/support/support.pro b/support/support.pro index 699b1f2b..b02cb0d9 100644 --- a/support/support.pro +++ b/support/support.pro @@ -12,13 +12,13 @@ contains(QSK_CONFIG, QskDll): DEFINES += SKINNY_MAKEDLL HEADERS += \ SkinnyGlobal.h \ - SkinnyFont.h \ + SkinnyNamespace.h \ SkinnyShapeFactory.h \ SkinnyShapeProvider.h \ SkinnyShortcut.h SOURCES += \ - SkinnyFont.cpp \ + SkinnyNamespace.cpp \ SkinnyPlugin.cpp \ SkinnyShapeFactory.cpp \ SkinnyShapeProvider.cpp \ From afefaf952a55fb9eed0cbee8a54601ccafab2362 Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Sat, 2 Apr 2022 11:50:55 +0200 Subject: [PATCH 07/70] using gardients instead of colors --- skins/material/QskMaterialSkin.cpp | 74 +++++++++++++++--------------- skins/material/QskMaterialSkin.h | 9 +++- 2 files changed, 45 insertions(+), 38 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index a8341aea..bceaa0dc 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -171,6 +171,7 @@ void Editor::setupTextLabel() void Editor::setupTextInput() { using Q = QskTextInput; + using namespace QskRgb; setAlignment( Q::Text, Qt::AlignLeft | Qt::AlignTop ); @@ -188,16 +189,16 @@ void Editor::setupTextInput() setBoxBorderColors( Q::Panel | Q::Focused, m_pal.primary ); - setColor( Q::Panel, m_pal.elevated( m_pal.background, 1 ) ); - setColor( Q::Panel | Q::Hovered, m_pal.elevated( m_pal.background, 2 ) ); - setColor( Q::Panel | Q::Focused, m_pal.elevated( m_pal.background, 3 ) ); - setColor( Q::Panel | Q::Editing, m_pal.elevated( m_pal.background, 4 ) ); + setGradient( Q::Panel, m_pal.elevated( m_pal.background, 1 ) ); + setGradient( Q::Panel | Q::Hovered, m_pal.elevated( m_pal.background, 2 ) ); + setGradient( Q::Panel | Q::Focused, m_pal.elevated( m_pal.background, 3 ) ); + setGradient( Q::Panel | Q::Editing, m_pal.elevated( m_pal.background, 4 ) ); - setColor( Q::Panel | Q::Disabled, - QskRgb::toTransparentF( m_pal.secondaryVariantNoSaturation, m_pal.disabled ) ); - setColor( Q::Text | Q::Disabled, QskRgb::toTransparentF( m_pal.onBackground, m_pal.disabled ) ); - setBoxBorderColors( Q::Panel, - QskRgb::toTransparentF( m_pal.onBackground, m_pal.disabled ) ); + setGradient( Q::Panel | Q::Disabled, + m_pal.toDisabled( m_pal.secondaryVariantNoSaturation ) ); + + setColor( Q::Text | Q::Disabled, m_pal.toDisabled( m_pal.onBackground ) ); + setBoxBorderColors( Q::Panel, m_pal.toDisabled( m_pal.onBackground ) ); } void Editor::setupProgressBar() @@ -216,14 +217,14 @@ void Editor::setupProgressBar() setBoxBorderMetrics( subControl, 0 ); } - setGradient( Q::Groove, m_pal.secondaryNoSaturation ); setMetric( Q::Groove | A::Size, size ); - setGradient( Q::Bar, m_pal.secondary ); + setGradient( Q::Groove, m_pal.secondaryNoSaturation ); setGradient( Q::Groove | Q::Disabled, - QskRgb::toTransparentF( m_pal.secondaryNoSaturation, m_pal.disabled ) ); - setGradient( Q::Bar | Q::Disabled, - QskRgb::toTransparentF( m_pal.secondary, m_pal.disabled ) ); + m_pal.toDisabled( m_pal.secondaryNoSaturation ) ); + + setGradient( Q::Bar, m_pal.secondary ); + setGradient( Q::Bar | Q::Disabled, m_pal.toDisabled( m_pal.secondary ) ); } void Editor::setupFocusIndicator() @@ -263,9 +264,10 @@ void Editor::setupPageIndicator() setGradient( Q::Bullet | Q::Selected, m_pal.secondary ); setGradient( Q::Bullet | Q::Disabled, - QskRgb::toTransparentF( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + m_pal.toDisabled( m_pal.secondaryNoSaturation ) ); + setGradient( Q::Bullet | Q::Selected | Q::Disabled, - QskRgb::toTransparentF( m_pal.secondary, m_pal.disabled ) ); + m_pal.toDisabled( m_pal.secondary ) ); setSpacing( Q::Panel, qskDpiScaled( 3 ) ); setPadding( Q::Panel, 0 ); @@ -292,19 +294,19 @@ void Editor::setupPushButton() setGradient( Q::Panel | Q::Flat, White & ColorMask ); setColor( Q::Text, m_pal.primary ); - setColor( Q::Text | Q::Disabled, QskRgb::toTransparentF( m_pal.primary, 0.6 ) ); + setColor( Q::Text | Q::Disabled, toTransparentF( m_pal.primary, 0.6 ) ); setFontRole( Q::Text, ButtonFontRole ); setAlignment( Q::Text, Qt::AlignCenter ); setBoxBorderMetrics( Q::Panel, 1 ); setBoxBorderColors( Q::Panel, m_pal.primary ); - setBoxBorderColors( Q::Panel | Q::Disabled, QskRgb::toTransparentF( m_pal.onBackground, m_pal.disabled ) ); - setColor( Q::Text | Q::Disabled, QskRgb::toTransparentF( m_pal.onBackground, m_pal.disabled ) ); + setBoxBorderColors( Q::Panel | Q::Disabled, m_pal.toDisabled( m_pal.onBackground ) ); + setColor( Q::Text | Q::Disabled, m_pal.toDisabled( m_pal.onBackground ) ); - setColor( Q::Panel | Q::Hovered, QskRgb::toTransparentF( m_pal.primary, m_pal.hover ) ); - setColor( Q::Panel | Q::Focused, QskRgb::toTransparentF( m_pal.primary, m_pal.focused ) ); - setColor( Q::Panel | Q::Pressed, QskRgb::toTransparentF( m_pal.primary, m_pal.pressed ) ); + setGradient( Q::Panel | Q::Hovered, toTransparentF( m_pal.primary, m_pal.hover ) ); + setGradient( Q::Panel | Q::Focused, toTransparentF( m_pal.primary, m_pal.focused ) ); + setGradient( Q::Panel | Q::Pressed, toTransparentF( m_pal.primary, m_pal.pressed ) ); setAnimation( Q::Panel | A::Color, qskDuration ); setAnimation( Q::Panel | A::Metric, qskDuration ); @@ -393,11 +395,11 @@ void Editor::setupSlider() setGradient( Q::Groove, QskRgb::toTransparentF( m_pal.secondary, .38 ) ); setGradient( Q::Groove | Q::Disabled, - QskRgb::toTransparentF( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + m_pal.toDisabled( m_pal.secondaryNoSaturation ) ); setGradient( Q::Fill, m_pal.secondary ); setGradient( Q::Fill | Q::Disabled, - QskRgb::toTransparentF( m_pal.secondaryNoSaturation, m_pal.disabled ) ); + m_pal.toDisabled( m_pal.secondaryNoSaturation ) ); setBoxShape( Q::Handle, 100, Qt::RelativeSize ); setBoxBorderMetrics( Q::Handle, 0 ); @@ -439,11 +441,9 @@ void Editor::setupSwitchButton() setStrutSize( Q::Groove | A::Horizontal, grooveSize ); setStrutSize( Q::Groove | A::Vertical, grooveSize.transposed() ); - setColor( Q::Groove, m_pal.secondaryNoSaturation ); - setGradient( Q::Groove | Q::Disabled, - QskRgb::toTransparentF( m_pal.secondaryNoSaturation, m_pal.disabled ) ); - setGradient( Q::Groove | Q::Checked, - m_pal.secondaryVariant ); + setGradient( Q::Groove, m_pal.secondaryNoSaturation ); + setGradient( Q::Groove | Q::Disabled, m_pal.toDisabled( m_pal.secondaryNoSaturation ) ); + setGradient( Q::Groove | Q::Checked, m_pal.secondaryVariant ); setGradient( Q::Groove | Q::Checked | Q::Disabled, QskRgb::toTransparentF( m_pal.secondaryVariant, m_pal.disabledOccupancy ) ); @@ -551,10 +551,10 @@ void Editor::setupTabButton() setColor( Q::Text | Q::Checked, m_pal.primary ); setColor( Q::Text | Q::Hovered, m_pal.primary ); - setColor( Q::Panel, m_pal.elevated( m_pal.background ) ); - setColor( Q::Panel | Q::Hovered, QskRgb::toTransparentF( m_pal.primary, m_pal.hover ) ); - setColor( Q::Panel | Q::Focused, QskRgb::toTransparentF( m_pal.primary, m_pal.focused ) ); - setColor( Q::Panel | Q::Pressed, QskRgb::toTransparentF( m_pal.primary, m_pal.pressed ) ); + setGradient( Q::Panel, m_pal.elevated( m_pal.background ) ); + setGradient( Q::Panel | Q::Hovered, QskRgb::toTransparentF( m_pal.primary, m_pal.hover ) ); + setGradient( Q::Panel | Q::Focused, QskRgb::toTransparentF( m_pal.primary, m_pal.focused ) ); + setGradient( Q::Panel | Q::Pressed, QskRgb::toTransparentF( m_pal.primary, m_pal.pressed ) ); setAnimation( Q::Panel | A::Color, qskDuration ); @@ -646,7 +646,7 @@ void Editor::setupScrollView() { setBoxShape( subControl, 3 ); setBoxBorderMetrics( subControl, 0 ); - setColor( subControl, QskRgb::toTransparentF( m_pal.onBackground, m_pal.hover ) ); + setGradient( subControl, QskRgb::toTransparentF( m_pal.onBackground, m_pal.hover ) ); setAnimation( subControl | A::Color, qskDuration ); } @@ -654,7 +654,7 @@ void Editor::setupScrollView() Q::HorizontalScrollHandle | Q::HorizontalHandlePressed, Q::VerticalScrollHandle | Q::VerticalHandlePressed } ) { - setColor( subControl, + setGradient( subControl, QskRgb::toTransparentF( m_pal.onBackground, m_pal.pressed ) ); } @@ -668,10 +668,10 @@ void Editor::setupListView() setPadding( Q::Cell, 0 ); - setColor( Q::Cell, m_pal.background ); + setGradient( Q::Cell, m_pal.background ); setColor( Q::Text, m_pal.onBackground ); - setColor( Q::Cell | Q::Selected, QskRgb::toTransparentF( m_pal.onBackground, m_pal.focused ) ); + setGradient( Q::Cell | Q::Selected, QskRgb::toTransparentF( m_pal.onBackground, m_pal.focused ) ); setColor( Q::Text | Q::Selected, m_pal.onBackground ); } diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index a6f041b0..4e04b2fc 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -31,6 +31,11 @@ class QSK_MATERIAL_EXPORT QskMaterialPalette : QskRgb::lighter( rgb, 130 + level * 30 ); } + inline QRgb toDisabled( const QRgb rgb ) const + { + return QskRgb::toTransparentF( rgb, this->m_disabled ); + } + public: QRgb primary; QRgb primaryVariant; @@ -56,7 +61,9 @@ class QSK_MATERIAL_EXPORT QskMaterialPalette const qreal hover = 0.1; const qreal focused = 0.4; const qreal pressed = 0.5; - const qreal disabled = 0.3; + + private: + const qreal m_disabled = 0.3; const Lightness m_lightness; }; From 45e0d8b53736d5bcf1e4d27db84190dc2a3c99e2 Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Sun, 3 Apr 2022 16:24:50 +0200 Subject: [PATCH 08/70] code grouped --- skins/material/QskMaterialSkin.cpp | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index bceaa0dc..2e88955f 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -291,8 +291,6 @@ void Editor::setupPushButton() setBoxShape( Q::Panel, 5 ); - setGradient( Q::Panel | Q::Flat, White & ColorMask ); - setColor( Q::Text, m_pal.primary ); setColor( Q::Text | Q::Disabled, toTransparentF( m_pal.primary, 0.6 ) ); setFontRole( Q::Text, ButtonFontRole ); @@ -307,6 +305,7 @@ void Editor::setupPushButton() setGradient( Q::Panel | Q::Hovered, toTransparentF( m_pal.primary, m_pal.hover ) ); setGradient( Q::Panel | Q::Focused, toTransparentF( m_pal.primary, m_pal.focused ) ); setGradient( Q::Panel | Q::Pressed, toTransparentF( m_pal.primary, m_pal.pressed ) ); + setGradient( Q::Panel | Q::Flat, White & ColorMask ); setAnimation( Q::Panel | A::Color, qskDuration ); setAnimation( Q::Panel | A::Metric, qskDuration ); From 23482cf1d06853d0341c4e25868501d2d536ecc9 Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Sun, 3 Apr 2022 16:25:13 +0200 Subject: [PATCH 09/70] Q_DECLARE_TYPEINFO fixed --- src/common/QskGradientStop.h | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/common/QskGradientStop.h b/src/common/QskGradientStop.h index 926803c9..3149eea4 100644 --- a/src/common/QskGradientStop.h +++ b/src/common/QskGradientStop.h @@ -48,7 +48,10 @@ class QSK_EXPORT QskGradientStop QColor m_color; // using RGBA instead ? }; -Q_DECLARE_TYPEINFO( QskGradientStop, Q_MOVABLE_TYPE ); +#if QT_VERSION >= QT_VERSION_CHECK( 6, 0, 0 ) + Q_DECLARE_TYPEINFO( QskGradientStop, Q_RELOCATABLE_TYPE ); +#endif + Q_DECLARE_METATYPE( QskGradientStop ) inline constexpr QskGradientStop::QskGradientStop() noexcept From 81cf9a20eef34da6aad59ca7e40ca86dd23fe9f4 Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Sun, 3 Apr 2022 16:25:46 +0200 Subject: [PATCH 10/70] only check if types do match without doing the conversion --- src/controls/QskSkinnable.cpp | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/controls/QskSkinnable.cpp b/src/controls/QskSkinnable.cpp index 15d8b0b5..29207849 100644 --- a/src/controls/QskSkinnable.cpp +++ b/src/controls/QskSkinnable.cpp @@ -1145,12 +1145,12 @@ void QskSkinnable::startHintTransition( QskAspect aspect, if ( control->window() == nullptr || !isTransitionAccepted( aspect ) ) return; + if ( !QskVariantAnimator::maybeInterpolate( from, to ) ) + return; + auto v1 = from; auto v2 = to; - if ( !QskVariantAnimator::convertValues( v1, v2 ) ) - return; - if ( aspect.flagPrimitive() == QskAspect::GraphicRole ) { const auto skin = effectiveSkin(); From b1931d43b97e1c381fa5f0130737983f1a6f66a8 Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Sun, 3 Apr 2022 16:27:10 +0200 Subject: [PATCH 11/70] stop animation, when start/endValues are chaged. Otherwise we will run into crashes, when value types have not been aligned or can't be aligned --- src/controls/QskVariantAnimator.cpp | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/src/controls/QskVariantAnimator.cpp b/src/controls/QskVariantAnimator.cpp index a23fd356..c54d4ea3 100644 --- a/src/controls/QskVariantAnimator.cpp +++ b/src/controls/QskVariantAnimator.cpp @@ -53,13 +53,13 @@ Q_CONSTRUCTOR_FUNCTION( qskRegisterInterpolator ) #endif #if defined( Q_CC_CLANG ) -#if __has_feature( address_sanitizer ) -#define QSK_DECL_INSANE __attribute__( ( no_sanitize( "undefined" ) ) ) -#endif + #if __has_feature( address_sanitizer ) + #define QSK_DECL_INSANE __attribute__( ( no_sanitize( "undefined" ) ) ) + #endif #endif #if !defined( QSK_DECL_INSANE ) -#define QSK_DECL_INSANE + #define QSK_DECL_INSANE #endif QSK_DECL_INSANE static inline QVariant qskInterpolate( @@ -112,11 +112,13 @@ QskVariantAnimator::~QskVariantAnimator() void QskVariantAnimator::setStartValue( const QVariant& value ) { + stop(); m_startValue = value; } void QskVariantAnimator::setEndValue( const QVariant& value ) { + stop(); m_endValue = value; } @@ -171,7 +173,7 @@ void QskVariantAnimator::setup() if ( convertValues( m_startValue, m_endValue ) ) { - if ( m_startValue != m_endValue ) + if ( m_startValue != m_endValue ) { const auto id = m_startValue.userType(); @@ -191,6 +193,8 @@ void QskVariantAnimator::advance( qreal progress ) if ( qFuzzyCompare( progress, 1.0 ) ) progress = 1.0; + Q_ASSERT( qskMetaType( m_startValue ) == qskMetaType( m_endValue ) ); + m_currentValue = qskInterpolate( m_interpolator, m_startValue, m_endValue, progress ); } From af033e07fb63653549ee5538865dd90360fcbde9 Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Sun, 3 Apr 2022 16:37:36 +0200 Subject: [PATCH 12/70] more switches --- examples/gallery/button/ButtonPage.cpp | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/examples/gallery/button/ButtonPage.cpp b/examples/gallery/button/ButtonPage.cpp index 9a347c37..d2e0ab3d 100644 --- a/examples/gallery/button/ButtonPage.cpp +++ b/examples/gallery/button/ButtonPage.cpp @@ -67,7 +67,14 @@ namespace (void) new QskSwitchButton( orientation, this ); auto button = new QskSwitchButton( orientation, this ); + button->setChecked( true ); + + button = new QskSwitchButton( orientation, this ); button->setInverted( true ); + + button = new QskSwitchButton( orientation, this ); + button->setInverted( true ); + button->setChecked( true ); } } }; From 6adee18cb77a802ec4382641b4d52a0067f9eab0 Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Tue, 5 Apr 2022 11:55:26 +0200 Subject: [PATCH 13/70] QskMenu initialization fixed --- skins/material/QskMaterialSkin.cpp | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 704db760..ffbb36c3 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -187,9 +187,9 @@ void Editor::setupMenu() setBoxShape( Q::Panel, qskDpiScaled( 4 ) ); setBoxBorderMetrics( Q::Panel, qskDpiScaled( 1 ) ); - setBoxBorderColors( Q::Panel, m_pal.darker125 ); + setBoxBorderColors( Q::Panel, m_pal.primary ); - setGradient( Q::Panel, m_pal.baseColor ); + setGradient( Q::Panel, m_pal.background ); const bool isCascading = qskMaybeDesktopPlatform(); setFlagHint( Q::Panel | A::Style, isCascading ); @@ -200,16 +200,15 @@ void Editor::setupMenu() setMetric( Q::Separator | A::Size, qskDpiScaled( 1 ) ); setBoxShape( Q::Separator, 0 ); setBoxBorderMetrics( Q::Separator, 0 ); - setGradient( Q::Separator, m_pal.darker125 ); + setGradient( Q::Separator, m_pal.primary ); setPadding( Q::Cell, QskMargins( 2, 10, 2, 10 ) ); setSpacing( Q::Cell, 5 ); setGradient( Q::Cell, Qt::transparent ); - setGradient( Q::Cursor, m_pal.accentColor ); + setGradient( Q::Cursor, QskRgb::toTransparentF( m_pal.onBackground, m_pal.focused ) ); - setColor( Q::Text, m_pal.textColor ); - setColor( Q::Text | Q::Selected, m_pal.contrastColor ); + setColor( Q::Text, m_pal.onBackground ); setFontRole( Q::Text, QskSkin::SmallFont ); setPosition( Q::Panel, 0 ); From 535d94b4942ea2dfbc777f8ebe48d13c8ebf7fac Mon Sep 17 00:00:00 2001 From: Uwe Rathmann Date: Mon, 2 May 2022 16:43:50 +0200 Subject: [PATCH 14/70] nothing useful, but fixes compiler error --- skins/material/QskMaterialSkin.cpp | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 4448bd82..28e5adf8 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -312,10 +312,9 @@ void Editor::setupSegmentedBar() setPadding( Q::Panel, 0 ); setSpacing( Q::Panel, 5 ); - setGradient( Q::Panel, m_pal.baseColor ); + setGradient( Q::Panel, m_pal.elevated( m_pal.background ) ); - setBoxBorderMetrics( Q::Panel, 2 ); - setBoxBorderColors( Q::Panel, m_pal.darker125 ); + setBoxBorderMetrics( Q::Panel, 0 ); const QSize strutSize( qskDpiScaled( 100 ), qskDpiScaled( 50 ) ); @@ -331,9 +330,11 @@ void Editor::setupSegmentedBar() } { + const auto cursor = QskRgb::toTransparentF( m_pal.onBackground, m_pal.focused ); + // Cursor - setGradient( Q::Cursor, m_pal.accentColor ); - setGradient( Q::Cursor | Q::Disabled, QColor( Qt::gray ) ); + setGradient( Q::Cursor, cursor ); + setGradient( Q::Cursor | Q::Disabled, m_pal.toDisabled( cursor ) ); setAnimation( Q::Cursor | A::Metric | A::Position, 100 ); } @@ -344,8 +345,8 @@ void Editor::setupSegmentedBar() { // Text - setColor( Q::Text, m_pal.textColor ); - setColor( Q::Text | Q::Selected, m_pal.contrastColor ); + setColor( Q::Text, m_pal.onBackground ); + setColor( Q::Text | Q::Selected, m_pal.onBackground ); } { From abc52e1bb87c38883f321054a493d9f3b6ff271a Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Thu, 2 Jun 2022 13:52:15 +0200 Subject: [PATCH 15/70] Material: Switch palettes to Material 3 Also, remove the old Material 2 palettes, since the weights etc. changed. --- src/common/QskRgbPalette.cpp | 30 +-- src/common/QskRgbPalette.h | 44 ++--- src/common/QskRgbValue.h | 345 ++++++++--------------------------- 3 files changed, 105 insertions(+), 314 deletions(-) diff --git a/src/common/QskRgbPalette.cpp b/src/common/QskRgbPalette.cpp index 79d715b6..4bc0b57c 100644 --- a/src/common/QskRgbPalette.cpp +++ b/src/common/QskRgbPalette.cpp @@ -11,8 +11,9 @@ #define RGBTABLE( c ) \ { \ - RGB( c, 50 ), RGB( c, 100 ), RGB( c, 200 ), RGB( c, 300 ), RGB( c, 400 ), \ - RGB( c, 500 ), RGB( c, 600 ), RGB( c, 700 ), RGB( c, 800 ), RGB( c, 900 ) \ + RGB( c, 0 ), RGB( c, 10 ), RGB( c, 20 ), RGB( c, 30 ), RGB( c, 40 ), \ + RGB( c, 50 ), RGB( c, 60 ), RGB( c, 70 ), RGB( c, 80 ), RGB( c, 90 ), \ + RGB( c, 95 ), RGB( c, 99 ), RGB( c, 100 ) \ } namespace @@ -26,25 +27,12 @@ namespace static constexpr QRgb table[][ Palette::NumWeights ] = { - RGBTABLE( Red ), - RGBTABLE( Pink ), - RGBTABLE( Purple ), - RGBTABLE( DeepPurple ), - RGBTABLE( Indigo ), - RGBTABLE( Blue ), - RGBTABLE( LightBlue ), - RGBTABLE( Cyan ), - RGBTABLE( Teal ), - RGBTABLE( Green ), - RGBTABLE( LightGreen ), - RGBTABLE( Lime ), - RGBTABLE( Yellow ), - RGBTABLE( Amber ), - RGBTABLE( Orange ), - RGBTABLE( DeepOrange ), - RGBTABLE( Brown ), - RGBTABLE( Grey ), - RGBTABLE( BlueGrey ), + RGBTABLE( DefaultMaterialPrimary ), + RGBTABLE( DefaultMaterialSecondary ), + RGBTABLE( DefaultMaterialTertiary ), + RGBTABLE( DefaultMaterialError ), + RGBTABLE( DefaultMaterialNeutral ), + RGBTABLE( DefaultMaterialNeutralVariant ), }; const int count = sizeof( table ) / sizeof( table[ 0 ] ); diff --git a/src/common/QskRgbPalette.h b/src/common/QskRgbPalette.h index 050dbe2b..69a8e100 100644 --- a/src/common/QskRgbPalette.h +++ b/src/common/QskRgbPalette.h @@ -19,16 +19,19 @@ class QSK_EXPORT QskRgbPalette public: enum Weight { + W0, + W10, + W20, + W30, + W40, W50, + W60, + W70, + W80, + W90, + W95, + W99, W100, - W200, - W300, - W400, - W500, - W600, - W700, - W800, - W900, NumWeights }; @@ -36,25 +39,12 @@ class QSK_EXPORT QskRgbPalette enum Theme { - Red, - Pink, - Purple, - DeepPurple, - Indigo, - Blue, - LightBlue, - Cyan, - Teal, - Green, - LightGreen, - Lime, - Yellow, - Amber, - Orange, - DeepOrange, - Brown, - Grey, - BlueGrey, + DefaultMaterialPrimary, + DefaultMaterialSecondary, + DefaultMaterialTertiary, + DefaultMaterialError, + DefaultMaterialNeutral, + DefaultMaterialNeutralVariant, NumThemes }; diff --git a/src/common/QskRgbValue.h b/src/common/QskRgbValue.h index 17302613..bbe3f540 100644 --- a/src/common/QskRgbValue.h +++ b/src/common/QskRgbValue.h @@ -157,279 +157,92 @@ RGBVALUE( Yellow, 0xffffff00 ) \ RGBVALUE( YellowGreen, 0xff9acd32 ) \ RGBVALUE( White, 0xffffffff ) \ - /* Material colors from https://material.google.com/style/color.html */ \ - RGBVALUE( Red50, 0xffffebee ) \ - RGBVALUE( Red100, 0xffffcdd2 ) \ - RGBVALUE( Red200, 0xffef9a9a ) \ - RGBVALUE( Red300, 0xffe57373 ) \ - RGBVALUE( Red400, 0xffef5350 ) \ - RGBVALUE( Red500, 0xfff44336 ) \ - RGBVALUE( Red600, 0xffe53935 ) \ - RGBVALUE( Red700, 0xffd32f2f ) \ - RGBVALUE( Red800, 0xffc62828 ) \ - RGBVALUE( Red900, 0xffb71c1c ) \ - RGBVALUE( RedA100, 0xffff8a80 ) \ - RGBVALUE( RedA200, 0xffff5252 ) \ - RGBVALUE( RedA400, 0xffff1744 ) \ - RGBVALUE( RedA700, 0xffd50000 ) \ \ - RGBVALUE( Pink50, 0xfffce4ec ) \ - RGBVALUE( Pink100, 0xfff8bbd0 ) \ - RGBVALUE( Pink200, 0xfff48fb1 ) \ - RGBVALUE( Pink300, 0xfff06292 ) \ - RGBVALUE( Pink400, 0xffec407a ) \ - RGBVALUE( Pink500, 0xffe91e63 ) \ - RGBVALUE( Pink600, 0xffd81b60 ) \ - RGBVALUE( Pink700, 0xffc2185b ) \ - RGBVALUE( Pink800, 0xffad1457 ) \ - RGBVALUE( Pink900, 0xff880e4f ) \ - RGBVALUE( PinkA100, 0xffff80ab ) \ - RGBVALUE( PinkA200, 0xffff4081 ) \ - RGBVALUE( PinkA400, 0xfff50057 ) \ - RGBVALUE( PinkA700, 0xffc51162 ) \ + /* Material colors from https://www.figma.com/file/TxkOtbaB4VoXta4ccRNi3b/Material-3-Design-Kit-(Community)?node-id=49823%3A12142 */ \ \ - RGBVALUE( Purple50, 0xfff3e5f5 ) \ - RGBVALUE( Purple100, 0xffe1bee7 ) \ - RGBVALUE( Purple200, 0xffce93d8 ) \ - RGBVALUE( Purple300, 0xffba68c8 ) \ - RGBVALUE( Purple400, 0xffab47bc ) \ - RGBVALUE( Purple500, 0xff9c27b0 ) \ - RGBVALUE( Purple600, 0xff8e24aa ) \ - RGBVALUE( Purple700, 0xff7b1fa2 ) \ - RGBVALUE( Purple800, 0xff6a1b9a ) \ - RGBVALUE( Purple900, 0xff4a148c ) \ - RGBVALUE( PurpleA100, 0xffea80fc ) \ - RGBVALUE( PurpleA200, 0xffe040fb ) \ - RGBVALUE( PurpleA400, 0xffd500f9 ) \ - RGBVALUE( PurpleA700, 0xffaa00ff ) \ + RGBVALUE( DefaultMaterialPrimary0, 0xff000000 ) \ + RGBVALUE( DefaultMaterialPrimary10, 0xff21005D ) \ + RGBVALUE( DefaultMaterialPrimary20, 0xff381E72 ) \ + RGBVALUE( DefaultMaterialPrimary30, 0xff4F378B ) \ + RGBVALUE( DefaultMaterialPrimary40, 0xff6750A4 ) \ + RGBVALUE( DefaultMaterialPrimary50, 0xff7F67BE ) \ + RGBVALUE( DefaultMaterialPrimary60, 0xffB69DF8 ) \ + RGBVALUE( DefaultMaterialPrimary70, 0xffB69DF8 ) \ + RGBVALUE( DefaultMaterialPrimary80, 0xffD0BCFF ) \ + RGBVALUE( DefaultMaterialPrimary90, 0xffEADDFF ) \ + RGBVALUE( DefaultMaterialPrimary95, 0xffF6EDFF ) \ + RGBVALUE( DefaultMaterialPrimary99, 0xffFFFBFE ) \ + RGBVALUE( DefaultMaterialPrimary100, 0xffFFFFFF ) \ \ - RGBVALUE( DeepPurple50, 0xffede7f6 ) \ - RGBVALUE( DeepPurple100, 0xffd1c4e9 ) \ - RGBVALUE( DeepPurple200, 0xffb39ddb ) \ - RGBVALUE( DeepPurple300, 0xff9575cd ) \ - RGBVALUE( DeepPurple400, 0xff7e57c2 ) \ - RGBVALUE( DeepPurple500, 0xff673ab7 ) \ - RGBVALUE( DeepPurple600, 0xff5e35b1 ) \ - RGBVALUE( DeepPurple700, 0xff512da8 ) \ - RGBVALUE( DeepPurple800, 0xff4527a0 ) \ - RGBVALUE( DeepPurple900, 0xff311b92 ) \ - RGBVALUE( DeepPurpleA100, 0xffb388ff ) \ - RGBVALUE( DeepPurpleA200, 0xff7c4dff ) \ - RGBVALUE( DeepPurpleA400, 0xff651fff ) \ - RGBVALUE( DeepPurpleA700, 0xff6200ea ) \ + RGBVALUE( DefaultMaterialSecondary0, 0xff000000 ) \ + RGBVALUE( DefaultMaterialSecondary10, 0xff1D192B ) \ + RGBVALUE( DefaultMaterialSecondary20, 0xff332D41 ) \ + RGBVALUE( DefaultMaterialSecondary30, 0xff4A4458 ) \ + RGBVALUE( DefaultMaterialSecondary40, 0xff625B71 ) \ + RGBVALUE( DefaultMaterialSecondary50, 0xff7A7289 ) \ + RGBVALUE( DefaultMaterialSecondary60, 0xff958DA5 ) \ + RGBVALUE( DefaultMaterialSecondary70, 0xffB0A7C0 ) \ + RGBVALUE( DefaultMaterialSecondary80, 0xffCCC2DC ) \ + RGBVALUE( DefaultMaterialSecondary90, 0xffE8DEF8 ) \ + RGBVALUE( DefaultMaterialSecondary95, 0xffF6EDFF ) \ + RGBVALUE( DefaultMaterialSecondary99, 0xffFFFBFE ) \ + RGBVALUE( DefaultMaterialSecondary100, 0xffFFFFFF ) \ \ - RGBVALUE( Indigo50, 0xffe8eaf6 ) \ - RGBVALUE( Indigo100, 0xffc5cae9 ) \ - RGBVALUE( Indigo200, 0xff9fa8da ) \ - RGBVALUE( Indigo300, 0xff7986cb ) \ - RGBVALUE( Indigo400, 0xff5c6bc0 ) \ - RGBVALUE( Indigo500, 0xff3f51b5 ) \ - RGBVALUE( Indigo600, 0xff3949ab ) \ - RGBVALUE( Indigo700, 0xff303f9f ) \ - RGBVALUE( Indigo800, 0xff283593 ) \ - RGBVALUE( Indigo900, 0xff1a237e ) \ - RGBVALUE( IndigoA100, 0xff8c9eff ) \ - RGBVALUE( IndigoA200, 0xff536dfe ) \ - RGBVALUE( IndigoA400, 0xff3d5afe ) \ - RGBVALUE( IndigoA700, 0xff304ffe ) \ + RGBVALUE( DefaultMaterialTertiary0, 0xff000000 ) \ + RGBVALUE( DefaultMaterialTertiary10, 0xff31111D ) \ + RGBVALUE( DefaultMaterialTertiary20, 0xff492532 ) \ + RGBVALUE( DefaultMaterialTertiary30, 0xff633B48 ) \ + RGBVALUE( DefaultMaterialTertiary40, 0xff7D5260 ) \ + RGBVALUE( DefaultMaterialTertiary50, 0xff986977 ) \ + RGBVALUE( DefaultMaterialTertiary60, 0xffB58392 ) \ + RGBVALUE( DefaultMaterialTertiary70, 0xffD29DAC ) \ + RGBVALUE( DefaultMaterialTertiary80, 0xffEFB8C8 ) \ + RGBVALUE( DefaultMaterialTertiary90, 0xffFFD8E4 ) \ + RGBVALUE( DefaultMaterialTertiary95, 0xffFFECF1 ) \ + RGBVALUE( DefaultMaterialTertiary99, 0xffFFFBFA ) \ + RGBVALUE( DefaultMaterialTertiary100, 0xffFFFFFF ) \ \ - RGBVALUE( Blue50, 0xffe3f2fd ) \ - RGBVALUE( Blue100, 0xffbbdefb ) \ - RGBVALUE( Blue200, 0xff90caf9 ) \ - RGBVALUE( Blue300, 0xff64b5f6 ) \ - RGBVALUE( Blue400, 0xff42a5f5 ) \ - RGBVALUE( Blue500, 0xff2196f3 ) \ - RGBVALUE( Blue600, 0xff1e88e5 ) \ - RGBVALUE( Blue700, 0xff1976d2 ) \ - RGBVALUE( Blue800, 0xff1565c0 ) \ - RGBVALUE( Blue900, 0xff0d47a1 ) \ - RGBVALUE( BlueA100, 0xff82b1ff ) \ - RGBVALUE( BlueA200, 0xff448aff ) \ - RGBVALUE( BlueA400, 0xff2979ff ) \ - RGBVALUE( BlueA700, 0xff2962ff ) \ + RGBVALUE( DefaultMaterialError0, 0xff000000 ) \ + RGBVALUE( DefaultMaterialError10, 0xff410E0B ) \ + RGBVALUE( DefaultMaterialError20, 0xff601410 ) \ + RGBVALUE( DefaultMaterialError30, 0xff8C1D18 ) \ + RGBVALUE( DefaultMaterialError40, 0xffB3261E ) \ + RGBVALUE( DefaultMaterialError50, 0xffDC362E ) \ + RGBVALUE( DefaultMaterialError60, 0xffE46962 ) \ + RGBVALUE( DefaultMaterialError70, 0xffEC928E ) \ + RGBVALUE( DefaultMaterialError80, 0xffF2B8B5 ) \ + RGBVALUE( DefaultMaterialError90, 0xffF9DEDC ) \ + RGBVALUE( DefaultMaterialError95, 0xffFCEEEE ) \ + RGBVALUE( DefaultMaterialError99, 0xffFFFBF9 ) \ + RGBVALUE( DefaultMaterialError100, 0xffFFFFFF ) \ \ - RGBVALUE( LightBlue50, 0xffe1f5fe ) \ - RGBVALUE( LightBlue100, 0xffb3e5fc ) \ - RGBVALUE( LightBlue200, 0xff81d4fa ) \ - RGBVALUE( LightBlue300, 0xff4fc3f7 ) \ - RGBVALUE( LightBlue400, 0xff29b6f6 ) \ - RGBVALUE( LightBlue500, 0xff03a9f4 ) \ - RGBVALUE( LightBlue600, 0xff039be5 ) \ - RGBVALUE( LightBlue700, 0xff0288d1 ) \ - RGBVALUE( LightBlue800, 0xff0277bd ) \ - RGBVALUE( LightBlue900, 0xff01579b ) \ - RGBVALUE( LightBlueA100, 0xff80d8ff ) \ - RGBVALUE( LightBlueA200, 0xff40c4ff ) \ - RGBVALUE( LightBlueA400, 0xff00b0ff ) \ - RGBVALUE( LightBlueA700, 0xff0091ea ) \ + RGBVALUE( DefaultMaterialNeutral0, 0xff000000 ) \ + RGBVALUE( DefaultMaterialNeutral10, 0xff1C1B1F ) \ + RGBVALUE( DefaultMaterialNeutral20, 0xff313033 ) \ + RGBVALUE( DefaultMaterialNeutral30, 0xff484649 ) \ + RGBVALUE( DefaultMaterialNeutral40, 0xff605D62 ) \ + RGBVALUE( DefaultMaterialNeutral50, 0xff787579 ) \ + RGBVALUE( DefaultMaterialNeutral60, 0xff939094 ) \ + RGBVALUE( DefaultMaterialNeutral70, 0xffAEAAAE ) \ + RGBVALUE( DefaultMaterialNeutral80, 0xffC9C5CA ) \ + RGBVALUE( DefaultMaterialNeutral90, 0xffE6E1E5 ) \ + RGBVALUE( DefaultMaterialNeutral95, 0xffF4EFF4 ) \ + RGBVALUE( DefaultMaterialNeutral99, 0xffFFFBFE ) \ + RGBVALUE( DefaultMaterialNeutral100, 0xffFFFFFF ) \ \ - RGBVALUE( Cyan50, 0xffe0f7fa ) \ - RGBVALUE( Cyan100, 0xffb2ebf2 ) \ - RGBVALUE( Cyan200, 0xff80deea ) \ - RGBVALUE( Cyan300, 0xff4dd0e1 ) \ - RGBVALUE( Cyan400, 0xff26c6da ) \ - RGBVALUE( Cyan500, 0xff00bcd4 ) \ - RGBVALUE( Cyan600, 0xff00acc1 ) \ - RGBVALUE( Cyan700, 0xff0097a7 ) \ - RGBVALUE( Cyan800, 0xff00838f ) \ - RGBVALUE( Cyan900, 0xff006064 ) \ - RGBVALUE( CyanA100, 0xff84ffff ) \ - RGBVALUE( CyanA200, 0xff18ffff ) \ - RGBVALUE( CyanA400, 0xff00e5ff ) \ - RGBVALUE( CyanA700, 0xff00b8d4 ) \ - \ - RGBVALUE( Teal50, 0xffe0f2f1 ) \ - RGBVALUE( Teal100, 0xffb2dfdb ) \ - RGBVALUE( Teal200, 0xff80cbc4 ) \ - RGBVALUE( Teal300, 0xff4db6ac ) \ - RGBVALUE( Teal400, 0xff26a69a ) \ - RGBVALUE( Teal500, 0xff009688 ) \ - RGBVALUE( Teal600, 0xff00897b ) \ - RGBVALUE( Teal700, 0xff00796b ) \ - RGBVALUE( Teal800, 0xff00695c ) \ - RGBVALUE( Teal900, 0xff004d40 ) \ - RGBVALUE( TealA100, 0xffa7ffeb ) \ - RGBVALUE( TealA200, 0xff64ffda ) \ - RGBVALUE( TealA400, 0xff1de9b6 ) \ - RGBVALUE( TealA700, 0xff00bfa5 ) \ - \ - RGBVALUE( Green50, 0xffe8f5e9 ) \ - RGBVALUE( Green100, 0xffc8e6c9 ) \ - RGBVALUE( Green200, 0xffa5d6a7 ) \ - RGBVALUE( Green300, 0xff81c784 ) \ - RGBVALUE( Green400, 0xff66bb6a ) \ - RGBVALUE( Green500, 0xff4caf50 ) \ - RGBVALUE( Green600, 0xff43a047 ) \ - RGBVALUE( Green700, 0xff388e3c ) \ - RGBVALUE( Green800, 0xff2e7d32 ) \ - RGBVALUE( Green900, 0xff1b5e20 ) \ - RGBVALUE( GreenA100, 0xffb9f6ca ) \ - RGBVALUE( GreenA200, 0xff69f0ae ) \ - RGBVALUE( GreenA400, 0xff00e676 ) \ - RGBVALUE( GreenA700, 0xff00c853 ) \ - \ - RGBVALUE( LightGreen50, 0xfff1f8e9 ) \ - RGBVALUE( LightGreen100, 0xffdcedc8 ) \ - RGBVALUE( LightGreen200, 0xffc5e1a5 ) \ - RGBVALUE( LightGreen300, 0xffaed581 ) \ - RGBVALUE( LightGreen400, 0xff9ccc65 ) \ - RGBVALUE( LightGreen500, 0xff8bc34a ) \ - RGBVALUE( LightGreen600, 0xff7cb342 ) \ - RGBVALUE( LightGreen700, 0xff689f38 ) \ - RGBVALUE( LightGreen800, 0xff558b2f ) \ - RGBVALUE( LightGreen900, 0xff33691e ) \ - RGBVALUE( LightGreenA100, 0xffccff90 ) \ - RGBVALUE( LightGreenA200, 0xffb2ff59 ) \ - RGBVALUE( LightGreenA400, 0xff76ff03 ) \ - RGBVALUE( LightGreenA700, 0xff64dd17 ) \ - \ - RGBVALUE( Lime50, 0xfff9fbe7 ) \ - RGBVALUE( Lime100, 0xfff0f4c3 ) \ - RGBVALUE( Lime200, 0xffe6ee9c ) \ - RGBVALUE( Lime300, 0xffdce775 ) \ - RGBVALUE( Lime400, 0xffd4e157 ) \ - RGBVALUE( Lime500, 0xffcddc39 ) \ - RGBVALUE( Lime600, 0xffc0ca33 ) \ - RGBVALUE( Lime700, 0xffafb42b ) \ - RGBVALUE( Lime800, 0xff9e9d24 ) \ - RGBVALUE( Lime900, 0xff827717 ) \ - RGBVALUE( LimeA100, 0xfff4ff81 ) \ - RGBVALUE( LimeA200, 0xffeeff41 ) \ - RGBVALUE( LimeA400, 0xffc6ff00 ) \ - RGBVALUE( LimeA700, 0xffaeea00 ) \ - \ - RGBVALUE( Yellow50, 0xfffffde7 ) \ - RGBVALUE( Yellow100, 0xfffff9c4 ) \ - RGBVALUE( Yellow200, 0xfffff59d ) \ - RGBVALUE( Yellow300, 0xfffff176 ) \ - RGBVALUE( Yellow400, 0xffffee58 ) \ - RGBVALUE( Yellow500, 0xffffeb3b ) \ - RGBVALUE( Yellow600, 0xfffdd835 ) \ - RGBVALUE( Yellow700, 0xfffbc02d ) \ - RGBVALUE( Yellow800, 0xfff9a825 ) \ - RGBVALUE( Yellow900, 0xfff57f17 ) \ - RGBVALUE( YellowA100, 0xffffff8d ) \ - RGBVALUE( YellowA200, 0xffffff00 ) \ - RGBVALUE( YellowA400, 0xffffea00 ) \ - RGBVALUE( YellowA700, 0xffffd600 ) \ - \ - RGBVALUE( Amber50, 0xfffff8e1 ) \ - RGBVALUE( Amber100, 0xffffecb3 ) \ - RGBVALUE( Amber200, 0xffffe082 ) \ - RGBVALUE( Amber300, 0xffffd54f ) \ - RGBVALUE( Amber400, 0xffffca28 ) \ - RGBVALUE( Amber500, 0xffffc107 ) \ - RGBVALUE( Amber600, 0xffffb300 ) \ - RGBVALUE( Amber700, 0xffffa000 ) \ - RGBVALUE( Amber800, 0xffff8f00 ) \ - RGBVALUE( Amber900, 0xffff6f00 ) \ - RGBVALUE( AmberA100, 0xffffe57f ) \ - RGBVALUE( AmberA200, 0xffffd740 ) \ - RGBVALUE( AmberA400, 0xffffc400 ) \ - RGBVALUE( AmberA700, 0xffffab00 ) \ - \ - RGBVALUE( Orange50, 0xfffff3e0 ) \ - RGBVALUE( Orange100, 0xffffe0b2 ) \ - RGBVALUE( Orange200, 0xffffcc80 ) \ - RGBVALUE( Orange300, 0xffffb74d ) \ - RGBVALUE( Orange400, 0xffffa726 ) \ - RGBVALUE( Orange500, 0xffff9800 ) \ - RGBVALUE( Orange600, 0xfffb8c00 ) \ - RGBVALUE( Orange700, 0xfff57c00 ) \ - RGBVALUE( Orange800, 0xffef6c00 ) \ - RGBVALUE( Orange900, 0xffe65100 ) \ - RGBVALUE( OrangeA100, 0xffffd180 ) \ - RGBVALUE( OrangeA200, 0xffffab40 ) \ - RGBVALUE( OrangeA400, 0xffff9100 ) \ - RGBVALUE( OrangeA700, 0xffff6d00 ) \ - \ - RGBVALUE( DeepOrange50, 0xfffbe9e7 ) \ - RGBVALUE( DeepOrange100, 0xffffccbc ) \ - RGBVALUE( DeepOrange200, 0xffffab91 ) \ - RGBVALUE( DeepOrange300, 0xffff8a65 ) \ - RGBVALUE( DeepOrange400, 0xffff7043 ) \ - RGBVALUE( DeepOrange500, 0xffff5722 ) \ - RGBVALUE( DeepOrange600, 0xfff4511e ) \ - RGBVALUE( DeepOrange700, 0xffe64a19 ) \ - RGBVALUE( DeepOrange800, 0xffd84315 ) \ - RGBVALUE( DeepOrange900, 0xffbf360c ) \ - RGBVALUE( DeepOrangeA100, 0xffff9e80 ) \ - RGBVALUE( DeepOrangeA200, 0xffff6e40 ) \ - RGBVALUE( DeepOrangeA400, 0xffff3d00 ) \ - RGBVALUE( DeepOrangeA700, 0xffdd2c00 ) \ - \ - RGBVALUE( Brown50, 0xffefebe9 ) \ - RGBVALUE( Brown100, 0xffd7ccc8 ) \ - RGBVALUE( Brown200, 0xffbcaaa4 ) \ - RGBVALUE( Brown300, 0xffa1887f ) \ - RGBVALUE( Brown400, 0xff8d6e63 ) \ - RGBVALUE( Brown500, 0xff795548 ) \ - RGBVALUE( Brown600, 0xff6d4c41 ) \ - RGBVALUE( Brown700, 0xff5d4037 ) \ - RGBVALUE( Brown800, 0xff4e342e ) \ - RGBVALUE( Brown900, 0xff3e2723 ) \ - \ - RGBVALUE( Grey50, 0xfffafafa ) \ - RGBVALUE( Grey100, 0xfff5f5f5 ) \ - RGBVALUE( Grey200, 0xffeeeeee ) \ - RGBVALUE( Grey300, 0xffe0e0e0 ) \ - RGBVALUE( Grey400, 0xffbdbdbd ) \ - RGBVALUE( Grey500, 0xff9e9e9e ) \ - RGBVALUE( Grey600, 0xff757575 ) \ - RGBVALUE( Grey700, 0xff616161 ) \ - RGBVALUE( Grey800, 0xff424242 ) \ - RGBVALUE( Grey900, 0xff212121 ) \ - \ - RGBVALUE( BlueGrey50, 0xffeceff1 ) \ - RGBVALUE( BlueGrey100, 0xffcfd8dc ) \ - RGBVALUE( BlueGrey200, 0xffb0bec5 ) \ - RGBVALUE( BlueGrey300, 0xff90a4ae ) \ - RGBVALUE( BlueGrey400, 0xff78909c ) \ - RGBVALUE( BlueGrey500, 0xff607d8b ) \ - RGBVALUE( BlueGrey600, 0xff546e7a ) \ - RGBVALUE( BlueGrey700, 0xff455a64 ) \ - RGBVALUE( BlueGrey800, 0xff37474f ) \ - RGBVALUE( BlueGrey900, 0xff263238 ) \ + RGBVALUE( DefaultMaterialNeutralVariant0, 0xff000000 ) \ + RGBVALUE( DefaultMaterialNeutralVariant10, 0xff1D1A22 ) \ + RGBVALUE( DefaultMaterialNeutralVariant20, 0xff322F37 ) \ + RGBVALUE( DefaultMaterialNeutralVariant30, 0xff49454F ) \ + RGBVALUE( DefaultMaterialNeutralVariant40, 0xff605D66 ) \ + RGBVALUE( DefaultMaterialNeutralVariant50, 0xff79747E ) \ + RGBVALUE( DefaultMaterialNeutralVariant60, 0xff938F99 ) \ + RGBVALUE( DefaultMaterialNeutralVariant70, 0xffAEA9B4 ) \ + RGBVALUE( DefaultMaterialNeutralVariant80, 0xffCAC4D0 ) \ + RGBVALUE( DefaultMaterialNeutralVariant90, 0xffE7E0EC ) \ + RGBVALUE( DefaultMaterialNeutralVariant95, 0xffF5EEFA ) \ + RGBVALUE( DefaultMaterialNeutralVariant99, 0xffFFFBFE ) \ + RGBVALUE( DefaultMaterialNeutralVariant100, 0xffFFFFFF ) \ \ RGBVALUE( Transparent, 0x00000000 ) \ RGBVALUE( AlphaMask, 0xff000000 ) \ From d1fb1e71cb12c3d1cce7d4a5523b556fd0465780 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Thu, 2 Jun 2022 14:20:40 +0200 Subject: [PATCH 16/70] fixup --- examples/boxes/Box.cpp | 10 +-- examples/boxes/main.cpp | 84 +++++++++---------- .../gallery/progressbar/ProgressBarPage.cpp | 20 ++--- examples/tabview/CustomSlider.cpp | 8 +- examples/tabview/CustomSliderSkinlet.cpp | 2 +- examples/tabview/OtherSlider.cpp | 8 +- skins/material/QskMaterialSkinFactory.cpp | 2 +- skins/squiek/QskSquiekSkin.cpp | 2 +- 8 files changed, 68 insertions(+), 68 deletions(-) diff --git a/examples/boxes/Box.cpp b/examples/boxes/Box.cpp index a1de2035..4492ee13 100644 --- a/examples/boxes/Box.cpp +++ b/examples/boxes/Box.cpp @@ -32,8 +32,8 @@ void Box::setBackground( FillType type, QskRgbPalette::Theme theme, bool inverte const auto pal = QskRgbPalette::palette( theme ); - const QColor light = pal.color( QskRgbPalette::W300 ); - const QColor mid = pal.color( QskRgbPalette::W600 ); + const QColor light = pal.color( QskRgbPalette::W60 ); + const QColor mid = pal.color( QskRgbPalette::W30 ); switch ( type ) { @@ -64,9 +64,9 @@ void Box::setBorder( BorderType type, QskRgbPalette::Theme theme ) setBorderWidth( 5 ); - QColor dark = pal.color( QskRgbPalette::W700 ); - QColor mid = pal.color( QskRgbPalette::W500 ); - QColor light = pal.color( QskRgbPalette::W300 ); + QColor dark = pal.color( QskRgbPalette::W30 ); + QColor mid = pal.color( QskRgbPalette::W50 ); + QColor light = pal.color( QskRgbPalette::W70 ); #if 0 dark.setAlpha( 100 ); mid.setAlpha( 100 ); diff --git a/examples/boxes/main.cpp b/examples/boxes/main.cpp index 95261fc2..50fa82ba 100644 --- a/examples/boxes/main.cpp +++ b/examples/boxes/main.cpp @@ -55,7 +55,7 @@ static void addTestRectangle( QskLinearBox* parent ) auto box = new Box( parent ); box->setMargins( 50 ); - box->setBorder( Box::Flat, QskRgbPalette::DeepOrange ); + box->setBorder( Box::Flat, QskRgbPalette::DefaultMaterialPrimary ); box->setBorderWidth( 10, 20, 40, 20 ); QskBoxShapeMetrics shape( 50, Qt::RelativeSize ); @@ -63,7 +63,7 @@ static void addTestRectangle( QskLinearBox* parent ) shape.setRadius( Qt::TopRightCorner, 70 ); box->setShape( shape ); - box->setGradient( QskGradient::Diagonal, QskRgbPalette::Blue ); + box->setGradient( QskGradient::Diagonal, QskRgbPalette::DefaultMaterialSecondary ); } static void addRectangles1( QskLinearBox* parent ) @@ -72,7 +72,7 @@ static void addRectangles1( QskLinearBox* parent ) Box::Horizontal, Box::Vertical, Box::Diagonal } ) { auto* rectangle = new MyRectangle( parent ); - rectangle->setBackground( type, QskRgbPalette::Teal ); + rectangle->setBackground( type, QskRgbPalette::DefaultMaterialTertiary ); } } @@ -82,8 +82,8 @@ static void addRectangles2( QskLinearBox* parent ) Box::Horizontal, Box::Vertical, Box::Diagonal } ) { auto* rectangle = new MyRectangle( parent ); - rectangle->setBorder( Box::Flat, QskRgbPalette::Brown ); - rectangle->setBackground( type, QskRgbPalette::Yellow ); + rectangle->setBorder( Box::Flat, QskRgbPalette::DefaultMaterialPrimary ); + rectangle->setBackground( type, QskRgbPalette::DefaultMaterialSecondary ); } } @@ -91,22 +91,22 @@ static void addRectangles3( QskLinearBox* parent ) { using namespace QskRgb; - const auto borderTheme = QskRgbPalette::Grey; - const auto fillTheme = QskRgbPalette::Blue; + const auto borderTheme = QskRgbPalette::DefaultMaterialPrimary; + const auto fillTheme = QskRgbPalette::DefaultMaterialSecondary; Box* box; box = new MyRectangle( parent ); box->setBorder( Box::Raised1, borderTheme ); - box->setGradient( Grey400 ); + box->setGradient( DefaultMaterialNeutral60 ); box = new MyRectangle( parent ); box->setBorder( Box::Sunken1, borderTheme ); - box->setGradient( QskGradient::Diagonal, Grey400, Grey500 ); + box->setGradient( QskGradient::Diagonal, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); box = new MyRectangle( parent ); box->setBorder( Box::Raised2, borderTheme ); - box->setGradient( QskGradient::Vertical, Grey400, Grey500 ); + box->setGradient( QskGradient::Vertical, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); box = new MyRectangle( parent ); box->setBorder( Box::Raised2, borderTheme ); @@ -123,7 +123,7 @@ static void addRectangles4( QskLinearBox* parent ) Box::Horizontal, Box::Vertical, Box::Diagonal } ) { auto* box = new MyRoundedRectangle( parent ); - box->setBackground( type, QskRgbPalette::DeepOrange ); + box->setBackground( type, QskRgbPalette::DefaultMaterialError ); } } @@ -133,8 +133,8 @@ static void addRectangles5( QskLinearBox* parent ) Box::Horizontal, Box::Vertical, Box::Diagonal } ) { auto* box = new MyRoundedRectangle( parent ); - box->setBorder( Box::Flat, QskRgbPalette::Indigo ); - box->setBackground( type, QskRgbPalette::Pink ); + box->setBorder( Box::Flat, QskRgbPalette::DefaultMaterialPrimary ); + box->setBackground( type, QskRgbPalette::DefaultMaterialSecondary ); } } @@ -142,22 +142,22 @@ static void addRectangles6( QskLinearBox* parent ) { using namespace QskRgb; - const auto borderTheme = QskRgbPalette::Grey; - const auto fillTheme = QskRgbPalette::Lime; + const auto borderTheme = QskRgbPalette::DefaultMaterialPrimary; + const auto fillTheme = QskRgbPalette::DefaultMaterialSecondary; Box* box; box = new MyRoundedRectangle( parent ); box->setBorder( Box::Raised1, borderTheme ); - box->setGradient( Grey400 ); + box->setGradient( DefaultMaterialNeutral60 ); box = new MyRoundedRectangle( parent ); box->setBorder( Box::Sunken1, borderTheme ); - box->setGradient( QskGradient::Diagonal, Grey400, Grey500 ); + box->setGradient( QskGradient::Diagonal, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); box = new MyRoundedRectangle( parent ); box->setBorder( Box::Raised2, borderTheme ); - box->setGradient( QskGradient::Vertical, Grey400, Grey500 ); + box->setGradient( QskGradient::Vertical, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); box = new MyRoundedRectangle( parent ); box->setBorder( Box::Raised2, borderTheme ); @@ -174,7 +174,7 @@ static void addRectangles7( QskLinearBox* parent ) Box::Horizontal, Box::Vertical, Box::Diagonal } ) { auto* box = new MyEllipse( parent ); - box->setBackground( type, QskRgbPalette::BlueGrey ); + box->setBackground( type, QskRgbPalette::DefaultMaterialNeutralVariant ); } } @@ -184,8 +184,8 @@ static void addRectangles8( QskLinearBox* parent ) Box::Horizontal, Box::Vertical, Box::Diagonal } ) { auto* box = new MyEllipse( parent ); - box->setBorder( Box::Flat, QskRgbPalette::Indigo ); - box->setBackground( type, QskRgbPalette::Red ); + box->setBorder( Box::Flat, QskRgbPalette::DefaultMaterialPrimary ); + box->setBackground( type, QskRgbPalette::DefaultMaterialError ); } } @@ -193,22 +193,22 @@ static void addRectangles9( QskLinearBox* parent ) { using namespace QskRgb; - const auto borderTheme = QskRgbPalette::Grey; - const auto fillTheme = QskRgbPalette::Lime; + const auto borderTheme = QskRgbPalette::DefaultMaterialNeutral; + const auto fillTheme = QskRgbPalette::DefaultMaterialPrimary; Box* box; box = new MyEllipse( parent ); box->setBorder( Box::Raised1, borderTheme ); - box->setGradient( Grey400 ); + box->setGradient( DefaultMaterialNeutral60 ); box = new MyEllipse( parent ); box->setBorder( Box::Sunken1, borderTheme ); - box->setGradient( QskGradient::Diagonal, Grey400, Grey500 ); + box->setGradient( QskGradient::Diagonal, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); box = new MyEllipse( parent ); box->setBorder( Box::Raised2, borderTheme ); - box->setGradient( QskGradient::Vertical, Grey400, Grey500 ); + box->setGradient( QskGradient::Vertical, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); box = new MyEllipse( parent ); box->setBorder( Box::Raised2, borderTheme ); @@ -263,14 +263,14 @@ static void addRectangles11( QskLinearBox* parent ) { auto box = new MyRectangle( parent ); - box->setBorder( Box::Flat, QskRgbPalette::Teal ); + box->setBorder( Box::Flat, QskRgbPalette::DefaultMaterialTertiary ); qreal bw[ 4 ] = { border, border, border, border }; if ( i != 0 ) bw[ i - 1 ] = 0; box->setBorderWidth( bw[ 0 ], bw[ 1 ], bw[ 2 ], bw[ 3 ] ); - box->setBackground( fillType[ i ], QskRgbPalette::Brown, i >= 3 ); + box->setBackground( fillType[ i ], QskRgbPalette::DefaultMaterialSecondary, i >= 3 ); } } @@ -281,14 +281,14 @@ static void addRectangles12( QskLinearBox* parent ) { auto* box = new Box( parent ); box->setBorderWidth( 0 ); - box->setGradient( orientation, QskRgbPalette::Brown ); + box->setGradient( orientation, QskRgbPalette::DefaultMaterialSecondary ); } for ( auto orientation : { QskGradient::Vertical, QskGradient::Diagonal } ) { auto* box = new Box( parent ); - box->setBorder( Box::Flat, QskRgbPalette::DeepOrange ); - box->setGradient( orientation, QskRgbPalette::Blue ); + box->setBorder( Box::Flat, QskRgbPalette::DefaultMaterialPrimary ); + box->setGradient( orientation, QskRgbPalette::DefaultMaterialTertiary ); } for ( auto orientation : { QskGradient::Vertical, @@ -297,15 +297,15 @@ static void addRectangles12( QskLinearBox* parent ) auto* box = new Box( parent ); box->setBorderWidth( 0 ); box->setShape( 30, 40, Qt::RelativeSize ); - box->setGradient( orientation, QskRgbPalette::Brown ); + box->setGradient( orientation, QskRgbPalette::DefaultMaterialTertiary ); } for ( auto orientation : { QskGradient::Vertical, QskGradient::Diagonal } ) { auto* box = new Box( parent ); - box->setBorder( Box::Flat, QskRgbPalette::DeepOrange ); + box->setBorder( Box::Flat, QskRgbPalette::DefaultMaterialPrimary ); box->setShape( 30, 40, Qt::RelativeSize ); - box->setGradient( orientation, QskRgbPalette::Blue ); + box->setGradient( orientation, QskRgbPalette::DefaultMaterialSecondary ); } for ( auto orientation : { QskGradient::Vertical, @@ -314,15 +314,15 @@ static void addRectangles12( QskLinearBox* parent ) auto* box = new Box( parent ); box->setBorderWidth( 0 ); box->setShape( 100, 100, Qt::RelativeSize ); - box->setGradient( orientation, QskRgbPalette::Brown ); + box->setGradient( orientation, QskRgbPalette::DefaultMaterialTertiary ); } for ( auto orientation : { QskGradient::Vertical, QskGradient::Diagonal } ) { auto* box = new Box( parent ); - box->setBorder( Box::Flat, QskRgbPalette::DeepOrange ); + box->setBorder( Box::Flat, QskRgbPalette::DefaultMaterialPrimary ); box->setShape( 100, 100, Qt::RelativeSize ); - box->setGradient( orientation, QskRgbPalette::Blue ); + box->setGradient( orientation, QskRgbPalette::DefaultMaterialSecondary ); } } @@ -374,7 +374,7 @@ static void addColoredBorderRectangles1( QskLinearBox* parent, bool rounded, Box box->setBorderGradients( gradient1, gradient2, gradient3, gradient4 ); if( fillType != Box::Unfilled ) - box->setBackground( fillType, QskRgbPalette::Indigo ); + box->setBackground( fillType, QskRgbPalette::DefaultMaterialPrimary ); if( rounded ) box->setShape( 30, Qt::AbsoluteSize ); @@ -387,7 +387,7 @@ static void addColoredBorderRectangles2( QskLinearBox* parent, bool rounded, Box box->setBorderGradients( Qt::red, Qt::green, Qt::blue, Qt::yellow ); if( fillType != Box::Unfilled ) - box->setBackground( fillType, QskRgbPalette::Indigo ); + box->setBackground( fillType, QskRgbPalette::DefaultMaterialPrimary ); if( rounded ) box->setShape( 30, Qt::AbsoluteSize ); @@ -416,7 +416,7 @@ static void addColoredBorderRectangles3( QskLinearBox* parent, bool rounded, Box box->setBorderGradients( gradient3, gradient3, gradient3, gradient3 ); if( fillType != Box::Unfilled ) - box->setBackground( fillType, QskRgbPalette::Indigo ); + box->setBackground( fillType, QskRgbPalette::DefaultMaterialPrimary ); if( rounded ) box->setShape( 30, Qt::AbsoluteSize ); @@ -430,7 +430,7 @@ static void addColoredBorderRectangles4( QskLinearBox* parent, bool rounded, Box box->setBorderGradients( gradient, gradient, gradient, gradient ); if( fillType != Box::Unfilled ) - box->setBackground( fillType, QskRgbPalette::Indigo ); + box->setBackground( fillType, QskRgbPalette::DefaultMaterialPrimary ); if( rounded ) box->setShape( 30, Qt::AbsoluteSize ); @@ -447,7 +447,7 @@ static void addColoredBorderRectangles5( QskLinearBox* parent, bool rounded, Box box->setBorderGradients( gradient, gradient, gradient, gradient ); if( fillType != Box::Unfilled ) - box->setBackground( fillType, QskRgbPalette::Indigo ); + box->setBackground( fillType, QskRgbPalette::DefaultMaterialPrimary ); if( rounded ) box->setShape( { 10, 20, 20, 40 } ); diff --git a/examples/gallery/progressbar/ProgressBarPage.cpp b/examples/gallery/progressbar/ProgressBarPage.cpp index 18985ecf..3c2efaac 100644 --- a/examples/gallery/progressbar/ProgressBarPage.cpp +++ b/examples/gallery/progressbar/ProgressBarPage.cpp @@ -30,10 +30,10 @@ namespace const auto pal = QskRgbPalette::palette( theme ); QVector< QRgb > rgb; - rgb += pal.rgb( QskRgbPalette::W200 ); - rgb += pal.rgb( QskRgbPalette::W400 ); - rgb += pal.rgb( QskRgbPalette::W600 ); - rgb += pal.rgb( QskRgbPalette::W900 ); + rgb += pal.rgb( QskRgbPalette::W90 ); + rgb += pal.rgb( QskRgbPalette::W60 ); + rgb += pal.rgb( QskRgbPalette::W40 ); + rgb += pal.rgb( QskRgbPalette::W20 ); const auto stops = QskRgbPalette::colorStops( rgb, true ); @@ -62,19 +62,19 @@ void ProgressBarPage::populate() { auto bar = new ProgressBar( hBox ); - bar->setTheme( QskRgbPalette::BlueGrey ); + bar->setTheme( QskRgbPalette::DefaultMaterialPrimary ); bar->setValue( 100 ); } { auto bar = new ProgressBar( hBox ); - bar->setTheme( QskRgbPalette::Blue ); + bar->setTheme( QskRgbPalette::DefaultMaterialSecondary ); bar->setValue( 75 ); } { auto bar = new ProgressBar( hBox ); - bar->setTheme( QskRgbPalette::Blue ); + bar->setTheme( QskRgbPalette::DefaultMaterialSecondary ); bar->setOrigin( 60 ); bar->setValue( 25 ); } @@ -90,20 +90,20 @@ void ProgressBarPage::populate() { auto bar = new ProgressBar( vBox ); - bar->setTheme( QskRgbPalette::DeepOrange ); + bar->setTheme( QskRgbPalette::DefaultMaterialPrimary ); bar->setValue( 100 ); } { auto bar = new ProgressBar( vBox ); - bar->setTheme( QskRgbPalette::Pink ); + bar->setTheme( QskRgbPalette::DefaultMaterialSecondary ); bar->setMaximum( 40 ); bar->setValue( 25 ); } { auto bar = new ProgressBar( vBox ); - bar->setTheme( QskRgbPalette::Pink ); + bar->setTheme( QskRgbPalette::DefaultMaterialSecondary ); bar->setOrigin( 40 ); bar->setValue( 10 ); } diff --git a/examples/tabview/CustomSlider.cpp b/examples/tabview/CustomSlider.cpp index e8da8471..5a97f1c9 100644 --- a/examples/tabview/CustomSlider.cpp +++ b/examples/tabview/CustomSlider.cpp @@ -26,17 +26,17 @@ CustomSlider::CustomSlider( QQuickItem* parentItem ) QskSkinHintTableEditor ed( &hintTable() ); ed.setBoxShape( Fill, 0 ); - ed.setGradient( Fill, Grey700 ); + ed.setGradient( Fill, DefaultMaterialPrimary40 ); ed.setColor( Scale, qRgb( 178, 178, 178 ) ); // for the ticks ed.setStrutSize( Handle, 80, 80 ); - ed.setColor( Handle, Grey800 ); + ed.setColor( Handle, DefaultMaterialNeutral30 ); - ed.setColor( Handle | Pressed, Orange600 ); + ed.setColor( Handle | Pressed, DefaultMaterialPrimary30 ); const auto combinationMask = Focused | Hovered; - ed.setColor( Handle, Orange600, combinationMask ); + ed.setColor( Handle, 0xfffb8c00, combinationMask ); ed.setAnimation( Handle | QskAspect::Color, 300, combinationMask ); ed.setAnimation( Handle | QskAspect::Color, 1000 ); diff --git a/examples/tabview/CustomSliderSkinlet.cpp b/examples/tabview/CustomSliderSkinlet.cpp index 0766957d..1ae6b08a 100644 --- a/examples/tabview/CustomSliderSkinlet.cpp +++ b/examples/tabview/CustomSliderSkinlet.cpp @@ -307,7 +307,7 @@ QSGNode* CustomSliderSkinlet::updateDecorationNode( labelNode = QskSkinlet::updateTextNode( slider, labelNode, QRectF( x - 0.5 * w, y, w, h ), Qt::AlignHCenter, text, qskLabelFont, - QskTextOptions(), QskTextColors( QskRgb::Grey700 ), Qsk::Normal ); + QskTextOptions(), QskTextColors( QskRgb::DefaultMaterialNeutral30 ), Qsk::Normal ); if ( labelNode ) { diff --git a/examples/tabview/OtherSlider.cpp b/examples/tabview/OtherSlider.cpp index bba59381..4561ccb5 100644 --- a/examples/tabview/OtherSlider.cpp +++ b/examples/tabview/OtherSlider.cpp @@ -37,8 +37,8 @@ OtherSlider::OtherSlider( QQuickItem* parentItem ) ed.setMetric( aspect | A::Size, h ); ed.setBoxShape( aspect, 4 ); ed.setBoxBorderMetrics( aspect, 1 ); - ed.setBoxBorderColors( aspect, Grey900 ); - ed.setGradient( aspect, Grey400 ); + ed.setBoxBorderColors( aspect, DefaultMaterialNeutral10 ); + ed.setGradient( aspect, DefaultMaterialNeutral60 ); if ( placement == A::Horizontal ) ed.setPadding( aspect, QskMargins( paddingW, 0 ) ); @@ -84,8 +84,8 @@ OtherSlider::OtherSlider( QQuickItem* parentItem ) for ( auto state : { A::NoState, Pressed } ) { - ed.setBoxBorderColors( aspect | state, Grey600 ); - ed.setGradient( aspect | state, Blue400 ); + ed.setBoxBorderColors( aspect | state, DefaultMaterialNeutral40 ); + ed.setGradient( aspect | state, DefaultMaterialPrimary60 ); } } } diff --git a/skins/material/QskMaterialSkinFactory.cpp b/skins/material/QskMaterialSkinFactory.cpp index 038103d1..cfeeebd6 100644 --- a/skins/material/QskMaterialSkinFactory.cpp +++ b/skins/material/QskMaterialSkinFactory.cpp @@ -71,7 +71,7 @@ QskSkin* QskMaterialSkinFactory::createSkin( const QString& skinName ) pal.secondary = 0xff03dac6; pal.secondaryVariant = 0xff018786; pal.onSecondary = QskRgb::White; - pal.background = QskRgb::Grey100; + pal.background = QskRgb::DefaultMaterialNeutral90; pal.onBackground = QskRgb::Black; pal.error = 0xffb00020; pal.onError = QskRgb::White; diff --git a/skins/squiek/QskSquiekSkin.cpp b/skins/squiek/QskSquiekSkin.cpp index bfe118ad..4a0d8cae 100644 --- a/skins/squiek/QskSquiekSkin.cpp +++ b/skins/squiek/QskSquiekSkin.cpp @@ -89,7 +89,7 @@ namespace contrasted = DarkGrey; contrastedText = White; - highlighted = BlueGrey500; + highlighted = 0xff607d8b; highlightedText = White; base = Black; From 6281a6afe0cbac2dbad2df269590946bd933c9e1 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 3 Jun 2022 09:11:29 +0200 Subject: [PATCH 17/70] Material: Use predefined palettes At some later point we might want to make the palettes settable, so the user can define his own palettes. --- skins/material/QskMaterialSkinFactory.cpp | 14 ++++++++++++-- skins/material/QskMaterialSkinFactory.h | 16 ++++++++++++++++ 2 files changed, 28 insertions(+), 2 deletions(-) diff --git a/skins/material/QskMaterialSkinFactory.cpp b/skins/material/QskMaterialSkinFactory.cpp index cfeeebd6..2f12ba79 100644 --- a/skins/material/QskMaterialSkinFactory.cpp +++ b/skins/material/QskMaterialSkinFactory.cpp @@ -48,6 +48,14 @@ namespace QskMaterialSkinFactory::QskMaterialSkinFactory( QObject* parent ) : QskSkinFactory( parent ) { + using Q = QskRgbPalette; + + m_palettes[ Primary ] = Q::palette( Q::DefaultMaterialPrimary ); + m_palettes[ Secondary ] = Q::palette( Q::DefaultMaterialSecondary ); + m_palettes[ Tertiary ] = Q::palette( Q::DefaultMaterialTertiary ); + m_palettes[ Error ] = Q::palette( Q::DefaultMaterialError ); + m_palettes[ Neutral ] = Q::palette( Q::DefaultMaterialNeutral ); + m_palettes[ NeutralVariant ] = Q::palette( Q::DefaultMaterialNeutralVariant ); } QskMaterialSkinFactory::~QskMaterialSkinFactory() @@ -63,9 +71,11 @@ QskSkin* QskMaterialSkinFactory::createSkin( const QString& skinName ) { if ( QString::compare( skinName, materialLightSkinName, Qt::CaseInsensitive ) == 0 ) { - QskMaterialPalette pal( QskMaterialPalette::Light );; + QskMaterialPalette pal( QskMaterialPalette::Light ); - pal.primary = 0xff6200ee; + using Q = QskRgbPalette; + + pal.primary = m_palettes[ Primary ].rgb( Q::W40 ); pal.primaryVariant = 0xff3700b3; pal.onPrimary = QskRgb::White; pal.secondary = 0xff03dac6; diff --git a/skins/material/QskMaterialSkinFactory.h b/skins/material/QskMaterialSkinFactory.h index 8294e824..f1a06c8a 100644 --- a/skins/material/QskMaterialSkinFactory.h +++ b/skins/material/QskMaterialSkinFactory.h @@ -7,6 +7,7 @@ #define QSK_MATERIAL_SKIN_FACTORY_H #include "QskMaterialGlobal.h" +#include #include class QSK_MATERIAL_EXPORT QskMaterialSkinFactory : public QskSkinFactory @@ -20,8 +21,23 @@ class QSK_MATERIAL_EXPORT QskMaterialSkinFactory : public QskSkinFactory QskMaterialSkinFactory( QObject* parent = nullptr ); ~QskMaterialSkinFactory() override; + enum PaletteType + { + Primary, + Secondary, + Tertiary, + Error, + Neutral, + NeutralVariant, + + NumPaletteTypes + }; + QStringList skinNames() const override; QskSkin* createSkin( const QString& skinName ) override; + + private: + QskRgbPalette m_palettes[ NumPaletteTypes ]; }; #endif From 17185addeb8244573e1e035253134d36a2096164 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 3 Jun 2022 09:32:29 +0200 Subject: [PATCH 18/70] fixup? Material: Use predefined palettes in skin --- skins/material/QskMaterialSkin.h | 59 ++++------- skins/material/QskMaterialSkinFactory.cpp | 121 +++++++++++----------- 2 files changed, 76 insertions(+), 104 deletions(-) diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index 4e04b2fc..c387f70a 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -13,59 +13,36 @@ class QSK_MATERIAL_EXPORT QskMaterialPalette { public: - enum Lightness - { - Light, - Dark - }; + // ### here add palettes? Or just pass them in the constructor? - QskMaterialPalette( Lightness lightness ) - : m_lightness( lightness ) - { - } - - inline QRgb elevated( const QRgb rgb, const float level = 1 ) const - { - return ( m_lightness == Light ) - ? QskRgb::darker( rgb, 100 + level * 15 ) - : QskRgb::lighter( rgb, 130 + level * 30 ); - } - - inline QRgb toDisabled( const QRgb rgb ) const - { - return QskRgb::toTransparentF( rgb, this->m_disabled ); - } - - public: QRgb primary; - QRgb primaryVariant; QRgb onPrimary; + QRgb primaryContainer; + QRgb onPrimaryContainer; QRgb secondary; - QRgb secondaryVariant; QRgb onSecondary; + QRgb secondaryContainer; + QRgb onSecondaryContainer; - QRgb background; - QRgb onBackground; + QRgb tertiary; + QRgb onTertiary; + QRgb tertiaryContainer; + QRgb onTertiaryContainer; QRgb error; QRgb onError; + QRgb errorContainer; + QRgb onErrorContainer; - QRgb primaryNoSaturation; - QRgb secondaryNoSaturation; - QRgb secondaryVariantNoSaturation; + QRgb background; + QRgb onBackground; + QRgb surface; + QRgb onSurface; - const qreal disabledOccupancy = 0.2; - const qreal widgetBackgroundDisabled = 0.6; - - const qreal hover = 0.1; - const qreal focused = 0.4; - const qreal pressed = 0.5; - - private: - const qreal m_disabled = 0.3; - - const Lightness m_lightness; + QRgb surfaceVariant; + QRgb onSurfaceVariant; + QRgb outline; }; class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin diff --git a/skins/material/QskMaterialSkinFactory.cpp b/skins/material/QskMaterialSkinFactory.cpp index 2f12ba79..d82a4e1a 100644 --- a/skins/material/QskMaterialSkinFactory.cpp +++ b/skins/material/QskMaterialSkinFactory.cpp @@ -9,42 +9,6 @@ static const QString materialLightSkinName = QStringLiteral( "materialLight" ); static const QString materialDarkSkinName = QStringLiteral( "materialDark" ); -namespace -{ - inline int lightnessRgb( QRgb rgb ) - { - const int red = qRed( rgb ); - const int green = qGreen( rgb ); - const int blue = qBlue( rgb ); - - int min, max; - - if ( red > green ) - { - max = qMax( red, blue ); - min = qMin( green, blue ); - } - else - { - max = qMax( green, blue ); - min = qMin( red, blue ); - } - - return ( max + min ) / 2; - } - - inline QRgb toUnsaturated( QRgb rgb ) - { - /* - a saturation of 0 results in having the lightness as r,g,b - Is this intended ? - */ - - const auto l = lightnessRgb( rgb ); - return qRgba( l, l, l, qAlpha( rgb ) ); - } -} - QskMaterialSkinFactory::QskMaterialSkinFactory( QObject* parent ) : QskSkinFactory( parent ) { @@ -71,46 +35,77 @@ QskSkin* QskMaterialSkinFactory::createSkin( const QString& skinName ) { if ( QString::compare( skinName, materialLightSkinName, Qt::CaseInsensitive ) == 0 ) { - QskMaterialPalette pal( QskMaterialPalette::Light ); + // ### Move this to QskMaterialSkin? + QskMaterialPalette pal; using Q = QskRgbPalette; pal.primary = m_palettes[ Primary ].rgb( Q::W40 ); - pal.primaryVariant = 0xff3700b3; - pal.onPrimary = QskRgb::White; - pal.secondary = 0xff03dac6; - pal.secondaryVariant = 0xff018786; - pal.onSecondary = QskRgb::White; - pal.background = QskRgb::DefaultMaterialNeutral90; - pal.onBackground = QskRgb::Black; - pal.error = 0xffb00020; - pal.onError = QskRgb::White; + pal.onPrimary = m_palettes[ Primary ].rgb( Q::W100 ); + pal.primaryContainer = m_palettes[ Primary ].rgb( Q::W90 ); + pal.onPrimaryContainer = m_palettes[ Primary ].rgb( Q::W10 ); - pal.primaryNoSaturation = toUnsaturated( pal.primary ); - pal.secondaryNoSaturation = toUnsaturated( pal.secondary ); - pal.secondaryVariantNoSaturation = toUnsaturated( pal.secondaryVariant ); + pal.primary = m_palettes[ Secondary ].rgb( Q::W40 ); + pal.onSecondary = m_palettes[ Secondary ].rgb( Q::W100 ); + pal.secondaryContainer = m_palettes[ Secondary ].rgb( Q::W90 ); + pal.onSecondaryContainer = m_palettes[ Secondary ].rgb( Q::W10 ); + + pal.tertiary = m_palettes[ Tertiary ].rgb( Q::W40 ); + pal.onTertiary = m_palettes[ Tertiary ].rgb( Q::W100 ); + pal.tertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W90 ); + pal.onTertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W10 ); + + pal.error = m_palettes[ Error ].rgb( Q::W40 ); + pal.onError = m_palettes[ Error ].rgb( Q::W100 ); + pal.errorContainer = m_palettes[ Error ].rgb( Q::W90 ); + pal.onErrorContainer = m_palettes[ Error ].rgb( Q::W10 ); + + pal.background = m_palettes[ Neutral ].rgb( Q::W99 ); + pal.onBackground = m_palettes[ Neutral ].rgb( Q::W10 ); + pal.surface = m_palettes[ Neutral ].rgb( Q::W99 ); + pal.onSurface = m_palettes[ Neutral ].rgb( Q::W10 ); + + pal.surfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W90 ); + pal.onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); + pal.outline = m_palettes[ NeutralVariant ].rgb( Q::W50 ); return new QskMaterialSkin( pal ); } if ( QString::compare( skinName, materialDarkSkinName, Qt::CaseInsensitive ) == 0 ) { - QskMaterialPalette pal( QskMaterialPalette::Dark ); + QskMaterialPalette pal; - pal.primary = 0xffbb86fc; - pal.primaryVariant = 0xff3700b3; - pal.onPrimary = QskRgb::Black; - pal.secondary = 0xff03dac6; - pal.secondaryVariant = 0xff018786; - pal.onSecondary = QskRgb::Black; - pal.background = 0xff121212; - pal.onBackground = QskRgb::White; - pal.error = 0xffcf6679; - pal.onError = QskRgb::Black; + using Q = QskRgbPalette; - pal.primaryNoSaturation = toUnsaturated( pal.primary ); - pal.secondaryNoSaturation = toUnsaturated( pal.secondary ); - pal.secondaryVariantNoSaturation = toUnsaturated( pal.secondaryVariant ); + pal.primary = m_palettes[ Primary ].rgb( Q::W80 ); + pal.onPrimary = m_palettes[ Primary ].rgb( Q::W20 ); + pal.primaryContainer = m_palettes[ Primary ].rgb( Q::W30 ); + pal.onPrimaryContainer = m_palettes[ Primary ].rgb( Q::W90 ); + + pal.primary = m_palettes[ Secondary ].rgb( Q::W80 ); + pal.onSecondary = m_palettes[ Secondary ].rgb( Q::W20 ); + pal.secondaryContainer = m_palettes[ Secondary ].rgb( Q::W30 ); + pal.onSecondaryContainer = m_palettes[ Secondary ].rgb( Q::W90 ); + + pal.tertiary = m_palettes[ Tertiary ].rgb( Q::W80 ); + pal.onTertiary = m_palettes[ Tertiary ].rgb( Q::W20 ); + pal.tertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W30 ); + pal.onTertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W90 ); + + pal.error = m_palettes[ Error ].rgb( Q::W80 ); + pal.onError = m_palettes[ Error ].rgb( Q::W20 ); + pal.errorContainer = m_palettes[ Error ].rgb( Q::W30 ); + pal.onErrorContainer = m_palettes[ Error ].rgb( Q::W90 ); + + pal.background = m_palettes[ Neutral ].rgb( Q::W10 ); + pal.onBackground = m_palettes[ Neutral ].rgb( Q::W90 ); + pal.surface = m_palettes[ Neutral ].rgb( Q::W10 ); + pal.onSurface = m_palettes[ Neutral ].rgb( Q::W80 ); + + pal.surfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); + pal.onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W80 ); + pal.outline = m_palettes[ NeutralVariant ].rgb( Q::W60 ); return new QskMaterialSkin( pal ); } From fdd19894fb0e4b705db6c9b5edae7c5eb27de3f9 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 3 Jun 2022 10:15:20 +0200 Subject: [PATCH 19/70] fixup Material: Move palette generation around --- skins/material/QskMaterialSkin.cpp | 93 ++++++++++++++++++++++- skins/material/QskMaterialSkin.h | 32 +++++++- skins/material/QskMaterialSkinFactory.cpp | 84 ++------------------ skins/material/QskMaterialSkinFactory.h | 15 ---- 4 files changed, 123 insertions(+), 101 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 28e5adf8..1873e030 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -55,7 +55,7 @@ namespace class Editor : private QskSkinHintTableEditor { public: - Editor( QskSkinHintTable* table, const QskMaterialPalette& palette ) + Editor( QskSkinHintTable* table, const QskMaterialTheme& palette ) : QskSkinHintTableEditor( table ) , m_pal( palette ) { @@ -91,7 +91,7 @@ namespace void setupTextInput(); void setupTextLabel(); - const QskMaterialPalette& m_pal; + const QskMaterialTheme& m_pal; const uint rippleSize = 30; }; } @@ -830,7 +830,94 @@ void Editor::setupSubWindow() } -QskMaterialSkin::QskMaterialSkin( const QskMaterialPalette& palette, QObject* parent ) +QskMaterialTheme::QskMaterialTheme( Lightness lightness ) + : QskMaterialTheme( lightness, + { + QskRgbPalette::palette( QskRgbPalette::DefaultMaterialPrimary ), + QskRgbPalette::palette( QskRgbPalette::DefaultMaterialSecondary ), + QskRgbPalette::palette( QskRgbPalette::DefaultMaterialTertiary ), + QskRgbPalette::palette( QskRgbPalette::DefaultMaterialError ), + QskRgbPalette::palette( QskRgbPalette::DefaultMaterialNeutral ), + QskRgbPalette::palette( QskRgbPalette::DefaultMaterialNeutralVariant ), + } ) +{ +} + +QskMaterialTheme::QskMaterialTheme( Lightness lightness, + std::array< QskRgbPalette, NumPaletteTypes > palettes ) + : m_palettes( palettes ) +{ + using Q = QskRgbPalette; + + if ( lightness == Light ) + { + using Q = QskRgbPalette; + + primary = m_palettes[ Primary ].rgb( Q::W40 ); + onPrimary = m_palettes[ Primary ].rgb( Q::W100 ); + primaryContainer = m_palettes[ Primary ].rgb( Q::W90 ); + onPrimaryContainer = m_palettes[ Primary ].rgb( Q::W10 ); + + primary = m_palettes[ Secondary ].rgb( Q::W40 ); + onSecondary = m_palettes[ Secondary ].rgb( Q::W100 ); + secondaryContainer = m_palettes[ Secondary ].rgb( Q::W90 ); + onSecondaryContainer = m_palettes[ Secondary ].rgb( Q::W10 ); + + tertiary = m_palettes[ Tertiary ].rgb( Q::W40 ); + onTertiary = m_palettes[ Tertiary ].rgb( Q::W100 ); + tertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W90 ); + onTertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W10 ); + + error = m_palettes[ Error ].rgb( Q::W40 ); + onError = m_palettes[ Error ].rgb( Q::W100 ); + errorContainer = m_palettes[ Error ].rgb( Q::W90 ); + onErrorContainer = m_palettes[ Error ].rgb( Q::W10 ); + + background = m_palettes[ Neutral ].rgb( Q::W99 ); + onBackground = m_palettes[ Neutral ].rgb( Q::W10 ); + surface = m_palettes[ Neutral ].rgb( Q::W99 ); + onSurface = m_palettes[ Neutral ].rgb( Q::W10 ); + + surfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W90 ); + onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); + outline = m_palettes[ NeutralVariant ].rgb( Q::W50 ); + } + else if ( lightness == Dark ) + { + using Q = QskRgbPalette; + + primary = m_palettes[ Primary ].rgb( Q::W80 ); + onPrimary = m_palettes[ Primary ].rgb( Q::W20 ); + primaryContainer = m_palettes[ Primary ].rgb( Q::W30 ); + onPrimaryContainer = m_palettes[ Primary ].rgb( Q::W90 ); + + primary = m_palettes[ Secondary ].rgb( Q::W80 ); + onSecondary = m_palettes[ Secondary ].rgb( Q::W20 ); + secondaryContainer = m_palettes[ Secondary ].rgb( Q::W30 ); + onSecondaryContainer = m_palettes[ Secondary ].rgb( Q::W90 ); + + tertiary = m_palettes[ Tertiary ].rgb( Q::W80 ); + onTertiary = m_palettes[ Tertiary ].rgb( Q::W20 ); + tertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W30 ); + onTertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W90 ); + + error = m_palettes[ Error ].rgb( Q::W80 ); + onError = m_palettes[ Error ].rgb( Q::W20 ); + errorContainer = m_palettes[ Error ].rgb( Q::W30 ); + onErrorContainer = m_palettes[ Error ].rgb( Q::W90 ); + + background = m_palettes[ Neutral ].rgb( Q::W10 ); + onBackground = m_palettes[ Neutral ].rgb( Q::W90 ); + surface = m_palettes[ Neutral ].rgb( Q::W10 ); + onSurface = m_palettes[ Neutral ].rgb( Q::W80 ); + + surfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); + onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W80 ); + outline = m_palettes[ NeutralVariant ].rgb( Q::W60 ); + } +} + +QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& palette, QObject* parent ) : Inherited( parent ) { // Default theme colors diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index c387f70a..b070862c 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -8,12 +8,31 @@ #include "QskMaterialGlobal.h" #include -#include +#include -class QSK_MATERIAL_EXPORT QskMaterialPalette +class QSK_MATERIAL_EXPORT QskMaterialTheme { public: - // ### here add palettes? Or just pass them in the constructor? + enum Lightness + { + Light, + Dark + }; + + enum PaletteType + { + Primary, + Secondary, + Tertiary, + Error, + Neutral, + NeutralVariant, + + NumPaletteTypes + }; + + QskMaterialTheme( Lightness ); + QskMaterialTheme( Lightness, std::array< QskRgbPalette, NumPaletteTypes > ); QRgb primary; QRgb onPrimary; @@ -43,6 +62,9 @@ class QSK_MATERIAL_EXPORT QskMaterialPalette QRgb surfaceVariant; QRgb onSurfaceVariant; QRgb outline; + + private: + std::array< QskRgbPalette, NumPaletteTypes > m_palettes; }; class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin @@ -52,8 +74,10 @@ class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin using Inherited = QskSkin; public: - QskMaterialSkin( const QskMaterialPalette&, QObject* parent = nullptr ); + QskMaterialSkin( const QskMaterialTheme&, QObject* parent = nullptr ); ~QskMaterialSkin() override; + + // ### add setTheme() re-implement resetColors() }; #endif diff --git a/skins/material/QskMaterialSkinFactory.cpp b/skins/material/QskMaterialSkinFactory.cpp index d82a4e1a..e73cd20f 100644 --- a/skins/material/QskMaterialSkinFactory.cpp +++ b/skins/material/QskMaterialSkinFactory.cpp @@ -12,14 +12,6 @@ static const QString materialDarkSkinName = QStringLiteral( "materialDark" ); QskMaterialSkinFactory::QskMaterialSkinFactory( QObject* parent ) : QskSkinFactory( parent ) { - using Q = QskRgbPalette; - - m_palettes[ Primary ] = Q::palette( Q::DefaultMaterialPrimary ); - m_palettes[ Secondary ] = Q::palette( Q::DefaultMaterialSecondary ); - m_palettes[ Tertiary ] = Q::palette( Q::DefaultMaterialTertiary ); - m_palettes[ Error ] = Q::palette( Q::DefaultMaterialError ); - m_palettes[ Neutral ] = Q::palette( Q::DefaultMaterialNeutral ); - m_palettes[ NeutralVariant ] = Q::palette( Q::DefaultMaterialNeutralVariant ); } QskMaterialSkinFactory::~QskMaterialSkinFactory() @@ -35,79 +27,13 @@ QskSkin* QskMaterialSkinFactory::createSkin( const QString& skinName ) { if ( QString::compare( skinName, materialLightSkinName, Qt::CaseInsensitive ) == 0 ) { - // ### Move this to QskMaterialSkin? - QskMaterialPalette pal; - - using Q = QskRgbPalette; - - pal.primary = m_palettes[ Primary ].rgb( Q::W40 ); - pal.onPrimary = m_palettes[ Primary ].rgb( Q::W100 ); - pal.primaryContainer = m_palettes[ Primary ].rgb( Q::W90 ); - pal.onPrimaryContainer = m_palettes[ Primary ].rgb( Q::W10 ); - - pal.primary = m_palettes[ Secondary ].rgb( Q::W40 ); - pal.onSecondary = m_palettes[ Secondary ].rgb( Q::W100 ); - pal.secondaryContainer = m_palettes[ Secondary ].rgb( Q::W90 ); - pal.onSecondaryContainer = m_palettes[ Secondary ].rgb( Q::W10 ); - - pal.tertiary = m_palettes[ Tertiary ].rgb( Q::W40 ); - pal.onTertiary = m_palettes[ Tertiary ].rgb( Q::W100 ); - pal.tertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W90 ); - pal.onTertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W10 ); - - pal.error = m_palettes[ Error ].rgb( Q::W40 ); - pal.onError = m_palettes[ Error ].rgb( Q::W100 ); - pal.errorContainer = m_palettes[ Error ].rgb( Q::W90 ); - pal.onErrorContainer = m_palettes[ Error ].rgb( Q::W10 ); - - pal.background = m_palettes[ Neutral ].rgb( Q::W99 ); - pal.onBackground = m_palettes[ Neutral ].rgb( Q::W10 ); - pal.surface = m_palettes[ Neutral ].rgb( Q::W99 ); - pal.onSurface = m_palettes[ Neutral ].rgb( Q::W10 ); - - pal.surfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W90 ); - pal.onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); - pal.outline = m_palettes[ NeutralVariant ].rgb( Q::W50 ); - - return new QskMaterialSkin( pal ); + QskMaterialTheme theme( QskMaterialTheme::Light ); + return new QskMaterialSkin( theme ); } - - if ( QString::compare( skinName, materialDarkSkinName, Qt::CaseInsensitive ) == 0 ) + else if ( QString::compare( skinName, materialDarkSkinName, Qt::CaseInsensitive ) == 0 ) { - QskMaterialPalette pal; - - using Q = QskRgbPalette; - - pal.primary = m_palettes[ Primary ].rgb( Q::W80 ); - pal.onPrimary = m_palettes[ Primary ].rgb( Q::W20 ); - pal.primaryContainer = m_palettes[ Primary ].rgb( Q::W30 ); - pal.onPrimaryContainer = m_palettes[ Primary ].rgb( Q::W90 ); - - pal.primary = m_palettes[ Secondary ].rgb( Q::W80 ); - pal.onSecondary = m_palettes[ Secondary ].rgb( Q::W20 ); - pal.secondaryContainer = m_palettes[ Secondary ].rgb( Q::W30 ); - pal.onSecondaryContainer = m_palettes[ Secondary ].rgb( Q::W90 ); - - pal.tertiary = m_palettes[ Tertiary ].rgb( Q::W80 ); - pal.onTertiary = m_palettes[ Tertiary ].rgb( Q::W20 ); - pal.tertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W30 ); - pal.onTertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W90 ); - - pal.error = m_palettes[ Error ].rgb( Q::W80 ); - pal.onError = m_palettes[ Error ].rgb( Q::W20 ); - pal.errorContainer = m_palettes[ Error ].rgb( Q::W30 ); - pal.onErrorContainer = m_palettes[ Error ].rgb( Q::W90 ); - - pal.background = m_palettes[ Neutral ].rgb( Q::W10 ); - pal.onBackground = m_palettes[ Neutral ].rgb( Q::W90 ); - pal.surface = m_palettes[ Neutral ].rgb( Q::W10 ); - pal.onSurface = m_palettes[ Neutral ].rgb( Q::W80 ); - - pal.surfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); - pal.onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W80 ); - pal.outline = m_palettes[ NeutralVariant ].rgb( Q::W60 ); - - return new QskMaterialSkin( pal ); + QskMaterialTheme theme( QskMaterialTheme::Dark ); + return new QskMaterialSkin( theme ); } return nullptr; diff --git a/skins/material/QskMaterialSkinFactory.h b/skins/material/QskMaterialSkinFactory.h index f1a06c8a..0936d76b 100644 --- a/skins/material/QskMaterialSkinFactory.h +++ b/skins/material/QskMaterialSkinFactory.h @@ -21,23 +21,8 @@ class QSK_MATERIAL_EXPORT QskMaterialSkinFactory : public QskSkinFactory QskMaterialSkinFactory( QObject* parent = nullptr ); ~QskMaterialSkinFactory() override; - enum PaletteType - { - Primary, - Secondary, - Tertiary, - Error, - Neutral, - NeutralVariant, - - NumPaletteTypes - }; - QStringList skinNames() const override; QskSkin* createSkin( const QString& skinName ) override; - - private: - QskRgbPalette m_palettes[ NumPaletteTypes ]; }; #endif From d456237feb6afba7760c02149713da30f0625f57 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 3 Jun 2022 17:09:02 +0200 Subject: [PATCH 20/70] switch button: Fix size hint This fixes the case where the Groove is bigger than the Handle, e.g. with the Material 3 switch buttons. --- src/controls/QskSwitchButtonSkinlet.cpp | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/controls/QskSwitchButtonSkinlet.cpp b/src/controls/QskSwitchButtonSkinlet.cpp index f18d45b2..4538b0c8 100644 --- a/src/controls/QskSwitchButtonSkinlet.cpp +++ b/src/controls/QskSwitchButtonSkinlet.cpp @@ -67,7 +67,7 @@ QSizeF QskSwitchButtonSkinlet::sizeHint( const QskSkinnable* skinnable, auto handleHint = skinnable->strutSizeHint( QskSwitchButton::Handle ); auto rippleHint = skinnable->strutSizeHint( QskSwitchButton::Ripple ); - auto hint = grooveHint.expandedTo( grooveHint + rippleHint - handleHint ); + auto hint = grooveHint; hint = hint.expandedTo( rippleHint ); hint = hint.expandedTo( handleHint ); From 8a14b75747e4823e4f4f47b3422e8eec09ff0914 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 3 Jun 2022 10:40:13 +0200 Subject: [PATCH 21/70] Material: Set values according to new palette --- skins/material/QskMaterialSkin.cpp | 370 +++++++++++++---------------- skins/material/QskMaterialSkin.h | 5 + 2 files changed, 166 insertions(+), 209 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 1873e030..3e9342e6 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -92,7 +92,7 @@ namespace void setupTextLabel(); const QskMaterialTheme& m_pal; - const uint rippleSize = 30; + const uint rippleSize = 40; // ### remove }; } @@ -129,14 +129,11 @@ void Editor::setup() void Editor::setupControl() { using A = QskAspect; - using Q = QskControl; setPadding( A::Control, 11 ); setGradient( A::Control, m_pal.background ); setColor( A::Control | A::StyleColor, m_pal.onBackground ); - setColor( A::Control | A::StyleColor | Q::Disabled, - QskRgb::toTransparentF( m_pal.onBackground, 0.6 ) ); } void Editor::setupCheckBox() @@ -144,18 +141,30 @@ void Editor::setupCheckBox() using A = QskAspect; using Q = QskCheckBox; - const qreal size = qskDpiScaled( 18 ); - - setStrutSize( Q::Panel, size, size ); - setPadding( Q::Panel, 3 ); + setStrutSize( Q::Panel, 24, 24 ); + setPadding( Q::Panel, 6 ); setBoxShape( Q::Panel, 2 ); + setBoxBorderMetrics( Q::Panel, 2 ); + setBoxBorderColors( Q::Panel, m_pal.onBackground ); + setBoxBorderMetrics( Q::Panel | Q::Checked, 0 ); - setGradient( Q::Panel, m_pal.secondaryNoSaturation ); - setGradient( Q::Panel | Q::Checked, m_pal.secondary ); - setGradient( Q::Panel | Q::Checked | Q::Disabled, QskRgb::Grey ); + setGradient( Q::Panel, m_pal.background ); + setGradient( Q::Panel | Q::Checked, m_pal.primary ); - setColor( Q::Indicator, m_pal.primary ); + QColor c3( m_pal.surfaceVariant ); + c3.setAlphaF( 0.12 ); + setGradient( Q::Panel | Q::Disabled, c3 ); + + QColor c1( m_pal.onSurface ); + c1.setAlphaF( 0.12 ); + setGradient( Q::Panel | Q::Checked | Q::Disabled, c1 ); + + + setColor( Q::Indicator | Q::Checked, m_pal.primaryContainer ); + QColor c4( m_pal.onSurface ); + c4.setAlphaF( 0.38 ); + setColor( Q::Indicator | Q::Checked | Q::Disabled, c4 ); setAnimation( Q::Panel | A::Color, qskDuration ); } @@ -175,12 +184,7 @@ void Editor::setupPopup() using Q = QskPopup; setFlagHint( Q::Overlay | A::Style, true ); - - const QskGradient gradient( QskGradient::Vertical, - QskRgb::toTransparentF( m_pal.secondary, 0.45 ), - QskRgb::toTransparentF( m_pal.secondary, 0.7 ) ); - - setGradient( Q::Overlay, gradient ); + setGradient( Q::Overlay, m_pal.surface ); } void Editor::setupMenu() @@ -208,7 +212,7 @@ void Editor::setupMenu() setSpacing( Q::Segment, 5 ); setGradient( Q::Segment, Qt::transparent ); - setGradient( Q::Cursor, QskRgb::toTransparentF( m_pal.onBackground, m_pal.focused ) ); + setGradient( Q::Cursor, m_pal.primary ); setColor( Q::Text, m_pal.onBackground ); setFontRole( Q::Text, QskSkin::SmallFont ); @@ -225,20 +229,15 @@ void Editor::setupTextLabel() using Q = QskTextLabel; setAlignment( Q::Text, Qt::AlignCenter ); - setColor( Q::Text, m_pal.onBackground ); + setColor( Q::Text, m_pal.onSurface ); setPadding( Q::Panel, 5 ); - setBoxShape( Q::Panel, 4 ); - setBoxBorderMetrics( Q::Panel, 2 ); - setBoxBorderColors( Q::Panel, m_pal.primaryNoSaturation ); - setGradient( Q::Panel, m_pal.background ); } void Editor::setupTextInput() { using Q = QskTextInput; - using namespace QskRgb; setAlignment( Q::Text, Qt::AlignLeft | Qt::AlignTop ); @@ -247,25 +246,28 @@ void Editor::setupTextInput() setPadding( Q::Panel, 5 ); setBoxShape( Q::Panel, 4, 4, 0, 0 ); setBoxBorderMetrics( Q::Panel, 0, 0, 0, 1 ); - setBoxBorderColors( Q::Panel, m_pal.onBackground ); + setBoxBorderColors( Q::Panel, m_pal.onSurface ); setBoxBorderMetrics( Q::Panel | Q::Focused, 0, 0, 0, 2 ); setBoxBorderColors( Q::Panel | Q::Focused, m_pal.primary ); + setBoxBorderMetrics( Q::Panel | Q::Editing, 0, 0, 0, 2 ); setBoxBorderColors( Q::Panel | Q::Editing, m_pal.primary ); - setBoxBorderColors( Q::Panel | Q::Focused, m_pal.primary ); + setBoxBorderMetrics( Q::Panel | Q::Hovered, 0, 0, 0, 1 ); + setBoxBorderColors( Q::Panel | Q::Hovered, m_pal.onSurface ); - setGradient( Q::Panel, m_pal.elevated( m_pal.background, 1 ) ); - setGradient( Q::Panel | Q::Hovered, m_pal.elevated( m_pal.background, 2 ) ); - setGradient( Q::Panel | Q::Focused, m_pal.elevated( m_pal.background, 3 ) ); - setGradient( Q::Panel | Q::Editing, m_pal.elevated( m_pal.background, 4 ) ); + setGradient( Q::Panel, m_pal.surfaceVariant ); - setGradient( Q::Panel | Q::Disabled, - m_pal.toDisabled( m_pal.secondaryVariantNoSaturation ) ); + QColor c1( m_pal.onSurface ); + c1.setAlphaF( 0.04 ); + setGradient( Q::Panel | Q::Disabled, c1 ); + setBoxBorderMetrics( Q::Panel | Q::Disabled, 0, 0, 0, 1 ); - setColor( Q::Text | Q::Disabled, m_pal.toDisabled( m_pal.onBackground ) ); - setBoxBorderColors( Q::Panel, m_pal.toDisabled( m_pal.onBackground ) ); + QColor c2( m_pal.onSurface ); + c2.setAlphaF( 0.38 ); // ### move this to the palette, we are using it all the time + setColor( Q::Text | Q::Disabled, c2 ); + setBoxBorderColors( Q::Panel | Q::Disabled, c2 ); } void Editor::setupProgressBar() @@ -285,13 +287,17 @@ void Editor::setupProgressBar() } setMetric( Q::Groove | A::Size, size ); - setGradient( Q::Groove, m_pal.secondaryNoSaturation ); + setGradient( Q::Groove, m_pal.primaryContainer ); - setGradient( Q::Groove | Q::Disabled, - m_pal.toDisabled( m_pal.secondaryNoSaturation ) ); + QColor c1( m_pal.onSurface ); + c1.setAlphaF( 0.12 ); + setGradient( Q::Groove | Q::Disabled, c1 ); - setGradient( Q::Bar, m_pal.secondary ); - setGradient( Q::Bar | Q::Disabled, m_pal.toDisabled( m_pal.secondary ) ); + setGradient( Q::Bar, m_pal.primary ); + + QColor c2( m_pal.onSurface ); + c2.setAlphaF( 0.38 ); + setGradient( Q::Bar | Q::Disabled, c2 ); } void Editor::setupFocusIndicator() @@ -312,11 +318,10 @@ void Editor::setupSegmentedBar() setPadding( Q::Panel, 0 ); setSpacing( Q::Panel, 5 ); - setGradient( Q::Panel, m_pal.elevated( m_pal.background ) ); + setBoxBorderMetrics( Q::Panel, 1 ); + setBoxBorderColors( Q::Panel, m_pal.outline ); - setBoxBorderMetrics( Q::Panel, 0 ); - - const QSize strutSize( qskDpiScaled( 100 ), qskDpiScaled( 50 ) ); + const QSize strutSize( qskDpiScaled( -1 ), qskDpiScaled( 40 ) ); setStrutSize( Q::Panel | A::Horizontal, strutSize ); setStrutSize( Q::Panel | A::Vertical, strutSize.transposed() ); @@ -326,27 +331,28 @@ void Editor::setupSegmentedBar() // Segment setPadding( Q::Segment, QskMargins( 2, 5, 2, 5 ) ); - setGradient( Q::Segment, QskGradient() ); } { - const auto cursor = QskRgb::toTransparentF( m_pal.onBackground, m_pal.focused ); - // Cursor - setGradient( Q::Cursor, cursor ); - setGradient( Q::Cursor | Q::Disabled, m_pal.toDisabled( cursor ) ); + setGradient( Q::Cursor, m_pal.secondaryContainer ); + QColor c1( m_pal.onSurface ); + c1.setAlphaF( 0.12 ); + setGradient( Q::Cursor | Q::Disabled, c1 ); setAnimation( Q::Cursor | A::Metric | A::Position, 100 ); } for( auto subControl : { Q::Panel, Q::Cursor } ) - setBoxShape( subControl, 3 ); + { + setBoxShape( subControl, 100, Qt::RelativeSize ); + } { // Text - setColor( Q::Text, m_pal.onBackground ); - setColor( Q::Text | Q::Selected, m_pal.onBackground ); + setColor( Q::Text, m_pal.onSurface ); + setColor( Q::Text | Q::Selected, m_pal.onSecondaryContainer ); } { @@ -386,14 +392,16 @@ void Editor::setupPageIndicator() setBoxShape( Q::Bullet, 100, Qt::RelativeSize ); setBoxBorderMetrics( Q::Bullet, 0 ); - setGradient( Q::Bullet, m_pal.secondaryNoSaturation ); - setGradient( Q::Bullet | Q::Selected, m_pal.secondary ); + setGradient( Q::Bullet, m_pal.primaryContainer ); + setGradient( Q::Bullet | Q::Selected, m_pal.primary ); - setGradient( Q::Bullet | Q::Disabled, - m_pal.toDisabled( m_pal.secondaryNoSaturation ) ); + QColor c1( m_pal.onSurface ); + c1.setAlphaF( 0.12 ); + setGradient( Q::Bullet | Q::Disabled, c1 ); - setGradient( Q::Bullet | Q::Selected | Q::Disabled, - m_pal.toDisabled( m_pal.secondary ) ); + QColor c2( m_pal.onSurface ); + c2.setAlphaF( 0.38 ); + setGradient( Q::Bullet | Q::Selected | Q::Disabled, c2 ); setSpacing( Q::Panel, qskDpiScaled( 3 ) ); setPadding( Q::Panel, 0 ); @@ -403,35 +411,29 @@ void Editor::setupPageIndicator() void Editor::setupPushButton() { using A = QskAspect; - using namespace QskRgb; using Q = QskPushButton; - setStrutSize( Q::Panel, qskDpiScaled( 75.0 ), qskDpiScaled( 23.0 ) ); + setStrutSize( Q::Panel, -1, qskDpiScaled( 40.0 ) ); setSpacing( Q::Panel, qskDpiScaled( 4 ) ); + setPadding( Q::Panel, { 24, 0, 20, 0 } ); - const QskMargins margin( 4, 3 ); - const QskMargins padding( 10, 6 ); + setBoxShape( Q::Panel, 100, Qt::RelativeSize ); - setMargin( Q::Panel, margin ); - setPadding( Q::Panel, padding ); + setColor( Q::Text, m_pal.onPrimary ); - setBoxShape( Q::Panel, 5 ); + QColor c2( m_pal.onSurface ); + c2.setAlphaF( 0.38 ); + setColor( Q::Text | Q::Disabled, c2 ); - setColor( Q::Text, m_pal.primary ); - setColor( Q::Text | Q::Disabled, toTransparentF( m_pal.primary, 0.6 ) ); setFontRole( Q::Text, ButtonFontRole ); setAlignment( Q::Text, Qt::AlignCenter ); - setBoxBorderMetrics( Q::Panel, 1 ); - setBoxBorderColors( Q::Panel, m_pal.primary ); + setGradient( Q::Panel, m_pal.primary ); - setBoxBorderColors( Q::Panel | Q::Disabled, m_pal.toDisabled( m_pal.onBackground ) ); - setColor( Q::Text | Q::Disabled, m_pal.toDisabled( m_pal.onBackground ) ); + QColor c1( m_pal.onSurface ); + c1.setAlphaF( 0.12 ); + setGradient( Q::Panel | Q::Disabled, c1 ); - setGradient( Q::Panel | Q::Hovered, toTransparentF( m_pal.primary, m_pal.hover ) ); - setGradient( Q::Panel | Q::Focused, toTransparentF( m_pal.primary, m_pal.focused ) ); - setGradient( Q::Panel | Q::Pressed, toTransparentF( m_pal.primary, m_pal.pressed ) ); - setGradient( Q::Panel | Q::Flat, White & ColorMask ); setAnimation( Q::Panel | A::Color, qskDuration ); setAnimation( Q::Panel | A::Metric, qskDuration ); @@ -441,7 +443,6 @@ void Editor::setupPushButton() void Editor::setupDialogButton() { using A = QskAspect; - using namespace QskRgb; using Q = QskDialogButton; setStrutSize( Q::Panel, 30, 16 ); @@ -453,8 +454,12 @@ void Editor::setupDialogButton() setBoxShape( Q::Panel, 0 ); setGradient( Q::Panel, m_pal.primary ); - setColor( Q::Text, m_pal.onBackground ); - setColor( Q::Text | Q::Disabled, QskRgb::toTransparentF( m_pal.onPrimary, 0.6 ) ); + setColor( Q::Text, m_pal.onPrimary ); + + QColor c2( m_pal.onSurface ); + c2.setAlphaF( 0.38 ); + setColor( Q::Text | Q::Disabled, c2 ); + setFontRole( Q::Text, ButtonFontRole ); setAlignment( Q::Text, Qt::AlignCenter ); @@ -490,7 +495,6 @@ void Editor::setupDialogButtonBox() void Editor::setupSlider() { using A = QskAspect; - using namespace QskRgb; using Q = QskSlider; const qreal extent = 30; @@ -518,13 +522,17 @@ void Editor::setupSlider() setMetric( Q::Groove | A::Size, qskDpiScaled( 4 ) ); setMetric( Q::Fill | A::Size, qskDpiScaled( 6 ) ); - setGradient( Q::Groove, QskRgb::toTransparentF( m_pal.secondary, .38 ) ); - setGradient( Q::Groove | Q::Disabled, - m_pal.toDisabled( m_pal.secondaryNoSaturation ) ); + setGradient( Q::Groove, m_pal.primaryContainer ); - setGradient( Q::Fill, m_pal.secondary ); - setGradient( Q::Fill | Q::Disabled, - m_pal.toDisabled( m_pal.secondaryNoSaturation ) ); + QColor c1( m_pal.onSurface ); + c1.setAlphaF( 0.12 ); + setGradient( Q::Groove | Q::Disabled, c1 ); + + setGradient( Q::Fill, m_pal.primary ); + + QColor c2( m_pal.onSurface ); + c2.setAlphaF( 0.38 ); + setGradient( Q::Fill | Q::Disabled, c2 ); setBoxShape( Q::Handle, 100, Qt::RelativeSize ); setBoxBorderMetrics( Q::Handle, 0 ); @@ -532,22 +540,13 @@ void Editor::setupSlider() setStrutSize( Q::Handle, qskDpiScaled( 20 + rippleSize ), qskDpiScaled( 20 + rippleSize ) ); - setGradient( Q::Handle | Q::Disabled, m_pal.secondaryNoSaturation ); + setGradient( Q::Handle, m_pal.primary ); + setGradient( Q::Handle | Q::Pressed, m_pal.primary ); - setGradient( Q::Handle, m_pal.secondary ); - setGradient( Q::Handle | Q::Pressed, m_pal.secondary ); + setGradient( Q::Handle | Q::Disabled, c2 ); setBoxBorderMetrics( Q::Handle, qskDpiScaled( rippleSize / 2 ) ); - setBoxBorderColors( Q::Handle | Q::Hovered, - QskRgb::toTransparentF( m_pal.secondary, m_pal.hover ) ); - - setBoxBorderColors( Q::Handle | Q::Focused, - QskRgb::toTransparentF( m_pal.secondary, m_pal.focused ) ); - - setBoxBorderColors( Q::Handle | Q::Pressed, - QskRgb::toTransparentF( m_pal.secondary, m_pal.pressed ) ); - // move the handle smoothly, when using keys setAnimation( Q::Handle | A::Metric | A::Position, 2 * qskDuration ); setAnimation( Q::Handle | A::Metric | A::Position | Q::Pressed, 0 ); @@ -558,59 +557,61 @@ void Editor::setupSwitchButton() using A = QskAspect; using Q = QskSwitchButton; - const qreal radius = qskDpiScaled( 10 ); - setBoxShape( Q::Groove, 100, Qt::RelativeSize ); + const QSizeF strutSize( 52, 32 ); + setStrutSize( Q::Groove | A::Horizontal, strutSize ); + setStrutSize( Q::Groove | A::Vertical, strutSize.transposed() ); + setGradient( Q::Groove, m_pal.surfaceVariant ); - const QSizeF grooveSize( 3.4 * radius, 1.2 * radius ); - setStrutSize( Q::Groove | A::Horizontal, grooveSize ); - setStrutSize( Q::Groove | A::Vertical, grooveSize.transposed() ); + QColor c3( m_pal.surfaceVariant ); + c3.setAlphaF( 0.12 ); + setGradient( Q::Groove | Q::Disabled, c3 ); + setGradient( Q::Groove | Q::Checked, m_pal.primary ); - setGradient( Q::Groove, m_pal.secondaryNoSaturation ); - setGradient( Q::Groove | Q::Disabled, m_pal.toDisabled( m_pal.secondaryNoSaturation ) ); - setGradient( Q::Groove | Q::Checked, m_pal.secondaryVariant ); - setGradient( Q::Groove | Q::Checked | Q::Disabled, - QskRgb::toTransparentF( m_pal.secondaryVariant, m_pal.disabledOccupancy ) ); + QColor c1( m_pal.onSurface ); + c1.setAlphaF( 0.12 ); + setGradient( Q::Groove | Q::Checked | Q::Disabled, c1 ); + setBoxBorderMetrics( Q::Groove, 2 ); + setBoxBorderColors( Q::Groove, m_pal.outline ); + + setBoxBorderMetrics( Q::Groove | Q::Checked, 0 ); setBoxShape( Q::Handle, 100, Qt::RelativeSize ); - setStrutSize( Q::Handle, qskDpiScaled( 2 * radius + rippleSize ), - qskDpiScaled( 2 * radius + rippleSize ) ); + setStrutSize( Q::Handle, 16, 16 ); + setStrutSize( Q::Handle | Q::Checked, 24, 24 ); - setGradient( Q::Handle, QskRgb::lighter( m_pal.background, 900 ) ); + setGradient( Q::Handle, m_pal.outline ); + setGradient( Q::Handle | Q::Checked, m_pal.primaryContainer ); - setGradient( Q::Handle | Q::Checked, m_pal.secondary ); + QColor c2( m_pal.onSurface ); + c2.setAlphaF( 0.38 ); + setGradient( Q::Handle | Q::Disabled, c2 ); + setGradient( Q::Handle | Q::Disabled | Q::Checked, m_pal.surface ); - setGradient( Q::Handle | Q::Disabled, - m_pal.elevated( m_pal.secondaryNoSaturation, -2 ) ); - setGradient( Q::Handle | Q::Disabled | Q::Checked, - m_pal.elevated( m_pal.secondary, -3 ) ); + // just to keep the strut size the same at all times: + setStrutSize( Q::Ripple, 40, 40 ); + setGradient( Q::Ripple, Qt::transparent ); - setBoxBorderMetrics( Q::Handle, qskDpiScaled( rippleSize / 2 ) ); - setBoxBorderMetrics( Q::Handle, qskDpiScaled( rippleSize / 2 ) ); + QColor c4( m_pal.surface ); + c4.setAlphaF( m_pal.focusOpacity ); + setGradient( Q::Ripple | Q::Hovered, c4 ); - setBoxBorderColors( Q::Handle | Q::Checked | Q::Hovered, - QskRgb::toTransparentF( m_pal.secondary, m_pal.hover ) ); - setBoxBorderColors( Q::Handle | Q::Checked | Q::Focused, - QskRgb::toTransparentF( m_pal.secondary, m_pal.focused ) ); - setBoxBorderColors( Q::Handle | Q::Checked | Q::Pressed, - QskRgb::toTransparentF( m_pal.secondary, m_pal.pressed ) ); + QColor c5( m_pal.primary ); + c5.setAlphaF( m_pal.focusOpacity ); + setGradient( Q::Ripple | Q::Hovered | Q::Checked, c5 ); + setStrutSize( Q::Ripple | Q::Hovered, 40, 40 ); + setBoxShape( Q::Ripple, 100, Qt::RelativeSize ); + setStrutSize( Q::Ripple | Q::Hovered | Q::Checked, 40, 40 ); - setBoxBorderColors( Q::Handle | Q::Hovered, - QskRgb::toTransparentF( m_pal.secondaryVariantNoSaturation, - m_pal.hover ) ); - setBoxBorderColors( Q::Handle | Q::Focused, - QskRgb::toTransparentF( m_pal.secondaryVariantNoSaturation, - m_pal.focused ) ); - setBoxBorderColors( Q::Handle | Q::Pressed, - QskRgb::toTransparentF( m_pal.secondaryVariantNoSaturation, - m_pal.pressed ) ); + setBoxBorderColors( Q::Handle, m_pal.outline ); + setBoxBorderColors( Q::Handle | Q::Checked, m_pal.primary ); for ( auto state : { A::NoState, Q::Disabled } ) { auto aspect = Q::Handle | state; - setPosition( aspect, 0 ); - setPosition( aspect | Q::Checked, 1 ); + setPosition( aspect, 0.15 ); + setPosition( aspect | Q::Checked, 0.85 ); } setAnimation( Q::Handle | A::Color, qskDuration ); @@ -623,63 +624,26 @@ void Editor::setupTabButton() using A = QskAspect; using Q = QskTabButton; - setStrutSize( Q::Panel, 30, 16 ); + setStrutSize( Q::Panel, 64, 64 ); - for ( const auto placement : { A::Left, A::Right, A::Top, A::Bottom } ) - { - const auto aspect = Q::Panel | placement; + setColor( Q::Text, m_pal.onSurfaceVariant ); - Qt::Edge edge; + QColor c2( m_pal.onSurface ); + c2.setAlphaF( 0.38 ); + setColor( Q::Text | Q::Disabled, c2 ); - switch( placement ) - { - case A::Left: - edge = Qt::RightEdge; - break; - - case A::Right: - edge = Qt::LeftEdge; - break; - - case A::Top: - edge = Qt::BottomEdge; - break; - - case A::Bottom: - edge = Qt::TopEdge; - break; - - default: - edge = Qt::Edge( 0 ); // making gcc4 happy - } - - QskBoxBorderColors borderColors( m_pal.elevated( m_pal.background ) ); - auto borderColorsActive = m_pal.primary; - - // The highlighted button has a accented bar at one edge - setBoxShape( aspect, 0 ); - - QskBoxBorderMetrics border; - border.setWidthAt( edge, 3 ); - setBoxBorderMetrics( aspect, border ); - - setBoxBorderColors( aspect, borderColors ); - - borderColors.setGradientAt( edge, borderColorsActive ); - setBoxBorderColors( aspect | Q::Checked, borderColors ); - } - - setColor( Q::Text, m_pal.onBackground ); - setColor( Q::Text | Q::Disabled, - QskRgb::toTransparentF( m_pal.onBackground, - m_pal.widgetBackgroundDisabled ) ); setColor( Q::Text | Q::Checked, m_pal.primary ); setColor( Q::Text | Q::Hovered, m_pal.primary ); - setGradient( Q::Panel, m_pal.elevated( m_pal.background ) ); - setGradient( Q::Panel | Q::Hovered, QskRgb::toTransparentF( m_pal.primary, m_pal.hover ) ); - setGradient( Q::Panel | Q::Focused, QskRgb::toTransparentF( m_pal.primary, m_pal.focused ) ); - setGradient( Q::Panel | Q::Pressed, QskRgb::toTransparentF( m_pal.primary, m_pal.pressed ) ); + setGradient( Q::Panel, m_pal.surface ); + + QColor c( m_pal.surface ); + c.setAlphaF( m_pal.hoverOpacity ); + setGradient( Q::Panel | Q::Hovered, c ); + c.setAlphaF( m_pal.focusOpacity ); + setGradient( Q::Panel | Q::Focused, c ); + c.setAlphaF( m_pal.pressedOpacity ); + setGradient( Q::Panel | Q::Pressed, c ); setAnimation( Q::Panel | A::Color, qskDuration ); @@ -695,7 +659,7 @@ void Editor::setupTabBar() setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); - setGradient( Q::Panel, m_pal.elevated( m_pal.background ) ); + setGradient( Q::Panel, m_pal.secondaryContainer ); setPadding( Q::Panel, 0 ); // when flicking @@ -716,7 +680,7 @@ void Editor::setupInputPanel() setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); - setGradient( Q::Panel, m_pal.elevated( m_pal.background, 1 ) ); + setGradient( Q::Panel, m_pal.secondaryContainer ); setBoxBorderColors( Q::Panel, m_pal.background ); } @@ -742,7 +706,7 @@ void Editor::setupVirtualKeyboard() // panel setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); - setGradient( Q::Panel, m_pal.elevated( m_pal.background, 1 ) ); + setGradient( Q::Panel, m_pal.secondaryContainer ); setBoxBorderColors( Q::Panel, m_pal.background ); } @@ -771,18 +735,10 @@ void Editor::setupScrollView() { setBoxShape( subControl, 3 ); setBoxBorderMetrics( subControl, 0 ); - setGradient( subControl, QskRgb::toTransparentF( m_pal.onBackground, m_pal.hover ) ); + setGradient( subControl, m_pal.primary ); setAnimation( subControl | A::Color, qskDuration ); } - for ( auto subControl : { - Q::HorizontalScrollHandle | Q::HorizontalHandlePressed, - Q::VerticalScrollHandle | Q::VerticalHandlePressed } ) - { - setGradient( subControl, - QskRgb::toTransparentF( m_pal.onBackground, m_pal.pressed ) ); - } - // when changing the position by QskScrollView::scrollTo setAnimation( Q::Viewport | A::Metric, QskAnimationHint( 200, QEasingCurve::InCubic ) ); } @@ -793,11 +749,11 @@ void Editor::setupListView() setPadding( Q::Cell, 0 ); - setGradient( Q::Cell, m_pal.background ); - setColor( Q::Text, m_pal.onBackground ); + setGradient( Q::Cell, m_pal.surface ); + setColor( Q::Text, m_pal.onSurfaceVariant ); - setGradient( Q::Cell | Q::Selected, QskRgb::toTransparentF( m_pal.onBackground, m_pal.focused ) ); - setColor( Q::Text | Q::Selected, m_pal.onBackground ); + setGradient( Q::Cell | Q::Selected, m_pal.secondaryContainer ); + setColor( Q::Text | Q::Selected, m_pal.onSecondaryContainer ); } void Editor::setupSubWindow() @@ -818,8 +774,8 @@ void Editor::setupSubWindow() setFlagHint( Q::TitleBarPanel | QskAspect::Style, Q::TitleBar | Q::Title | Q::Symbol ); - setGradient( Q::TitleBarPanel, m_pal.primary ); - setGradient( Q::TitleBarPanel | Q::Focused, m_pal.primaryVariant ); + setGradient( Q::TitleBarPanel, m_pal.surface ); + setGradient( Q::TitleBarPanel | Q::Focused, m_pal.surfaceVariant ); // TitleBarText setFontRole( Q::TitleBarText, QskSkin::SmallFont ); @@ -851,14 +807,12 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness, if ( lightness == Light ) { - using Q = QskRgbPalette; - primary = m_palettes[ Primary ].rgb( Q::W40 ); onPrimary = m_palettes[ Primary ].rgb( Q::W100 ); primaryContainer = m_palettes[ Primary ].rgb( Q::W90 ); onPrimaryContainer = m_palettes[ Primary ].rgb( Q::W10 ); - primary = m_palettes[ Secondary ].rgb( Q::W40 ); + secondary = m_palettes[ Secondary ].rgb( Q::W40 ); onSecondary = m_palettes[ Secondary ].rgb( Q::W100 ); secondaryContainer = m_palettes[ Secondary ].rgb( Q::W90 ); onSecondaryContainer = m_palettes[ Secondary ].rgb( Q::W10 ); @@ -884,14 +838,12 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness, } else if ( lightness == Dark ) { - using Q = QskRgbPalette; - primary = m_palettes[ Primary ].rgb( Q::W80 ); onPrimary = m_palettes[ Primary ].rgb( Q::W20 ); primaryContainer = m_palettes[ Primary ].rgb( Q::W30 ); onPrimaryContainer = m_palettes[ Primary ].rgb( Q::W90 ); - primary = m_palettes[ Secondary ].rgb( Q::W80 ); + secondary = m_palettes[ Secondary ].rgb( Q::W80 ); onSecondary = m_palettes[ Secondary ].rgb( Q::W20 ); secondaryContainer = m_palettes[ Secondary ].rgb( Q::W30 ); onSecondaryContainer = m_palettes[ Secondary ].rgb( Q::W90 ); diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index b070862c..f59c12c5 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -63,6 +63,11 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme QRgb onSurfaceVariant; QRgb outline; + const qreal hoverOpacity = 0.08; + const qreal focusOpacity = 0.12; + const qreal pressedOpacity = 0.12; + const qreal draggedOpacity = 0.16; + private: std::array< QskRgbPalette, NumPaletteTypes > m_palettes; }; From 0c3355fa0fb047f5273c550c59d48e44b99ff49b Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 7 Jun 2022 11:18:11 +0200 Subject: [PATCH 22/70] Gallery: Use raster for textures --- examples/gallery/main.cpp | 3 +++ 1 file changed, 3 insertions(+) diff --git a/examples/gallery/main.cpp b/examples/gallery/main.cpp index 8e8d622b..1073dfef 100644 --- a/examples/gallery/main.cpp +++ b/examples/gallery/main.cpp @@ -18,6 +18,7 @@ #include #include #include +#include #include #include #include @@ -161,6 +162,8 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); + qskSetup->setItemUpdateFlag( QskQuickItem::PreferRasterForTextures, true ); + SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); auto mainView = new ApplicationView(); From 3c69498026c0a4e26b585a265a25ecf73857ab5d Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 14 May 2021 15:46:15 +0200 Subject: [PATCH 23/70] QskPushButton: respect the graphics alignment Also, respect the padding hint of the graphic Resolves #22 --- skins/material/QskMaterialSkin.cpp | 3 ++ skins/squiek/QskSquiekSkin.cpp | 3 ++ src/controls/QskPushButtonSkinlet.cpp | 72 ++++++++++++++++++++++----- 3 files changed, 65 insertions(+), 13 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 3e9342e6..48bf2267 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -435,6 +435,9 @@ void Editor::setupPushButton() setGradient( Q::Panel | Q::Disabled, c1 ); + setAlignment( Q::Graphic | A::Alignment, Qt::AlignLeft ); + setPadding( Q::Graphic, 5 ); + setAnimation( Q::Panel | A::Color, qskDuration ); setAnimation( Q::Panel | A::Metric, qskDuration ); setAnimation( Q::Text | A::Color, qskDuration ); diff --git a/skins/squiek/QskSquiekSkin.cpp b/skins/squiek/QskSquiekSkin.cpp index 4a0d8cae..974d0e6c 100644 --- a/skins/squiek/QskSquiekSkin.cpp +++ b/skins/squiek/QskSquiekSkin.cpp @@ -594,6 +594,9 @@ void Editor::setupPushButton() setColor( Q::Text, m_pal.themeForeground ); setColor( Q::Text | Q::Disabled, m_pal.darker200 ); + + // Graphic + setPadding( Q::Graphic, 2 ); } void Editor::setupDialogButton() diff --git a/src/controls/QskPushButtonSkinlet.cpp b/src/controls/QskPushButtonSkinlet.cpp index 6063d9eb..407cd51b 100644 --- a/src/controls/QskPushButtonSkinlet.cpp +++ b/src/controls/QskPushButtonSkinlet.cpp @@ -77,11 +77,24 @@ QRectF QskPushButtonSkinlet::textRect( if ( button->hasGraphic() ) { - // in case of having text + graphic we put the text at the bottom + const auto alignment = button->alignmentHint( QskPushButton::Graphic, Qt::AlignTop ); - qreal h = button->effectiveFontHeight( QskPushButton::Text ); - if ( h < r.height() ) - r.setTop( r.bottom() - h ); + switch( alignment ) + { + case Qt::AlignLeft: + { + const auto graphicsRect = subControlRect( button, contentsRect, QskPushButton::Graphic ); + const auto spacing = button->metric( QskPushButton::Panel | QskAspect::Spacing ); + r.setX( r.x() + graphicsRect.width() + spacing ); + break; + } + default: // AlignTop + { + qreal h = QFontMetricsF( button->effectiveFont( QskPushButton::Text ) ).height(); + if ( h < r.height() ) + r.setTop( r.bottom() - h ); + } + } } return r; @@ -94,7 +107,9 @@ QRectF QskPushButtonSkinlet::graphicRect( auto r = button->subControlContentsRect( contentsRect, QskPushButton::Panel ); - if ( !button->text().isEmpty() ) + const auto alignment = button->alignmentHint( QskPushButton::Graphic, Qt::AlignTop ); + + if ( !button->text().isEmpty() && alignment != Qt::AlignLeft ) { const auto textRect = subControlRect( button, contentsRect, QskPushButton::Text ); qreal h = textRect.height() + button->spacingHint( QskPushButton::Panel ); @@ -106,6 +121,7 @@ QRectF QskPushButtonSkinlet::graphicRect( } const auto maxSize = button->graphicSourceSize(); + if ( maxSize.width() >= 0 || maxSize.height() >= 0 ) { // limiting the size by graphicSize @@ -134,15 +150,31 @@ QRectF QskPushButtonSkinlet::graphicRect( const double scaleFactor = qMin( r.width() / sz.width(), r.height() / sz.height() ); - // early aligning to avoid pointless operations, that finally will - // have no effect, when drawing to an integer based paint device - const int w = qFloor( scaleFactor * sz.width() ); const int h = qFloor( scaleFactor * sz.height() ); - const int x = qFloor( r.center().x() - 0.5 * w ); - const int y = qFloor( r.center().y() - 0.5 * h ); + int x, y; + + switch( alignment ) + { + case Qt::AlignLeft: + { + x = r.left(); + y = r.top(); + break; + } + default: // AlignTop + { + // early aligning to avoid pointless operations, that finally will + // have no effect, when drawing to an integer based paint device + + x = qFloor( r.center().x() - 0.5 * w ); + y = qFloor( r.center().y() - 0.5 * h ); + } + } r = QRectF( x, y, w, h ); + const auto padding = button->paddingHint( QskPushButton::Graphic ); + r = r.marginsRemoved( padding ); } return r; @@ -213,10 +245,24 @@ QSizeF QskPushButtonSkinlet::sizeHint( const QskSkinnable* skinnable, } } - const qreal padding = 2.0; // paddingHint( Graphic ) ??? + const auto alignment = button->alignmentHint( QskPushButton::Graphic, Qt::AlignTop ); - size.rheight() += 2 * padding + h; - size.rwidth() = qMax( size.width(), w ); + const QMarginsF padding = button->paddingHint( QskPushButton::Graphic ); + + switch( alignment ) + { + case Qt::AlignLeft: + { + size.rwidth() += padding.left() + w + padding.right(); + size.rheight() = qMax( size.height(), h ); + break; + } + default: // AlignTop + { + size.rheight() += padding.top() + h + padding.bottom(); + size.rwidth() = qMax( size.width(), w ); + } + } } size = size.expandedTo( button->strutSizeHint( QskPushButton::Panel ) ); From 1839cd452f68ffb424eb5eea462a4dfc07e4e73e Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 7 Jun 2022 12:10:40 +0200 Subject: [PATCH 24/70] Material: More skin hints --- skins/material/QskMaterialSkin.cpp | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 48bf2267..e9ffcfc5 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -413,7 +413,7 @@ void Editor::setupPushButton() using A = QskAspect; using Q = QskPushButton; - setStrutSize( Q::Panel, -1, qskDpiScaled( 40.0 ) ); + setStrutSize( Q::Panel, -1, 31 ); setSpacing( Q::Panel, qskDpiScaled( 4 ) ); setPadding( Q::Panel, { 24, 0, 20, 0 } ); @@ -879,7 +879,7 @@ QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& palette, QObject* pare setupFonts( QStringLiteral( "Roboto" ) ); auto buttonFont = font( QskSkin::DefaultFont ); - buttonFont.setCapitalization( QFont::AllUppercase ); + buttonFont.setPixelSize( 14 ); setFont( ButtonFontRole, buttonFont ); Editor editor( &hintTable(), palette ); From a2d67f0438484618b41bfb1ad21802f04ff95cfd Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 7 Jun 2022 12:40:21 +0200 Subject: [PATCH 25/70] Material: set up fonts --- skins/material/QskMaterialSkin.cpp | 36 +++++++++++++++++------------- skins/material/QskMaterialSkin.h | 8 +++++++ 2 files changed, 29 insertions(+), 15 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index e9ffcfc5..74a1bd6d 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -42,12 +42,6 @@ #include #include -#if 1 -// should be defined in the public header, so that -// application code can avoid conflicts -static const int ButtonFontRole = QskSkin::HugeFont + 77; -#endif - static const int qskDuration = 150; namespace @@ -94,6 +88,16 @@ namespace const QskMaterialTheme& m_pal; const uint rippleSize = 40; // ### remove }; + + QFont createFont( int pixelSize, QFont::Weight weight = QFont::Normal ) + { + QFont font( "Roboto" ); + font.setPixelSize( pixelSize ); + font.setLetterSpacing( QFont::AbsoluteSpacing, 0.1 ); + font.setWeight( weight ); + + return font; + } } void Editor::setup() @@ -425,7 +429,7 @@ void Editor::setupPushButton() c2.setAlphaF( 0.38 ); setColor( Q::Text | Q::Disabled, c2 ); - setFontRole( Q::Text, ButtonFontRole ); + setFontRole( Q::Text, QskMaterialSkin::M3LabelLarge ); setAlignment( Q::Text, Qt::AlignCenter ); setGradient( Q::Panel, m_pal.primary ); @@ -463,7 +467,7 @@ void Editor::setupDialogButton() c2.setAlphaF( 0.38 ); setColor( Q::Text | Q::Disabled, c2 ); - setFontRole( Q::Text, ButtonFontRole ); + setFontRole( Q::Text, QskMaterialSkin::M3LabelLarge ); setAlignment( Q::Text, Qt::AlignCenter ); for ( auto state1 : { A::NoState, Q::Focused } ) @@ -650,7 +654,7 @@ void Editor::setupTabButton() setAnimation( Q::Panel | A::Color, qskDuration ); - setFontRole( Q::Text, ButtonFontRole ); + setFontRole( Q::Text, QskMaterialSkin::M3LabelLarge ); setAlignment( Q::Text, Qt::AlignCenter ); } @@ -875,12 +879,7 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness, QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& palette, QObject* parent ) : Inherited( parent ) { - // Default theme colors - setupFonts( QStringLiteral( "Roboto" ) ); - - auto buttonFont = font( QskSkin::DefaultFont ); - buttonFont.setPixelSize( 14 ); - setFont( ButtonFontRole, buttonFont ); + setupFonts(); Editor editor( &hintTable(), palette ); editor.setup(); @@ -890,4 +889,11 @@ QskMaterialSkin::~QskMaterialSkin() { } +void QskMaterialSkin::setupFonts() +{ + Inherited::setupFonts( QStringLiteral( "Roboto" ) ); + + setFont( M3LabelLarge, createFont( 14 ) ); +} + #include "moc_QskMaterialSkin.cpp" diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index f59c12c5..e4bc11f1 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -82,7 +82,15 @@ class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin QskMaterialSkin( const QskMaterialTheme&, QObject* parent = nullptr ); ~QskMaterialSkin() override; + enum FontRole + { + M3LabelLarge = QskSkin::HugeFont + 1, + }; + // ### add setTheme() re-implement resetColors() + + private: + void setupFonts(); }; #endif From 421db106da4724aee16274ecfb818713e3ac61d7 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 7 Jun 2022 14:03:06 +0200 Subject: [PATCH 26/70] Material skin: Allow setting a different palette --- skins/material/QskMaterialSkin.cpp | 40 +++++++++++++++++++++++++----- skins/material/QskMaterialSkin.h | 11 +++++++- 2 files changed, 44 insertions(+), 7 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 74a1bd6d..58d81616 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -809,10 +809,16 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness ) QskMaterialTheme::QskMaterialTheme( Lightness lightness, std::array< QskRgbPalette, NumPaletteTypes > palettes ) : m_palettes( palettes ) + , m_lightness( lightness ) +{ + initColors(); +} + +void QskMaterialTheme::initColors() { using Q = QskRgbPalette; - if ( lightness == Light ) + if ( m_lightness == Light ) { primary = m_palettes[ Primary ].rgb( Q::W40 ); onPrimary = m_palettes[ Primary ].rgb( Q::W100 ); @@ -843,7 +849,7 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness, onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); outline = m_palettes[ NeutralVariant ].rgb( Q::W50 ); } - else if ( lightness == Dark ) + else if ( m_lightness == Dark ) { primary = m_palettes[ Primary ].rgb( Q::W80 ); onPrimary = m_palettes[ Primary ].rgb( Q::W20 ); @@ -876,19 +882,41 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness, } } -QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& palette, QObject* parent ) +std::array< QskRgbPalette, QskMaterialTheme::NumPaletteTypes > QskMaterialTheme::palettes() const +{ + return m_palettes; +} + +void QskMaterialTheme::setPalette( PaletteType type, const QskRgbPalette& palette ) +{ + m_palettes[ type ] = palette; + initColors(); +} + +QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& theme, QObject* parent ) : Inherited( parent ) + , m_theme( theme ) { setupFonts(); - - Editor editor( &hintTable(), palette ); - editor.setup(); + init( theme ); } QskMaterialSkin::~QskMaterialSkin() { } +void QskMaterialSkin::setPalette( QskMaterialTheme::PaletteType type, + const QskRgbPalette& palette ) +{ + m_theme.setPalette( type, palette ); +} + +void QskMaterialSkin::init( const QskMaterialTheme& palette ) +{ + Editor editor( &hintTable(), palette ); + editor.setup(); +} + void QskMaterialSkin::setupFonts() { Inherited::setupFonts( QStringLiteral( "Roboto" ) ); diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index e4bc11f1..14cb2c83 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -68,8 +68,14 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme const qreal pressedOpacity = 0.12; const qreal draggedOpacity = 0.16; + std::array< QskRgbPalette, NumPaletteTypes > palettes() const; + void setPalette( PaletteType type, const QskRgbPalette& palette ); + private: + void initColors(); + std::array< QskRgbPalette, NumPaletteTypes > m_palettes; + Lightness m_lightness; }; class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin @@ -87,10 +93,13 @@ class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin M3LabelLarge = QskSkin::HugeFont + 1, }; - // ### add setTheme() re-implement resetColors() + void setPalette( QskMaterialTheme::PaletteType, const QskRgbPalette& palette ); private: + void init( const QskMaterialTheme& palette ); void setupFonts(); + + QskMaterialTheme m_theme; }; #endif From a810739254128f261b52f34a168f2b7284d5ac0c Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 7 Jun 2022 16:21:04 +0200 Subject: [PATCH 27/70] Revert "Material skin: Allow setting a different palette" This reverts commit 421db106da4724aee16274ecfb818713e3ac61d7. We cannot easily change this on the fly anyhow. --- skins/material/QskMaterialSkin.cpp | 40 +++++------------------------- skins/material/QskMaterialSkin.h | 11 +------- 2 files changed, 7 insertions(+), 44 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 58d81616..74a1bd6d 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -809,16 +809,10 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness ) QskMaterialTheme::QskMaterialTheme( Lightness lightness, std::array< QskRgbPalette, NumPaletteTypes > palettes ) : m_palettes( palettes ) - , m_lightness( lightness ) -{ - initColors(); -} - -void QskMaterialTheme::initColors() { using Q = QskRgbPalette; - if ( m_lightness == Light ) + if ( lightness == Light ) { primary = m_palettes[ Primary ].rgb( Q::W40 ); onPrimary = m_palettes[ Primary ].rgb( Q::W100 ); @@ -849,7 +843,7 @@ void QskMaterialTheme::initColors() onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); outline = m_palettes[ NeutralVariant ].rgb( Q::W50 ); } - else if ( m_lightness == Dark ) + else if ( lightness == Dark ) { primary = m_palettes[ Primary ].rgb( Q::W80 ); onPrimary = m_palettes[ Primary ].rgb( Q::W20 ); @@ -882,41 +876,19 @@ void QskMaterialTheme::initColors() } } -std::array< QskRgbPalette, QskMaterialTheme::NumPaletteTypes > QskMaterialTheme::palettes() const -{ - return m_palettes; -} - -void QskMaterialTheme::setPalette( PaletteType type, const QskRgbPalette& palette ) -{ - m_palettes[ type ] = palette; - initColors(); -} - -QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& theme, QObject* parent ) +QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& palette, QObject* parent ) : Inherited( parent ) - , m_theme( theme ) { setupFonts(); - init( theme ); + + Editor editor( &hintTable(), palette ); + editor.setup(); } QskMaterialSkin::~QskMaterialSkin() { } -void QskMaterialSkin::setPalette( QskMaterialTheme::PaletteType type, - const QskRgbPalette& palette ) -{ - m_theme.setPalette( type, palette ); -} - -void QskMaterialSkin::init( const QskMaterialTheme& palette ) -{ - Editor editor( &hintTable(), palette ); - editor.setup(); -} - void QskMaterialSkin::setupFonts() { Inherited::setupFonts( QStringLiteral( "Roboto" ) ); diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index 14cb2c83..e4bc11f1 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -68,14 +68,8 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme const qreal pressedOpacity = 0.12; const qreal draggedOpacity = 0.16; - std::array< QskRgbPalette, NumPaletteTypes > palettes() const; - void setPalette( PaletteType type, const QskRgbPalette& palette ); - private: - void initColors(); - std::array< QskRgbPalette, NumPaletteTypes > m_palettes; - Lightness m_lightness; }; class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin @@ -93,13 +87,10 @@ class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin M3LabelLarge = QskSkin::HugeFont + 1, }; - void setPalette( QskMaterialTheme::PaletteType, const QskRgbPalette& palette ); + // ### add setTheme() re-implement resetColors() private: - void init( const QskMaterialTheme& palette ); void setupFonts(); - - QskMaterialTheme m_theme; }; #endif From e6b85e528b9ac44ccfcef2b0d0abafb7d041bb2a Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 8 Jun 2022 10:54:01 +0200 Subject: [PATCH 28/70] button: Add more states to cover different button types --- examples/gallery/button/ButtonPage.cpp | 21 +++++++++---- skins/material/QskMaterialSkin.cpp | 42 +++++++++++++++++++++----- src/controls/QskAbstractButton.cpp | 2 ++ src/controls/QskAbstractButton.h | 2 +- 4 files changed, 53 insertions(+), 14 deletions(-) diff --git a/examples/gallery/button/ButtonPage.cpp b/examples/gallery/button/ButtonPage.cpp index faad977b..9132dd41 100644 --- a/examples/gallery/button/ButtonPage.cpp +++ b/examples/gallery/button/ButtonPage.cpp @@ -29,27 +29,36 @@ namespace private: void populate() { - const char* texts[] = { "Press Me", "Check Me" }; + const char* texts[] = { "Press Me", "Check Me", "Outlined", "Text" }; const char* graphics[] = { "diamond/khaki", "ellipse/sandybrown" }; - for ( int i = 0; i < 6; i++ ) + for ( int i = 0; i < 8; i++ ) { const int index = i % 2; auto button = new QskPushButton( this ); - button->setCheckable( index != 0 ); + button->setCheckable( index != 0 && index < 6 ); //button->setSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::Fixed ); - if ( i > 1 ) + if ( i > 1 && i < 6 ) { auto src = QStringLiteral( "image://shapes/" ) + graphics[ index ]; button->setGraphicSource( src ); } - - if ( i < 2 || i > 3 ) + if ( i < 2 || ( i > 3 && i < 6 ) ) { button->setText( texts[ index ] ); } + else if( i == 6 ) + { + button->setSkinStateFlag( QskAbstractButton::Outlined ); + button->setText( texts[ 2 ] ); + } + else if( i == 7 ) + { + button->setSkinStateFlag( QskAbstractButton::TextState ); + button->setText( texts[ 3 ] ); + } } } }; diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 74a1bd6d..cdf68756 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -423,24 +423,52 @@ void Editor::setupPushButton() setBoxShape( Q::Panel, 100, Qt::RelativeSize ); - setColor( Q::Text, m_pal.onPrimary ); - - QColor c2( m_pal.onSurface ); - c2.setAlphaF( 0.38 ); - setColor( Q::Text | Q::Disabled, c2 ); + setAlignment( Q::Graphic | A::Alignment, Qt::AlignLeft ); + setPadding( Q::Graphic, 5 ); setFontRole( Q::Text, QskMaterialSkin::M3LabelLarge ); setAlignment( Q::Text, Qt::AlignCenter ); + + // normal buttons (i.e. Filled): + setGradient( Q::Panel, m_pal.primary ); QColor c1( m_pal.onSurface ); c1.setAlphaF( 0.12 ); setGradient( Q::Panel | Q::Disabled, c1 ); + setColor( Q::Text, m_pal.onPrimary ); + + QColor c2( m_pal.onSurface ); + c2.setAlphaF( 0.38 ); + setColor( Q::Text | Q::Disabled, c2 ); + + + // Outlined and Text: + + const QskStateCombination combination( QskStateCombination::Combination, Q::Outlined | Q::TextState ); + setGradient( Q::Panel, Qt::transparent, combination ); + + setBoxBorderMetrics( Q::Panel, 1, { QskStateCombination::CombinationNoState, Q::Outlined } ); + setBoxBorderColors( Q::Panel | Q::Outlined, m_pal.outline ); + + setGradient( Q::Panel | Q::Disabled, Qt::transparent, combination ); + setBoxBorderColors( Q::Panel | Q::Outlined | Q::Disabled, c1 ); + + QColor primary08( m_pal.primary ); + primary08.setAlphaF( 0.08 ); + setGradient( Q::Panel | Q::Outlined, primary08, + { QskStateCombination::Combination, + Q::Hovered | Q::Focused | Q::Pressed } ); + setGradient( Q::Panel | Q::TextState, primary08, + { QskStateCombination::Combination, + Q::Hovered | Q::Focused | Q::Pressed } ); + + setColor( Q::Text, m_pal.primary, combination ); + + setColor( Q::Text | Q::Disabled, c1, combination ); - setAlignment( Q::Graphic | A::Alignment, Qt::AlignLeft ); - setPadding( Q::Graphic, 5 ); setAnimation( Q::Panel | A::Color, qskDuration ); setAnimation( Q::Panel | A::Metric, qskDuration ); diff --git a/src/controls/QskAbstractButton.cpp b/src/controls/QskAbstractButton.cpp index 01e1a352..cb3f4ef9 100644 --- a/src/controls/QskAbstractButton.cpp +++ b/src/controls/QskAbstractButton.cpp @@ -12,6 +12,8 @@ // Flat is no state - we need to get rid of it. TODO ... QSK_SYSTEM_STATE( QskAbstractButton, Flat, QskAspect::FirstSystemState << 1 ) +QSK_SYSTEM_STATE( QskAbstractButton, Outlined, QskAspect::FirstSystemState << 2 ) +QSK_SYSTEM_STATE( QskAbstractButton, TextState, QskAspect::FirstSystemState << 3 ) QSK_SYSTEM_STATE( QskAbstractButton, Checked, QskAspect::LastSystemState >> 3 ) QSK_SYSTEM_STATE( QskAbstractButton, Pressed, QskAspect::LastSystemState >> 2 ) diff --git a/src/controls/QskAbstractButton.h b/src/controls/QskAbstractButton.h index 22c0661b..70ecb4f1 100644 --- a/src/controls/QskAbstractButton.h +++ b/src/controls/QskAbstractButton.h @@ -33,7 +33,7 @@ class QSK_EXPORT QskAbstractButton : public QskControl using Inherited = QskControl; public: - QSK_STATES( Flat, Checked, Pressed ) + QSK_STATES( Flat, Outlined, TextState, Checked, Pressed ) QskAbstractButton( QQuickItem* parent = nullptr ); ~QskAbstractButton() override; From 4841e39813314c38887a7dd5cb329a0cccd365d0 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 8 Jun 2022 11:50:43 +0200 Subject: [PATCH 29/70] small fix for switch --- skins/material/QskMaterialSkin.cpp | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index cdf68756..06694764 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -613,7 +613,7 @@ void Editor::setupSwitchButton() setBoxShape( Q::Handle, 100, Qt::RelativeSize ); setStrutSize( Q::Handle, 16, 16 ); - setStrutSize( Q::Handle | Q::Checked, 24, 24 ); + setStrutSize( Q::Handle | Q::Checked, 24, 24, { QskStateCombination::CombinationNoState, Q::Disabled } ); setGradient( Q::Handle, m_pal.outline ); setGradient( Q::Handle | Q::Checked, m_pal.primaryContainer ); From e6120baf15010847d11bb27d637c428b153708c7 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Mon, 13 Jun 2022 16:52:07 +0200 Subject: [PATCH 30/70] QskMenu: Respect graphic padding We need some padding for e.g. the Material 3 style. --- src/controls/QskMenuSkinlet.cpp | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/controls/QskMenuSkinlet.cpp b/src/controls/QskMenuSkinlet.cpp index 12e8be86..d4e941b8 100644 --- a/src/controls/QskMenuSkinlet.cpp +++ b/src/controls/QskMenuSkinlet.cpp @@ -323,8 +323,10 @@ QRectF QskMenuSkinlet::sampleRect( { auto graphicRect = r; graphicRect.setWidth( graphicWidth ); + const auto padding = menu->paddingHint( QskMenu::Graphic ); + graphicRect = graphicRect.marginsRemoved( padding ); - return QRectF( r.x(), r.y(), graphicWidth, r.height() ); + return graphicRect; } else { From 3a0b3b077dd28492a8bf5fb1eda0485b1d8dcd06 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Mon, 13 Jun 2022 15:36:06 +0200 Subject: [PATCH 31/70] style menu --- skins/material/QskMaterialSkin.cpp | 31 ++++++++++++++++-------------- skins/material/QskMaterialSkin.h | 3 ++- 2 files changed, 19 insertions(+), 15 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 06694764..476b4d0a 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -196,30 +196,32 @@ void Editor::setupMenu() using A = QskAspect; using Q = QskMenu; - setBoxShape( Q::Panel, qskDpiScaled( 4 ) ); - setBoxBorderMetrics( Q::Panel, qskDpiScaled( 1 ) ); - setBoxBorderColors( Q::Panel, m_pal.primary ); + setBoxShape( Q::Panel, 4 ); + setBoxBorderMetrics( Q::Panel, 0 ); + setPadding( Q::Panel, 0 ); - setGradient( Q::Panel, m_pal.background ); + QColor primary08( m_pal.primary ); + primary08.setAlphaF( 0.08 ); + setGradient( Q::Panel, primary08 ); - setFlagHint( Q::Panel | A::Style, false ); // not cascading - -#if 0 - setPadding( Q::Separator, QMarginsF( 10, 0, 10, 0 ) ); -#endif setMetric( Q::Separator | A::Size, qskDpiScaled( 1 ) ); setBoxShape( Q::Separator, 0 ); setBoxBorderMetrics( Q::Separator, 0 ); - setGradient( Q::Separator, m_pal.primary ); + QColor primary12( m_pal.primary ); + primary12.setAlphaF( 0.12 ); + setGradient( Q::Separator, primary12 ); - setPadding( Q::Segment, QskMargins( 2, 10, 2, 10 ) ); + setPadding( Q::Segment, 6 ); setSpacing( Q::Segment, 5 ); setGradient( Q::Segment, Qt::transparent ); - setGradient( Q::Cursor, m_pal.primary ); + setGradient( Q::Cursor, primary12 ); - setColor( Q::Text, m_pal.onBackground ); - setFontRole( Q::Text, QskSkin::SmallFont ); + setPadding( Q::Graphic, 7 ); + setStrutSize( Q::Graphic, { 46, -1 } ); + + setColor( Q::Text, m_pal.onSurface ); + setFontRole( Q::Text, QskMaterialSkin::M3BodyLarge ); setPosition( Q::Panel, 0 ); setPosition( Q::Panel | QskPopup::Closed, 1 ); @@ -921,6 +923,7 @@ void QskMaterialSkin::setupFonts() { Inherited::setupFonts( QStringLiteral( "Roboto" ) ); + setFont( M3BodyLarge, createFont( 16 ) ); setFont( M3LabelLarge, createFont( 14 ) ); } diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index e4bc11f1..2d398020 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -84,7 +84,8 @@ class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin enum FontRole { - M3LabelLarge = QskSkin::HugeFont + 1, + M3BodyLarge = QskSkin::HugeFont + 1, + M3LabelLarge, }; // ### add setTheme() re-implement resetColors() From 42ab3fcb85fe9fe2f7bdd67c0e5412b12cc22f7f Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Mon, 13 Jun 2022 12:54:17 +0200 Subject: [PATCH 32/70] add shadow to buttons --- skins/material/QskMaterialSkin.cpp | 8 ++++++++ skins/material/QskMaterialSkin.h | 2 ++ 2 files changed, 10 insertions(+) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 476b4d0a..6230b63d 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -21,6 +21,7 @@ #include #include #include +#include #include #include #include @@ -446,6 +447,9 @@ void Editor::setupPushButton() c2.setAlphaF( 0.38 ); setColor( Q::Text | Q::Disabled, c2 ); + QskShadowMetrics shadow( -1, 5 ); + setShadowMetrics( Q::Panel | Q::Hovered, shadow ); + setShadowColor( Q::Panel | Q::Hovered, m_pal.shadow ); // Outlined and Text: @@ -872,6 +876,8 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness, surfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W90 ); onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); outline = m_palettes[ NeutralVariant ].rgb( Q::W50 ); + + shadow = m_palettes[ Neutral ].rgb( Q::W0 ); } else if ( lightness == Dark ) { @@ -903,6 +909,8 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness, surfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W80 ); outline = m_palettes[ NeutralVariant ].rgb( Q::W60 ); + + shadow = m_palettes[ Neutral ].rgb( Q::W0 ); } } diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index 2d398020..3571de89 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -63,6 +63,8 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme QRgb onSurfaceVariant; QRgb outline; + QRgb shadow; + const qreal hoverOpacity = 0.08; const qreal focusOpacity = 0.12; const qreal pressedOpacity = 0.12; From f39ade0606249cdcc431901d64a163616bfb8bb8 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 14 Jun 2022 09:35:59 +0200 Subject: [PATCH 33/70] Revert "Gallery: Use raster for textures" This reverts commit 0c3355fa0fb047f5273c550c59d48e44b99ff49b. --- examples/gallery/main.cpp | 3 --- 1 file changed, 3 deletions(-) diff --git a/examples/gallery/main.cpp b/examples/gallery/main.cpp index 1073dfef..8e8d622b 100644 --- a/examples/gallery/main.cpp +++ b/examples/gallery/main.cpp @@ -18,7 +18,6 @@ #include #include #include -#include #include #include #include @@ -162,8 +161,6 @@ int main( int argc, char* argv[] ) QGuiApplication app( argc, argv ); - qskSetup->setItemUpdateFlag( QskQuickItem::PreferRasterForTextures, true ); - SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts ); auto mainView = new ApplicationView(); From c3dd5efd1a24ba801a11359f60cfc5b35a9a18f4 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 14 Jun 2022 10:26:43 +0200 Subject: [PATCH 34/70] improve button shadow --- skins/material/QskMaterialSkin.cpp | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 6230b63d..2d58b9f7 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -447,7 +447,7 @@ void Editor::setupPushButton() c2.setAlphaF( 0.38 ); setColor( Q::Text | Q::Disabled, c2 ); - QskShadowMetrics shadow( -1, 5 ); + QskShadowMetrics shadow( -6, 20 ); setShadowMetrics( Q::Panel | Q::Hovered, shadow ); setShadowColor( Q::Panel | Q::Hovered, m_pal.shadow ); From f8070c1bf085006144d2f60585ff4187046b0f7f Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 14 Jun 2022 11:26:12 +0200 Subject: [PATCH 35/70] fix build --- skins/material/QskMaterialSkin.h | 2 ++ 1 file changed, 2 insertions(+) diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index 3571de89..91b5eefd 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -10,6 +10,8 @@ #include #include +#include + class QSK_MATERIAL_EXPORT QskMaterialTheme { public: From 4aa0c7de79c1faea2355d0281ac2792da5ff5239 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 14 Jun 2022 11:33:22 +0200 Subject: [PATCH 36/70] fix menu --- skins/material/QskMaterialSkin.cpp | 26 ++++++++++++++++++++------ 1 file changed, 20 insertions(+), 6 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 2d58b9f7..0b573eed 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -99,6 +99,15 @@ namespace return font; } + + QColor flattenedColor( const QColor& foregroundColor, + const QColor& backgroundColor, qreal opacity ) + { + QColor r( opacity * foregroundColor.red() + ( 1 - opacity ) * backgroundColor.red(), + opacity * foregroundColor.green() + ( 1 - opacity ) * backgroundColor.green(), + opacity * foregroundColor.blue() + ( 1 - opacity ) * backgroundColor.blue() ); + return r; + } } void Editor::setup() @@ -189,7 +198,7 @@ void Editor::setupPopup() using Q = QskPopup; setFlagHint( Q::Overlay | A::Style, true ); - setGradient( Q::Overlay, m_pal.surface ); + setGradient( Q::Overlay, Qt::transparent ); } void Editor::setupMenu() @@ -201,9 +210,14 @@ void Editor::setupMenu() setBoxBorderMetrics( Q::Panel, 0 ); setPadding( Q::Panel, 0 ); - QColor primary08( m_pal.primary ); - primary08.setAlphaF( 0.08 ); - setGradient( Q::Panel, primary08 ); + // The color here is primary with an opacity of 8% - we blend that + // with the background, because we don't want the menu to have transparency: + QColor panel = flattenedColor( m_pal.primary, m_pal.background, 0.08 ); + setGradient( Q::Panel, panel ); + + QskShadowMetrics elevationLight1( 106, 20 ); + setShadowMetrics( Q::Panel | Q::Hovered, elevationLight1 ); + setShadowColor( Q::Panel | Q::Hovered, m_pal.shadow ); setMetric( Q::Separator | A::Size, qskDpiScaled( 1 ) ); setBoxShape( Q::Separator, 0 ); @@ -447,8 +461,8 @@ void Editor::setupPushButton() c2.setAlphaF( 0.38 ); setColor( Q::Text | Q::Disabled, c2 ); - QskShadowMetrics shadow( -6, 20 ); - setShadowMetrics( Q::Panel | Q::Hovered, shadow ); + QskShadowMetrics elevationLight1( -6, 20 ); + setShadowMetrics( Q::Panel | Q::Hovered, elevationLight1 ); setShadowColor( Q::Panel | Q::Hovered, m_pal.shadow ); // Outlined and Text: From 8ee681588ee8fd848fd6f456b613d4e98d368e75 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 15 Jun 2022 10:57:36 +0200 Subject: [PATCH 37/70] Revert "QskPushButton: respect the graphics alignment" This reverts commit 3c69498026c0a4e26b585a265a25ecf73857ab5d. --- skins/material/QskMaterialSkin.cpp | 1 - skins/squiek/QskSquiekSkin.cpp | 3 -- src/controls/QskPushButtonSkinlet.cpp | 72 +++++---------------------- 3 files changed, 13 insertions(+), 63 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 0b573eed..4fe1fa53 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -489,7 +489,6 @@ void Editor::setupPushButton() setColor( Q::Text | Q::Disabled, c1, combination ); - setAnimation( Q::Panel | A::Color, qskDuration ); setAnimation( Q::Panel | A::Metric, qskDuration ); setAnimation( Q::Text | A::Color, qskDuration ); diff --git a/skins/squiek/QskSquiekSkin.cpp b/skins/squiek/QskSquiekSkin.cpp index 974d0e6c..4a0d8cae 100644 --- a/skins/squiek/QskSquiekSkin.cpp +++ b/skins/squiek/QskSquiekSkin.cpp @@ -594,9 +594,6 @@ void Editor::setupPushButton() setColor( Q::Text, m_pal.themeForeground ); setColor( Q::Text | Q::Disabled, m_pal.darker200 ); - - // Graphic - setPadding( Q::Graphic, 2 ); } void Editor::setupDialogButton() diff --git a/src/controls/QskPushButtonSkinlet.cpp b/src/controls/QskPushButtonSkinlet.cpp index 407cd51b..6063d9eb 100644 --- a/src/controls/QskPushButtonSkinlet.cpp +++ b/src/controls/QskPushButtonSkinlet.cpp @@ -77,24 +77,11 @@ QRectF QskPushButtonSkinlet::textRect( if ( button->hasGraphic() ) { - const auto alignment = button->alignmentHint( QskPushButton::Graphic, Qt::AlignTop ); + // in case of having text + graphic we put the text at the bottom - switch( alignment ) - { - case Qt::AlignLeft: - { - const auto graphicsRect = subControlRect( button, contentsRect, QskPushButton::Graphic ); - const auto spacing = button->metric( QskPushButton::Panel | QskAspect::Spacing ); - r.setX( r.x() + graphicsRect.width() + spacing ); - break; - } - default: // AlignTop - { - qreal h = QFontMetricsF( button->effectiveFont( QskPushButton::Text ) ).height(); - if ( h < r.height() ) - r.setTop( r.bottom() - h ); - } - } + qreal h = button->effectiveFontHeight( QskPushButton::Text ); + if ( h < r.height() ) + r.setTop( r.bottom() - h ); } return r; @@ -107,9 +94,7 @@ QRectF QskPushButtonSkinlet::graphicRect( auto r = button->subControlContentsRect( contentsRect, QskPushButton::Panel ); - const auto alignment = button->alignmentHint( QskPushButton::Graphic, Qt::AlignTop ); - - if ( !button->text().isEmpty() && alignment != Qt::AlignLeft ) + if ( !button->text().isEmpty() ) { const auto textRect = subControlRect( button, contentsRect, QskPushButton::Text ); qreal h = textRect.height() + button->spacingHint( QskPushButton::Panel ); @@ -121,7 +106,6 @@ QRectF QskPushButtonSkinlet::graphicRect( } const auto maxSize = button->graphicSourceSize(); - if ( maxSize.width() >= 0 || maxSize.height() >= 0 ) { // limiting the size by graphicSize @@ -150,31 +134,15 @@ QRectF QskPushButtonSkinlet::graphicRect( const double scaleFactor = qMin( r.width() / sz.width(), r.height() / sz.height() ); + // early aligning to avoid pointless operations, that finally will + // have no effect, when drawing to an integer based paint device + const int w = qFloor( scaleFactor * sz.width() ); const int h = qFloor( scaleFactor * sz.height() ); - int x, y; - - switch( alignment ) - { - case Qt::AlignLeft: - { - x = r.left(); - y = r.top(); - break; - } - default: // AlignTop - { - // early aligning to avoid pointless operations, that finally will - // have no effect, when drawing to an integer based paint device - - x = qFloor( r.center().x() - 0.5 * w ); - y = qFloor( r.center().y() - 0.5 * h ); - } - } + const int x = qFloor( r.center().x() - 0.5 * w ); + const int y = qFloor( r.center().y() - 0.5 * h ); r = QRectF( x, y, w, h ); - const auto padding = button->paddingHint( QskPushButton::Graphic ); - r = r.marginsRemoved( padding ); } return r; @@ -245,24 +213,10 @@ QSizeF QskPushButtonSkinlet::sizeHint( const QskSkinnable* skinnable, } } - const auto alignment = button->alignmentHint( QskPushButton::Graphic, Qt::AlignTop ); + const qreal padding = 2.0; // paddingHint( Graphic ) ??? - const QMarginsF padding = button->paddingHint( QskPushButton::Graphic ); - - switch( alignment ) - { - case Qt::AlignLeft: - { - size.rwidth() += padding.left() + w + padding.right(); - size.rheight() = qMax( size.height(), h ); - break; - } - default: // AlignTop - { - size.rheight() += padding.top() + h + padding.bottom(); - size.rwidth() = qMax( size.width(), w ); - } - } + size.rheight() += 2 * padding + h; + size.rwidth() = qMax( size.width(), w ); } size = size.expandedTo( button->strutSizeHint( QskPushButton::Panel ) ); From 56f25bd74c9c747590e925148c65f1e2bf7fe60b Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 15 Jun 2022 11:37:02 +0200 Subject: [PATCH 38/70] fix button size again, was lost in a merge --- skins/material/QskMaterialSkin.cpp | 1 + 1 file changed, 1 insertion(+) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 3c46fd86..44e06f3c 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -435,6 +435,7 @@ void Editor::setupPushButton() using Q = QskPushButton; setFlagHint( Q::Panel | QskAspect::Direction, Qsk::LeftToRight ); + setStrutSize( Q::Panel, -1, 31 ); setSpacing( Q::Panel, qskDpiScaled( 4 ) ); setPadding( Q::Panel, { 24, 0, 20, 0 } ); From 8a22a2f7bbc198fa9c7d76b554d3a8fa8f523842 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 15 Jun 2022 15:20:46 +0200 Subject: [PATCH 39/70] Add shadow to menus and move shadows to palette --- skins/material/QskMaterialSkin.cpp | 11 ++++++----- skins/material/QskMaterialSkin.h | 4 ++++ 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 44e06f3c..f84bf9ff 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -215,9 +215,8 @@ void Editor::setupMenu() QColor panel = flattenedColor( m_pal.primary, m_pal.background, 0.08 ); setGradient( Q::Panel, panel ); - QskShadowMetrics elevationLight1( 106, 20 ); - setShadowMetrics( Q::Panel | Q::Hovered, elevationLight1 ); - setShadowColor( Q::Panel | Q::Hovered, m_pal.shadow ); + setShadowMetrics( Q::Panel, m_pal.elevationLight2 ); + setShadowColor( Q::Panel, m_pal.shadow ); setMetric( Q::Separator | A::Size, qskDpiScaled( 1 ) ); setBoxShape( Q::Separator, 0 ); @@ -462,8 +461,7 @@ void Editor::setupPushButton() c2.setAlphaF( 0.38 ); setColor( Q::Text | Q::Disabled, c2 ); - QskShadowMetrics elevationLight1( -6, 20 ); - setShadowMetrics( Q::Panel | Q::Hovered, elevationLight1 ); + setShadowMetrics( Q::Panel | Q::Hovered, m_pal.elevationLight1 ); setShadowColor( Q::Panel | Q::Hovered, m_pal.shadow ); // Outlined and Text: @@ -928,6 +926,9 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness, shadow = m_palettes[ Neutral ].rgb( Q::W0 ); } + + elevationLight1 = QskShadowMetrics( -6, 20 ); + elevationLight2 = QskShadowMetrics( -5, 20 ); } QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& palette, QObject* parent ) diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index 91b5eefd..10e5b947 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -9,6 +9,7 @@ #include "QskMaterialGlobal.h" #include #include +#include #include @@ -67,6 +68,9 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme QRgb shadow; + QskShadowMetrics elevationLight1; + QskShadowMetrics elevationLight2; + const qreal hoverOpacity = 0.08; const qreal focusOpacity = 0.12; const qreal pressedOpacity = 0.12; From ed26bd3ab41cc81a9234c8e184e879a520102006 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Thu, 16 Jun 2022 09:53:12 +0200 Subject: [PATCH 40/70] segmented bar: Add states for when cursor is at beginning and end ... so we can style the cursor accordingly --- src/controls/QskSegmentedBar.cpp | 7 ++++++- src/controls/QskSegmentedBar.h | 2 +- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/src/controls/QskSegmentedBar.cpp b/src/controls/QskSegmentedBar.cpp index b9b1c94a..6f5dd5e1 100644 --- a/src/controls/QskSegmentedBar.cpp +++ b/src/controls/QskSegmentedBar.cpp @@ -22,7 +22,9 @@ QSK_SUBCONTROL( QskSegmentedBar, Cursor ) QSK_SUBCONTROL( QskSegmentedBar, Text ) QSK_SUBCONTROL( QskSegmentedBar, Graphic ) -QSK_SYSTEM_STATE( QskSegmentedBar, Selected, QskAspect::FirstSystemState << 2 ) +QSK_SYSTEM_STATE( QskSegmentedBar, Selected, QskAspect::FirstSystemState << 1 ) +QSK_SYSTEM_STATE( QskSegmentedBar, Minimum, QskAspect::FirstSystemState << 2 ) +QSK_SYSTEM_STATE( QskSegmentedBar, Maximum, QskAspect::FirstSystemState << 3 ) namespace { @@ -381,6 +383,9 @@ void QskSegmentedBar::setSelectedIndex( int index ) update(); Q_EMIT selectedIndexChanged( index ); + + setSkinStateFlag( Minimum, ( m_data->selectedIndex == 0 ) ); + setSkinStateFlag( Maximum, ( m_data->selectedIndex == count() - 1 ) ); } } diff --git a/src/controls/QskSegmentedBar.h b/src/controls/QskSegmentedBar.h index e01b4669..3777432d 100644 --- a/src/controls/QskSegmentedBar.h +++ b/src/controls/QskSegmentedBar.h @@ -33,7 +33,7 @@ class QSK_EXPORT QskSegmentedBar : public QskControl public: QSK_SUBCONTROLS( Panel, Segment, Cursor, Text, Graphic ) - QSK_STATES( Selected ) + QSK_STATES( Selected, Minimum, Maximum ) QskSegmentedBar( QQuickItem* parent = nullptr ); QskSegmentedBar( Qt::Orientation, QQuickItem* parent = nullptr ); From 79442019e4b548f732d3a7ed449595f93e3f4fd2 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Thu, 16 Jun 2022 12:00:10 +0200 Subject: [PATCH 41/70] segmented bar: Don't constrain segment and cursor to inner box In case we want to fill e.g. the cursor completely, we want to access the contents rect. This means that it is our responsibility to not draw beyond the panel. --- src/controls/QskSegmentedBarSkinlet.cpp | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/controls/QskSegmentedBarSkinlet.cpp b/src/controls/QskSegmentedBarSkinlet.cpp index a7aedc14..732cebad 100644 --- a/src/controls/QskSegmentedBarSkinlet.cpp +++ b/src/controls/QskSegmentedBarSkinlet.cpp @@ -49,7 +49,6 @@ QRectF QskSegmentedBarSkinlet::cursorRect( return QRectF(); auto rect = subControlRect( bar, contentsRect, Q::Panel ); - rect = bar->innerBox( Q::Panel, rect ); if( rect.isEmpty() ) return QRectF(); @@ -81,7 +80,6 @@ QRectF QskSegmentedBarSkinlet::segmentRect( const auto count = bar->count(); auto rect = subControlRect( bar, contentsRect, Q::Panel ); - rect = bar->innerBox( Q::Panel, rect ); if( bar->orientation() == Qt::Horizontal ) { @@ -238,7 +236,7 @@ QRectF QskSegmentedBarSkinlet::sampleRect( const QskSkinnable* skinnable, if ( subControl == Q::Text || subControl == Q::Graphic ) { const auto rect = sampleRect( skinnable, contentsRect, Q::Segment, index ); - return skinnable->innerBox( Q::Segment, rect ); + return rect; } return Inherited::sampleRect( skinnable, contentsRect, subControl, index ); From a8fd90f5b14cccf6104cacbff2375dfe64d4fde0 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 17 Jun 2022 08:46:00 +0200 Subject: [PATCH 42/70] segmented bar: Use QskAspect for the orientation ... to be able to style properly. --- src/controls/QskSegmentedBar.cpp | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/controls/QskSegmentedBar.cpp b/src/controls/QskSegmentedBar.cpp index 6f5dd5e1..83234377 100644 --- a/src/controls/QskSegmentedBar.cpp +++ b/src/controls/QskSegmentedBar.cpp @@ -95,6 +95,10 @@ QskSegmentedBar::QskSegmentedBar( Qt::Orientation orientation, QQuickItem* paren : Inherited( parent ) , m_data( new PrivateData( orientation ) ) { + auto direction = ( orientation == Qt::Horizontal ) + ? Qsk::LeftToRight : Qsk::TopToBottom; + setFlagHint( Panel | QskAspect::Direction, direction ); + if( orientation == Qt::Horizontal ) initSizePolicy( QskSizePolicy::MinimumExpanding, QskSizePolicy::Fixed ); else @@ -119,6 +123,10 @@ void QskSegmentedBar::setOrientation( Qt::Orientation orientation ) setSizePolicy( sizePolicy( Qt::Vertical ), sizePolicy( Qt::Horizontal ) ); m_data->orientation = orientation; + auto direction = ( orientation == Qt::Horizontal ) + ? Qsk::LeftToRight : Qsk::TopToBottom; + setFlagHint( Panel | QskAspect::Direction, direction ); + resetImplicitSize(); update(); } From e5880cf3ba761891fe0cd53e48b69fbbbfed5c2b Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 17 Jun 2022 09:32:38 +0200 Subject: [PATCH 43/70] segmented bar: Respect padding hint for graphic --- src/controls/QskSegmentedBarSkinlet.cpp | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/controls/QskSegmentedBarSkinlet.cpp b/src/controls/QskSegmentedBarSkinlet.cpp index 732cebad..1e1168a4 100644 --- a/src/controls/QskSegmentedBarSkinlet.cpp +++ b/src/controls/QskSegmentedBarSkinlet.cpp @@ -304,9 +304,11 @@ QSGNode* QskSegmentedBarSkinlet::updateSampleNode( const QskSkinnable* skinnable { const auto graphic = value.value< QskGraphic >(); const auto filter = bar->effectiveGraphicFilter( subControl ); + const auto padding = bar->paddingHint( Q::Graphic ); + const auto graphicRect = rect.marginsRemoved( padding ); return QskSkinlet::updateGraphicNode( - bar, node, graphic, filter, rect, alignment ); + bar, node, graphic, filter, graphicRect, alignment ); } return nullptr; From 9ab96db7573d00e236a9051f9caa2edaffac1aaf Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Thu, 16 Jun 2022 09:47:17 +0200 Subject: [PATCH 44/70] style segmented bar --- skins/material/QskMaterialSkin.cpp | 30 +++++++++++++++++++----------- 1 file changed, 19 insertions(+), 11 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index f84bf9ff..df439d81 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -336,7 +336,9 @@ void Editor::setupSegmentedBar() // Panel setPadding( Q::Panel, 0 ); - setSpacing( Q::Panel, 5 ); + setSpacing( Q::Panel, 0 ); + + setBoxShape( Q::Panel, 100, Qt::RelativeSize ); setBoxBorderMetrics( Q::Panel, 1 ); setBoxBorderColors( Q::Panel, m_pal.outline ); @@ -350,11 +352,24 @@ void Editor::setupSegmentedBar() { // Segment - setPadding( Q::Segment, QskMargins( 2, 5, 2, 5 ) ); + setGradient( Q::Segment, Qt::transparent ); + + // ### resolve this problem: +// setBoxBorderMetrics( Q::Segment, 0, 0, 1, 0 ); +// setBoxBorderColors( Q::Segment, m_pal.outline ); } { // Cursor + setMargin( Q::Cursor, 1 ); + setBoxShape( Q::Cursor, 0 ); + + setBoxShape( Q::Cursor | Q::Minimum | A::Horizontal, 100, 0, 100, 0, Qt::RelativeSize ); + setBoxShape( Q::Cursor | Q::Maximum | A::Horizontal, 0, 100, 0, 100, Qt::RelativeSize ); + + setBoxShape( Q::Cursor | Q::Minimum | A::Vertical, 100, 100, 0, 0, Qt::RelativeSize ); + setBoxShape( Q::Cursor | Q::Maximum | A::Vertical, 0, 0, 100, 100, Qt::RelativeSize ); + setGradient( Q::Cursor, m_pal.secondaryContainer ); QColor c1( m_pal.onSurface ); c1.setAlphaF( 0.12 ); @@ -363,11 +378,6 @@ void Editor::setupSegmentedBar() setAnimation( Q::Cursor | A::Metric | A::Position, 100 ); } - for( auto subControl : { Q::Panel, Q::Cursor } ) - { - setBoxShape( subControl, 100, Qt::RelativeSize ); - } - { // Text @@ -378,10 +388,8 @@ void Editor::setupSegmentedBar() { // Graphic -#if 0 - setGraphicRole( Q::Graphic, ... ); - setStrutSize( Q::Graphic, ... ); -#endif + setPadding( Q::Graphic, 10 ); + setMargin( Q::Graphic, 10 ); } } From c465676642af4b19f4b7cdf900461373d4a259d9 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 17 Jun 2022 10:01:10 +0200 Subject: [PATCH 45/70] segmented bar: Add separator subcontrol --- src/controls/QskSegmentedBar.cpp | 1 + src/controls/QskSegmentedBar.h | 2 +- src/controls/QskSegmentedBarSkinlet.cpp | 54 ++++++++++++++++++++++++- src/controls/QskSegmentedBarSkinlet.h | 2 + 4 files changed, 56 insertions(+), 3 deletions(-) diff --git a/src/controls/QskSegmentedBar.cpp b/src/controls/QskSegmentedBar.cpp index 83234377..55e1dbe5 100644 --- a/src/controls/QskSegmentedBar.cpp +++ b/src/controls/QskSegmentedBar.cpp @@ -18,6 +18,7 @@ QSK_SUBCONTROL( QskSegmentedBar, Panel ) QSK_SUBCONTROL( QskSegmentedBar, Segment ) +QSK_SUBCONTROL( QskSegmentedBar, Separator ) QSK_SUBCONTROL( QskSegmentedBar, Cursor ) QSK_SUBCONTROL( QskSegmentedBar, Text ) QSK_SUBCONTROL( QskSegmentedBar, Graphic ) diff --git a/src/controls/QskSegmentedBar.h b/src/controls/QskSegmentedBar.h index 3777432d..e2afa911 100644 --- a/src/controls/QskSegmentedBar.h +++ b/src/controls/QskSegmentedBar.h @@ -32,7 +32,7 @@ class QSK_EXPORT QskSegmentedBar : public QskControl using Inherited = QskControl; public: - QSK_SUBCONTROLS( Panel, Segment, Cursor, Text, Graphic ) + QSK_SUBCONTROLS( Panel, Segment, Separator, Cursor, Text, Graphic ) QSK_STATES( Selected, Minimum, Maximum ) QskSegmentedBar( QQuickItem* parent = nullptr ); diff --git a/src/controls/QskSegmentedBarSkinlet.cpp b/src/controls/QskSegmentedBarSkinlet.cpp index 1e1168a4..b6f54789 100644 --- a/src/controls/QskSegmentedBarSkinlet.cpp +++ b/src/controls/QskSegmentedBarSkinlet.cpp @@ -18,7 +18,7 @@ QskSegmentedBarSkinlet::QskSegmentedBarSkinlet( QskSkin* skin ) : Inherited( skin ) { - setNodeRoles( { PanelRole, SegmentRole, CursorRole, TextRole, GraphicRole } ); + setNodeRoles( { PanelRole, SegmentRole, SeparatorRole, CursorRole, TextRole, GraphicRole } ); } QskSegmentedBarSkinlet::~QskSegmentedBarSkinlet() = default; @@ -99,6 +99,34 @@ QRectF QskSegmentedBarSkinlet::segmentRect( return rect; } +QRectF QskSegmentedBarSkinlet::separatorRect( + const QskSegmentedBar* bar, const QRectF& contentsRect, int index ) const +{ + using Q = QskSegmentedBar; + + auto rect = segmentRect( bar, contentsRect, index ); + + auto sh = bar->sizeHint(); + + const QSizeF strutSize = bar->strutSizeHint( Q::Separator ); + + if( bar->orientation() == Qt::Horizontal ) + { + rect.setLeft( rect.right() ); + rect.setSize( { strutSize.width(), sh.height() } ); + } + else + { + rect.setTop( rect.bottom() ); + rect.setSize( { sh.width(), strutSize.height() } ); + } + + const auto padding = bar->paddingHint( Q::Separator ); + rect = rect.marginsRemoved( padding ); + + return rect; +} + QSGNode* QskSegmentedBarSkinlet::updateSubNode( const QskSkinnable* skinnable, quint8 nodeRole, QSGNode* node ) const { @@ -115,6 +143,9 @@ QSGNode* QskSegmentedBarSkinlet::updateSubNode( case SegmentRole: return updateSeriesNode( skinnable, Q::Segment, node ); + case SeparatorRole: + return updateSeriesNode( skinnable, Q::Separator, node ); + case TextRole: return updateSeriesNode( skinnable, Q::Text, node ); @@ -226,13 +257,18 @@ QRectF QskSegmentedBarSkinlet::sampleRect( const QskSkinnable* skinnable, const QRectF& contentsRect, QskAspect::Subcontrol subControl, int index ) const { using Q = QskSegmentedBar; + const auto bar = static_cast< const QskSegmentedBar* >( skinnable ); if ( subControl == Q::Segment ) { - const auto bar = static_cast< const QskSegmentedBar* >( skinnable ); return segmentRect( bar, contentsRect, index ); } + if ( subControl == Q::Separator ) + { + return separatorRect( bar, contentsRect, index ); + } + if ( subControl == Q::Text || subControl == Q::Graphic ) { const auto rect = sampleRect( skinnable, contentsRect, Q::Segment, index ); @@ -281,6 +317,20 @@ QSGNode* QskSegmentedBarSkinlet::updateSampleNode( const QskSkinnable* skinnable return updateBoxNode( skinnable, node, rect, subControl ); } + if( subControl == Q::Separator ) + { + if( index == bar->count() - 1 ) + { + return nullptr; + } + else + { + const auto rect = sampleRect( bar, bar->contentsRect(), subControl, index ); + + return updateBoxNode( skinnable, node, rect, subControl ); + } + } + const auto alignment = bar->alignmentHint( subControl, Qt::AlignCenter ); if ( subControl == Q::Text ) diff --git a/src/controls/QskSegmentedBarSkinlet.h b/src/controls/QskSegmentedBarSkinlet.h index 5c878255..8bb8faa8 100644 --- a/src/controls/QskSegmentedBarSkinlet.h +++ b/src/controls/QskSegmentedBarSkinlet.h @@ -21,6 +21,7 @@ class QSK_EXPORT QskSegmentedBarSkinlet : public QskSkinlet { PanelRole, SegmentRole, + SeparatorRole, CursorRole, TextRole, @@ -57,6 +58,7 @@ class QSK_EXPORT QskSegmentedBarSkinlet : public QskSkinlet QSizeF segmentSizeHint( const QskSegmentedBar* ) const; QRectF segmentRect( const QskSegmentedBar*, const QRectF&, int index ) const; + QRectF separatorRect( const QskSegmentedBar*, const QRectF&, int index ) const; QRectF cursorRect( const QskSegmentedBar*, const QRectF& ) const; }; From 4e581486c385db0604491cf77eb0f7bc2738c52f Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 17 Jun 2022 12:50:35 +0200 Subject: [PATCH 46/70] style segmented bar some more --- skins/material/QskMaterialSkin.cpp | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index df439d81..3f35e48b 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -332,6 +332,8 @@ void Editor::setupSegmentedBar() using A = QskAspect; using Q = QskSegmentedBar; + const QSize strutSize( -1, 40 ); + { // Panel @@ -343,8 +345,6 @@ void Editor::setupSegmentedBar() setBoxBorderMetrics( Q::Panel, 1 ); setBoxBorderColors( Q::Panel, m_pal.outline ); - const QSize strutSize( qskDpiScaled( -1 ), qskDpiScaled( 40 ) ); - setStrutSize( Q::Panel | A::Horizontal, strutSize ); setStrutSize( Q::Panel | A::Vertical, strutSize.transposed() ); } @@ -353,10 +353,16 @@ void Editor::setupSegmentedBar() // Segment setGradient( Q::Segment, Qt::transparent ); + setPadding( Q::Segment, 0 ); + } - // ### resolve this problem: -// setBoxBorderMetrics( Q::Segment, 0, 0, 1, 0 ); -// setBoxBorderColors( Q::Segment, m_pal.outline ); + { + // Separator + + setStrutSize( Q::Separator | A::Horizontal, 1, strutSize.height() ); + setStrutSize( Q::Separator | A::Vertical, strutSize.height(), 1 ); + setPadding( Q::Separator, 0 ); + setGradient( Q::Separator, m_pal.outline ); } { @@ -381,6 +387,8 @@ void Editor::setupSegmentedBar() { // Text + setFontRole( Q::Text, QskMaterialSkin::M3LabelLarge ); + setColor( Q::Text, m_pal.onSurface ); setColor( Q::Text | Q::Selected, m_pal.onSecondaryContainer ); } From 752982fa03e92f0a8ec68556bb6272b96d8b51a5 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 17 Jun 2022 15:28:42 +0200 Subject: [PATCH 47/70] improve shadow --- skins/material/QskMaterialSkin.cpp | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 3f35e48b..9250b4af 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -943,8 +943,8 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness, shadow = m_palettes[ Neutral ].rgb( Q::W0 ); } - elevationLight1 = QskShadowMetrics( -6, 20 ); - elevationLight2 = QskShadowMetrics( -5, 20 ); + elevationLight1 = QskShadowMetrics( -3, 5, { 0, 2 } ); + elevationLight2 = QskShadowMetrics( -2, 8, { 0, 2 } ); } QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& palette, QObject* parent ) From fecfd7c5c77f067e40100d22a346b06a978c1e8f Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 17 Jun 2022 17:37:44 +0200 Subject: [PATCH 48/70] move some colors to the palette --- skins/material/QskMaterialSkin.cpp | 107 ++++++++++------------------- skins/material/QskMaterialSkin.h | 4 ++ 2 files changed, 41 insertions(+), 70 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 9250b4af..95dfadc1 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -166,19 +166,13 @@ void Editor::setupCheckBox() setGradient( Q::Panel, m_pal.background ); setGradient( Q::Panel | Q::Checked, m_pal.primary ); - QColor c3( m_pal.surfaceVariant ); - c3.setAlphaF( 0.12 ); - setGradient( Q::Panel | Q::Disabled, c3 ); + setGradient( Q::Panel | Q::Disabled, m_pal.surfaceVariant12 ); - QColor c1( m_pal.onSurface ); - c1.setAlphaF( 0.12 ); - setGradient( Q::Panel | Q::Checked | Q::Disabled, c1 ); + setGradient( Q::Panel | Q::Checked | Q::Disabled, m_pal.onSurface12 ); setColor( Q::Indicator | Q::Checked, m_pal.primaryContainer ); - QColor c4( m_pal.onSurface ); - c4.setAlphaF( 0.38 ); - setColor( Q::Indicator | Q::Checked | Q::Disabled, c4 ); + setColor( Q::Indicator | Q::Checked | Q::Disabled, m_pal.onSurface38 ); setAnimation( Q::Panel | A::Color, qskDuration ); } @@ -221,15 +215,13 @@ void Editor::setupMenu() setMetric( Q::Separator | A::Size, qskDpiScaled( 1 ) ); setBoxShape( Q::Separator, 0 ); setBoxBorderMetrics( Q::Separator, 0 ); - QColor primary12( m_pal.primary ); - primary12.setAlphaF( 0.12 ); - setGradient( Q::Separator, primary12 ); + setGradient( Q::Separator, m_pal.primary12 ); setPadding( Q::Segment, 6 ); setSpacing( Q::Segment, 5 ); setGradient( Q::Segment, Qt::transparent ); - setGradient( Q::Cursor, primary12 ); + setGradient( Q::Cursor, m_pal.primary12 ); setPadding( Q::Graphic, 7 ); setStrutSize( Q::Graphic, { 46, -1 } ); @@ -284,10 +276,8 @@ void Editor::setupTextInput() setGradient( Q::Panel | Q::Disabled, c1 ); setBoxBorderMetrics( Q::Panel | Q::Disabled, 0, 0, 0, 1 ); - QColor c2( m_pal.onSurface ); - c2.setAlphaF( 0.38 ); // ### move this to the palette, we are using it all the time - setColor( Q::Text | Q::Disabled, c2 ); - setBoxBorderColors( Q::Panel | Q::Disabled, c2 ); + setColor( Q::Text | Q::Disabled, m_pal.onSurface38 ); + setBoxBorderColors( Q::Panel | Q::Disabled, m_pal.onSurface38 ); } void Editor::setupProgressBar() @@ -309,15 +299,10 @@ void Editor::setupProgressBar() setMetric( Q::Groove | A::Size, size ); setGradient( Q::Groove, m_pal.primaryContainer ); - QColor c1( m_pal.onSurface ); - c1.setAlphaF( 0.12 ); - setGradient( Q::Groove | Q::Disabled, c1 ); + setGradient( Q::Groove | Q::Disabled, m_pal.onSurface12 ); setGradient( Q::Bar, m_pal.primary ); - - QColor c2( m_pal.onSurface ); - c2.setAlphaF( 0.38 ); - setGradient( Q::Bar | Q::Disabled, c2 ); + setGradient( Q::Bar | Q::Disabled, m_pal.onSurface38 ); } void Editor::setupFocusIndicator() @@ -377,9 +362,7 @@ void Editor::setupSegmentedBar() setBoxShape( Q::Cursor | Q::Maximum | A::Vertical, 0, 0, 100, 100, Qt::RelativeSize ); setGradient( Q::Cursor, m_pal.secondaryContainer ); - QColor c1( m_pal.onSurface ); - c1.setAlphaF( 0.12 ); - setGradient( Q::Cursor | Q::Disabled, c1 ); + setGradient( Q::Cursor | Q::Disabled, m_pal.onSurface12 ); setAnimation( Q::Cursor | A::Metric | A::Position, 100 ); } @@ -431,13 +414,8 @@ void Editor::setupPageIndicator() setGradient( Q::Bullet, m_pal.primaryContainer ); setGradient( Q::Bullet | Q::Selected, m_pal.primary ); - QColor c1( m_pal.onSurface ); - c1.setAlphaF( 0.12 ); - setGradient( Q::Bullet | Q::Disabled, c1 ); - - QColor c2( m_pal.onSurface ); - c2.setAlphaF( 0.38 ); - setGradient( Q::Bullet | Q::Selected | Q::Disabled, c2 ); + setGradient( Q::Bullet | Q::Disabled, m_pal.onSurface12 ); + setGradient( Q::Bullet | Q::Selected | Q::Disabled, m_pal.onSurface38 ); setSpacing( Q::Panel, qskDpiScaled( 3 ) ); setPadding( Q::Panel, 0 ); @@ -466,16 +444,10 @@ void Editor::setupPushButton() // normal buttons (i.e. Filled): setGradient( Q::Panel, m_pal.primary ); - - QColor c1( m_pal.onSurface ); - c1.setAlphaF( 0.12 ); - setGradient( Q::Panel | Q::Disabled, c1 ); + setGradient( Q::Panel | Q::Disabled, m_pal.onSurface12 ); setColor( Q::Text, m_pal.onPrimary ); - - QColor c2( m_pal.onSurface ); - c2.setAlphaF( 0.38 ); - setColor( Q::Text | Q::Disabled, c2 ); + setColor( Q::Text | Q::Disabled, m_pal.onSurface38 ); setShadowMetrics( Q::Panel | Q::Hovered, m_pal.elevationLight1 ); setShadowColor( Q::Panel | Q::Hovered, m_pal.shadow ); @@ -491,7 +463,7 @@ void Editor::setupPushButton() setPadding( Q::Graphic, 5 ); setGradient( Q::Panel | Q::Disabled, Qt::transparent, combination ); - setBoxBorderColors( Q::Panel | Q::Outlined | Q::Disabled, c1 ); + setBoxBorderColors( Q::Panel | Q::Outlined | Q::Disabled, m_pal.onSurface12 ); QColor primary08( m_pal.primary ); primary08.setAlphaF( 0.08 ); @@ -504,7 +476,7 @@ void Editor::setupPushButton() setColor( Q::Text, m_pal.primary, combination ); - setColor( Q::Text | Q::Disabled, c1, combination ); + setColor( Q::Text | Q::Disabled, m_pal.onSurface12, combination ); setAnimation( Q::Panel | A::Color, qskDuration ); setAnimation( Q::Panel | A::Metric, qskDuration ); @@ -525,11 +497,9 @@ void Editor::setupDialogButton() setBoxShape( Q::Panel, 0 ); setGradient( Q::Panel, m_pal.primary ); - setColor( Q::Text, m_pal.onPrimary ); - QColor c2( m_pal.onSurface ); - c2.setAlphaF( 0.38 ); - setColor( Q::Text | Q::Disabled, c2 ); + setColor( Q::Text, m_pal.onPrimary ); + setColor( Q::Text | Q::Disabled, m_pal.onSurface38 ); setFontRole( Q::Text, QskMaterialSkin::M3LabelLarge ); setAlignment( Q::Text, Qt::AlignCenter ); @@ -594,16 +564,10 @@ void Editor::setupSlider() setMetric( Q::Fill | A::Size, qskDpiScaled( 6 ) ); setGradient( Q::Groove, m_pal.primaryContainer ); - - QColor c1( m_pal.onSurface ); - c1.setAlphaF( 0.12 ); - setGradient( Q::Groove | Q::Disabled, c1 ); + setGradient( Q::Groove | Q::Disabled, m_pal.onSurface12 ); setGradient( Q::Fill, m_pal.primary ); - - QColor c2( m_pal.onSurface ); - c2.setAlphaF( 0.38 ); - setGradient( Q::Fill | Q::Disabled, c2 ); + setGradient( Q::Fill | Q::Disabled, m_pal.onSurface38 ); setBoxShape( Q::Handle, 100, Qt::RelativeSize ); setBoxBorderMetrics( Q::Handle, 0 ); @@ -614,7 +578,7 @@ void Editor::setupSlider() setGradient( Q::Handle, m_pal.primary ); setGradient( Q::Handle | Q::Pressed, m_pal.primary ); - setGradient( Q::Handle | Q::Disabled, c2 ); + setGradient( Q::Handle | Q::Disabled, m_pal.onSurface38 ); setBoxBorderMetrics( Q::Handle, qskDpiScaled( rippleSize / 2 ) ); @@ -634,14 +598,10 @@ void Editor::setupSwitchButton() setStrutSize( Q::Groove | A::Vertical, strutSize.transposed() ); setGradient( Q::Groove, m_pal.surfaceVariant ); - QColor c3( m_pal.surfaceVariant ); - c3.setAlphaF( 0.12 ); - setGradient( Q::Groove | Q::Disabled, c3 ); + setGradient( Q::Groove | Q::Disabled, m_pal.surfaceVariant12 ); setGradient( Q::Groove | Q::Checked, m_pal.primary ); - QColor c1( m_pal.onSurface ); - c1.setAlphaF( 0.12 ); - setGradient( Q::Groove | Q::Checked | Q::Disabled, c1 ); + setGradient( Q::Groove | Q::Checked | Q::Disabled, m_pal.onSurface12 ); setBoxBorderMetrics( Q::Groove, 2 ); setBoxBorderColors( Q::Groove, m_pal.outline ); @@ -654,9 +614,7 @@ void Editor::setupSwitchButton() setGradient( Q::Handle, m_pal.outline ); setGradient( Q::Handle | Q::Checked, m_pal.primaryContainer ); - QColor c2( m_pal.onSurface ); - c2.setAlphaF( 0.38 ); - setGradient( Q::Handle | Q::Disabled, c2 ); + setGradient( Q::Handle | Q::Disabled, m_pal.onSurface38 ); setGradient( Q::Handle | Q::Disabled | Q::Checked, m_pal.surface ); // just to keep the strut size the same at all times: @@ -698,10 +656,7 @@ void Editor::setupTabButton() setStrutSize( Q::Panel, 64, 64 ); setColor( Q::Text, m_pal.onSurfaceVariant ); - - QColor c2( m_pal.onSurface ); - c2.setAlphaF( 0.38 ); - setColor( Q::Text | Q::Disabled, c2 ); + setColor( Q::Text | Q::Disabled, m_pal.onSurface38 ); setColor( Q::Text | Q::Checked, m_pal.primary ); setColor( Q::Text | Q::Hovered, m_pal.primary ); @@ -943,6 +898,18 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness, shadow = m_palettes[ Neutral ].rgb( Q::W0 ); } + primary12 = primary; + primary12.setAlphaF( 0.12 ); + + onSurface12 = onSurface; + onSurface12.setAlphaF( 0.12 ); + + onSurface38 = onSurface; + onSurface38.setAlphaF( 0.38 ); + + surfaceVariant12 = surfaceVariant; + surfaceVariant12.setAlphaF( 0.12 ); + elevationLight1 = QskShadowMetrics( -3, 5, { 0, 2 } ); elevationLight2 = QskShadowMetrics( -2, 8, { 0, 2 } ); } diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index 10e5b947..9e424679 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -38,6 +38,7 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme QskMaterialTheme( Lightness, std::array< QskRgbPalette, NumPaletteTypes > ); QRgb primary; + QColor primary12; QRgb onPrimary; QRgb primaryContainer; QRgb onPrimaryContainer; @@ -61,8 +62,11 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme QRgb onBackground; QRgb surface; QRgb onSurface; + QColor onSurface12; + QColor onSurface38; QRgb surfaceVariant; + QColor surfaceVariant12; QRgb onSurfaceVariant; QRgb outline; From 74ccd3e4df7318c359f5e4256e962c85d2ac572b Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Fri, 17 Jun 2022 18:20:34 +0200 Subject: [PATCH 49/70] style segmented bar in disabled state --- skins/material/QskMaterialSkin.cpp | 20 ++++++++++++++++---- 1 file changed, 16 insertions(+), 4 deletions(-) diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 95dfadc1..e965afbb 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -329,6 +329,7 @@ void Editor::setupSegmentedBar() setBoxBorderMetrics( Q::Panel, 1 ); setBoxBorderColors( Q::Panel, m_pal.outline ); + setBoxBorderColors( Q::Panel | Q::Disabled, m_pal.onSurface12 ); setStrutSize( Q::Panel | A::Horizontal, strutSize ); setStrutSize( Q::Panel | A::Vertical, strutSize.transposed() ); @@ -348,6 +349,7 @@ void Editor::setupSegmentedBar() setStrutSize( Q::Separator | A::Vertical, strutSize.height(), 1 ); setPadding( Q::Separator, 0 ); setGradient( Q::Separator, m_pal.outline ); + setColor( Q::Separator | Q::Disabled, m_pal.onSurface38 ); } { @@ -355,11 +357,19 @@ void Editor::setupSegmentedBar() setMargin( Q::Cursor, 1 ); setBoxShape( Q::Cursor, 0 ); - setBoxShape( Q::Cursor | Q::Minimum | A::Horizontal, 100, 0, 100, 0, Qt::RelativeSize ); - setBoxShape( Q::Cursor | Q::Maximum | A::Horizontal, 0, 100, 0, 100, Qt::RelativeSize ); + setBoxShape( Q::Cursor | Q::Minimum | A::Horizontal, + { 100, 0, 100, 0, Qt::RelativeSize }, + { QskStateCombination::CombinationNoState, Q::Disabled } ); + setBoxShape( Q::Cursor | Q::Maximum | A::Horizontal, + { 0, 100, 0, 100, Qt::RelativeSize }, + { QskStateCombination::CombinationNoState, Q::Disabled } ); - setBoxShape( Q::Cursor | Q::Minimum | A::Vertical, 100, 100, 0, 0, Qt::RelativeSize ); - setBoxShape( Q::Cursor | Q::Maximum | A::Vertical, 0, 0, 100, 100, Qt::RelativeSize ); + setBoxShape( Q::Cursor | Q::Minimum | A::Vertical, + { 100, 100, 0, 0, Qt::RelativeSize }, + { QskStateCombination::CombinationNoState, Q::Disabled } ); + setBoxShape( Q::Cursor | Q::Maximum | A::Vertical, + { 0, 0, 100, 100, Qt::RelativeSize }, + { QskStateCombination::CombinationNoState, Q::Disabled } ); setGradient( Q::Cursor, m_pal.secondaryContainer ); setGradient( Q::Cursor | Q::Disabled, m_pal.onSurface12 ); @@ -374,6 +384,8 @@ void Editor::setupSegmentedBar() setColor( Q::Text, m_pal.onSurface ); setColor( Q::Text | Q::Selected, m_pal.onSecondaryContainer ); + + setColor( Q::Text | Q::Disabled, m_pal.onSurface38 ); } { From 6332a27764344eed4177fc1ca045632141bec20b Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Mon, 27 Jun 2022 14:32:37 +0200 Subject: [PATCH 50/70] fix build after merge --- examples/boxes/main.cpp | 18 ++-- skins/material/QskMaterialSkin.cpp | 126 +++++++++++------------- skins/material/QskMaterialSkin.h | 9 +- skins/material/QskMaterialSkinFactory.h | 1 - src/common/QskRgbValue.h | 9 -- 5 files changed, 70 insertions(+), 93 deletions(-) diff --git a/examples/boxes/main.cpp b/examples/boxes/main.cpp index ddcae76f..8641e48d 100644 --- a/examples/boxes/main.cpp +++ b/examples/boxes/main.cpp @@ -109,15 +109,15 @@ static void addRectangles3( QskLinearBox* parent ) box = new MyRectangle( parent ); box->setBorder( Box::Raised1, borderTheme ); - box->setGradient( DefaultMaterialNeutral60 ); + box->setGradient( Grey400 ); box = new MyRectangle( parent ); box->setBorder( Box::Sunken1, borderTheme ); - box->setGradient( QskGradient::Diagonal, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); + box->setGradient( QskGradient::Diagonal, Grey400, Grey500 ); box = new MyRectangle( parent ); box->setBorder( Box::Raised2, borderTheme ); - box->setGradient( QskGradient::Vertical, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); + box->setGradient( QskGradient::Vertical, Grey400, Grey500 ); box = new MyRectangle( parent ); box->setBorder( Box::Raised2, borderTheme ); @@ -159,15 +159,15 @@ static void addRectangles6( QskLinearBox* parent ) box = new MyRoundedRectangle( parent ); box->setBorder( Box::Raised1, borderTheme ); - box->setGradient( DefaultMaterialNeutral60 ); + box->setGradient( Grey400 ); box = new MyRoundedRectangle( parent ); box->setBorder( Box::Sunken1, borderTheme ); - box->setGradient( QskGradient::Diagonal, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); + box->setGradient( QskGradient::Diagonal, Grey400, Grey500 ); box = new MyRoundedRectangle( parent ); box->setBorder( Box::Raised2, borderTheme ); - box->setGradient( QskGradient::Vertical, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); + box->setGradient( QskGradient::Vertical, Grey400, Grey500 ); box = new MyRoundedRectangle( parent ); box->setBorder( Box::Raised2, borderTheme ); @@ -209,15 +209,15 @@ static void addRectangles9( QskLinearBox* parent ) box = new MyEllipse( parent ); box->setBorder( Box::Raised1, borderTheme ); - box->setGradient( DefaultMaterialNeutral60 ); + box->setGradient( Grey400 ); box = new MyEllipse( parent ); box->setBorder( Box::Sunken1, borderTheme ); - box->setGradient( QskGradient::Diagonal, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); + box->setGradient( QskGradient::Diagonal, Grey400, Grey500 ); box = new MyEllipse( parent ); box->setBorder( Box::Raised2, borderTheme ); - box->setGradient( QskGradient::Vertical, DefaultMaterialNeutral60, DefaultMaterialNeutral50 ); + box->setGradient( QskGradient::Vertical, Grey400, Grey500 ); box = new MyEllipse( parent ); box->setBorder( Box::Raised2, borderTheme ); diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index b4d46e7f..f0b3c776 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -47,16 +47,6 @@ static const int qskDuration = 150; namespace { -#if 1 - // temporary definitions, will be removed when moving to M(aterial)3 - constexpr const QRgb Grey100 = 0xfff5f5f5; - constexpr const QRgb Grey300 = 0xffe0e0e0; - constexpr const QRgb Grey400 = 0xffbdbdbd; - constexpr const QRgb Grey500 = 0xff9e9e9e; - constexpr const QRgb Grey600 = 0xff757575; - constexpr const QRgb Blue500 = 0xff2196f3; -#endif - class Editor : private QskSkinHintTableEditor { public: @@ -836,88 +826,86 @@ void Editor::setupSubWindow() QskMaterialTheme::QskMaterialTheme( Lightness lightness ) : QskMaterialTheme( lightness, - { - QskRgbPalette::palette( QskRgbPalette::DefaultMaterialPrimary ), - QskRgbPalette::palette( QskRgbPalette::DefaultMaterialSecondary ), - QskRgbPalette::palette( QskRgbPalette::DefaultMaterialTertiary ), - QskRgbPalette::palette( QskRgbPalette::DefaultMaterialError ), - QskRgbPalette::palette( QskRgbPalette::DefaultMaterialNeutral ), - QskRgbPalette::palette( QskRgbPalette::DefaultMaterialNeutralVariant ), + { // default Material colors: + 0xff6750A4, + 0xff625B71, + 0xff7D5260, + 0xffB3261E, + 0xff605D62, + 0xff605D66, } ) { } -QskMaterialTheme::QskMaterialTheme( Lightness lightness, - std::array< QskRgbPalette, NumPaletteTypes > palettes ) +QskMaterialTheme::QskMaterialTheme(Lightness lightness, + std::array palettes ) : m_palettes( palettes ) { - using Q = QskRgbPalette; - if ( lightness == Light ) { - primary = m_palettes[ Primary ].rgb( Q::W40 ); - onPrimary = m_palettes[ Primary ].rgb( Q::W100 ); - primaryContainer = m_palettes[ Primary ].rgb( Q::W90 ); - onPrimaryContainer = m_palettes[ Primary ].rgb( Q::W10 ); + primary = m_palettes[ Primary ].toned( 40 ).rgb(); + onPrimary = m_palettes[ Primary ].toned( 100 ).rgb(); + primaryContainer = m_palettes[ Primary ].toned( 90 ).rgb(); + onPrimaryContainer = m_palettes[ Primary ].toned( 10 ).rgb(); - secondary = m_palettes[ Secondary ].rgb( Q::W40 ); - onSecondary = m_palettes[ Secondary ].rgb( Q::W100 ); - secondaryContainer = m_palettes[ Secondary ].rgb( Q::W90 ); - onSecondaryContainer = m_palettes[ Secondary ].rgb( Q::W10 ); + secondary = m_palettes[ Secondary ].toned( 40 ).rgb(); + onSecondary = m_palettes[ Secondary ].toned( 100 ).rgb(); + secondaryContainer = m_palettes[ Secondary ].toned( 90 ).rgb(); + onSecondaryContainer = m_palettes[ Secondary ].toned( 10 ).rgb(); - tertiary = m_palettes[ Tertiary ].rgb( Q::W40 ); - onTertiary = m_palettes[ Tertiary ].rgb( Q::W100 ); - tertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W90 ); - onTertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W10 ); + tertiary = m_palettes[ Tertiary ].toned( 40 ).rgb(); + onTertiary = m_palettes[ Tertiary ].toned( 100 ).rgb(); + tertiaryContainer = m_palettes[ Tertiary ].toned( 90 ).rgb(); + onTertiaryContainer = m_palettes[ Tertiary ].toned( 10 ).rgb(); - error = m_palettes[ Error ].rgb( Q::W40 ); - onError = m_palettes[ Error ].rgb( Q::W100 ); - errorContainer = m_palettes[ Error ].rgb( Q::W90 ); - onErrorContainer = m_palettes[ Error ].rgb( Q::W10 ); + error = m_palettes[ Error ].toned( 40 ).rgb(); + onError = m_palettes[ Error ].toned( 100 ).rgb(); + errorContainer = m_palettes[ Error ].toned( 90 ).rgb(); + onErrorContainer = m_palettes[ Error ].toned( 10 ).rgb(); - background = m_palettes[ Neutral ].rgb( Q::W99 ); - onBackground = m_palettes[ Neutral ].rgb( Q::W10 ); - surface = m_palettes[ Neutral ].rgb( Q::W99 ); - onSurface = m_palettes[ Neutral ].rgb( Q::W10 ); + background = m_palettes[ Neutral ].toned( 99 ).rgb(); + onBackground = m_palettes[ Neutral ].toned( 10 ).rgb(); + surface = m_palettes[ Neutral ].toned( 99 ).rgb(); + onSurface = m_palettes[ Neutral ].toned( 10 ).rgb(); - surfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W90 ); - onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); - outline = m_palettes[ NeutralVariant ].rgb( Q::W50 ); + surfaceVariant = m_palettes[ NeutralVariant ].toned( 90 ).rgb(); + onSurfaceVariant = m_palettes[ NeutralVariant ].toned( 30 ).rgb(); + outline = m_palettes[ NeutralVariant ].toned( 50 ).rgb(); - shadow = m_palettes[ Neutral ].rgb( Q::W0 ); + shadow = m_palettes[ Neutral ].toned( 0 ).rgb(); } else if ( lightness == Dark ) { - primary = m_palettes[ Primary ].rgb( Q::W80 ); - onPrimary = m_palettes[ Primary ].rgb( Q::W20 ); - primaryContainer = m_palettes[ Primary ].rgb( Q::W30 ); - onPrimaryContainer = m_palettes[ Primary ].rgb( Q::W90 ); + primary = m_palettes[ Primary ].toned( 80 ).rgb(); + onPrimary = m_palettes[ Primary ].toned( 20 ).rgb(); + primaryContainer = m_palettes[ Primary ].toned( 30 ).rgb(); + onPrimaryContainer = m_palettes[ Primary ].toned( 90 ).rgb(); - secondary = m_palettes[ Secondary ].rgb( Q::W80 ); - onSecondary = m_palettes[ Secondary ].rgb( Q::W20 ); - secondaryContainer = m_palettes[ Secondary ].rgb( Q::W30 ); - onSecondaryContainer = m_palettes[ Secondary ].rgb( Q::W90 ); + secondary = m_palettes[ Secondary ].toned( 80 ).rgb(); + onSecondary = m_palettes[ Secondary ].toned( 20 ).rgb(); + secondaryContainer = m_palettes[ Secondary ].toned( 30 ).rgb(); + onSecondaryContainer = m_palettes[ Secondary ].toned( 90 ).rgb(); - tertiary = m_palettes[ Tertiary ].rgb( Q::W80 ); - onTertiary = m_palettes[ Tertiary ].rgb( Q::W20 ); - tertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W30 ); - onTertiaryContainer = m_palettes[ Tertiary ].rgb( Q::W90 ); + tertiary = m_palettes[ Tertiary ].toned( 80 ).rgb(); + onTertiary = m_palettes[ Tertiary ].toned( 20 ).rgb(); + tertiaryContainer = m_palettes[ Tertiary ].toned( 30 ).rgb(); + onTertiaryContainer = m_palettes[ Tertiary ].toned( 90 ).rgb(); - error = m_palettes[ Error ].rgb( Q::W80 ); - onError = m_palettes[ Error ].rgb( Q::W20 ); - errorContainer = m_palettes[ Error ].rgb( Q::W30 ); - onErrorContainer = m_palettes[ Error ].rgb( Q::W90 ); + error = m_palettes[ Error ].toned( 80 ).rgb(); + onError = m_palettes[ Error ].toned( 20 ).rgb(); + errorContainer = m_palettes[ Error ].toned( 30 ).rgb(); + onErrorContainer = m_palettes[ Error ].toned( 90 ).rgb(); - background = m_palettes[ Neutral ].rgb( Q::W10 ); - onBackground = m_palettes[ Neutral ].rgb( Q::W90 ); - surface = m_palettes[ Neutral ].rgb( Q::W10 ); - onSurface = m_palettes[ Neutral ].rgb( Q::W80 ); + background = m_palettes[ Neutral ].toned( 10 ).rgb(); + onBackground = m_palettes[ Neutral ].toned( 90 ).rgb(); + surface = m_palettes[ Neutral ].toned( 10 ).rgb(); + onSurface = m_palettes[ Neutral ].toned( 80 ).rgb(); - surfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W30 ); - onSurfaceVariant = m_palettes[ NeutralVariant ].rgb( Q::W80 ); - outline = m_palettes[ NeutralVariant ].rgb( Q::W60 ); + surfaceVariant = m_palettes[ NeutralVariant ].toned( 30 ).rgb(); + onSurfaceVariant = m_palettes[ NeutralVariant ].toned( 80 ).rgb(); + outline = m_palettes[ NeutralVariant ].toned( 60 ).rgb(); - shadow = m_palettes[ Neutral ].rgb( Q::W0 ); + shadow = m_palettes[ Neutral ].toned( 0 ).rgb(); } primary12 = primary; diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h index 9e424679..f97b2c5b 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material/QskMaterialSkin.h @@ -7,8 +7,9 @@ #define QSK_MATERIAL_SKIN_H #include "QskMaterialGlobal.h" + +#include #include -#include #include #include @@ -35,7 +36,7 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme }; QskMaterialTheme( Lightness ); - QskMaterialTheme( Lightness, std::array< QskRgbPalette, NumPaletteTypes > ); + QskMaterialTheme( Lightness, std::array< QskHctColor, NumPaletteTypes > ); QRgb primary; QColor primary12; @@ -81,7 +82,7 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme const qreal draggedOpacity = 0.16; private: - std::array< QskRgbPalette, NumPaletteTypes > m_palettes; + std::array< QskHctColor, NumPaletteTypes > m_palettes; }; class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin @@ -100,8 +101,6 @@ class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin M3LabelLarge, }; - // ### add setTheme() re-implement resetColors() - private: void setupFonts(); }; diff --git a/skins/material/QskMaterialSkinFactory.h b/skins/material/QskMaterialSkinFactory.h index 0936d76b..8294e824 100644 --- a/skins/material/QskMaterialSkinFactory.h +++ b/skins/material/QskMaterialSkinFactory.h @@ -7,7 +7,6 @@ #define QSK_MATERIAL_SKIN_FACTORY_H #include "QskMaterialGlobal.h" -#include #include class QSK_MATERIAL_EXPORT QskMaterialSkinFactory : public QskSkinFactory diff --git a/src/common/QskRgbValue.h b/src/common/QskRgbValue.h index 96aa5e07..39687898 100644 --- a/src/common/QskRgbValue.h +++ b/src/common/QskRgbValue.h @@ -9,15 +9,6 @@ #include "QskGlobal.h" #include - RGBVALUE( DefaultMaterialError95, 0xffFCEEEE ) \ - RGBVALUE( DefaultMaterialError99, 0xffFFFBF9 ) \ - RGBVALUE( DefaultMaterialError100, 0xffFFFFFF ) \ - RGBVALUE( DefaultMaterialNeutral95, 0xffF4EFF4 ) \ - RGBVALUE( DefaultMaterialNeutral99, 0xffFFFBFE ) \ - RGBVALUE( DefaultMaterialNeutral100, 0xffFFFFFF ) \ - RGBVALUE( DefaultMaterialNeutralVariant95, 0xffF5EEFA ) \ - RGBVALUE( DefaultMaterialNeutralVariant99, 0xffFFFBFE ) \ - RGBVALUE( DefaultMaterialNeutralVariant100, 0xffFFFFFF ) \ namespace QskRgb { /* Web colors */ From 5ff92a9fb8d4f2c79316d58ce9e8a12538307346 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 08:36:25 +0200 Subject: [PATCH 51/70] Material: Rename new skin to Material3 --- examples/iotdashboard/main.cpp | 2 +- skins/material/metadata.json | 4 --- .../QskMaterial3Global.h} | 14 ++++----- .../QskMaterial3Skin.cpp} | 30 +++++++++---------- .../QskMaterial3Skin.h} | 18 +++++------ .../QskMaterial3SkinFactory.cpp} | 26 ++++++++-------- .../QskMaterial3SkinFactory.h} | 8 ++--- .../material.pro => material3/material3.pro} | 14 ++++----- skins/material3/metadata.json | 4 +++ skins/skins.pro | 2 +- support/SkinnyNamespace.cpp | 4 +-- support/SkinnyPlugin.cpp | 4 +-- support/support.pro | 2 +- 13 files changed, 66 insertions(+), 66 deletions(-) delete mode 100644 skins/material/metadata.json rename skins/{material/QskMaterialGlobal.h => material3/QskMaterial3Global.h} (60%) rename skins/{material/QskMaterialSkin.cpp => material3/QskMaterial3Skin.cpp} (97%) rename skins/{material/QskMaterialSkin.h => material3/QskMaterial3Skin.h} (80%) rename skins/{material/QskMaterialSkinFactory.cpp => material3/QskMaterial3SkinFactory.cpp} (55%) rename skins/{material/QskMaterialSkinFactory.h => material3/QskMaterial3SkinFactory.h} (75%) rename skins/{material/material.pro => material3/material3.pro} (51%) create mode 100644 skins/material3/metadata.json diff --git a/examples/iotdashboard/main.cpp b/examples/iotdashboard/main.cpp index 12ffb4d9..36ee139b 100644 --- a/examples/iotdashboard/main.cpp +++ b/examples/iotdashboard/main.cpp @@ -66,7 +66,7 @@ int main( int argc, char* argv[] ) // disable default skins qskSkinManager->setPluginPaths( QStringList() ); // no plugins - qskSkinManager->unregisterFactory( "materialfactory" ); + qskSkinManager->unregisterFactory( "material3factory" ); qskSkinManager->unregisterFactory( "squiekfactory" ); qskSkinManager->registerFactory( diff --git a/skins/material/metadata.json b/skins/material/metadata.json deleted file mode 100644 index 57af8644..00000000 --- a/skins/material/metadata.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "FactoryId": "MaterialFactory", - "Skins": [ "materialLight", "materialDark" ] -} diff --git a/skins/material/QskMaterialGlobal.h b/skins/material3/QskMaterial3Global.h similarity index 60% rename from skins/material/QskMaterialGlobal.h rename to skins/material3/QskMaterial3Global.h index 76e58182..be12d9d4 100644 --- a/skins/material/QskMaterialGlobal.h +++ b/skins/material3/QskMaterial3Global.h @@ -3,23 +3,23 @@ * This file may be used under the terms of the QSkinny License, Version 1.0 *****************************************************************************/ -#ifndef QSK_MATERIAL_GLOBAL_H -#define QSK_MATERIAL_GLOBAL_H +#ifndef QSK_MATERIAL3_GLOBAL_H +#define QSK_MATERIAL3_GLOBAL_H #include "QskGlobal.h" #ifdef QSK_DLL -#if defined( QSK_MATERIAL_MAKEDLL ) // create a DLL library -#define QSK_MATERIAL_EXPORT Q_DECL_EXPORT +#if defined( QSK_MATERIAL3_MAKEDLL ) // create a DLL library +#define QSK_MATERIAL3_EXPORT Q_DECL_EXPORT #else // use a DLL library -#define QSK_MATERIAL_EXPORT Q_DECL_IMPORT +#define QSK_MATERIAL3_EXPORT Q_DECL_IMPORT #endif #endif // QSK_DLL -#ifndef QSK_MATERIAL_EXPORT -#define QSK_MATERIAL_EXPORT +#ifndef QSK_MATERIAL3_EXPORT +#define QSK_MATERIAL3_EXPORT #endif #endif diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material3/QskMaterial3Skin.cpp similarity index 97% rename from skins/material/QskMaterialSkin.cpp rename to skins/material3/QskMaterial3Skin.cpp index f0b3c776..4fc89578 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -3,7 +3,7 @@ * This file may be used under the terms of the QSkinny License, Version 1.0 *****************************************************************************/ -#include "QskMaterialSkin.h" +#include "QskMaterial3Skin.h" #include @@ -50,7 +50,7 @@ namespace class Editor : private QskSkinHintTableEditor { public: - Editor( QskSkinHintTable* table, const QskMaterialTheme& palette ) + Editor( QskSkinHintTable* table, const QskMaterial3Theme& palette ) : QskSkinHintTableEditor( table ) , m_pal( palette ) { @@ -86,7 +86,7 @@ namespace void setupTextInput(); void setupTextLabel(); - const QskMaterialTheme& m_pal; + const QskMaterial3Theme& m_pal; const uint rippleSize = 40; // ### remove }; @@ -227,7 +227,7 @@ void Editor::setupMenu() setStrutSize( Q::Graphic, { 46, -1 } ); setColor( Q::Text, m_pal.onSurface ); - setFontRole( Q::Text, QskMaterialSkin::M3BodyLarge ); + setFontRole( Q::Text, QskMaterial3Skin::M3BodyLarge ); setPosition( Q::Panel, 0 ); setPosition( Q::Panel | QskPopup::Closed, 1 ); @@ -380,7 +380,7 @@ void Editor::setupSegmentedBar() { // Text - setFontRole( Q::Text, QskMaterialSkin::M3LabelLarge ); + setFontRole( Q::Text, QskMaterial3Skin::M3LabelLarge ); setColor( Q::Text, m_pal.onSurface ); setColor( Q::Text | Q::Selected, m_pal.onSecondaryContainer ); @@ -449,7 +449,7 @@ void Editor::setupPushButton() setAlignment( Q::Graphic | A::Alignment, Qt::AlignLeft ); setPadding( Q::Graphic, 5 ); - setFontRole( Q::Text, QskMaterialSkin::M3LabelLarge ); + setFontRole( Q::Text, QskMaterial3Skin::M3LabelLarge ); setAlignment( Q::Text, Qt::AlignCenter ); @@ -513,7 +513,7 @@ void Editor::setupDialogButton() setColor( Q::Text, m_pal.onPrimary ); setColor( Q::Text | Q::Disabled, m_pal.onSurface38 ); - setFontRole( Q::Text, QskMaterialSkin::M3LabelLarge ); + setFontRole( Q::Text, QskMaterial3Skin::M3LabelLarge ); setAlignment( Q::Text, Qt::AlignCenter ); for ( auto state1 : { A::NoState, Q::Focused } ) @@ -685,7 +685,7 @@ void Editor::setupTabButton() setAnimation( Q::Panel | A::Color, qskDuration ); - setFontRole( Q::Text, QskMaterialSkin::M3LabelLarge ); + setFontRole( Q::Text, QskMaterial3Skin::M3LabelLarge ); setAlignment( Q::Text, Qt::AlignCenter ); } @@ -824,8 +824,8 @@ void Editor::setupSubWindow() } -QskMaterialTheme::QskMaterialTheme( Lightness lightness ) - : QskMaterialTheme( lightness, +QskMaterial3Theme::QskMaterial3Theme( Lightness lightness ) + : QskMaterial3Theme( lightness, { // default Material colors: 0xff6750A4, 0xff625B71, @@ -837,7 +837,7 @@ QskMaterialTheme::QskMaterialTheme( Lightness lightness ) { } -QskMaterialTheme::QskMaterialTheme(Lightness lightness, +QskMaterial3Theme::QskMaterial3Theme(Lightness lightness, std::array palettes ) : m_palettes( palettes ) { @@ -924,7 +924,7 @@ QskMaterialTheme::QskMaterialTheme(Lightness lightness, elevationLight2 = QskShadowMetrics( -2, 8, { 0, 2 } ); } -QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& palette, QObject* parent ) +QskMaterial3Skin::QskMaterial3Skin( const QskMaterial3Theme& palette, QObject* parent ) : Inherited( parent ) { setupFonts(); @@ -933,11 +933,11 @@ QskMaterialSkin::QskMaterialSkin( const QskMaterialTheme& palette, QObject* pare editor.setup(); } -QskMaterialSkin::~QskMaterialSkin() +QskMaterial3Skin::~QskMaterial3Skin() { } -void QskMaterialSkin::setupFonts() +void QskMaterial3Skin::setupFonts() { Inherited::setupFonts( QStringLiteral( "Roboto" ) ); @@ -945,4 +945,4 @@ void QskMaterialSkin::setupFonts() setFont( M3LabelLarge, createFont( 14 ) ); } -#include "moc_QskMaterialSkin.cpp" +#include "moc_QskMaterial3Skin.cpp" diff --git a/skins/material/QskMaterialSkin.h b/skins/material3/QskMaterial3Skin.h similarity index 80% rename from skins/material/QskMaterialSkin.h rename to skins/material3/QskMaterial3Skin.h index f97b2c5b..5c2b0700 100644 --- a/skins/material/QskMaterialSkin.h +++ b/skins/material3/QskMaterial3Skin.h @@ -3,10 +3,10 @@ * This file may be used under the terms of the QSkinny License, Version 1.0 *****************************************************************************/ -#ifndef QSK_MATERIAL_SKIN_H -#define QSK_MATERIAL_SKIN_H +#ifndef QSK_MATERIAL3_SKIN_H +#define QSK_MATERIAL3_SKIN_H -#include "QskMaterialGlobal.h" +#include "QskMaterial3Global.h" #include #include @@ -14,7 +14,7 @@ #include -class QSK_MATERIAL_EXPORT QskMaterialTheme +class QSK_MATERIAL3_EXPORT QskMaterial3Theme { public: enum Lightness @@ -35,8 +35,8 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme NumPaletteTypes }; - QskMaterialTheme( Lightness ); - QskMaterialTheme( Lightness, std::array< QskHctColor, NumPaletteTypes > ); + QskMaterial3Theme( Lightness ); + QskMaterial3Theme( Lightness, std::array< QskHctColor, NumPaletteTypes > ); QRgb primary; QColor primary12; @@ -85,15 +85,15 @@ class QSK_MATERIAL_EXPORT QskMaterialTheme std::array< QskHctColor, NumPaletteTypes > m_palettes; }; -class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin +class QSK_MATERIAL3_EXPORT QskMaterial3Skin : public QskSkin { Q_OBJECT using Inherited = QskSkin; public: - QskMaterialSkin( const QskMaterialTheme&, QObject* parent = nullptr ); - ~QskMaterialSkin() override; + QskMaterial3Skin( const QskMaterial3Theme&, QObject* parent = nullptr ); + ~QskMaterial3Skin() override; enum FontRole { diff --git a/skins/material/QskMaterialSkinFactory.cpp b/skins/material3/QskMaterial3SkinFactory.cpp similarity index 55% rename from skins/material/QskMaterialSkinFactory.cpp rename to skins/material3/QskMaterial3SkinFactory.cpp index e73cd20f..4f43f841 100644 --- a/skins/material/QskMaterialSkinFactory.cpp +++ b/skins/material3/QskMaterial3SkinFactory.cpp @@ -3,40 +3,40 @@ * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ -#include "QskMaterialSkinFactory.h" -#include "QskMaterialSkin.h" +#include "QskMaterial3SkinFactory.h" +#include "QskMaterial3Skin.h" -static const QString materialLightSkinName = QStringLiteral( "materialLight" ); -static const QString materialDarkSkinName = QStringLiteral( "materialDark" ); +static const QString materialLightSkinName = QStringLiteral( "material3Light" ); +static const QString materialDarkSkinName = QStringLiteral( "material3Dark" ); -QskMaterialSkinFactory::QskMaterialSkinFactory( QObject* parent ) +QskMaterial3SkinFactory::QskMaterial3SkinFactory( QObject* parent ) : QskSkinFactory( parent ) { } -QskMaterialSkinFactory::~QskMaterialSkinFactory() +QskMaterial3SkinFactory::~QskMaterial3SkinFactory() { } -QStringList QskMaterialSkinFactory::skinNames() const +QStringList QskMaterial3SkinFactory::skinNames() const { return { materialLightSkinName, materialDarkSkinName }; } -QskSkin* QskMaterialSkinFactory::createSkin( const QString& skinName ) +QskSkin* QskMaterial3SkinFactory::createSkin( const QString& skinName ) { if ( QString::compare( skinName, materialLightSkinName, Qt::CaseInsensitive ) == 0 ) { - QskMaterialTheme theme( QskMaterialTheme::Light ); - return new QskMaterialSkin( theme ); + QskMaterial3Theme theme( QskMaterial3Theme::Light ); + return new QskMaterial3Skin( theme ); } else if ( QString::compare( skinName, materialDarkSkinName, Qt::CaseInsensitive ) == 0 ) { - QskMaterialTheme theme( QskMaterialTheme::Dark ); - return new QskMaterialSkin( theme ); + QskMaterial3Theme theme( QskMaterial3Theme::Dark ); + return new QskMaterial3Skin( theme ); } return nullptr; } -#include "moc_QskMaterialSkinFactory.cpp" +#include "moc_QskMaterial3SkinFactory.cpp" diff --git a/skins/material/QskMaterialSkinFactory.h b/skins/material3/QskMaterial3SkinFactory.h similarity index 75% rename from skins/material/QskMaterialSkinFactory.h rename to skins/material3/QskMaterial3SkinFactory.h index 8294e824..9727a329 100644 --- a/skins/material/QskMaterialSkinFactory.h +++ b/skins/material3/QskMaterial3SkinFactory.h @@ -6,10 +6,10 @@ #ifndef QSK_MATERIAL_SKIN_FACTORY_H #define QSK_MATERIAL_SKIN_FACTORY_H -#include "QskMaterialGlobal.h" +#include "QskMaterial3Global.h" #include -class QSK_MATERIAL_EXPORT QskMaterialSkinFactory : public QskSkinFactory +class QSK_MATERIAL3_EXPORT QskMaterial3SkinFactory : public QskSkinFactory { Q_OBJECT @@ -17,8 +17,8 @@ class QSK_MATERIAL_EXPORT QskMaterialSkinFactory : public QskSkinFactory Q_INTERFACES( QskSkinFactory ) public: - QskMaterialSkinFactory( QObject* parent = nullptr ); - ~QskMaterialSkinFactory() override; + QskMaterial3SkinFactory( QObject* parent = nullptr ); + ~QskMaterial3SkinFactory() override; QStringList skinNames() const override; QskSkin* createSkin( const QString& skinName ) override; diff --git a/skins/material/material.pro b/skins/material3/material3.pro similarity index 51% rename from skins/material/material.pro rename to skins/material3/material3.pro index c1259315..97317b2d 100644 --- a/skins/material/material.pro +++ b/skins/material3/material3.pro @@ -4,17 +4,17 @@ CONFIG += qskinny TEMPLATE = lib QSK_PLUGIN_SUBDIR = skins -TARGET = $$qskPluginTarget(materialskin) -DEFINES += QSK_MATERIAL_MAKEDLL +TARGET = $$qskPluginTarget(material3skin) +DEFINES += QSK_MATERIAL3_MAKEDLL HEADERS += \ - QskMaterialGlobal.h \ - QskMaterialSkin.h \ - QskMaterialSkinFactory.h + QskMaterial3Global.h \ + QskMaterial3Skin.h \ + QskMaterial3SkinFactory.h SOURCES += \ - QskMaterialSkin.cpp \ - QskMaterialSkinFactory.cpp + QskMaterial3Skin.cpp \ + QskMaterial3SkinFactory.cpp OTHER_FILES += metadata.json diff --git a/skins/material3/metadata.json b/skins/material3/metadata.json new file mode 100644 index 00000000..c668d63e --- /dev/null +++ b/skins/material3/metadata.json @@ -0,0 +1,4 @@ +{ + "FactoryId": "Material3Factory", + "Skins": [ "material3Light", "material3Dark" ] +} diff --git a/skins/skins.pro b/skins/skins.pro index 42e5f9bb..2a2c6621 100644 --- a/skins/skins.pro +++ b/skins/skins.pro @@ -2,4 +2,4 @@ TEMPLATE = subdirs SUBDIRS += \ squiek \ - material + material3 diff --git a/support/SkinnyNamespace.cpp b/support/SkinnyNamespace.cpp index 6878794e..f6e12307 100644 --- a/support/SkinnyNamespace.cpp +++ b/support/SkinnyNamespace.cpp @@ -20,7 +20,7 @@ #if defined( ENSURE_SKINS ) #include - #include + #include static void initSkins() { @@ -32,7 +32,7 @@ */ qskSkinManager->registerFactory( "SquiekFactory", new QskSquiekSkinFactory() ); - qskSkinManager->registerFactory( "MaterialFactory", new QskMaterialSkinFactory() ); + qskSkinManager->registerFactory( "Material3Factory", new QskMaterial3SkinFactory() ); qWarning() << "Couldn't find skin plugins, adding some manually."; } diff --git a/support/SkinnyPlugin.cpp b/support/SkinnyPlugin.cpp index e6718926..0b37eab7 100644 --- a/support/SkinnyPlugin.cpp +++ b/support/SkinnyPlugin.cpp @@ -37,7 +37,7 @@ static bool pluginPath = initPluginPath(); #include #include -#include +#include #include #include @@ -53,7 +53,7 @@ static void initSkins() */ qskSkinManager->registerFactory( "SquiekFactory", new QskSquiekSkinFactory() ); - qskSkinManager->registerFactory( "MaterialFactory", new QskMaterialSkinFactory() ); + qskSkinManager->registerFactory( "Material3Factory", new QskMaterial3SkinFactory() ); cout << "Couldn't find skin plugins, adding some manually." << endl; } diff --git a/support/support.pro b/support/support.pro index b02cb0d9..71c2c00e 100644 --- a/support/support.pro +++ b/support/support.pro @@ -40,7 +40,7 @@ ensure_skins { use_local_rpath: QMAKE_RPATHDIR *= $${QSK_PLUGIN_DIR}/skins qskAddLibrary($${QSK_PLUGIN_DIR}/skins, squiekskin) - qskAddLibrary($${QSK_PLUGIN_DIR}/skins, materialskin) + qskAddLibrary($${QSK_PLUGIN_DIR}/skins, material3skin) } fontconfig { From 38d2f5e4b60b3c9bfc557696c9fbf12794d99ba1 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 09:18:52 +0200 Subject: [PATCH 52/70] Bring back the old Material skin for now --- examples/gallery/button/ButtonPage.cpp | 9 +- examples/iotdashboard/main.cpp | 1 + skins/material/QskMaterialGlobal.h | 25 + skins/material/QskMaterialSkin.cpp | 957 ++++++++++++++++++++++ skins/material/QskMaterialSkin.h | 30 + skins/material/QskMaterialSkinFactory.cpp | 33 + skins/material/QskMaterialSkinFactory.h | 27 + skins/material/material.pro | 23 + skins/material/metadata.json | 4 + skins/skins.pro | 1 + support/support.pro | 1 + 11 files changed, 1107 insertions(+), 4 deletions(-) create mode 100644 skins/material/QskMaterialGlobal.h create mode 100644 skins/material/QskMaterialSkin.cpp create mode 100644 skins/material/QskMaterialSkin.h create mode 100644 skins/material/QskMaterialSkinFactory.cpp create mode 100644 skins/material/QskMaterialSkinFactory.h create mode 100644 skins/material/material.pro create mode 100644 skins/material/metadata.json diff --git a/examples/gallery/button/ButtonPage.cpp b/examples/gallery/button/ButtonPage.cpp index e7fbe51f..abb5727f 100644 --- a/examples/gallery/button/ButtonPage.cpp +++ b/examples/gallery/button/ButtonPage.cpp @@ -29,7 +29,7 @@ namespace private: void populate() { - const char* texts[] = { "Press Me", "Check Me", "Outlined", "Text" }; + const char* texts[] = { "Press Me", "Check Me" }; const char* graphics[] = { "diamond/khaki", "ellipse/sandybrown" }; for ( int i = 0; i < 6; i++ ) @@ -37,15 +37,16 @@ namespace const int index = i % 2; auto button = new QskPushButton( this ); - button->setCheckable( index != 0 && index < 6 ); + button->setCheckable( index != 0 ); //button->setSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::Fixed ); - if ( i > 1 && i < 6 ) + if ( i > 1 ) { auto src = QStringLiteral( "image://shapes/" ) + graphics[ index ]; button->setGraphicSource( src ); } - if ( i < 2 || ( i > 3 && i < 6 ) ) + + if ( i < 2 || i > 3 ) { button->setText( texts[ index ] ); } diff --git a/examples/iotdashboard/main.cpp b/examples/iotdashboard/main.cpp index 36ee139b..78b71d87 100644 --- a/examples/iotdashboard/main.cpp +++ b/examples/iotdashboard/main.cpp @@ -66,6 +66,7 @@ int main( int argc, char* argv[] ) // disable default skins qskSkinManager->setPluginPaths( QStringList() ); // no plugins + qskSkinManager->unregisterFactory( "materialfactory" ); qskSkinManager->unregisterFactory( "material3factory" ); qskSkinManager->unregisterFactory( "squiekfactory" ); diff --git a/skins/material/QskMaterialGlobal.h b/skins/material/QskMaterialGlobal.h new file mode 100644 index 00000000..76e58182 --- /dev/null +++ b/skins/material/QskMaterialGlobal.h @@ -0,0 +1,25 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the QSkinny License, Version 1.0 + *****************************************************************************/ + +#ifndef QSK_MATERIAL_GLOBAL_H +#define QSK_MATERIAL_GLOBAL_H + +#include "QskGlobal.h" + +#ifdef QSK_DLL + +#if defined( QSK_MATERIAL_MAKEDLL ) // create a DLL library +#define QSK_MATERIAL_EXPORT Q_DECL_EXPORT +#else // use a DLL library +#define QSK_MATERIAL_EXPORT Q_DECL_IMPORT +#endif + +#endif // QSK_DLL + +#ifndef QSK_MATERIAL_EXPORT +#define QSK_MATERIAL_EXPORT +#endif + +#endif diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp new file mode 100644 index 00000000..51aa3ce7 --- /dev/null +++ b/skins/material/QskMaterialSkin.cpp @@ -0,0 +1,957 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the QSkinny License, Version 1.0 + *****************************************************************************/ + +#include "QskMaterialSkin.h" + +#include + +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include + +#include +#include +#include +#include +#include +#include +#include + +#include +#include + +#if 1 +// should be defined in the public header, so that +// application code can avoid conflicts +static const int ButtonFontRole = QskSkin::HugeFont + 77; +#endif + +static const int qskDuration = 150; + +static inline QColor qskShadedColor( const QColor color, qreal opacity ) +{ + QColor c = color; + c.setAlphaF( opacity ); + + return c; +} + +namespace +{ +#if 1 + // temporary definitions, will be removed when moving to M(aterial)3 + constexpr const QRgb Grey100 = 0xfff5f5f5; + constexpr const QRgb Grey300 = 0xffe0e0e0; + constexpr const QRgb Grey400 = 0xffbdbdbd; + constexpr const QRgb Grey500 = 0xff9e9e9e; + constexpr const QRgb Grey600 = 0xff757575; + constexpr const QRgb Blue500 = 0xff2196f3; +#endif + + class ColorPalette + { + public: + ColorPalette( const QColor base = QColor::fromRgba( Grey100 ), + const QColor& accent = QColor::fromRgba( Blue500 ), + const QColor& contrast = QColor::fromRgba( QskRgb::White ) ) + { + baseColor = base; + accentColor = accent; + contrastColor = contrast; + + darker125 = baseColor.darker( 125 ); + darker150 = baseColor.darker( 150 ); + darker200 = baseColor.darker( 200 ); + + lighter125 = baseColor.lighter( 125 ); + lighter150 = baseColor.lighter( 150 ); + lighter200 = baseColor.lighter( 200 ); + + textColor = ( baseColor.value() > 128 ) + ? QskRgb::Black : QskRgb::White; + } + + QColor accentColor; + QColor contrastColor; + + QColor baseColor; + + QColor lighter125; + QColor lighter150; + QColor lighter200; + + QColor darker125; + QColor darker150; + QColor darker200; + + QColor textColor; + }; + + class Editor : private QskSkinHintTableEditor + { + public: + Editor( QskSkinHintTable* table, const ColorPalette& palette ) + : QskSkinHintTableEditor( table ) + , m_pal( palette ) + { + } + + void setup(); + + private: + void setupControl(); + + void setupBox(); + void setupCheckBox(); + void setupDialogButtonBox(); + void setupDialogButton(); + void setupFocusIndicator(); + void setupInputPanel(); + void setupVirtualKeyboard(); + void setupListView(); + void setupMenu(); + void setupPageIndicator(); + void setupPopup(); + void setupProgressBar(); + void setupPushButton(); + void setupScrollView(); + void setupSegmentedBar(); + void setupSeparator(); + void setupSubWindow(); + void setupSlider(); + void setupSwitchButton(); + void setupTabButton(); + void setupTabBar(); + void setupTabView(); + void setupTextInput(); + void setupTextLabel(); + + const ColorPalette& m_pal; + }; +} + +void Editor::setup() +{ + setupControl(); + + setupBox(); + setupCheckBox(); + setupDialogButtonBox(); + setupDialogButton(); + setupFocusIndicator(); + setupInputPanel(); + setupVirtualKeyboard(); + setupListView(); + setupMenu(); + setupPageIndicator(); + setupPopup(); + setupProgressBar(); + setupPushButton(); + setupScrollView(); + setupSegmentedBar(); + setupSeparator(); + setupSlider(); + setupSubWindow(); + setupSwitchButton(); + setupTabButton(); + setupTabBar(); + setupTabView(); + setupTextLabel(); + setupTextInput(); +} + +void Editor::setupControl() +{ + using A = QskAspect; + using Q = QskControl; + + setPadding( A::Control, 4 ); + + setGradient( A::Control, m_pal.baseColor ); + setColor( A::Control | A::StyleColor, m_pal.textColor ); + setColor( A::Control | A::StyleColor | Q::Disabled, + qskShadedColor( m_pal.textColor, 0.6 ) ); +} + +void Editor::setupCheckBox() +{ + using A = QskAspect; + using Q = QskCheckBox; + + setSpacing( Q::Panel, 5 ); + + const qreal size = qskDpiScaled( 18 ); + + setStrutSize( Q::Box, size, size ); + setPadding( Q::Box, 3 ); + + setBoxShape( Q::Box, 2 ); + + setGradient( Q::Box, m_pal.baseColor); + setGradient( Q::Box | Q::Checked, m_pal.accentColor ); + setGradient( Q::Box | Q::Disabled, QskRgb::Grey ); + + setColor( Q::Indicator | Q::Checked, m_pal.contrastColor ); + setColor( Q::Indicator, m_pal.textColor ); + + setColor( Q::Text, m_pal.textColor ); + setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.textColor, 0.6 ) ); + setFontRole( Q::Text, ButtonFontRole ); + + setAnimation( Q::Box | A::Color, qskDuration ); + setAnimation( Q::Text | A::Color, qskDuration ); +} + +void Editor::setupBox() +{ + using Q = QskBox; + + setGradient( Q::Panel, m_pal.baseColor ); + setBoxShape( Q::Panel, 4 ); + setBoxBorderMetrics( Q::Panel, 0 ); +} + +void Editor::setupPopup() +{ + using A = QskAspect; + using Q = QskPopup; + + setFlagHint( Q::Overlay | A::Style, true ); + + const QskGradient gradient( QskGradient::Vertical, + qskShadedColor( m_pal.accentColor, 0.45 ), qskShadedColor( m_pal.accentColor, 0.7 ) ); + + setGradient( Q::Overlay, gradient ); +} + +void Editor::setupMenu() +{ + using A = QskAspect; + using Q = QskMenu; + + setBoxShape( Q::Panel, qskDpiScaled( 4 ) ); + setBoxBorderMetrics( Q::Panel, qskDpiScaled( 1 ) ); + setBoxBorderColors( Q::Panel, m_pal.darker125 ); + + setGradient( Q::Panel, m_pal.baseColor ); + + setFlagHint( Q::Panel | A::Style, false ); // not cascading + +#if 0 + setPadding( Q::Separator, QMarginsF( 10, 0, 10, 0 ) ); +#endif + setMetric( Q::Separator | A::Size, qskDpiScaled( 1 ) ); + setBoxShape( Q::Separator, 0 ); + setBoxBorderMetrics( Q::Separator, 0 ); + setGradient( Q::Separator, m_pal.darker125 ); + + setPadding( Q::Segment, QskMargins( 2, 10, 2, 10 ) ); + setSpacing( Q::Segment, 5 ); + setGradient( Q::Segment, Qt::transparent ); + + setGradient( Q::Cursor, m_pal.accentColor ); + + setColor( Q::Text, m_pal.textColor ); + setColor( Q::Text | Q::Selected, m_pal.contrastColor ); + setFontRole( Q::Text, QskSkin::SmallFont ); + + setPosition( Q::Panel, 0 ); + setPosition( Q::Panel | QskPopup::Closed, 1 ); + + setAnimation( Q::Panel | A::Metric, 150 ); + setAnimation( Q::Cursor | A::Position | A::Metric, 75, QEasingCurve::OutCubic ); +} + +void Editor::setupTextLabel() +{ + using Q = QskTextLabel; + + setAlignment( Q::Text, Qt::AlignCenter ); + setColor( Q::Text, m_pal.textColor ); + + setPadding( Q::Panel, 5 ); + setBoxShape( Q::Panel, 4 ); + setBoxBorderMetrics( Q::Panel, 2 ); + setBoxBorderColors( Q::Panel, m_pal.darker125 ); + setGradient( Q::Panel, m_pal.baseColor ); +} + +void Editor::setupTextInput() +{ + using Q = QskTextInput; + + setAlignment( Q::Text, Qt::AlignLeft | Qt::AlignTop ); + + setColor( Q::Text, m_pal.textColor ); + setColor( Q::PanelSelected, m_pal.accentColor ); + setColor( Q::TextSelected, m_pal.contrastColor ); + + setPadding( Q::Panel, 5 ); + setBoxShape( Q::Panel, 4 ); + setBoxBorderMetrics( Q::Panel, 2 ); + setBoxBorderColors( Q::Panel, m_pal.darker125 ); + setGradient( Q::Panel, m_pal.baseColor ); +} + +void Editor::setupProgressBar() +{ + using A = QskAspect; + using namespace QskRgb; + using Q = QskProgressBar; + + for ( auto subControl : { Q::Groove, Q::Bar } ) + { + setMetric( subControl | A::Size, 5 ); + setPadding( subControl, 0 ); + + setBoxShape( subControl, 0 ); + setBoxBorderMetrics( subControl, 0 ); + } + + setGradient( Q::Groove, Grey ); + setMetric( Q::Groove | A::Size, 5 ); + setGradient( Q::Bar, m_pal.accentColor ); +} + +void Editor::setupFocusIndicator() +{ + using Q = QskFocusIndicator; + + setPadding( Q::Panel, 5 ); + setBoxShape( Q::Panel, 4 ); + setBoxBorderMetrics( Q::Panel, 2 ); + setBoxBorderColors( Q::Panel, m_pal.accentColor ); + setGradient( Q::Panel, QskGradient() ); +} + +void Editor::setupSegmentedBar() +{ + // copied from Squiek: we need something similar to a tab bar here. TODO ... + using A = QskAspect; + using Q = QskSegmentedBar; + + { + // Panel + + setPadding( Q::Panel, 0 ); + setSpacing( Q::Panel, 5 ); + + setGradient( Q::Panel, m_pal.baseColor ); + + setBoxBorderMetrics( Q::Panel, 2 ); + setBoxBorderColors( Q::Panel, m_pal.darker125 ); + + const QSize strutSize( qskDpiScaled( 100 ), qskDpiScaled( 50 ) ); + + setStrutSize( Q::Panel | A::Horizontal, strutSize ); + setStrutSize( Q::Panel | A::Vertical, strutSize.transposed() ); + } + + { + // Segment + + setPadding( Q::Segment, QskMargins( 2, 5, 2, 5 ) ); + setGradient( Q::Segment, QskGradient() ); + } + + { + // Cursor + setGradient( Q::Cursor, m_pal.accentColor ); + setGradient( Q::Cursor | Q::Disabled, QColor( Qt::gray ) ); + + setAnimation( Q::Cursor | A::Metric | A::Position, 100 ); + } + + for( auto subControl : { Q::Panel, Q::Cursor } ) + setBoxShape( subControl, 3 ); + + { + // Text + + setColor( Q::Text, m_pal.textColor ); + setColor( Q::Text | Q::Selected, m_pal.contrastColor ); + } + + { + // Graphic + +#if 0 + setGraphicRole( Q::Graphic, ... ); + setStrutSize( Q::Graphic, ... ); +#endif + } +} + +void Editor::setupSeparator() +{ + using A = QskAspect; + using Q = QskSeparator; + + for ( auto placement : { A::Horizontal, A::Vertical } ) + { + const auto aspect = Q::Panel | placement; + + setMetric( aspect | A::Size, 4 ); + setBoxShape( Q::Panel, 0 ); + setBoxBorderMetrics( Q::Panel, 0 ); + setGradient( aspect, m_pal.baseColor ); + } +} + +void Editor::setupPageIndicator() +{ + using Q = QskPageIndicator; + + const auto extent = qskDpiScaled( 9 ); + setStrutSize( Q::Bullet, extent, extent ); + + // circles, without border + setBoxShape( Q::Bullet, 100, Qt::RelativeSize ); + setBoxBorderMetrics( Q::Bullet, 0 ); + + setGradient( Q::Bullet, m_pal.lighter150 ); + setGradient( Q::Bullet | Q::Selected, m_pal.accentColor ); + + setSpacing( Q::Panel, 5 ); + setPadding( Q::Panel, 0 ); + setGradient( Q::Panel, QskGradient() ); // invisible +} + +void Editor::setupPushButton() +{ + using A = QskAspect; + using namespace QskRgb; + using Q = QskPushButton; + + setFlagHint( Q::Panel | QskAspect::Direction, Qsk::LeftToRight ); + setStrutSize( Q::Panel, qskDpiScaled( 75.0 ), qskDpiScaled( 23.0 ) ); + setSpacing( Q::Panel, 4 ); + + const QskMargins margin( 4, 3 ); + const QskMargins padding( 10, 6 ); + + setMargin( Q::Panel, margin ); + setPadding( Q::Panel, padding ); + + const QskBoxBorderColors borderColors( Grey400, Grey300, Grey400, Grey600 ); + + QskBoxBorderColors noBorderColors = borderColors; + noBorderColors.setAlpha( 0 ); + + setBoxShape( Q::Panel, 0 ); + setBoxBorderMetrics( Q::Panel, QskMargins( 1, 2, 1, 2 ) ); + setBoxBorderColors( Q::Panel, noBorderColors ); + + setGradient( Q::Panel, White ); + setGradient( Q::Panel | A::Header, White & ColorMask ); + + setColor( Q::Text, m_pal.textColor ); + setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.textColor, 0.6 ) ); + setFontRole( Q::Text, ButtonFontRole ); + setAlignment( Q::Text, Qt::AlignCenter ); + + for ( auto state1 : { A::NoState, Q::Focused } ) + { + setBoxBorderColors( Q::Panel | Q::Hovered | state1, borderColors ); + setBoxBorderColors( Q::Panel | Q::Hovered | A::Header | state1, borderColors ); + + for ( auto state2 : { A::NoState, Q::Hovered } ) + { + for ( auto state3 : { Q::Pressed | A::NoState, Q::Checked | A::NoState, Q::Checked | Q::Pressed } ) + { + const auto states = state1 | state2 | state3; + + setGradient( Q::Panel | states, m_pal.accentColor ); + setColor( Q::Text | states, White ); + + setGradient( Q::Panel | A::Header | states, m_pal.accentColor ); + setColor( Q::Text | A::Header | states, White ); + } + } + } + + setPadding( Q::Graphic, 5 ); + + setAnimation( Q::Panel | A::Color, qskDuration ); + setAnimation( Q::Panel | A::Metric, qskDuration ); + setAnimation( Q::Text | A::Color, qskDuration ); +} + +void Editor::setupDialogButton() +{ + using A = QskAspect; + using namespace QskRgb; + using Q = QskDialogButton; + + setStrutSize( Q::Panel, 30, 16 ); + setSpacing( Q::Panel, 4 ); + + setMargin( Q::Panel, QskMargins( 4, 3 ) ); + setPadding( Q::Panel, QskMargins( 10, 6 ) ); + + const QskBoxBorderColors borderColors( Grey400, Grey300, Grey400, Grey600 ); + + QskBoxBorderColors noBorderColors = borderColors; + noBorderColors.setAlpha( 0 ); + + setBoxShape( Q::Panel, 0 ); + setBoxBorderMetrics( Q::Panel, QskMargins( 1, 2, 1, 2 ) ); + setBoxBorderColors( Q::Panel, noBorderColors ); + + setGradient( Q::Panel, White ); + setColor( Q::Text, m_pal.textColor ); + setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.textColor, 0.6 ) ); + setFontRole( Q::Text, ButtonFontRole ); + setAlignment( Q::Text, Qt::AlignCenter ); + + for ( auto state1 : { A::NoState, Q::Focused } ) + { + setBoxBorderColors( Q::Panel | Q::Hovered | state1, borderColors ); + + for ( auto state2 : { A::NoState, Q::Hovered } ) + { + for ( auto state3 : { Q::Pressed | A::NoState, Q::Checked | A::NoState, Q::Checked | Q::Pressed } ) + { + const auto states = state1 | state2 | state3; + + setGradient( Q::Panel | states, m_pal.accentColor ); + setColor( Q::Text | states, White ); + } + } + } + + setAnimation( Q::Panel | A::Color, qskDuration ); + setAnimation( Q::Panel | A::Metric, qskDuration ); + setAnimation( Q::Text | A::Color, qskDuration ); +} + +void Editor::setupDialogButtonBox() +{ + using Q = QskDialogButtonBox; + + setGradient( Q::Panel, m_pal.baseColor ); + setBoxShape( Q::Panel, 0 ); + setBoxBorderMetrics( Q::Panel, 0 ); +} + +void Editor::setupSlider() +{ + using A = QskAspect; + using namespace QskRgb; + using Q = QskSlider; + + const qreal extent = 30; + + // Panel + + setMetric( Q::Panel | A::Size, extent ); + setBoxShape( Q::Panel, 0 ); + setBoxBorderMetrics( Q::Panel, 0 ); + setGradient( Q::Panel, QskGradient() ); + + setPadding( Q::Panel | A::Horizontal, QskMargins( 0.5 * extent, 0 ) ); + setPadding( Q::Panel | A::Vertical, QskMargins( 0, 0.5 * extent ) ); + + // Groove, Fill + + for ( auto subControl : { Q::Groove, Q::Fill } ) + { + setMetric( subControl | A::Size, 5 ); + setPadding( subControl, 0 ); + + setBoxShape( subControl, 0 ); + setBoxBorderMetrics( subControl, 0 ); + } + + setGradient( Q::Groove, Grey ); + + setGradient( Q::Fill, m_pal.accentColor ); + setBoxBorderColors( Q::Fill, m_pal.accentColor ); + + // handle + + setBoxShape( Q::Handle, 100, Qt::RelativeSize ); + setBoxBorderMetrics( Q::Handle, 4 ); + + // handle expanding, when being pressed + const QSize extentSize( extent, extent ); + setStrutSize( Q::Handle, 0.6 * extentSize ); + setStrutSize( Q::Handle | Q::Pressed, extentSize ); + + setGradient( Q::Handle | Q::Disabled, Grey ); + setBoxBorderColors( Q::Handle | Q::Disabled, Grey ); + + setGradient( Q::Handle, m_pal.accentColor ); + setGradient( Q::Handle | Q::Pressed, m_pal.accentColor ); + + for ( auto state : { A::States(), Q::Pressed | A::NoState, Q::Pressed | Q::Hovered } ) + { + setBoxBorderColors( Q::Handle | state, m_pal.accentColor ); + } + + for ( auto state : { A::States(), Q::Pressed | A::NoState, Q::Pressed | Q::Hovered } ) + { + const auto aspect = Q::Handle | Q::Minimum | state; + setGradient( aspect, Grey300 ); + setBoxBorderColors( aspect, Grey ); + } + + setAnimation( Q::Handle | A::Metric, qskDuration ); + setAnimation( Q::Handle | A::Color, qskDuration ); + + // move the handle smoothly, when using keys + setAnimation( Q::Handle | A::Metric | A::Position, 2 * qskDuration ); + setAnimation( Q::Handle | A::Metric | A::Position | Q::Pressed, 0 ); +} + +void Editor::setupSwitchButton() +{ + using A = QskAspect; + using Q = QskSwitchButton; + + const qreal radius = qskDpiScaled( 10 ); + const qreal handleSize = 2 * radius; + + setBoxShape( Q::Groove, 100, Qt::RelativeSize ); + + const QSizeF grooveSize( 3.4 * radius, 1.2 * radius ); + setStrutSize( Q::Groove | A::Horizontal, grooveSize ); + setStrutSize( Q::Groove | A::Vertical, grooveSize.transposed() ); + + setGradient( Q::Groove, m_pal.darker125 ); + setGradient( Q::Groove | Q::Disabled, m_pal.lighter150 ); + setGradient( Q::Groove | Q::Checked, m_pal.darker200 ); + + setBoxBorderColors( Q::Groove, m_pal.darker200 ); + setBoxBorderMetrics( Q::Groove, 2 ); + setBoxBorderColors( Q::Groove | Q::Disabled, m_pal.darker125 ); + + setBoxShape( Q::Handle, 100, Qt::RelativeSize ); + setStrutSize( Q::Handle, handleSize, handleSize ); + setBoxBorderMetrics( Q::Handle, 2 ); + + setGradient( Q::Handle, QskGradient( Qt::Vertical, m_pal.lighter150, m_pal.lighter125 ) ); + setGradient( Q::Handle | Q::Checked, m_pal.accentColor ); + + setGradient( Q::Handle | Q::Disabled, m_pal.lighter125 ); + setBoxBorderColors( Q::Handle, m_pal.darker200 ); + setBoxBorderColors( Q::Handle | Q::Disabled, m_pal.darker125 ); + + setBoxShape( Q::Ripple, 100, Qt::RelativeSize ); + setStrutSize( Q::Ripple, 2 * handleSize, 2 * handleSize ); + setGradient( Q::Ripple, QskRgb::Transparent ); + + for ( auto state : { Q::Hovered, Q::Focused, Q::Pressed } ) + { + auto weak = m_pal.darker125; + auto strong = m_pal.accentColor; + + if ( state == Q::Hovered ) + { + weak.setAlpha( 100 ); + strong.setAlpha( 50 ); + } + else if ( state == Q::Focused ) + { + weak.setAlpha( 150 ); + strong.setAlpha( 100 ); + } + else + { + weak.setAlpha( 200 ); + strong.setAlpha( 150 ); + } + + setGradient( Q::Ripple | state, weak ); + setGradient( Q::Ripple | Q::Checked | state, strong ); + } + + for( auto state : { A::NoState, Q::Disabled } ) + { + auto aspect = Q::Handle | state; + + setPosition( aspect, 0 ); + setPosition( aspect | Q::Checked, 1 ); + } + + setAnimation( Q::Handle | A::Color, qskDuration ); + setAnimation( Q::Handle | A::Metric, qskDuration ); + setAnimation( Q::Groove | A::Color, qskDuration ); +} + +void Editor::setupTabButton() +{ + using A = QskAspect; + using Q = QskTabButton; + + setStrutSize( Q::Panel, 30, 16 ); + + for ( const auto placement : { A::Left, A::Right, A::Top, A::Bottom } ) + { + const auto aspect = Q::Panel | placement; + + Qt::Edge edge; + + switch( placement ) + { + case A::Left: + edge = Qt::RightEdge; + break; + + case A::Right: + edge = Qt::LeftEdge; + break; + + case A::Top: + edge = Qt::BottomEdge; + break; + + case A::Bottom: + edge = Qt::TopEdge; + break; + + default: + edge = Qt::Edge( 0 ); // making gcc4 happy + } + + setGradient( aspect, QskRgb::White ); + + // The highlighted button has a accented bar at one edge + setBoxShape( aspect, 0 ); + + QskBoxBorderMetrics border; + border.setWidthAt( edge, 3 ); + setBoxBorderMetrics( aspect, border ); + + QskBoxBorderColors borderColors( QskRgb::White ); + setBoxBorderColors( aspect, borderColors ); + + borderColors.setGradientAt( edge, m_pal.accentColor ); + for ( auto state : { Q::Checked, Q::Pressed, Q::Hovered } ) + setBoxBorderColors( aspect | state, borderColors ); + } + + setAnimation( Q::Panel | A::Color, qskDuration ); + + // text + setFontRole( Q::Text, ButtonFontRole ); + setAlignment( Q::Text, Qt::AlignCenter ); + + setColor( Q::Text, m_pal.textColor ); + setColor( Q::Text | Q::Disabled, qskShadedColor( m_pal.textColor, 0.6 ) ); +} + +void Editor::setupTabBar() +{ + using A = QskAspect; + using Q = QskTabBar; + + setBoxShape( Q::Panel, 0 ); + setBoxBorderMetrics( Q::Panel, 0 ); + setGradient( Q::Panel, QskGradient() ); + + // when flicking + setAnimation( Q::Panel | A::Metric, QskAnimationHint( 200, QEasingCurve::InCubic ) ); +} + +void Editor::setupTabView() +{ + using Q = QskTabView; + + setBoxShape( Q::Page, 0 ); + setBoxBorderMetrics( Q::Page, 0 ); + setGradient( Q::Page, m_pal.darker150 ); + setBoxBorderColors( Q::Page, m_pal.baseColor ); + + setAnimation( Q::Page, qskDuration ); +} + +void Editor::setupInputPanel() +{ + using Q = QskInputPanelBox; + + setBoxShape( Q::Panel, 0 ); + setBoxBorderMetrics( Q::Panel, 0 ); + setGradient( Q::Panel, m_pal.darker150 ); + setBoxBorderColors( Q::Panel, m_pal.baseColor ); +} + +void Editor::setupVirtualKeyboard() +{ + using A = QskAspect; + using Q = QskVirtualKeyboard; + + // key panel + setMargin( Q::ButtonPanel, 2 ); + + setBoxShape( Q::ButtonPanel, 20.0, Qt::RelativeSize ); + setBoxBorderMetrics( Q::ButtonPanel, 2 ); + + setGradient( Q::ButtonPanel, m_pal.darker125 ); + setBoxBorderColors( Q::ButtonPanel, m_pal.baseColor ); + + for ( auto state : { A::NoState, Q::Focused } ) + setBoxBorderColors( Q::ButtonPanel | QskPushButton::Pressed | state, m_pal.accentColor ); + + setAnimation( Q::ButtonPanel | A::Color, qskDuration ); + setAnimation( Q::ButtonPanel | A::Metric, qskDuration ); + + // panel + setBoxShape( Q::Panel, 0 ); + setBoxBorderMetrics( Q::Panel, 0 ); + setGradient( Q::Panel, m_pal.darker150 ); + setBoxBorderColors( Q::Panel, m_pal.baseColor ); +} + +void Editor::setupScrollView() +{ + using A = QskAspect; + using Q = QskScrollView; + + setSpacing( Q::Panel, 2 ); + + setBoxShape( Q::Viewport, 5 ); + setBoxBorderMetrics( Q::Viewport, 1 ); + setGradient( Q::Viewport, QskRgb::White ); + setBoxBorderColors( Q::Viewport, Qt::black ); + + for ( auto subControl : { Q::HorizontalScrollBar, Q::VerticalScrollBar } ) + { + setMetric( subControl | A::Size, 12 ); + setPadding( subControl, 0 ); + } + + const auto handleExtent = qskDpiScaled( 40.0 ); + setStrutSize( Q::HorizontalScrollHandle, handleExtent, 0.0 ); + setStrutSize( Q::VerticalScrollHandle, 0.0, handleExtent ); + + for ( auto subControl : { Q::HorizontalScrollHandle, Q::VerticalScrollHandle } ) + { + setBoxShape( subControl, 3 ); + setBoxBorderMetrics( subControl, 1 ); + setGradient( subControl, m_pal.accentColor ); + setBoxBorderColors( subControl, QskRgb::White ); + + setAnimation( subControl | A::Color, qskDuration ); + } + + for ( auto subControl : { + Q::HorizontalScrollHandle | Q::HorizontalHandlePressed, + Q::VerticalScrollHandle | Q::VerticalHandlePressed } ) + { + setGradient( subControl, m_pal.accentColor ); + setBoxBorderColors( subControl, m_pal.accentColor ); + } + + // when changing the position by QskScrollView::scrollTo + setAnimation( Q::Viewport | A::Metric, QskAnimationHint( 200, QEasingCurve::InCubic ) ); +} + +void Editor::setupListView() +{ + using Q = QskListView; + + // padding for each cell + setPadding( Q::Cell, QskMargins( 4, 8 ) ); + + setColor( Q::Cell, m_pal.baseColor ); + setColor( Q::Text, m_pal.textColor ); + + setColor( Q::Cell | Q::Selected, m_pal.accentColor ); + setColor( Q::Text | Q::Selected, m_pal.contrastColor ); +} + +void Editor::setupSubWindow() +{ + using A = QskAspect; + using Q = QskSubWindow; + + // Panel + + setPadding( Q::Panel, 10 ); + setBoxShape( Q::Panel, 0 ); + setBoxBorderMetrics( Q::Panel, 2 ); + setGradient( Q::Panel, m_pal.baseColor ); + + QskBoxBorderColors colors; + colors.setGradientAt( Qt::TopEdge | Qt::LeftEdge, m_pal.lighter125 ); + colors.setGradientAt( Qt::RightEdge | Qt::BottomEdge, m_pal.darker200 ); + + setBoxBorderColors( Q::Panel, colors ); + + // TitleBarPanel + setFlagHint( Q::TitleBarPanel | QskAspect::Style, + Q::TitleBar | Q::Title | Q::Symbol ); + + setGradient( Q::TitleBarPanel, m_pal.darker200 ); + setGradient( Q::TitleBarPanel | Q::Focused, m_pal.accentColor ); + + // TitleBarText + setFontRole( Q::TitleBarText, QskSkin::SmallFont ); + setAlignment( Q::TitleBarText, Qt::AlignLeft | Qt::AlignVCenter ); + + for ( auto subControl : { Q::Panel, Q::TitleBarPanel, Q::TitleBarText } ) + setAnimation( subControl | A::Color, qskDuration ); + +} + +class QskMaterialSkin::PrivateData +{ + public: + ColorPalette palette; +}; + +QskMaterialSkin::QskMaterialSkin( QObject* parent ) + : Inherited( parent ) + , m_data( new PrivateData() ) +{ + m_data->palette = ColorPalette( Grey100, Blue500, QskRgb::White ); + + // Default theme colors + setupFonts( QStringLiteral( "Roboto" ) ); + + auto buttonFont = font( QskSkin::DefaultFont ); + buttonFont.setCapitalization( QFont::AllUppercase ); + setFont( ButtonFontRole, buttonFont ); + + Editor editor( &hintTable(), m_data->palette ); + editor.setup(); +} + +QskMaterialSkin::~QskMaterialSkin() +{ +} + +void QskMaterialSkin::resetColors( const QColor& accent ) +{ + m_data->palette = ColorPalette( m_data->palette.baseColor, + accent, m_data->palette.contrastColor ); + + Editor editor( &hintTable(), m_data->palette ); + editor.setup(); +} + +#include "moc_QskMaterialSkin.cpp" diff --git a/skins/material/QskMaterialSkin.h b/skins/material/QskMaterialSkin.h new file mode 100644 index 00000000..1a08f89f --- /dev/null +++ b/skins/material/QskMaterialSkin.h @@ -0,0 +1,30 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the QSkinny License, Version 1.0 + *****************************************************************************/ + +#ifndef QSK_MATERIAL_SKIN_H +#define QSK_MATERIAL_SKIN_H + +#include "QskMaterialGlobal.h" +#include +#include + +class QSK_MATERIAL_EXPORT QskMaterialSkin : public QskSkin +{ + Q_OBJECT + + using Inherited = QskSkin; + + public: + QskMaterialSkin( QObject* parent = nullptr ); + ~QskMaterialSkin() override; + + private: + void resetColors( const QColor& accent ) override; + + class PrivateData; + std::unique_ptr< PrivateData > m_data; +}; + +#endif diff --git a/skins/material/QskMaterialSkinFactory.cpp b/skins/material/QskMaterialSkinFactory.cpp new file mode 100644 index 00000000..40683a6a --- /dev/null +++ b/skins/material/QskMaterialSkinFactory.cpp @@ -0,0 +1,33 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the 3-clause BSD License + *****************************************************************************/ + +#include "QskMaterialSkinFactory.h" +#include "QskMaterialSkin.h" + +static const QString materialSkinName = QStringLiteral( "material" ); + +QskMaterialSkinFactory::QskMaterialSkinFactory( QObject* parent ) + : QskSkinFactory( parent ) +{ +} + +QskMaterialSkinFactory::~QskMaterialSkinFactory() +{ +} + +QStringList QskMaterialSkinFactory::skinNames() const +{ + return { materialSkinName }; +} + +QskSkin* QskMaterialSkinFactory::createSkin( const QString& skinName ) +{ + if ( QString::compare( skinName, materialSkinName, Qt::CaseInsensitive ) == 0 ) + return new QskMaterialSkin(); + + return nullptr; +} + +#include "moc_QskMaterialSkinFactory.cpp" diff --git a/skins/material/QskMaterialSkinFactory.h b/skins/material/QskMaterialSkinFactory.h new file mode 100644 index 00000000..8294e824 --- /dev/null +++ b/skins/material/QskMaterialSkinFactory.h @@ -0,0 +1,27 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the 3-clause BSD License + *****************************************************************************/ + +#ifndef QSK_MATERIAL_SKIN_FACTORY_H +#define QSK_MATERIAL_SKIN_FACTORY_H + +#include "QskMaterialGlobal.h" +#include + +class QSK_MATERIAL_EXPORT QskMaterialSkinFactory : public QskSkinFactory +{ + Q_OBJECT + + Q_PLUGIN_METADATA( IID QskSkinFactoryIID FILE "metadata.json" ) + Q_INTERFACES( QskSkinFactory ) + + public: + QskMaterialSkinFactory( QObject* parent = nullptr ); + ~QskMaterialSkinFactory() override; + + QStringList skinNames() const override; + QskSkin* createSkin( const QString& skinName ) override; +}; + +#endif diff --git a/skins/material/material.pro b/skins/material/material.pro new file mode 100644 index 00000000..c1259315 --- /dev/null +++ b/skins/material/material.pro @@ -0,0 +1,23 @@ +CONFIG += plugin +CONFIG += qskinny + +TEMPLATE = lib +QSK_PLUGIN_SUBDIR = skins + +TARGET = $$qskPluginTarget(materialskin) +DEFINES += QSK_MATERIAL_MAKEDLL + +HEADERS += \ + QskMaterialGlobal.h \ + QskMaterialSkin.h \ + QskMaterialSkinFactory.h + +SOURCES += \ + QskMaterialSkin.cpp \ + QskMaterialSkinFactory.cpp + +OTHER_FILES += metadata.json + +target.path = $${QSK_INSTALL_PLUGINS}/$${QSK_PLUGIN_SUBDIR} +INSTALLS = target + diff --git a/skins/material/metadata.json b/skins/material/metadata.json new file mode 100644 index 00000000..1812afd4 --- /dev/null +++ b/skins/material/metadata.json @@ -0,0 +1,4 @@ +{ + "FactoryId": "MaterialFactory", + "Skins": [ "material" ] +} diff --git a/skins/skins.pro b/skins/skins.pro index 2a2c6621..ec1ce1a8 100644 --- a/skins/skins.pro +++ b/skins/skins.pro @@ -2,4 +2,5 @@ TEMPLATE = subdirs SUBDIRS += \ squiek \ + material \ material3 diff --git a/support/support.pro b/support/support.pro index 71c2c00e..d7e9155a 100644 --- a/support/support.pro +++ b/support/support.pro @@ -40,6 +40,7 @@ ensure_skins { use_local_rpath: QMAKE_RPATHDIR *= $${QSK_PLUGIN_DIR}/skins qskAddLibrary($${QSK_PLUGIN_DIR}/skins, squiekskin) + qskAddLibrary($${QSK_PLUGIN_DIR}/skins, materialskin) qskAddLibrary($${QSK_PLUGIN_DIR}/skins, material3skin) } From 2129e235b700905f48bb65d3be1a7b45522b2ced Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 09:52:03 +0200 Subject: [PATCH 53/70] remove leftover change in segmented bar --- src/controls/QskSegmentedBar.cpp | 8 -------- 1 file changed, 8 deletions(-) diff --git a/src/controls/QskSegmentedBar.cpp b/src/controls/QskSegmentedBar.cpp index 55e1dbe5..2129a48a 100644 --- a/src/controls/QskSegmentedBar.cpp +++ b/src/controls/QskSegmentedBar.cpp @@ -96,10 +96,6 @@ QskSegmentedBar::QskSegmentedBar( Qt::Orientation orientation, QQuickItem* paren : Inherited( parent ) , m_data( new PrivateData( orientation ) ) { - auto direction = ( orientation == Qt::Horizontal ) - ? Qsk::LeftToRight : Qsk::TopToBottom; - setFlagHint( Panel | QskAspect::Direction, direction ); - if( orientation == Qt::Horizontal ) initSizePolicy( QskSizePolicy::MinimumExpanding, QskSizePolicy::Fixed ); else @@ -124,10 +120,6 @@ void QskSegmentedBar::setOrientation( Qt::Orientation orientation ) setSizePolicy( sizePolicy( Qt::Vertical ), sizePolicy( Qt::Horizontal ) ); m_data->orientation = orientation; - auto direction = ( orientation == Qt::Horizontal ) - ? Qsk::LeftToRight : Qsk::TopToBottom; - setFlagHint( Panel | QskAspect::Direction, direction ); - resetImplicitSize(); update(); } From ec4fc1d1b220ec8e0f007b091ec44b6c1e3875b1 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 09:54:09 +0200 Subject: [PATCH 54/70] bring back old squiek skin --- skins/squiek/QskSquiekSkin.cpp | 49 +++++++++++++++++++++------------- 1 file changed, 31 insertions(+), 18 deletions(-) diff --git a/skins/squiek/QskSquiekSkin.cpp b/skins/squiek/QskSquiekSkin.cpp index 4f3368a0..f8a3fef8 100644 --- a/skins/squiek/QskSquiekSkin.cpp +++ b/skins/squiek/QskSquiekSkin.cpp @@ -759,38 +759,51 @@ void Editor::setupSlider() // Panel - setMetric( Q::Panel | A::Size, extent ); - setBoxBorderMetrics( Q::Panel, 0 ); - setBoxShape( Q::Panel, 0 ); - setGradient( Q::Panel, QskGradient() ); + for ( auto placement : { A::Horizontal, A::Vertical } ) + { + const auto aspect = Q::Panel | placement; + + setMetric( aspect | A::Size, extent ); + setBoxBorderMetrics( aspect, 0 ); + setBoxShape( aspect, 0 ); + setGradient( aspect, QskGradient() ); + } setPadding( Q::Panel | A::Horizontal, QskMargins( 0.5 * extent, 0 ) ); setPadding( Q::Panel | A::Vertical, QskMargins( 0, 0.5 * extent ) ); // Groove, Fill - for ( auto subControl : { Q::Groove, Q::Fill } ) + for ( auto placement : { A::Horizontal, A::Vertical } ) { - const auto aspect = subControl; + for ( auto subControl : { Q::Groove, Q::Fill } ) + { + const auto aspect = subControl | placement; - setMetric( aspect | A::Size, 0.3 * extent ); - setPadding( aspect, 0 ); + setMetric( aspect | A::Size, 0.3 * extent ); + setPadding( aspect, 0 ); - setBoxBorderMetrics( aspect, 0 ); - setBoxShape( aspect, 0.1 * extent ); + setBoxBorderMetrics( aspect, 0 ); + setBoxShape( aspect, 0.1 * extent ); + } + + setGradient( Q::Groove | placement, m_pal.darker200 ); + setGradient( Q::Fill | placement, QskGradient() ); // no filling } - setGradient( Q::Groove, m_pal.darker200 ); - setGradient( Q::Fill, QskGradient() ); // no filling - // Handle - setButton( Q::Handle, Raised, 1 ); - setBoxShape( Q::Handle, 20.0, Qt::RelativeSize ); - setButton( Q::Handle | Q::Pressed, Sunken, 1 ); + for ( auto placement : { A::Horizontal, A::Vertical } ) + { + const auto aspect = Q::Handle | placement; - const qreal sz = 0.75 * extent; - setStrutSize( Q::Handle, sz, sz ); + setButton( aspect, Raised, 1 ); + setBoxShape( aspect, 20.0, Qt::RelativeSize ); + setButton( aspect | Q::Pressed, Sunken, 1 ); + + const qreal sz = 0.75 * extent; + setStrutSize( aspect, sz, sz ); + } setAnimation( Q::Handle | A::Color, qskDuration ); } From c8f28c05dcac77292200bfbdc36d7dc310951f40 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 10:32:05 +0200 Subject: [PATCH 55/70] style check box --- skins/material3/QskMaterial3Skin.cpp | 30 +++++++++++++++------------- 1 file changed, 16 insertions(+), 14 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index a8adbde7..594fd377 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -155,26 +155,28 @@ void Editor::setupCheckBox() using A = QskAspect; using Q = QskCheckBox; - setStrutSize( Q::Panel, 24, 24 ); + setSpacing( Q::Panel, 10 ); - setPadding( Q::Panel, 6 ); - setBoxShape( Q::Panel, 2 ); - setBoxBorderMetrics( Q::Panel, 2 ); - setBoxBorderColors( Q::Panel, m_pal.onBackground ); - setBoxBorderMetrics( Q::Panel | Q::Checked, 0 ); + setStrutSize( Q::Box, 24, 24 ); - setGradient( Q::Panel, m_pal.background ); - setGradient( Q::Panel | Q::Checked, m_pal.primary ); + setPadding( Q::Box, 6 ); + setBoxShape( Q::Box, 2 ); + setBoxBorderMetrics( Q::Box, 2 ); + setBoxBorderColors( Q::Box, m_pal.onBackground ); + setBoxBorderMetrics( Q::Box | Q::Checked, 0 ); - setGradient( Q::Panel | Q::Disabled, m_pal.surfaceVariant12 ); + setGradient( Q::Box, m_pal.background ); + setGradient( Q::Box | Q::Checked, m_pal.primary ); + setGradient( Q::Box | Q::Disabled, m_pal.surfaceVariant12 ); + setGradient( Q::Box | Q::Checked | Q::Disabled, m_pal.onSurface12 ); - setGradient( Q::Panel | Q::Checked | Q::Disabled, m_pal.onSurface12 ); - - - setColor( Q::Indicator | Q::Checked, m_pal.primaryContainer ); + setColor( Q::Indicator, m_pal.background ); + setColor( Q::Indicator | Q::Checked, m_pal.onPrimary ); setColor( Q::Indicator | Q::Checked | Q::Disabled, m_pal.onSurface38 ); - setAnimation( Q::Panel | A::Color, qskDuration ); + setColor( Q::Text, m_pal.onBackground ); + + setAnimation( Q::Box | A::Color, qskDuration ); } void Editor::setupBox() From ed767b91610b10ec9100799bec0cbf1dadbf7295 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 11:44:19 +0200 Subject: [PATCH 56/70] style buttons when hovered, focused and pressed --- skins/material3/QskMaterial3Skin.cpp | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index 594fd377..3eca297d 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -460,12 +460,19 @@ void Editor::setupPushButton() setGradient( Q::Panel, m_pal.primary ); setGradient( Q::Panel | Q::Disabled, m_pal.onSurface12 ); - setColor( Q::Text, m_pal.onPrimary ); - setColor( Q::Text | Q::Disabled, m_pal.onSurface38 ); - + QColor hoverColor = flattenedColor( m_pal.onPrimary, m_pal.primary, 0.08 ); + setGradient( Q::Panel | Q::Hovered, hoverColor ); setShadowMetrics( Q::Panel | Q::Hovered, m_pal.elevationLight1 ); setShadowColor( Q::Panel | Q::Hovered, m_pal.shadow ); + QColor focusColor = flattenedColor( m_pal.onPrimary, m_pal.primary, 0.12 ); + setGradient( Q::Panel | Q::Focused, focusColor ); + + setGradient( Q::Panel | Q::Pressed, focusColor ); + + setColor( Q::Text, m_pal.onPrimary ); + setColor( Q::Text | Q::Disabled, m_pal.onSurface38 ); + setAnimation( Q::Panel | A::Color, qskDuration ); setAnimation( Q::Panel | A::Metric, qskDuration ); setAnimation( Q::Text | A::Color, qskDuration ); From d97f17c8592f7ab43ad842ee36128262f7090fb9 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 12:59:41 +0200 Subject: [PATCH 57/70] style active tab button --- skins/material3/QskMaterial3Skin.cpp | 40 +++++++++++++++++++++++++++- 1 file changed, 39 insertions(+), 1 deletion(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index 3eca297d..7eee0977 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -649,6 +649,7 @@ void Editor::setupTabButton() using Q = QskTabButton; setStrutSize( Q::Panel, 64, 64 ); + setGradient( Q::Panel, m_pal.surface ); setColor( Q::Text, m_pal.onSurfaceVariant ); setColor( Q::Text | Q::Disabled, m_pal.onSurface38 ); @@ -656,7 +657,44 @@ void Editor::setupTabButton() setColor( Q::Text | Q::Checked, m_pal.primary ); setColor( Q::Text | Q::Hovered, m_pal.primary ); - setGradient( Q::Panel, m_pal.surface ); + for ( const auto placement : { A::Left, A::Right, A::Top, A::Bottom } ) + { + const auto aspect = Q::Panel | placement; + + Qt::Edge edge; + + switch( placement ) + { + case A::Left: + edge = Qt::RightEdge; + break; + + case A::Right: + edge = Qt::LeftEdge; + break; + + case A::Top: + edge = Qt::BottomEdge; + break; + + case A::Bottom: + edge = Qt::TopEdge; + break; + + default: + edge = Qt::Edge( 0 ); // making gcc4 happy + } + + QskBoxBorderMetrics border; + border.setWidthAt( edge, 3 ); + setBoxBorderMetrics( aspect, border ); + + QskBoxBorderColors borderColors( m_pal.surface ); + setBoxBorderColors( aspect, borderColors ); + + borderColors.setGradientAt( edge, m_pal.primary ); + setBoxBorderColors( aspect | Q::Checked, borderColors ); + } QColor c( m_pal.surface ); c.setAlphaF( m_pal.hoverOpacity ); From 9ecafddc49e9dd0df0d6d1158d64fce1137fb9ca Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 13:27:35 +0200 Subject: [PATCH 58/70] Slider: Add ripple and style it --- skins/material3/QskMaterial3Skin.cpp | 10 ++++++---- src/controls/QskSlider.cpp | 1 + src/controls/QskSlider.h | 2 +- src/controls/QskSliderSkinlet.cpp | 24 +++++++++++++++++++++++- src/controls/QskSliderSkinlet.h | 2 ++ 5 files changed, 33 insertions(+), 6 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index 7eee0977..e20939e5 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -87,7 +87,6 @@ namespace void setupTextLabel(); const QskMaterial3Theme& m_pal; - const uint rippleSize = 40; // ### remove }; QFont createFont( int pixelSize, QFont::Weight weight = QFont::Normal ) @@ -567,15 +566,18 @@ void Editor::setupSlider() setBoxShape( Q::Handle, 100, Qt::RelativeSize ); setBoxBorderMetrics( Q::Handle, 0 ); - setStrutSize( Q::Handle, qskDpiScaled( 20 + rippleSize ), - qskDpiScaled( 20 + rippleSize ) ); + setStrutSize( Q::Handle, { 20, 20 } ); setGradient( Q::Handle, m_pal.primary ); setGradient( Q::Handle | Q::Pressed, m_pal.primary ); setGradient( Q::Handle | Q::Disabled, m_pal.onSurface38 ); - setBoxBorderMetrics( Q::Handle, qskDpiScaled( rippleSize / 2 ) ); + setStrutSize( Q::Ripple, { 40, 40 } ); + setBoxShape( Q::Ripple, 100, Qt::RelativeSize ); + setGradient( Q::Ripple, Qt::transparent ); + setGradient( Q::Ripple | Q::Hovered, m_pal.primary12 ); + setGradient( Q::Ripple | Q::Pressed, m_pal.primary12 ); // move the handle smoothly, when using keys setAnimation( Q::Handle | A::Metric | A::Position, 2 * qskDuration ); diff --git a/src/controls/QskSlider.cpp b/src/controls/QskSlider.cpp index 4fe96db9..08226db5 100644 --- a/src/controls/QskSlider.cpp +++ b/src/controls/QskSlider.cpp @@ -14,6 +14,7 @@ QSK_SUBCONTROL( QskSlider, Groove ) QSK_SUBCONTROL( QskSlider, Fill ) QSK_SUBCONTROL( QskSlider, Scale ) QSK_SUBCONTROL( QskSlider, Handle ) +QSK_SUBCONTROL( QskSlider, Ripple ) QSK_SYSTEM_STATE( QskSlider, Pressed, QskAspect::FirstSystemState << 2 ) QSK_SYSTEM_STATE( QskSlider, Minimum, QskAspect::LastUserState << 1 ) diff --git a/src/controls/QskSlider.h b/src/controls/QskSlider.h index 9d118cd5..45c39a9b 100644 --- a/src/controls/QskSlider.h +++ b/src/controls/QskSlider.h @@ -23,7 +23,7 @@ class QSK_EXPORT QskSlider : public QskBoundedValueInput using Inherited = QskBoundedValueInput; public: - QSK_SUBCONTROLS( Panel, Groove, Fill, Scale, Handle ) + QSK_SUBCONTROLS( Panel, Groove, Fill, Scale, Handle, Ripple ) QSK_STATES( Pressed, Minimum, Maximum ) explicit QskSlider( QQuickItem* parent = nullptr ); diff --git a/src/controls/QskSliderSkinlet.cpp b/src/controls/QskSliderSkinlet.cpp index 5f89c861..6d25379c 100644 --- a/src/controls/QskSliderSkinlet.cpp +++ b/src/controls/QskSliderSkinlet.cpp @@ -31,7 +31,7 @@ static inline QRectF qskInnerPanelRect( QskSliderSkinlet::QskSliderSkinlet( QskSkin* skin ) : Inherited( skin ) { - setNodeRoles( { PanelRole, GrooveRole, FillRole, HandleRole } ); + setNodeRoles( { PanelRole, GrooveRole, FillRole, HandleRole, RippleRole } ); } QskSliderSkinlet::~QskSliderSkinlet() @@ -68,6 +68,11 @@ QRectF QskSliderSkinlet::subControlRect( const QskSkinnable* skinnable, return scaleRect( slider, contentsRect ); } + if ( subControl == QskSlider::Ripple ) + { + return rippleRect( slider, contentsRect ); + } + return Inherited::subControlRect( skinnable, contentsRect, subControl ); } @@ -97,6 +102,11 @@ QSGNode* QskSliderSkinlet::updateSubNode( { return updateBoxNode( slider, node, QskSlider::Handle ); } + + case RippleRole: + { + return updateBoxNode( slider, node, QskSlider::Ripple ); + } } return Inherited::updateSubNode( skinnable, nodeRole, node ); @@ -223,6 +233,18 @@ QRectF QskSliderSkinlet::handleRect( return handleRect; } +QRectF QskSliderSkinlet::rippleRect( + const QskSlider* slider, const QRectF& rect ) const +{ + auto r = handleRect( slider, rect ); + auto rippleSize = slider->strutSizeHint( QskSlider::Ripple ); + auto handleSize = slider->strutSizeHint( QskSlider::Handle ); + auto w = ( rippleSize.width() - handleSize.width() ) / 2, + h = ( rippleSize.height() - handleSize.height() ) / 2; + r = r.marginsAdded( { w, h, w, h } ); + return r; +} + QSizeF QskSliderSkinlet::sizeHint( const QskSkinnable* skinnable, Qt::SizeHint which, const QSizeF& ) const { diff --git a/src/controls/QskSliderSkinlet.h b/src/controls/QskSliderSkinlet.h index 1b49bb29..25c3ead2 100644 --- a/src/controls/QskSliderSkinlet.h +++ b/src/controls/QskSliderSkinlet.h @@ -23,6 +23,7 @@ class QSK_EXPORT QskSliderSkinlet : public QskSkinlet GrooveRole, FillRole, HandleRole, + RippleRole, RoleCount }; @@ -46,6 +47,7 @@ class QSK_EXPORT QskSliderSkinlet : public QskSkinlet QRectF fillRect( const QskSlider*, const QRectF& ) const; QRectF handleRect( const QskSlider*, const QRectF& ) const; QRectF scaleRect( const QskSlider*, const QRectF& ) const; + QRectF rippleRect( const QskSlider*, const QRectF& ) const; QRectF innerRect( const QskSlider*, const QRectF&, QskAspect::Subcontrol ) const; }; From a429bfb7b858b92640b20a67823356c4c7491485 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 13:44:39 +0200 Subject: [PATCH 59/70] slider: flatten handle color when disabled --- skins/material3/QskMaterial3Skin.cpp | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index e20939e5..e5c66ea7 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -571,7 +571,8 @@ void Editor::setupSlider() setGradient( Q::Handle, m_pal.primary ); setGradient( Q::Handle | Q::Pressed, m_pal.primary ); - setGradient( Q::Handle | Q::Disabled, m_pal.onSurface38 ); + const auto disabledColor = flattenedColor( m_pal.onSurface, m_pal.background, 0.38 ); + setGradient( Q::Handle | Q::Disabled, disabledColor ); setStrutSize( Q::Ripple, { 40, 40 } ); setBoxShape( Q::Ripple, 100, Qt::RelativeSize ); From 7b247c67fec96f8ad3a72d65760af116b61d5ea6 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 14:19:55 +0200 Subject: [PATCH 60/70] style listbox --- skins/material3/QskMaterial3Skin.cpp | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index e5c66ea7..41cb5370 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -809,10 +809,10 @@ void Editor::setupListView() { using Q = QskListView; - setPadding( Q::Cell, 0 ); + setPadding( Q::Cell, { 16, 12, 16, 12 } ); setGradient( Q::Cell, m_pal.surface ); - setColor( Q::Text, m_pal.onSurfaceVariant ); + setColor( Q::Text, m_pal.onSurface ); setGradient( Q::Cell | Q::Selected, m_pal.secondaryContainer ); setColor( Q::Text | Q::Selected, m_pal.onSecondaryContainer ); From 35e61ce52a043aa076e556adf6ad0570f69f2004 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 15:45:06 +0200 Subject: [PATCH 61/70] gallery: Add tab for dialogs --- examples/gallery/dialog/DialogPage.cpp | 82 ++++++++++++++++++++++++++ examples/gallery/dialog/DialogPage.h | 17 ++++++ examples/gallery/gallery.pro | 6 ++ examples/gallery/main.cpp | 2 + 4 files changed, 107 insertions(+) create mode 100644 examples/gallery/dialog/DialogPage.cpp create mode 100644 examples/gallery/dialog/DialogPage.h diff --git a/examples/gallery/dialog/DialogPage.cpp b/examples/gallery/dialog/DialogPage.cpp new file mode 100644 index 00000000..8bd36eb5 --- /dev/null +++ b/examples/gallery/dialog/DialogPage.cpp @@ -0,0 +1,82 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the 3-clause BSD License + *****************************************************************************/ + +#include "DialogPage.h" + +#include +#include +#include +#include + +namespace +{ + class Box : public QskGridBox + { + public: + Box( QQuickItem* parent ) + : QskGridBox( parent ) + { + auto* messageButton = new QskPushButton( "message", this ); + + connect( messageButton, &QskPushButton::clicked, this, []() + { + qskDialog->message( "message", "text", QskStandardSymbol::Ok ); + } ); + + auto* informationButton = new QskPushButton( "information", this ); + + connect( informationButton, &QskPushButton::clicked, this, []() + { + qskDialog->information( "information", "text" ); + } ); + + auto* warningButton = new QskPushButton( "warning", this ); + + connect( warningButton, &QskPushButton::clicked, this, []() + { + qskDialog->warning( "warning", "text" ); + } ); + + auto* criticalButton = new QskPushButton( "critical", this ); + + connect( criticalButton, &QskPushButton::clicked, this, []() + { + qskDialog->critical( "critical", "text" ); + } ); + + auto* questionButton = new QskPushButton( "question", this ); + + connect( questionButton, &QskPushButton::clicked, this, []() + { + qskDialog->question( "question", "text" ); + } ); + + auto* selectButton = new QskPushButton( "select", this ); + + connect( selectButton, &QskPushButton::clicked, this, []() + { + qskDialog->select( "select", "text", { "yes", "no", "maybe" } ); + } ); + + addItem( messageButton, 0, 0 ); + addItem( informationButton, 0, 1 ); + addItem( warningButton, 0, 2 ); + addItem( criticalButton, 1, 0 ); + addItem( questionButton, 1, 1 ); + addItem( selectButton, 1, 2 ); + } + }; +} + +DialogPage::DialogPage( QQuickItem* parent ) + : Page( Qt::Horizontal, parent ) +{ + populate(); +} + +void DialogPage::populate() +{ + new Box( this ); +} diff --git a/examples/gallery/dialog/DialogPage.h b/examples/gallery/dialog/DialogPage.h new file mode 100644 index 00000000..f41a2a37 --- /dev/null +++ b/examples/gallery/dialog/DialogPage.h @@ -0,0 +1,17 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the 3-clause BSD License + *****************************************************************************/ + +#pragma once + +#include "Page.h" + +class DialogPage : public Page +{ + public: + DialogPage( QQuickItem* = nullptr ); + + private: + void populate(); +}; diff --git a/examples/gallery/gallery.pro b/examples/gallery/gallery.pro index 0435c5ea..d282c339 100644 --- a/examples/gallery/gallery.pro +++ b/examples/gallery/gallery.pro @@ -36,6 +36,12 @@ HEADERS += \ SOURCES += \ selector/SelectorPage.cpp \ +HEADERS += \ + dialog/DialogPage.h + +SOURCES += \ + dialog/DialogPage.cpp \ + HEADERS += \ Page.h diff --git a/examples/gallery/main.cpp b/examples/gallery/main.cpp index 0d4bf2a5..b2bec795 100644 --- a/examples/gallery/main.cpp +++ b/examples/gallery/main.cpp @@ -9,6 +9,7 @@ #include "button/ButtonPage.h" #include "textinput/TextInputPage.h" #include "selector/SelectorPage.h" +#include "dialog/DialogPage.h" #include #include @@ -138,6 +139,7 @@ namespace tabView->addTab( "Progress\nBars", new ProgressBarPage() ); tabView->addTab( "Text\nInputs", new TextInputPage() ); tabView->addTab( "Selectors", new SelectorPage() ); + tabView->addTab( "Dialogs", new DialogPage() ); connect( header, &Header::enabledToggled, tabView, &TabView::setTabsEnabled ); From f0fbb084f61b55260e77e51b638b07526468d6f3 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Tue, 5 Jul 2022 16:15:00 +0200 Subject: [PATCH 62/70] style dialogs --- skins/material3/QskMaterial3Skin.cpp | 27 ++++++++++++++++----------- skins/material3/QskMaterial3Skin.h | 2 ++ 2 files changed, 18 insertions(+), 11 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index 41cb5370..c143624b 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -522,7 +522,7 @@ void Editor::setupDialogButtonBox() { using Q = QskDialogButtonBox; - setGradient( Q::Panel, m_pal.background ); + setGradient( Q::Panel, m_pal.secondaryContainer ); setBoxShape( Q::Panel, 0 ); setBoxBorderMetrics( Q::Panel, 0 ); } @@ -825,23 +825,26 @@ void Editor::setupSubWindow() // Panel - setPadding( Q::Panel, 10 ); - setBoxShape( Q::Panel, 0 ); - setBoxBorderMetrics( Q::Panel, 2 ); - setGradient( Q::Panel, m_pal.onBackground ); - - setBoxBorderColors( Q::Panel, m_pal.primary ); + setPadding( Q::Panel, { 24, 0, 24, 24 } ); + setStrutSize( Q::Panel, { 280, -1 } ); + setBoxShape( Q::Panel, 28 ); + setBoxBorderMetrics( Q::Panel, 0 ); + setGradient( Q::Panel, m_pal.secondaryContainer ); + setShadowMetrics( Q::Panel, m_pal.elevationLight3 ); + setShadowColor( Q::Panel, m_pal.shadow ); // TitleBarPanel + setBoxShape( Q::TitleBarPanel, 28 ); + setPadding( Q::TitleBarPanel, { 24, 24, 24, 16 } ); setFlagHint( Q::TitleBarPanel | QskAspect::Style, Q::TitleBar | Q::Title | Q::Symbol ); - setGradient( Q::TitleBarPanel, m_pal.surface ); - setGradient( Q::TitleBarPanel | Q::Focused, m_pal.surfaceVariant ); + setGradient( Q::TitleBarPanel, m_pal.secondaryContainer ); // TitleBarText - setFontRole( Q::TitleBarText, QskSkin::SmallFont ); - setAlignment( Q::TitleBarText, Qt::AlignLeft | Qt::AlignVCenter ); + setFontRole( Q::TitleBarText, QskMaterial3Skin::M3HeadlineSmall ); + setColor( Q::TitleBarText, m_pal.onSurface ); + setAlignment( Q::TitleBarText, Qt::AlignCenter ); for ( auto subControl : { Q::Panel, Q::TitleBarPanel, Q::TitleBarText } ) setAnimation( subControl | A::Color, qskDuration ); @@ -946,6 +949,7 @@ QskMaterial3Theme::QskMaterial3Theme(Lightness lightness, elevationLight1 = QskShadowMetrics( -3, 5, { 0, 2 } ); elevationLight2 = QskShadowMetrics( -2, 8, { 0, 2 } ); + elevationLight3 = QskShadowMetrics( -1, 11, { 0, 2 } ); } QskMaterial3Skin::QskMaterial3Skin( const QskMaterial3Theme& palette, QObject* parent ) @@ -966,6 +970,7 @@ void QskMaterial3Skin::setupFonts() Inherited::setupFonts( QStringLiteral( "Roboto" ) ); setFont( M3BodyLarge, createFont( 16 ) ); + setFont( M3HeadlineSmall, createFont( 28 ) ); setFont( M3LabelLarge, createFont( 14 ) ); } diff --git a/skins/material3/QskMaterial3Skin.h b/skins/material3/QskMaterial3Skin.h index 5c2b0700..f30c5bf1 100644 --- a/skins/material3/QskMaterial3Skin.h +++ b/skins/material3/QskMaterial3Skin.h @@ -75,6 +75,7 @@ class QSK_MATERIAL3_EXPORT QskMaterial3Theme QskShadowMetrics elevationLight1; QskShadowMetrics elevationLight2; + QskShadowMetrics elevationLight3; const qreal hoverOpacity = 0.08; const qreal focusOpacity = 0.12; @@ -98,6 +99,7 @@ class QSK_MATERIAL3_EXPORT QskMaterial3Skin : public QskSkin enum FontRole { M3BodyLarge = QskSkin::HugeFont + 1, + M3HeadlineSmall, M3LabelLarge, }; From 2fcc7c77cab2279ceaa17132c5cb21c48a3a9e21 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 6 Jul 2022 11:43:49 +0200 Subject: [PATCH 63/70] Improve fonts Setting the proper weight makes the fonts pixel perfect now --- skins/material3/QskMaterial3Skin.cpp | 19 +++++++++++++------ skins/material3/QskMaterial3Skin.h | 3 ++- 2 files changed, 15 insertions(+), 7 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index c143624b..b1bdd573 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -12,6 +12,7 @@ #include #include #include +#include #include #include #include @@ -89,11 +90,16 @@ namespace const QskMaterial3Theme& m_pal; }; - QFont createFont( int pixelSize, QFont::Weight weight = QFont::Normal ) + QFont createFont( int pixelSize, qreal tracking, QFont::Weight weight ) { QFont font( "Roboto" ); font.setPixelSize( pixelSize ); - font.setLetterSpacing( QFont::AbsoluteSpacing, 0.1 ); + + if( !qskFuzzyCompare( tracking, 0.0 ) ) + { + font.setLetterSpacing( QFont::AbsoluteSpacing, tracking ); + } + font.setWeight( weight ); return font; @@ -228,7 +234,7 @@ void Editor::setupMenu() setStrutSize( Q::Graphic, { 46, -1 } ); setColor( Q::Text, m_pal.onSurface ); - setFontRole( Q::Text, QskMaterial3Skin::M3BodyLarge ); + setFontRole( Q::Text, QskMaterial3Skin::M3BodyMedium ); setPosition( Q::Panel, 0 ); setPosition( Q::Panel | QskPopup::Closed, 1 ); @@ -969,9 +975,10 @@ void QskMaterial3Skin::setupFonts() { Inherited::setupFonts( QStringLiteral( "Roboto" ) ); - setFont( M3BodyLarge, createFont( 16 ) ); - setFont( M3HeadlineSmall, createFont( 28 ) ); - setFont( M3LabelLarge, createFont( 14 ) ); + setFont( M3BodyMedium, createFont( 14, 0.25, QFont::Normal ) ); + setFont( M3BodyLarge, createFont( 16, 0.5, QFont::Normal ) ); + setFont( M3HeadlineSmall, createFont( 28, 0.0, QFont::Normal ) ); + setFont( M3LabelLarge, createFont( 14, 0.1, QFont::Medium ) ); } #include "moc_QskMaterial3Skin.cpp" diff --git a/skins/material3/QskMaterial3Skin.h b/skins/material3/QskMaterial3Skin.h index f30c5bf1..834d3535 100644 --- a/skins/material3/QskMaterial3Skin.h +++ b/skins/material3/QskMaterial3Skin.h @@ -98,7 +98,8 @@ class QSK_MATERIAL3_EXPORT QskMaterial3Skin : public QskSkin enum FontRole { - M3BodyLarge = QskSkin::HugeFont + 1, + M3BodyMedium = QskSkin::HugeFont + 1, + M3BodyLarge, M3HeadlineSmall, M3LabelLarge, }; From 8ff290410e86928204d0a543f3dba41666626b83 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 6 Jul 2022 10:39:17 +0200 Subject: [PATCH 64/70] style dialog button --- skins/material3/QskMaterial3Skin.cpp | 47 +++++++++------------------- 1 file changed, 15 insertions(+), 32 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index b1bdd573..94cf771b 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -113,6 +113,13 @@ namespace opacity * foregroundColor.blue() + ( 1 - opacity ) * backgroundColor.blue() ); return r; } + + QColor stateLayerColor( QRgb rgb, qreal opacity ) + { + QColor c( rgb ); + c.setAlphaF( opacity ); + return c; + } } void Editor::setup() @@ -485,43 +492,19 @@ void Editor::setupPushButton() void Editor::setupDialogButton() { - using A = QskAspect; using Q = QskDialogButton; - setStrutSize( Q::Panel, 30, 16 ); - setSpacing( Q::Panel, 4 ); + setStrutSize( Q::Panel, 48, -1 ); + setSpacing( Q::Panel, 8 ); + setPadding( Q::Panel, { 12, 13, 12, 13 } ); + setBoxShape( Q::Panel, 100, Qt::RelativeSize ); + setGradient( Q::Panel, m_pal.secondaryContainer ); - setMargin( Q::Panel, QskMargins( 4, 3 ) ); - setPadding( Q::Panel, QskMargins( 10, 6 ) ); - - setBoxShape( Q::Panel, 0 ); - - setGradient( Q::Panel, m_pal.primary ); - - setColor( Q::Text, m_pal.onPrimary ); - setColor( Q::Text | Q::Disabled, m_pal.onSurface38 ); + setGradient( Q::Panel | Q::Hovered, stateLayerColor( m_pal.primary, m_pal.hoverOpacity ) ); + setGradient( Q::Panel | Q::Pressed, stateLayerColor( m_pal.primary, m_pal.pressedOpacity ) ); + setColor( Q::Text, m_pal.primary ); setFontRole( Q::Text, QskMaterial3Skin::M3LabelLarge ); - setAlignment( Q::Text, Qt::AlignCenter ); - - for ( auto state1 : { A::NoState, Q::Focused } ) - { - for ( auto state2 : { A::NoState, Q::Hovered } ) - { - for ( auto state3 : { Q::Pressed | A::NoState, - Q::Checked | A::NoState, Q::Checked | Q::Pressed } ) - { - const auto states = state1 | state2 | state3; - - setGradient( Q::Panel | states, m_pal.secondary ); - setColor( Q::Text | states, m_pal.onSecondary ); - } - } - } - - setAnimation( Q::Panel | A::Color, qskDuration ); - setAnimation( Q::Panel | A::Metric, qskDuration ); - setAnimation( Q::Text | A::Color, qskDuration ); } void Editor::setupDialogButtonBox() From 567753df84fb548d8ffe4e42caf5e63d62363b2e Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 6 Jul 2022 13:27:35 +0200 Subject: [PATCH 65/70] fix tab buttons --- skins/material3/QskMaterial3Skin.cpp | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index 94cf771b..148d43d9 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -640,7 +640,7 @@ void Editor::setupTabButton() using A = QskAspect; using Q = QskTabButton; - setStrutSize( Q::Panel, 64, 64 ); + setStrutSize( Q::Panel, 48, 48 ); setGradient( Q::Panel, m_pal.surface ); setColor( Q::Text, m_pal.onSurfaceVariant ); From 606d5ddef1f9ea4e162a6f597d342d7d1784b067 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 6 Jul 2022 13:42:04 +0200 Subject: [PATCH 66/70] style scroll view and list view --- skins/material3/QskMaterial3Skin.cpp | 16 ++++++---------- 1 file changed, 6 insertions(+), 10 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index 148d43d9..c03a6dde 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -766,11 +766,7 @@ void Editor::setupScrollView() using A = QskAspect; using Q = QskScrollView; - setSpacing( Q::Panel, 5 ); - - setBoxBorderMetrics( Q::Viewport, 1 ); - setGradient( Q::Viewport, m_pal.background ); - setBoxBorderColors( Q::Viewport, m_pal.onBackground ); + setGradient( Q::Viewport, m_pal.secondaryContainer ); for ( auto subControl : { Q::HorizontalScrollBar, Q::VerticalScrollBar } ) { @@ -799,12 +795,12 @@ void Editor::setupListView() using Q = QskListView; setPadding( Q::Cell, { 16, 12, 16, 12 } ); + setBoxBorderMetrics( Q::Cell, { 0, 0, 0, 1 } ); + setBoxBorderColors( Q::Cell, m_pal.outline ); + setColor( Q::Cell, m_pal.surface ); + setColor( Q::Cell | Q::Selected, m_pal.primary12 ); - setGradient( Q::Cell, m_pal.surface ); - setColor( Q::Text, m_pal.onSurface ); - - setGradient( Q::Cell | Q::Selected, m_pal.secondaryContainer ); - setColor( Q::Text | Q::Selected, m_pal.onSecondaryContainer ); + setColor( Q::Text, m_pal.onSurfaceVariant ); } void Editor::setupSubWindow() From 413e6e88d68ba18b28339553f02fc6de286a7880 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 6 Jul 2022 14:11:11 +0200 Subject: [PATCH 67/70] checkboxes: Remove animation for now --- skins/material3/QskMaterial3Skin.cpp | 2 -- 1 file changed, 2 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index c03a6dde..b51ada83 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -187,8 +187,6 @@ void Editor::setupCheckBox() setColor( Q::Indicator | Q::Checked | Q::Disabled, m_pal.onSurface38 ); setColor( Q::Text, m_pal.onBackground ); - - setAnimation( Q::Box | A::Color, qskDuration ); } void Editor::setupBox() From 240784b99c736cad42ecd7ef9aec76b15471b763 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 6 Jul 2022 14:23:05 +0200 Subject: [PATCH 68/70] switch: fix ripple style --- skins/material3/QskMaterial3Skin.cpp | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index b51ada83..aecbedf8 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -606,16 +606,10 @@ void Editor::setupSwitchButton() setStrutSize( Q::Ripple, 40, 40 ); setGradient( Q::Ripple, Qt::transparent ); - QColor c4( m_pal.surface ); - c4.setAlphaF( m_pal.focusOpacity ); - setGradient( Q::Ripple | Q::Hovered, c4 ); - - QColor c5( m_pal.primary ); - c5.setAlphaF( m_pal.focusOpacity ); - setGradient( Q::Ripple | Q::Hovered | Q::Checked, c5 ); setStrutSize( Q::Ripple | Q::Hovered, 40, 40 ); setBoxShape( Q::Ripple, 100, Qt::RelativeSize ); - setStrutSize( Q::Ripple | Q::Hovered | Q::Checked, 40, 40 ); + setGradient( Q::Ripple | Q::Hovered, stateLayerColor( m_pal.onSurface, m_pal.focusOpacity ) ); + setGradient( Q::Ripple | Q::Hovered | Q::Checked, stateLayerColor( m_pal.primary, m_pal.focusOpacity ) ); setBoxBorderColors( Q::Handle, m_pal.outline ); setBoxBorderColors( Q::Handle | Q::Checked, m_pal.primary ); From 8b98a64f5040e443725dfe58671c8b322fe62e3f Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 6 Jul 2022 14:47:49 +0200 Subject: [PATCH 69/70] Remove unused statement --- skins/material3/QskMaterial3Skin.cpp | 1 - 1 file changed, 1 deletion(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index aecbedf8..b733d697 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -164,7 +164,6 @@ void Editor::setupControl() void Editor::setupCheckBox() { - using A = QskAspect; using Q = QskCheckBox; setSpacing( Q::Panel, 10 ); From d79a2b52264222d8ab2eb1d7938ed162c2149529 Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 6 Jul 2022 14:48:06 +0200 Subject: [PATCH 70/70] Change copyright --- skins/material3/QskMaterial3Skin.cpp | 4 ++-- skins/material3/QskMaterial3Skin.h | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/skins/material3/QskMaterial3Skin.cpp b/skins/material3/QskMaterial3Skin.cpp index b733d697..c6ad860f 100644 --- a/skins/material3/QskMaterial3Skin.cpp +++ b/skins/material3/QskMaterial3Skin.cpp @@ -1,6 +1,6 @@ /****************************************************************************** - * QSkinny - Copyright (C) 2016 Uwe Rathmann - * This file may be used under the terms of the QSkinny License, Version 1.0 + * QSkinny - Copyright (C) 2022 Edelhirsch Software GmbH + * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ #include "QskMaterial3Skin.h" diff --git a/skins/material3/QskMaterial3Skin.h b/skins/material3/QskMaterial3Skin.h index 834d3535..646cef4b 100644 --- a/skins/material3/QskMaterial3Skin.h +++ b/skins/material3/QskMaterial3Skin.h @@ -1,6 +1,6 @@ /****************************************************************************** - * QSkinny - Copyright (C) 2016 Uwe Rathmann - * This file may be used under the terms of the QSkinny License, Version 1.0 + * QSkinny - Copyright (C) 2022 Edelhirsch Software GmbH + * This file may be used under the terms of the 3-clause BSD License *****************************************************************************/ #ifndef QSK_MATERIAL3_SKIN_H