listview in sample app has no border reveal

[touseefbsb]

in the sample app when I bring the pointer close to the listview it should show the reveal highlight on the borders, but it does not, however when I hover on the listviewitems, then I can see the reveal properly. However the issue does not exist when the theme is actually exported into a uwp app.

[kikisaints]

Hmm, it might be the version of the app or your build - did you recently update, or is this something that you’ve noticed for a while?

[touseefbsb]

just noticed it today, and I have the store version installed.

[kikisaints]

Oh! I think I know what you're experiencing. This is actually intended.

In the latest release (which you may have gotten recently) we changed listview to have a slightly different Reveal behavior than say, CommandBar does. Listview will now only show reveal when hovering over the items themselves, and will no longer have an "approach" behavior (seeing Reveal borders when near the list items).

We changed Reveal for lists because we were seeing 2px thick lines between items in a list (top, bottom) but the sides were 1px. Since Reveal was mostly 1px throughout the other controls, we decided to make sure that listview followed the 1px border rule rather than display mis-matched thicknesses. Thus we turned off the approach behavior.

NavigationView kept the thicker borders between items because of it's collapsed mode looking like CommandBar and we wanted to keep the visual consistency there - although that control is still an odd one 😄

[touseefbsb]

by changed the controls do u mean changed them in the sdk? and gridview still has the approach reveal borders, which makes it different from listview. I am sure you considered this possibility but if you put 2px vertical margins between list view items the 2px reveal border problem might go away, even 1 px margin between 2 item might work as well, I think this change was made in commandbar as well in april 2018 update and now all appabarbuttons have a 1px spacing between then by default.

[kikisaints]

We did consider adding space, like we did with the CommandBar, but then we ran the risk of introducing unexpected spacing behavior in ListViews - which are more widely used than CommandBars, and have a lot of custom content being displayed. Introducing extra padding could cause some layout issues for our developers.

In addition to that, we were also seeing weirdness with Reveal when different sized ListView items were parallel to each other.
For example, in the Mail app you have this arrangement:

Where two lists are very close to each other, but have different item heights. Prior to this update ListView's border Reveal would bleed over into both list item columns and create this odd disjointed look:

The resolution to that issue was to simply limit or restrict Reveal's border behavior to only the hovered item.

GridView we kept with approach because of Shell's tiles, and the fact that most often GridViews are used with pictures and therefore tend to have space between items.

[touseefbsb]

I see the problem. May I suggest an optional boolean property to turn on this approach reveal on listview? ( which will be off by default to avoid the problem) and only those developer can turn it on who do not encounter the parallel listview problem in their app, because it is a very fluent and nice to have feature.
something like <ListView ApproachBorderReveal='true'/>

[kikisaints]

Definitely! I can see the usefulness for that - would you mind going over to the WinUI Repo Issues page and logging this API suggestion as a feature request? Feel free to also link back to this issue in the comments for extra context.

[touseefbsb]

Done :)