How to remove decoration tinting of selected items in item views?



  • Hello, all.

    By default, on Windows 10 for example, the selected items in item views - QListView, QTableView, QTreeView, etc., are tinted using a semitransparent colored overlay (light blue for instance):
    0_1543225970172_400eb185-0f52-434c-aedb-a4bf5e323051-image.png
    It is configurable using the following QSS *::item:selected { ... } but the problem is that whatever the QSS for this state the tinting of the decoration is left intact (see the white part of the image used for the decoration of the item):
    0_1543226358723_ea5c9baa-feda-47b1-ba7d-1d4e0192830e-image.png

    Is there an integrated way - some QSS statement, to remove or disable the decoration tinting? Presumably, the hard way is to tune some item delegates' painting?


  • Qt Champions 2018

    This is actually some magic that happens inside QIcon. can you show us how you are setting the image for the decoration?


  • Moderators

    @napajejenunedk0
    have you tried the show-decoration-selected property?

    QAbstractItemView {
        show-decoration-selected: 0;
    }
    


  • @raven-worx, setting it results in resizing the selection marquee to fit the contents horizontally:
    0_1543236217927_4557752e-2b10-4efc-8579-099cf3fbce1f-image.png
    Actually, the name of the QSS property looks promising and targeting exactly this - to remove the tinting of the decoration, but its documentation says exactly what it practically does:

    Controls whether selections in a QListView cover the entire row or just the extent of the text.

    If you have other ideas, they are welcome.


  • Moderators

    @napajejenunedk0 said in How to remove decoration tinting of selected items in item views?:

    but its documentation says exactly what it practically does:

    Controls whether selections in a QListView cover the entire row or just the extent of the text.

    that doesn't necessarily means the right side of the row. As the name lets one assume.

    Also the corresponding QStyle::SH_ItemView_ShowDecorationSelected doc says:

    When an item in an item view is selected, also highlight the branch or other decoration.

    Can you try to set your model and delegate to a QTreeView and check the results there?


  • Qt Champions 2018

    @napajejenunedk0 said in How to remove decoration tinting of selected items in item views?:

    If you have other ideas, they are welcome.

    Did you consider my question?



  • @VRonin, sorry, I thought I provided you with the source code. I haven't found a way to set the decoration through the QSS but only using the standard approach - to pass it from the model. Here is the complete code:

    QListView* const view = new QListView;
    QStandardItemModel* const model = new QStandardItemModel( this );
    model->appendColumn( {
                             new QStandardItem( QIcon( ":/icon.png" ), "Test 1" ),
                             new QStandardItem( QIcon( ":/icon.png" ), "Test 2" )
                         } );
    view->setModel( model );
    qApp->setStyleSheet( "QListView::item { outline: none; }"
                         "QListView::item:selected { background-color: black; color: white; } "
                         "QListView::item:hover:!selected { background-color: lightgray; color: white; }" );

  • Qt Champions 2018

    QIcon uniformIcon(const QString& path){
        const QPixmap basePixmap(path);
        QIcon result;
        for (auto state : {QIcon::Off, QIcon::On}){
            for (auto mode : {QIcon::Normal, QIcon::Disabled, QIcon::Active, QIcon::Selected})
                result.addPixmap(basePixmap, mode, state);
        }
        return result;
    }
    

    now replace

    new QStandardItem( QIcon( ":/icon.png" ), "Test 1" ),
    new QStandardItem( QIcon( ":/icon.png" ), "Test 2" )
    

    with

    new QStandardItem( uniformIcon(QStringLiteral(":/icon.png")), "Test 1" ),
    new QStandardItem( uniformIcon(QStringLiteral(":/icon.png")), "Test 2" )
    


  • @VRonin Nice. I was looking for something more integrated, so that to provide clear graphics of the icon all of the time, but obviously the clarity should be achieved in a more manual manner. Thanks. Actually, is there a QSS way to set the decoration?