Focus ring around tree/table views?

[davecotter]

when i click into a text edit in my window (search box) i get a nice focus ring, indicating where the keyboard has focus:

this is exactly what i want.
but i ALSO want it when the user clicks in the tree or table view, surrounding the view. but no focus ring is shown.

note that the underlying QWidgets all have "strongFocus" as the focusPolicy, but that doesn't seem related. How can i get this lovely focus ring to appear around my other views?

[mpergand]

try:

treeView->setAttribute(Qt::WA_MacShowFocusRect);

[J.Hilk]

@davecotter
as far as I know, the MacShowFocusRect that @mpergand suggested only works on Mac.

So if you're looking for a more general approach, than take a look at the stylesheet example for a customized ListView

https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qlistview

QListView::item:selected is probably the selector you need

[davecotter]

@j-hilk said in Focus ring around tree/table views?:

QListView::item:selected

well i'm looking for a ring around the entire view, not around an item, like this:

Tree view has focus:

Table view has focus:

[J.Hilk]

@davecotter
well that makes it easier:

QTreeView:focus {
     border: 1px solid #6a6ea9;
}

[davecotter]

@j-hilk said in Focus ring around tree/table views?:

QTreeView:focus {
border: 1px solid #6a6ea9;
}

i took your suggestion but the "ring" is practically invisible. As you can see i'm setting it to 3 pixels but that doesn't change it's width for some reason?:

Search bar does it correctly:

No ring around treeview:

No ring around table view:

should i be using QFocusFrame ?

[davecotter]

tried this and got exactly nothing:

QFocusFrame *focus1P(new QFocusFrame(ui->sourcesList));
focus1P->setWidget(ui->sourcesList);
QFocusFrame *focus2P(new QFocusFrame(ui->tracksList));
focus2P->setWidget(ui->tracksList);

[mpergand]

It can't work because the border must be drawn above the widget.

As far as I know, it's only work on Mac with WA_MacShowFocusRect as I said earlier.

The possible solution would be to embed the view inside a QFrame with a 3 px margin.

The ultimate question should be : why do you want to implement a feature that is not standard except on Mac ?

[davecotter]

because it looks great, makes it clear where the focus is, and i want the EXACT SAME look on both mac and windows. also, my previous iteration of my app did it and the last thing i want to do is REMOVE FEATURES with an app rewrite, because that's the most horrible thing any dev can do to it's installed base

[J.Hilk]

@davecotter
you clearly did not write what I did, right? only 1 : not ::focus

#include <QApplication>
#include <QWidget>
#include <QTableWidget>
#include <QTreeWidget>
#include <QHBoxLayout>

int main(int argc, char *argv[])
{

    QApplication a(argc, argv);

    QWidget w;
    QHBoxLayout *layout = new QHBoxLayout(&w);

    QTreeWidget tr;
    tr.setStyleSheet("QTreeWidget:focus{border: 4px solid red;}");

    QTableWidget ta;
    ta.setStyleSheet("QTableWidget:focus{border: 4px solid red;}");

    layout->addWidget(&tr);
    layout->addWidget(&ta);

    w.resize(400,400);
    w.show();

    return  a.exec();
}

[mpergand]

@davecotter said in Focus ring around tree/table views?:

because it looks great, makes it clear where the focus is

It's your own opinion ...
Regular users on other systems could find this extra border annoying, or don't care at all.
Stay the standard way and every users of your apps will be happy ...

[davecotter]

@mpergand I appreciate your taking the time to answer, and in trying to guide me, however i'm not here for a critique of my UX, i'm here for technical details on how to accomplish a goal. My users have been seeing a focus ring for over ten years, and zero have told me they don't like it. I'm not going to change the UX, because people come to rely on visual indicators, and when you take them away is when users get upset.

In any case it seems that i must come up with a different approach. May i ask how the text edit focus ring is accomplished? Or is there sample code for QFocusFrame ? the doc is cryptic and my first attempt lead to nothing.

[davecotter]

@j-hilk well, it turns out not to have mattered. With 1 OR 2 colons, you get the same result, one pixel wide border, not the number of pixels you specify. Even your example, specifying 4px, it only shows a 1px border. but thanks for the test!

[J.Hilk]

@davecotter you're welcome 😉

strange I can confirm that, but the pixel size used to make a difference 🤔

[davecotter]

@mpergand said in Focus ring around tree/table views?:

treeView->setAttribute(Qt::WA_MacShowFocusRect);

note i tried this on the mac just to SEE it, and got exactly nothing. is there no way to accomplish this?

again i ask: how does the text edit control (on mac) do it? that looks great!

[Pl45m4]

@davecotter

Qt::WA_MacShowFocusRect will create a QFocusFrame around the specific widget. If setting that flag doesnt work for you, you could try to build a QFocusFrame directly.

https://doc.qt.io/archives/qt-4.8/qfocusframe.html

[mpergand]

@davecotter said in Focus ring around tree/table views?:

@mpergand said in Focus ring around tree/table views?:

treeView->setAttribute(Qt::WA_MacShowFocusRect);

note i tried this on the mac just to SEE it, and got exactly nothing. is there no way to accomplish this?

It works for me on MacOS 10.9, Qt 5.6
QFocusFrame doesn't work on Mac on the config above,
but works well on Linux (Ubuntu mate 18.04)

[davecotter]

i have tried to use Qt::WA_MacShowFocusRect on mac and see nothing. can you show a screen shot of what you see?

[mpergand]

@davecotter

edit=new QTextEdit;
edit->setAttribute(Qt::WA_MacShowFocusRect);
groupLayout->addWidget(edit);

[davecotter]

sorry, i wasn't talking about a text edit widget. that already works without my having to do anything.

i'm talking about putting a focus ring around a QTreeView and a QTableView.

and in that case it only shows the ring when the view has focus right? i don't have to manage that part myself, right?