diff --git a/examples/gallery/button/ButtonPage.cpp b/examples/gallery/button/ButtonPage.cpp index e6cb217d..faad977b 100644 --- a/examples/gallery/button/ButtonPage.cpp +++ b/examples/gallery/button/ButtonPage.cpp @@ -81,18 +81,18 @@ namespace }; class CheckButtonBox : public QskLinearBox - { + { public: CheckButtonBox( QQuickItem* parent = nullptr ) : QskLinearBox( Qt::Horizontal, parent ) - { + { setSpacing( 20 ); setExtraSpacingAt( Qt::LeftEdge | Qt::RightEdge | Qt::BottomEdge ); for ( auto state : { Qt::Unchecked, Qt::PartiallyChecked, Qt::Checked } ) { auto button = new QskCheckBox( this ); - button->setTristate( true ); + button->setTristate( true ); button->setCheckState( state ); } } diff --git a/examples/gallery/gallery.pro b/examples/gallery/gallery.pro index ae8596b9..0435c5ea 100644 --- a/examples/gallery/gallery.pro +++ b/examples/gallery/gallery.pro @@ -30,6 +30,12 @@ HEADERS += \ SOURCES += \ textinput/TextInputPage.cpp \ +HEADERS += \ + selector/SelectorPage.h + +SOURCES += \ + selector/SelectorPage.cpp \ + HEADERS += \ Page.h diff --git a/examples/gallery/main.cpp b/examples/gallery/main.cpp index 04189f70..a150f0f0 100644 --- a/examples/gallery/main.cpp +++ b/examples/gallery/main.cpp @@ -8,6 +8,7 @@ #include "slider/SliderPage.h" #include "button/ButtonPage.h" #include "textinput/TextInputPage.h" +#include "selector/SelectorPage.h" #include #include @@ -135,6 +136,7 @@ namespace tabView->addTab( "Sliders", new SliderPage() ); tabView->addTab( "Progress\nBars", new ProgressBarPage() ); tabView->addTab( "Text\nInputs", new TextInputPage() ); + tabView->addTab( "Selectors", new SelectorPage() ); connect( header, &Header::enabledToggled, tabView, &TabView::setTabsEnabled ); diff --git a/examples/gallery/selector/SelectorPage.cpp b/examples/gallery/selector/SelectorPage.cpp new file mode 100644 index 00000000..483949a8 --- /dev/null +++ b/examples/gallery/selector/SelectorPage.cpp @@ -0,0 +1,69 @@ +/****************************************************************************** + * QSkinny - Copyright (C) 2016 Uwe Rathmann + * This file may be used under the terms of the 3-clause BSD License + *****************************************************************************/ + +#include "SelectorPage.h" +#include + +namespace +{ + class Box : public QskLinearBox + { + public: + Box( Qt::Orientation orientation, QQuickItem* parent = nullptr ) + : QskLinearBox( orientation, parent ) + { + setSpacing( 20 ); + + orientation = ( orientation == Qt::Horizontal ) + ? Qt::Vertical : Qt::Horizontal; + + { + auto bar = new QskSegmentedBar( orientation, this ); + + bar->addText( "Option 1" ); + bar->addText( "Option 2" ); + bar->addText( "Option 3" ); + bar->addText( "Option 4" ); + } + + { + const auto prefix = QStringLiteral( "image://shapes/" ); + + const char* icons[] = + { + "rectangle/crimson", + "triangleright/thistle", + "ellipse/khaki", + "ring/sandybrown", + "star/darkviolet", + "hexagon/darkslategray" + }; + + auto bar = new QskSegmentedBar( orientation, this ); + for ( const auto icon : icons ) + bar->addGraphic( prefix + icon ); + } + + setExtraSpacingAt( Qt::LeftEdge | Qt::BottomEdge ); + } + }; +} + +SelectorPage::SelectorPage( QQuickItem* parent ) + : Page( Qt::Horizontal, parent ) +{ + populate(); +} + +void SelectorPage::populate() +{ + setSpacing( 20 ); + + new Box( Qt::Horizontal, this ); + new Box( Qt::Vertical, this ); + + setStretchFactor( 0, 0 ); + setStretchFactor( 1, 10 ); +} diff --git a/examples/gallery/selector/SelectorPage.h b/examples/gallery/selector/SelectorPage.h new file mode 100644 index 00000000..7a5d53e1 --- /dev/null +++ b/examples/gallery/selector/SelectorPage.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 SelectorPage : public Page +{ + public: + SelectorPage( QQuickItem* = nullptr ); + + private: + void populate(); +}; diff --git a/skins/material/QskMaterialSkin.cpp b/skins/material/QskMaterialSkin.cpp index 58114ea3..aaf993fe 100644 --- a/skins/material/QskMaterialSkin.cpp +++ b/skins/material/QskMaterialSkin.cpp @@ -331,7 +331,73 @@ void Editor::setupFocusIndicator() void Editor::setupSegmentedBar() { - // TODO + // 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.base ); + + setBoxBorderMetrics( Q::Panel, 2 ); + + const auto c = m_pal.base; + + const QskBoxBorderColors borderColors( + c.darker( 170 ), c.darker( 170 ), + c.darker( 105 ), c.darker( 105 ) ); + + setBoxBorderColors( Q::Panel, borderColors ); + + 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.highlighted ); + setBoxBorderColors( Q::Cursor, QColor( m_pal.highlighted ).darker( 120 ) ); + + setGradient( Q::Cursor | Q::Disabled, QColor( Qt::gray ).darker( 110 ) ); + setBoxBorderColors( Q::Cursor | Q::Disabled, 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.themeForeground ); + setColor( Q::Text | Q::Selected, m_pal.highlightedText ); + + for( auto state : { A::NoState, Q::Selected } ) + setColor( Q::Text | state | Q::Disabled, m_pal.darker200 ); + } + + { + // Graphic + +#if 0 + setGraphicRole( Q::Graphic, ... ); + setStrutSize( Q::Graphic, ... ); +#endif + } } void Editor::setupSeparator() diff --git a/skins/squiek/QskSquiekSkin.cpp b/skins/squiek/QskSquiekSkin.cpp index 2beb9c78..5a729df0 100644 --- a/skins/squiek/QskSquiekSkin.cpp +++ b/skins/squiek/QskSquiekSkin.cpp @@ -22,6 +22,7 @@ #include #include #include +#include #include #include #include @@ -469,7 +470,72 @@ void Editor::setupSeparator() void Editor::setupSegmentedBar() { - // TODO + using A = QskAspect; + using Q = QskSegmentedBar; + + { + // Panel + + setPadding( Q::Panel, 0 ); + setSpacing( Q::Panel, 5 ); + + setGradient( Q::Panel, m_pal.base ); + + setBoxBorderMetrics( Q::Panel, 2 ); + + const auto c = m_pal.base; + + const QskBoxBorderColors borderColors( + c.darker( 170 ), c.darker( 170 ), + c.darker( 105 ), c.darker( 105 ) ); + + setBoxBorderColors( Q::Panel, borderColors ); + + 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.highlighted ); + setBoxBorderColors( Q::Cursor, QColor( m_pal.highlighted ).darker( 120 ) ); + + setGradient( Q::Cursor | Q::Disabled, QColor( Qt::gray ).darker( 110 ) ); + setBoxBorderColors( Q::Cursor | Q::Disabled, 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.themeForeground ); + setColor( Q::Text | Q::Selected, m_pal.highlightedText ); + + for( auto state : { A::NoState, Q::Selected } ) + setColor( Q::Text | state | Q::Disabled, m_pal.darker200 ); + } + + { + // Graphic + +#if 0 + setGraphicRole( Q::Graphic, ... ); + setStrutSize( Q::Graphic, ... ); +#endif + } } void Editor::setupPageIndicator() diff --git a/src/controls/QskSegmentedBar.cpp b/src/controls/QskSegmentedBar.cpp index a53301f2..dca664b6 100644 --- a/src/controls/QskSegmentedBar.cpp +++ b/src/controls/QskSegmentedBar.cpp @@ -94,9 +94,9 @@ QskSegmentedBar::QskSegmentedBar( Qt::Orientation orientation, QQuickItem* paren , m_data( new PrivateData( orientation ) ) { if( orientation == Qt::Horizontal ) - initSizePolicy( QskSizePolicy::Preferred, QskSizePolicy::Fixed ); + initSizePolicy( QskSizePolicy::MinimumExpanding, QskSizePolicy::Fixed ); else - initSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::Preferred ); + initSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::MinimumExpanding ); setAcceptedMouseButtons( Qt::LeftButton ); setWheelEnabled( true );