text input: Add subcontrols needed for M3 and F2
This commit is contained in:
parent
b88b3123d7
commit
0208573325
|
|
@ -17,5 +17,8 @@
|
|||
<file>icons/qvg/arrow_drop_up.qvg</file>
|
||||
<file>icons/qvg/check.qvg</file>
|
||||
<file>icons/qvg/remove.qvg</file>
|
||||
<file>icons/qvg/text_field_search.qvg</file>
|
||||
<file>icons/qvg/text_field_cancel.qvg</file>
|
||||
<file>icons/qvg/text_field_error.qvg</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
|
|
|||
|
|
@ -452,33 +452,126 @@ void Editor::setupTextInput()
|
|||
{
|
||||
using Q = QskTextInput;
|
||||
|
||||
setStrutSize( Q::Panel, -1.0, 56_dp );
|
||||
setPadding( Q::Panel, { 12_dp, 8_dp, 12_dp, 8_dp } );
|
||||
setGradient( Q::Panel, m_pal.surfaceVariant );
|
||||
setBoxShape( Q::Panel, m_pal.shapeExtraSmallTop );
|
||||
setBoxBorderMetrics( Q::Panel, { 0, 0, 0, 1_dp } );
|
||||
setBoxBorderColors( Q::Panel, m_pal.onSurfaceVariant );
|
||||
setSpacing( Q::Panel, 8_dp );
|
||||
const QskStateCombination allStates( QskStateCombination::CombinationNoState, QskAspect::AllStates );
|
||||
|
||||
const auto hoverColor = flattenedColor( m_pal.onSurfaceVariant,
|
||||
// Panel
|
||||
|
||||
setStrutSize( Q::Panel, -1.0, 56_dp );
|
||||
setGradient( Q::Panel, m_pal.surfaceVariant );
|
||||
|
||||
setBoxShape( Q::Panel, m_pal.shapeExtraSmallTop );
|
||||
|
||||
setBoxBorderMetrics( Q::Panel, { 0, 0, 0, 1_dp } );
|
||||
setBoxBorderMetrics( Q::Panel | Q::Focused, { 0, 0, 0, 2_dp }, allStates );
|
||||
|
||||
setBoxBorderColors( Q::Panel, m_pal.onSurfaceVariant );
|
||||
setBoxBorderColors( Q::Panel | Q::Error, m_pal.error, allStates );
|
||||
setBoxBorderColors( Q::Panel | Q::Error | Q::Hovered, m_pal.onErrorContainer, allStates );
|
||||
|
||||
const auto normalHoverColor = flattenedColor( m_pal.onSurfaceVariant,
|
||||
m_pal.surfaceVariant, m_pal.hoverOpacity );
|
||||
setGradient( Q::Panel | Q::Hovered, hoverColor );
|
||||
setGradient( Q::Panel | Q::Hovered, normalHoverColor, allStates );
|
||||
|
||||
const auto errorHoverColor = flattenedColor( m_pal.onSurface,
|
||||
m_pal.surfaceVariant, m_pal.hoverOpacity );
|
||||
setGradient( Q::Panel | Q::Error | Q::Hovered, errorHoverColor, allStates );
|
||||
|
||||
const auto focusColor = flattenedColor( m_pal.onSurfaceVariant,
|
||||
m_pal.surfaceVariant, m_pal.focusOpacity );
|
||||
setGradient( Q::Panel | Q::Focused, focusColor );
|
||||
|
||||
// ### Also add a pressed state
|
||||
|
||||
setColor( Q::InputText, m_pal.onSurface );
|
||||
setFontRole( Q::InputText, BodyMedium );
|
||||
setAlignment( Q::InputText, Qt::AlignLeft | Qt::AlignVCenter );
|
||||
setGradient( Q::Panel | Q::Focused, focusColor, allStates );
|
||||
|
||||
const auto disabledPanelColor = QskRgb::toTransparentF( m_pal.onSurface, 0.04 );
|
||||
setGradient( Q::Panel | Q::Disabled, disabledPanelColor );
|
||||
setBoxBorderColors( Q::Panel | Q::Disabled, m_pal.onSurface38 );
|
||||
setGradient( Q::Panel | Q::Disabled, disabledPanelColor, allStates );
|
||||
setBoxBorderColors( Q::Panel | Q::Disabled, m_pal.onSurface38, allStates );
|
||||
|
||||
|
||||
// LeadingIcon
|
||||
|
||||
setStrutSize( Q::LeadingIcon, { 24_dp, 24_dp } );
|
||||
setMargin( Q::LeadingIcon, { 12_dp, 0, 0, 0 } );
|
||||
const auto leadingIcon = symbol( "text_field_search" );
|
||||
setSymbol( Q::LeadingIcon, leadingIcon );
|
||||
|
||||
setGraphicRole( Q::LeadingIcon, QskMaterial3Skin::GraphicRoleOnSurface );
|
||||
setGraphicRole( Q::LeadingIcon | Q::Error, QskMaterial3Skin::GraphicRoleOnSurfaceVariant, allStates );
|
||||
|
||||
|
||||
// LabelText
|
||||
|
||||
setAlignment( Q::LabelText, Qt::AlignLeft | Qt::AlignVCenter );
|
||||
|
||||
const QskStateCombination textEmptyStates( QskStateCombination::CombinationNoState,
|
||||
Q::Focused | Q::Hovered | Q::ReadOnly | Q::Disabled );
|
||||
|
||||
setFontRole( Q::LabelText | Q::TextEmpty, BodyMedium, textEmptyStates );
|
||||
setColor( Q::LabelText | Q::TextEmpty, m_pal.onSurfaceVariant, textEmptyStates );
|
||||
|
||||
const QskStateCombination editingHoveredFocused( QskStateCombination::CombinationNoState,
|
||||
Q::Editing | Q::Hovered | Q::Focused );
|
||||
|
||||
setMargin( Q::LabelText, { 16_dp, 8_dp, 16_dp, 16_dp }, editingHoveredFocused );
|
||||
setColor( Q::LabelText, m_pal.primary, editingHoveredFocused );
|
||||
setFontRole( Q::LabelText, BodySmall, editingHoveredFocused );
|
||||
|
||||
setColor( Q::LabelText | Q::Error, m_pal.error, allStates );
|
||||
setColor( Q::LabelText | Q::Error | Q::Hovered, m_pal.onErrorContainer, allStates );
|
||||
|
||||
|
||||
// InputText
|
||||
|
||||
setMargin( Q::InputText, { 16_dp, 8_dp, 16_dp, 8_dp } );
|
||||
setColor( Q::InputText, m_pal.onSurface );
|
||||
setFontRole( Q::InputText, BodyMedium );
|
||||
setAlignment( Q::InputText, Qt::AlignLeft | Qt::AlignBottom );
|
||||
|
||||
setColor( Q::InputText | Q::Error, m_pal.onSurface, allStates ); // same as with Hovered and Focused
|
||||
|
||||
setColor( Q::InputText | Q::Disabled, m_pal.onSurface38 );
|
||||
|
||||
|
||||
// HintText
|
||||
|
||||
setColor( Q::HintText, color( Q::InputText ) );
|
||||
setFontRole( Q::HintText, fontRole( Q::InputText ) );
|
||||
setAlignment( Q::HintText, alignment( Q::InputText ) );
|
||||
|
||||
|
||||
// TrailingIcon
|
||||
|
||||
setStrutSize( Q::TrailingIcon, { 24_dp, 24_dp } );
|
||||
setMargin( Q::TrailingIcon, { 0, 0, 12_dp, 0 } );
|
||||
setGraphicRole( Q::TrailingIcon, QskMaterial3Skin::GraphicRoleOnSurface );
|
||||
const auto trailingIcon = symbol( "text_field_cancel" );
|
||||
setSymbol( Q::TrailingIcon, trailingIcon );
|
||||
|
||||
const auto errorIcon = symbol( "text_field_error" );
|
||||
setSymbol( Q::TrailingIcon | Q::Error, errorIcon, allStates );
|
||||
setGraphicRole( Q::TrailingIcon | Q::Error, QskMaterial3Skin::GraphicRoleError, allStates );
|
||||
setGraphicRole( Q::TrailingIcon | Q::Error | Q::Hovered, QskMaterial3Skin::GraphicRoleOnErrorContainer, allStates );
|
||||
|
||||
|
||||
// TrailingIconRipple
|
||||
|
||||
setStrutSize( Q::TrailingIconRipple, { 45_dp, 45_dp } );
|
||||
setGradient( Q::TrailingIconRipple | Q::Hovered, m_pal.onSurface8, allStates );
|
||||
setBoxShape( Q::TrailingIconRipple, 100, Qt::RelativeSize );
|
||||
|
||||
|
||||
// SupportingText
|
||||
|
||||
setMargin( Q::SupportingText, { 16_dp, 4_dp, 16_dp, 4_dp } );
|
||||
setColor( Q::SupportingText, m_pal.onSurfaceVariant );
|
||||
setColor( Q::SupportingText | Q::Error, m_pal.error, allStates );
|
||||
setFontRole( Q::SupportingText, BodySmall );
|
||||
setAlignment( Q::SupportingText, Qt::AlignLeft | Qt::AlignVCenter );
|
||||
|
||||
|
||||
// CharacterCount
|
||||
|
||||
setMargin( Q::CharacterCount, margin( Q::SupportingText ) );
|
||||
setColor( Q::CharacterCount, color( Q::SupportingText ) );
|
||||
setFontRole( Q::CharacterCount, fontRole( Q::SupportingText ) );
|
||||
setAlignment( Q::CharacterCount, Qt::AlignRight | Qt::AlignVCenter );
|
||||
}
|
||||
|
||||
void Editor::setupProgressBar()
|
||||
|
|
@ -1661,10 +1754,12 @@ void QskMaterial3Skin::setGraphicColor( GraphicRole role, QRgb rgb )
|
|||
|
||||
void QskMaterial3Skin::setupGraphicFilters( const QskMaterial3Theme& theme )
|
||||
{
|
||||
setGraphicColor( GraphicRoleError, theme.error );
|
||||
setGraphicColor( GraphicRoleOnPrimary, theme.onPrimary );
|
||||
setGraphicColor( GraphicRoleOnPrimaryContainer, theme.onPrimaryContainer );
|
||||
setGraphicColor( GraphicRoleOnSecondaryContainer, theme.onSecondaryContainer );
|
||||
setGraphicColor( GraphicRoleOnError, theme.onError );
|
||||
setGraphicColor( GraphicRoleOnErrorContainer, theme.onErrorContainer );
|
||||
setGraphicColor( GraphicRoleOnSurface, theme.onSurface );
|
||||
setGraphicColor( GraphicRoleOnSurface38, theme.onSurface38 );
|
||||
setGraphicColor( GraphicRoleOnSurfaceVariant, theme.onSurfaceVariant );
|
||||
|
|
|
|||
|
|
@ -114,7 +114,9 @@ class QSK_MATERIAL3_EXPORT QskMaterial3Skin : public QskSkin
|
|||
public:
|
||||
enum GraphicRole
|
||||
{
|
||||
GraphicRoleError,
|
||||
GraphicRoleOnError,
|
||||
GraphicRoleOnErrorContainer,
|
||||
GraphicRoleOnPrimary,
|
||||
GraphicRoleOnPrimaryContainer,
|
||||
GraphicRoleOnSecondaryContainer,
|
||||
|
|
|
|||
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -0,0 +1,4 @@
|
|||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10 0C4.47 0 0 4.47 0 10C0 15.53 4.47 20 10 20C15.53 20 20 15.53 20 10C20 4.47 15.53 0 10 0ZM10 18C5.59 18 2 14.41 2 10C2 5.59 5.59 2 10 2C14.41 2 18 5.59 18 10C18 14.41 14.41 18 10 18ZM10 8.59L13.59 5L15 6.41L11.41 10L15 13.59L13.59 15L10 11.41L6.41 15L5 13.59L8.59 10L5 6.41L6.41 5L10 8.59Z" fill="black"/>
|
||||
</svg>
|
||||
|
||||
|
After Width: | Height: | Size: 462 B |
|
|
@ -0,0 +1,4 @@
|
|||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM9 15V13H11V15H9ZM9 5V11H11V5H9Z" fill="black"/>
|
||||
</svg>
|
||||
|
||||
|
After Width: | Height: | Size: 294 B |
|
|
@ -0,0 +1,4 @@
|
|||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.76 10.27L17.49 16L16 17.49L10.27 11.76C9.2 12.53 7.91 13 6.5 13C2.91 13 0 10.09 0 6.5C0 2.91 2.91 0 6.5 0C10.09 0 13 2.91 13 6.5C13 7.91 12.53 9.2 11.76 10.27ZM6.5 2C4.01 2 2 4.01 2 6.5C2 8.99 4.01 11 6.5 11C8.99 11 11 8.99 11 6.5C11 4.01 8.99 2 6.5 2Z" fill="black"/>
|
||||
</svg>
|
||||
|
||||
|
After Width: | Height: | Size: 426 B |
|
|
@ -67,26 +67,51 @@ namespace
|
|||
InputBox( QQuickItem* parent = nullptr )
|
||||
: QskLinearBox( Qt::Horizontal, parent )
|
||||
{
|
||||
setSpacing( 20 );
|
||||
setSpacing( 40 );
|
||||
setDefaultAlignment( Qt::AlignHCenter | Qt::AlignTop );
|
||||
|
||||
{
|
||||
new QskTextInput( "Edit Me", this );
|
||||
auto spinBox = new QskSpinBox( 0.0, 100.0, 1.0, this );
|
||||
spinBox->setSizePolicy( Qt::Horizontal, QskSizePolicy::Fixed );
|
||||
spinBox->setPageSize( 5 );
|
||||
spinBox->setValue( 35 );
|
||||
}
|
||||
|
||||
{
|
||||
auto input = new QskTextInput( "Only Read Me", this );
|
||||
auto input = new QskTextInput( this );
|
||||
input->setLabelText( "filled" );
|
||||
input->setHintText( "hint text" );
|
||||
input->setSupportingText( "supporting text" );
|
||||
input->setMaxLength( 10 );
|
||||
}
|
||||
|
||||
{
|
||||
auto input = new QskTextInput( this );
|
||||
input->setLeadingIcon( {} );
|
||||
input->setLabelText( "no leading icon" );
|
||||
input->setHintText( "hint text" );
|
||||
input->setSupportingText( "supporting text" );
|
||||
}
|
||||
auto input = new QskTextInput( this );
|
||||
input->setSkinStateFlag( QskTextInput::Error );
|
||||
input->setLabelText( "error" );
|
||||
input->setHintText( "hint text" );
|
||||
input->setSupportingText( "error text" );
|
||||
}
|
||||
|
||||
{
|
||||
auto input = new QskTextInput( this );
|
||||
input->setReadOnly( true );
|
||||
input->setLabelText( "read only" );
|
||||
input->setSizePolicy( Qt::Horizontal, QskSizePolicy::MinimumExpanding );
|
||||
}
|
||||
|
||||
{
|
||||
auto input = new QskTextInput( "12345", this );
|
||||
input->setMaxLength( 5 );
|
||||
input->setEchoMode( QskTextInput::PasswordEchoOnEdit );
|
||||
#if 1
|
||||
input->setFixedWidth( 80 );
|
||||
#endif
|
||||
}
|
||||
auto input = new QskTextInput( this );
|
||||
input->setMaxLength( 15 );
|
||||
input->setLabelText( "password" );
|
||||
input->setEchoMode( QskTextInput::Password );
|
||||
input->setHintText( "better be strong" );
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
*****************************************************************************/
|
||||
|
||||
#include "QskTextInput.h"
|
||||
#include "QskEvent.h"
|
||||
#include "QskFontRole.h"
|
||||
#include "QskQuick.h"
|
||||
|
||||
|
|
@ -13,11 +14,20 @@ QSK_QT_PRIVATE_BEGIN
|
|||
QSK_QT_PRIVATE_END
|
||||
|
||||
QSK_SUBCONTROL( QskTextInput, Panel )
|
||||
QSK_SUBCONTROL( QskTextInput, LeadingIcon )
|
||||
QSK_SUBCONTROL( QskTextInput, LabelText )
|
||||
QSK_SUBCONTROL( QskTextInput, InputText )
|
||||
QSK_SUBCONTROL( QskTextInput, TrailingIconRipple )
|
||||
QSK_SUBCONTROL( QskTextInput, TrailingIcon )
|
||||
QSK_SUBCONTROL( QskTextInput, HintText )
|
||||
QSK_SUBCONTROL( QskTextInput, SupportingText )
|
||||
QSK_SUBCONTROL( QskTextInput, CharacterCount )
|
||||
|
||||
QSK_SYSTEM_STATE( QskTextInput, ReadOnly, QskAspect::FirstSystemState << 1 )
|
||||
QSK_SYSTEM_STATE( QskTextInput, Editing, QskAspect::FirstSystemState << 2 )
|
||||
QSK_SYSTEM_STATE( QskTextInput, Selected, QskAspect::FirstSystemState << 3 )
|
||||
QSK_SYSTEM_STATE( QskTextInput, Error, QskAspect::FirstSystemState << 4 )
|
||||
QSK_SYSTEM_STATE( QskTextInput, TextEmpty, QskAspect::LastUserState << 1 )
|
||||
|
||||
static inline void qskPropagateReadOnly( QskTextInput* input )
|
||||
{
|
||||
|
|
@ -284,7 +294,9 @@ class QskTextInput::PrivateData
|
|||
{
|
||||
public:
|
||||
TextInput* textInput;
|
||||
QString description; // f.e. used as prompt in QskInputPanel
|
||||
QString labelText;
|
||||
QString hintText;
|
||||
QString supportingText;
|
||||
|
||||
unsigned int activationModes : 3;
|
||||
bool hasPanel : 1;
|
||||
|
|
@ -318,12 +330,20 @@ QskTextInput::QskTextInput( QQuickItem* parent )
|
|||
m_data->textInput->setAcceptedMouseButtons( Qt::NoButton );
|
||||
|
||||
initSizePolicy( QskSizePolicy::Expanding, QskSizePolicy::Fixed );
|
||||
|
||||
setSkinStateFlag( TextEmpty );
|
||||
|
||||
connect( m_data->textInput, &QQuickTextInput::textChanged, this, [this]()
|
||||
{
|
||||
setSkinStateFlag( TextEmpty, m_data->textInput->text().isEmpty() );
|
||||
update(); // character count might have changed
|
||||
} );
|
||||
}
|
||||
|
||||
QskTextInput::QskTextInput( const QString& text, QQuickItem* parent )
|
||||
: QskTextInput( parent )
|
||||
{
|
||||
m_data->textInput->setText( text );
|
||||
setInputText( text );
|
||||
}
|
||||
|
||||
QskTextInput::~QskTextInput()
|
||||
|
|
@ -420,7 +440,14 @@ void QskTextInput::keyReleaseEvent( QKeyEvent* event )
|
|||
|
||||
void QskTextInput::mousePressEvent( QMouseEvent* event )
|
||||
{
|
||||
m_data->textInput->handleEvent( event );
|
||||
if( !isReadOnly() && subControlContentsRect( TrailingIcon ).contains( event->position() ) )
|
||||
{
|
||||
setInputText( {} );
|
||||
}
|
||||
else
|
||||
{
|
||||
m_data->textInput->handleEvent( event );
|
||||
}
|
||||
|
||||
if ( !isReadOnly() && !qGuiApp->styleHints()->setFocusOnTouchRelease() )
|
||||
setEditing( true );
|
||||
|
|
@ -489,6 +516,36 @@ void QskTextInput::focusOutEvent( QFocusEvent* event )
|
|||
Inherited::focusOutEvent( event );
|
||||
}
|
||||
|
||||
void QskTextInput::hoverEnterEvent( QHoverEvent* event )
|
||||
{
|
||||
using A = QskAspect;
|
||||
|
||||
setSkinHint( TrailingIconRipple | Hovered | A::Metric | A::Position, qskHoverPosition( event ) );
|
||||
update();
|
||||
|
||||
Inherited::hoverEnterEvent( event );
|
||||
}
|
||||
|
||||
void QskTextInput::hoverMoveEvent( QHoverEvent* event )
|
||||
{
|
||||
using A = QskAspect;
|
||||
|
||||
setSkinHint( TrailingIconRipple | Hovered | A::Metric | A::Position, qskHoverPosition( event ) );
|
||||
update();
|
||||
|
||||
Inherited::hoverMoveEvent( event );
|
||||
}
|
||||
|
||||
void QskTextInput::hoverLeaveEvent( QHoverEvent* event )
|
||||
{
|
||||
using A = QskAspect;
|
||||
|
||||
setSkinHint( TrailingIconRipple | Hovered | A::Metric | A::Position, QPointF() );
|
||||
update();
|
||||
|
||||
Inherited::hoverLeaveEvent( event );
|
||||
}
|
||||
|
||||
QSizeF QskTextInput::layoutSizeHint( Qt::SizeHint which, const QSizeF& ) const
|
||||
{
|
||||
if ( which != Qt::PreferredSize )
|
||||
|
|
@ -506,6 +563,12 @@ QSizeF QskTextInput::layoutSizeHint( Qt::SizeHint which, const QSizeF& ) const
|
|||
hint = hint.expandedTo( strutSizeHint( Panel ) );
|
||||
}
|
||||
|
||||
if( !supportingText().isEmpty() || maxLength() != 32767 ) // magic number hardcoded in qquicktextinput.cpp
|
||||
{
|
||||
const auto margins = marginHint( SupportingText );
|
||||
hint.rheight() += margins.top() + effectiveFontHeight( SupportingText ) + margins.bottom();
|
||||
}
|
||||
|
||||
return hint;
|
||||
}
|
||||
|
||||
|
|
@ -534,18 +597,56 @@ void QskTextInput::setInputText( const QString& text )
|
|||
m_data->textInput->setText( text );
|
||||
}
|
||||
|
||||
void QskTextInput::setDescription( const QString& text )
|
||||
QString QskTextInput::labelText() const
|
||||
{
|
||||
if ( m_data->description != text )
|
||||
return m_data->labelText;
|
||||
}
|
||||
|
||||
void QskTextInput::setLabelText( const QString& text )
|
||||
{
|
||||
if ( m_data->labelText != text )
|
||||
{
|
||||
m_data->description = text;
|
||||
Q_EMIT descriptionChanged( text );
|
||||
m_data->labelText = text;
|
||||
Q_EMIT labelTextChanged( text );
|
||||
}
|
||||
}
|
||||
|
||||
QString QskTextInput::description() const
|
||||
QskGraphic QskTextInput::leadingIcon() const
|
||||
{
|
||||
return m_data->description;
|
||||
return symbolHint( LeadingIcon );
|
||||
}
|
||||
|
||||
void QskTextInput::setLeadingIcon( const QskGraphic& icon )
|
||||
{
|
||||
setSymbolHint( LeadingIcon, icon );
|
||||
}
|
||||
|
||||
void QskTextInput::setHintText( const QString& text )
|
||||
{
|
||||
if ( m_data->hintText != text )
|
||||
{
|
||||
m_data->hintText = text;
|
||||
Q_EMIT hintTextChanged( text );
|
||||
}
|
||||
}
|
||||
|
||||
QString QskTextInput::hintText() const
|
||||
{
|
||||
return m_data->hintText;
|
||||
}
|
||||
|
||||
void QskTextInput::setSupportingText( const QString& text )
|
||||
{
|
||||
if ( m_data->supportingText != text )
|
||||
{
|
||||
m_data->supportingText = text;
|
||||
Q_EMIT supportingTextChanged( text );
|
||||
}
|
||||
}
|
||||
|
||||
QString QskTextInput::supportingText() const
|
||||
{
|
||||
return m_data->supportingText;
|
||||
}
|
||||
|
||||
QskTextInput::ActivationModes QskTextInput::activationModes() const
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
#define QSK_TEXT_INPUT_H
|
||||
|
||||
#include "QskControl.h"
|
||||
#include "QskGraphic.h"
|
||||
#include "QskTextOptions.h"
|
||||
|
||||
class QValidator;
|
||||
|
|
@ -18,13 +19,18 @@ class QSK_EXPORT QskTextInput : public QskControl
|
|||
|
||||
Q_PROPERTY( QString inputText READ inputText WRITE setInputText NOTIFY inputTextChanged USER true )
|
||||
|
||||
Q_PROPERTY( QString description READ description
|
||||
WRITE setDescription NOTIFY descriptionChanged )
|
||||
Q_PROPERTY( QString labelText READ labelText WRITE setLabelText NOTIFY labelTextChanged )
|
||||
|
||||
Q_PROPERTY( QString hintText READ hintText
|
||||
WRITE setHintText NOTIFY hintTextChanged )
|
||||
|
||||
Q_PROPERTY( QString supportingText READ supportingText
|
||||
WRITE setSupportingText NOTIFY supportingTextChanged )
|
||||
|
||||
Q_PROPERTY( QskFontRole fontRole READ fontRole
|
||||
WRITE setFontRole RESET resetFontRole NOTIFY fontRoleChanged )
|
||||
|
||||
Q_PROPERTY( QFont font READ font )
|
||||
Q_PROPERTY( QFont font READ font CONSTANT )
|
||||
|
||||
Q_PROPERTY( Qt::Alignment alignment READ alignment
|
||||
WRITE setAlignment RESET resetAlignment NOTIFY alignmentChanged )
|
||||
|
|
@ -55,8 +61,11 @@ class QSK_EXPORT QskTextInput : public QskControl
|
|||
using Inherited = QskControl;
|
||||
|
||||
public:
|
||||
QSK_SUBCONTROLS( Panel, InputText )
|
||||
QSK_STATES( ReadOnly, Editing, Selected )
|
||||
QSK_SUBCONTROLS( Panel, LeadingIcon, LabelText, InputText,
|
||||
TrailingIconRipple, TrailingIcon, HintText, SupportingText,
|
||||
CharacterCount )
|
||||
|
||||
QSK_STATES( ReadOnly, Editing, Selected, Error, TextEmpty )
|
||||
|
||||
enum ActivationMode
|
||||
{
|
||||
|
|
@ -84,7 +93,7 @@ class QSK_EXPORT QskTextInput : public QskControl
|
|||
Q_ENUM( EchoMode )
|
||||
|
||||
QskTextInput( QQuickItem* parent = nullptr );
|
||||
QskTextInput( const QString&, QQuickItem* parent = nullptr );
|
||||
QskTextInput( const QString&, QQuickItem* parent = nullptr ); // ### do we need this constructor?
|
||||
|
||||
~QskTextInput() override;
|
||||
|
||||
|
|
@ -92,8 +101,16 @@ class QSK_EXPORT QskTextInput : public QskControl
|
|||
|
||||
QString inputText() const;
|
||||
|
||||
void setDescription( const QString& );
|
||||
QString description() const;
|
||||
QString labelText() const;
|
||||
|
||||
QskGraphic leadingIcon() const;
|
||||
void setLeadingIcon( const QskGraphic& );
|
||||
|
||||
void setHintText( const QString& );
|
||||
QString hintText() const;
|
||||
|
||||
void setSupportingText( const QString& );
|
||||
QString supportingText() const;
|
||||
|
||||
void setPanel( bool );
|
||||
bool hasPanel() const;
|
||||
|
|
@ -164,6 +181,8 @@ class QSK_EXPORT QskTextInput : public QskControl
|
|||
|
||||
public Q_SLOTS:
|
||||
void setInputText( const QString& );
|
||||
void setLabelText( const QString& );
|
||||
|
||||
void setEditing( bool );
|
||||
|
||||
Q_SIGNALS:
|
||||
|
|
@ -174,10 +193,13 @@ class QSK_EXPORT QskTextInput : public QskControl
|
|||
void panelChanged( bool );
|
||||
|
||||
void inputTextChanged( const QString& );
|
||||
void labelTextChanged( const QString& );
|
||||
|
||||
void displayTextChanged( const QString& );
|
||||
|
||||
void textEdited( const QString& );
|
||||
void descriptionChanged( const QString& );
|
||||
void hintTextChanged( const QString& );
|
||||
void supportingTextChanged( const QString& );
|
||||
|
||||
void fontRoleChanged();
|
||||
void alignmentChanged();
|
||||
|
|
@ -201,6 +223,10 @@ class QSK_EXPORT QskTextInput : public QskControl
|
|||
void focusInEvent( QFocusEvent* ) override;
|
||||
void focusOutEvent( QFocusEvent* ) override;
|
||||
|
||||
void hoverEnterEvent( QHoverEvent* ) override;
|
||||
void hoverMoveEvent( QHoverEvent* ) override;
|
||||
void hoverLeaveEvent( QHoverEvent* ) override;
|
||||
|
||||
void mousePressEvent( QMouseEvent* ) override;
|
||||
void mouseMoveEvent( QMouseEvent* ) override;
|
||||
void mouseReleaseEvent( QMouseEvent* ) override;
|
||||
|
|
|
|||
|
|
@ -6,10 +6,35 @@
|
|||
#include "QskTextInputSkinlet.h"
|
||||
#include "QskTextInput.h"
|
||||
|
||||
#include "QskFunctions.h"
|
||||
|
||||
#include <QFontMetricsF>
|
||||
|
||||
using Q = QskTextInput;
|
||||
|
||||
namespace
|
||||
{
|
||||
QString maxLengthString( const QskTextInput* input )
|
||||
{
|
||||
QString s = QString::number( input->inputText().length() )
|
||||
+ " / " + QString::number( input->maxLength() );
|
||||
return s;
|
||||
}
|
||||
}
|
||||
|
||||
QskTextInputSkinlet::QskTextInputSkinlet( QskSkin* skin )
|
||||
: Inherited( skin )
|
||||
{
|
||||
setNodeRoles( { PanelRole } );
|
||||
setNodeRoles( {
|
||||
PanelRole,
|
||||
LeadingIconRole,
|
||||
LabelTextRole,
|
||||
HintTextRole,
|
||||
SupportingTextRole,
|
||||
CharacterCountRole,
|
||||
TrailingIconRippleRole,
|
||||
TrailingIconRole,
|
||||
} );
|
||||
}
|
||||
|
||||
QskTextInputSkinlet::~QskTextInputSkinlet()
|
||||
|
|
@ -19,13 +44,158 @@ QskTextInputSkinlet::~QskTextInputSkinlet()
|
|||
QRectF QskTextInputSkinlet::subControlRect( const QskSkinnable* skinnable,
|
||||
const QRectF& contentsRect, QskAspect::Subcontrol subControl ) const
|
||||
{
|
||||
if ( subControl == QskTextInput::Panel )
|
||||
const auto input = static_cast< const Q* >( skinnable );
|
||||
|
||||
if ( subControl == Q::Panel )
|
||||
{
|
||||
return contentsRect;
|
||||
auto rect = contentsRect;
|
||||
|
||||
const auto h = input->strutSizeHint( subControl ).height();
|
||||
rect.setHeight( h );
|
||||
|
||||
return rect;
|
||||
}
|
||||
else if ( subControl == QskTextInput::InputText )
|
||||
else if ( subControl == Q::LeadingIcon )
|
||||
{
|
||||
return skinnable->subControlContentsRect( contentsRect, QskTextInput::Panel );
|
||||
if( input->symbolHint( subControl ).isEmpty() )
|
||||
{
|
||||
return {};
|
||||
}
|
||||
else
|
||||
{
|
||||
const auto margins = input->marginHint( subControl );
|
||||
const auto panelRect = input->subControlRect( Q::Panel );
|
||||
auto rect = panelRect.marginsRemoved( margins );
|
||||
|
||||
const auto size = input->strutSizeHint( subControl );
|
||||
rect.setSize( size );
|
||||
rect.moveCenter( { rect.center().x(), panelRect.center().y() } );
|
||||
|
||||
return rect;
|
||||
}
|
||||
}
|
||||
else if ( subControl == Q::LabelText )
|
||||
{
|
||||
const auto inputRect = input->subControlRect( Q::InputText );
|
||||
|
||||
if( input->hasSkinState( Q::Focused ) || !input->inputText().isEmpty() )
|
||||
{
|
||||
const auto margins = input->marginHint( subControl );
|
||||
auto rect = inputRect;
|
||||
rect.setY( contentsRect.y() + margins.top() );
|
||||
const QFontMetricsF fm ( input->effectiveFont( subControl ) );
|
||||
rect.setHeight( fm.height() );
|
||||
return rect;
|
||||
}
|
||||
else
|
||||
{
|
||||
return inputRect;
|
||||
}
|
||||
}
|
||||
else if ( subControl == Q::InputText )
|
||||
{
|
||||
const auto margins = input->marginHint( subControl );
|
||||
|
||||
const auto leadingIconRect = input->subControlRect( Q::LeadingIcon );
|
||||
const auto panelRect = input->subControlRect( Q::Panel );
|
||||
auto rect = panelRect;
|
||||
rect.setLeft( leadingIconRect.right() );
|
||||
rect.setRight( contentsRect.right() ); // ### space for trailing icon
|
||||
rect = rect.marginsRemoved( margins );
|
||||
|
||||
return rect;
|
||||
}
|
||||
else if ( subControl == Q::HintText )
|
||||
{
|
||||
if( input->hasSkinState( Q::Focused ) && input->inputText().isEmpty() ) // ### has TextEmpty state
|
||||
{
|
||||
return input->subControlRect( Q::InputText );
|
||||
}
|
||||
else
|
||||
{
|
||||
return {};
|
||||
}
|
||||
}
|
||||
else if ( subControl == Q::SupportingText )
|
||||
{
|
||||
if( input->supportingText().isEmpty() )
|
||||
{
|
||||
return {};
|
||||
}
|
||||
else
|
||||
{
|
||||
auto rect = contentsRect;
|
||||
|
||||
const auto margins = input->marginHint( subControl );
|
||||
const auto h = margins.top() + input->effectiveFontHeight( subControl ) + margins.bottom();
|
||||
rect.setTop( rect.bottom() - h );
|
||||
|
||||
rect.setLeft( rect.left() + margins.left() );
|
||||
|
||||
return rect;
|
||||
}
|
||||
}
|
||||
else if ( subControl == Q::CharacterCount )
|
||||
{
|
||||
if( input->maxLength() == 32767 ) // magic number hardcoded in qquicktextinput.cpp
|
||||
{
|
||||
return {};
|
||||
}
|
||||
else
|
||||
{
|
||||
auto rect = contentsRect;
|
||||
|
||||
const auto margins = input->marginHint( subControl );
|
||||
const auto h = margins.top() + input->effectiveFontHeight( subControl ) + margins.bottom();
|
||||
rect.setTop( rect.bottom() - h );
|
||||
|
||||
const QFontMetricsF fm( input->effectiveFont( subControl ) );
|
||||
const auto w = qskHorizontalAdvance( fm, maxLengthString( input ) );
|
||||
rect.setRight( rect.right() - margins.right() );
|
||||
rect.setLeft( rect.right() - ( margins.left() + w + margins.right() ) );
|
||||
|
||||
return rect;
|
||||
}
|
||||
}
|
||||
else if ( subControl == Q::TrailingIconRipple )
|
||||
{
|
||||
const auto cursorPos = input->effectiveSkinHint(
|
||||
Q::TrailingIconRipple | Q::Hovered | QskAspect::Metric | QskAspect::Position ).toPointF();
|
||||
const auto trailingIconRect = input->subControlRect( Q::TrailingIcon );
|
||||
|
||||
if( !cursorPos.isNull() && trailingIconRect.contains( cursorPos ) )
|
||||
{
|
||||
const auto size = input->strutSizeHint( subControl );
|
||||
QRectF rect( { 0, 0 }, size );
|
||||
|
||||
rect.moveCenter( trailingIconRect.center() );
|
||||
|
||||
return rect;
|
||||
}
|
||||
else
|
||||
{
|
||||
return {};
|
||||
}
|
||||
}
|
||||
else if ( subControl == Q::TrailingIcon )
|
||||
{
|
||||
if( input->symbolHint( subControl ).isEmpty() )
|
||||
{
|
||||
return {};
|
||||
}
|
||||
else
|
||||
{
|
||||
const auto margins = input->marginHint( subControl );
|
||||
const auto panelRect = input->subControlRect( Q::Panel );
|
||||
auto rect = panelRect.marginsRemoved( margins );
|
||||
|
||||
const auto size = input->strutSizeHint( subControl );
|
||||
rect.setHeight( size.height() );
|
||||
rect.moveCenter( { rect.center().x(), panelRect.center().y() } );
|
||||
rect.setLeft( rect.right() - size.width() );
|
||||
|
||||
return rect;
|
||||
}
|
||||
}
|
||||
|
||||
return Inherited::subControlRect( skinnable, contentsRect, subControl );
|
||||
|
|
@ -34,15 +204,51 @@ QRectF QskTextInputSkinlet::subControlRect( const QskSkinnable* skinnable,
|
|||
QSGNode* QskTextInputSkinlet::updateSubNode(
|
||||
const QskSkinnable* skinnable, quint8 nodeRole, QSGNode* node ) const
|
||||
{
|
||||
const auto input = static_cast< const Q* >( skinnable );
|
||||
|
||||
switch ( nodeRole )
|
||||
{
|
||||
case PanelRole:
|
||||
{
|
||||
const auto input = static_cast< const QskTextInput* >( skinnable );
|
||||
if ( !input->hasPanel() )
|
||||
return nullptr;
|
||||
|
||||
return updateBoxNode( skinnable, node, QskTextInput::Panel );
|
||||
return updateBoxNode( skinnable, node, Q::Panel );
|
||||
}
|
||||
|
||||
case LeadingIconRole:
|
||||
{
|
||||
return updateSymbolNode( skinnable, node, Q::LeadingIcon );
|
||||
}
|
||||
|
||||
case LabelTextRole:
|
||||
{
|
||||
return updateTextNode( skinnable, node, input->labelText(), Q::LabelText );
|
||||
}
|
||||
|
||||
case HintTextRole:
|
||||
{
|
||||
return updateTextNode( skinnable, node, input->hintText(), Q::HintText );
|
||||
}
|
||||
|
||||
case SupportingTextRole:
|
||||
{
|
||||
return updateTextNode( skinnable, node, input->supportingText(), Q::SupportingText );
|
||||
}
|
||||
|
||||
case CharacterCountRole:
|
||||
{
|
||||
return updateTextNode( skinnable, node, maxLengthString( input ), Q::CharacterCount );
|
||||
}
|
||||
|
||||
case TrailingIconRippleRole:
|
||||
{
|
||||
return updateBoxNode( skinnable, node, Q::TrailingIconRipple );
|
||||
}
|
||||
|
||||
case TrailingIconRole:
|
||||
{
|
||||
return updateSymbolNode( skinnable, node, Q::TrailingIcon );
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -18,6 +18,13 @@ class QSK_EXPORT QskTextInputSkinlet : public QskSkinlet
|
|||
enum NodeRole
|
||||
{
|
||||
PanelRole,
|
||||
LeadingIconRole,
|
||||
LabelTextRole,
|
||||
HintTextRole,
|
||||
SupportingTextRole,
|
||||
TrailingIconRippleRole,
|
||||
TrailingIconRole,
|
||||
CharacterCountRole,
|
||||
RoleCount
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue