Listview with Multiple Columns Topic is solved

Are you writing your own components and need help with how to set them up or have questions about the components you are deriving from ? Ask them here.
Post Reply
burakkoray
In need of some credit
In need of some credit
Posts: 4
Joined: Tue Nov 02, 2021 1:46 am

Listview with Multiple Columns

Post by burakkoray »

Hey there,

I'm looking to create a list-like structure with multiple columns, let's say something like chess board where I can have 8x8 squares / items. However, instead of automatic wrapping when vertical / horizontal space not available, I want to manage my own rows / columns. Unfortunately, report view is not the answer I'm looking for as it does not allow traversing columns using left / right arrows.

With that said, I have a few questions:
  • Is there any control that would fit the bill with no / minimal modifications?
  • If not, which I believe is the case, what would be the best way to go about this?
So far, the only way I can think of is to extend wxListCtrl, and override its onPaint method to paint the rectangle the way I need. And then map squares to items and vice versa. Finally, capture arrow keys to handle left / right / up and down navigation to traverse the list and highlight mapped square on the screen.

Am I making this more complicated than it needs to be? So far this is the only way I can come up with.
User avatar
[email protected]
I live to help wx-kind
I live to help wx-kind
Posts: 154
Joined: Wed Jul 29, 2020 6:06 pm

Re: Listview with Multiple Columns

Post by [email protected] »

Check wxGrid. https://docs.wxwidgets.org/trunk/classwx_grid.html
It's very flexible, but unfortunately not very easy to use.

What content do you need to display in the cells and how many cells do you expect?
Maybe individual wxPanels inside a wxGridSizer might work for you.
https://docs.wxwidgets.org/trunk/classw ... sizer.html

(wxGrid and wxGridSizer are not technically related, they just have related names).
So far, the only way I can think of is to extend wxListCtrl, and override its onPaint method to paint the rectangle the way I need. And then map squares to items and vice versa. Finally, capture arrow keys to handle left / right / up and down navigation to traverse the list and highlight mapped square on the screen.
That won't work with wxListCtrl, as it's a native control at least under Windows (which means that you can't change its look with a custom paint event handler). The key arrow catching for navigation would be needed if you use the approach with separate panels in a wxGridSizer.
burakkoray
In need of some credit
In need of some credit
Posts: 4
Joined: Tue Nov 02, 2021 1:46 am

Re: Listview with Multiple Columns

Post by burakkoray »

Thank you so much for your swift response!
Check wxGrid. https://docs.wxwidgets.org/trunk/classwx_grid.html
It's very flexible, but unfortunately not very easy to use.
Unfortunately wxGrid will not help as I need to make it accessible to screen readers as well. Seems like it's not possible to explore a grid using those
What content do you need to display in the cells and how many cells do you expect?
Maybe individual wxPanels inside a wxGridSizer might work for you.
The main idea was to give screen reader users the ability to explore something like a 2d field or tabular data using arrow keys. The reason I resorted to lists / listbox was because they allowed vertical / horizontal navigation and supported reading labels out of the box. I am guessing I could either use wxGridSizer like you've mentioned or paint squares on panel but I feel like I'd be opening a can of worms with accessibility support in that case.

Before dropping the idea, one last question I have would be regarding hiding the list. Is it somehow possible to make it strictly off screen or invisible while getting keyboard focus? This would allow leveraging native accessibility support while keeping visual stuff sane on the foreground. I've tried hide followed by SetCanFocus(true) but it didn't work as expected.
User avatar
doublemax
Moderator
Moderator
Posts: 16586
Joined: Fri Apr 21, 2006 8:03 pm
Location: $FCE2

Re: Listview with Multiple Columns

Post by doublemax »

burakkoray wrote: Fri Nov 05, 2021 2:55 am Unfortunately wxGrid will not help as I need to make it accessible to screen readers as well. Seems like it's not possible to explore a grid using those
It might be possible to make it accessible using wxAccessible, but it's not documented well.

However as wxListCtrl is a wrapper aound a native control, it should support accessibility out of the box. So maybe you should try with a wxListCtrl in icon/text mode. Check the "listctrl" sample, switch to "icon view with text" and see how accessible it is using a screen reader.
burakkoray wrote: Fri Nov 05, 2021 2:55 amBefore dropping the idea, one last question I have would be regarding hiding the list. Is it somehow possible to make it strictly off screen or invisible while getting keyboard focus? This would allow leveraging native accessibility support while keeping visual stuff sane on the foreground.
I don't think that's possible.
Use the source, Luke!
burakkoray
In need of some credit
In need of some credit
Posts: 4
Joined: Tue Nov 02, 2021 1:46 am

Re: Listview with Multiple Columns

Post by burakkoray »

doublemax wrote: Fri Nov 05, 2021 9:04 am However as wxListCtrl is a wrapper aound a native control, it should support accessibility out of the box. So maybe you should try with a wxListCtrl in icon/text mode. Check the "listctrl" sample, switch to "icon view with text" and see how accessible it is using a screen reader.
It is quite accessible, though in that case it's restricted to 1d alone / 2d is out of my control.

Thank you so much for the help, I'll try to see what kind of hacks I can come up with.
burakkoray
In need of some credit
In need of some credit
Posts: 4
Joined: Tue Nov 02, 2021 1:46 am

Re: Listview with Multiple Columns

Post by burakkoray »

Creating the listbox with 0, 0 position and size, and not adding it to the panel's main sizer did the trick. I can now reach it using the keyboard but it's not visible anywhere on the screen, which should allow me to draw something else in place of it.

I imagine this may break on other platforms, is there any other downsides to this?

p.s marking your first post as answer since my use case is rather niche.
Post Reply