How to use VisualState AdaptiveTrigger to change ListView Item FontSize

Question

I am using Visual State Adaptive Trigger to change page appearance depending on effective screen resolution. This works great, but I cannot get it to work for ListView Items

Answer 1

You will need to wrap your your template inside a UserControl for adaptive triggers to work; also the visual states should go inside the template as well, and make sure it's under the first direct child (i.e. Grid) of the UserControl. I see you have defined two visual state groups but really you just need one.

---

Update

Here is what I think a much more flexible solution. It needs some code to setup but the outcome is that you get clean, reusable and readable code.

The idea is to obtain a reference of the top level VisualStateGroup which is defined outside of the ListView, mostly at the Page level.

Then, create three VisualStates (i.e. Narrow, Normal & Wide) and attach them to a new VisualStateGroup which should belong to the first child of the UserControl.

Once we have referenced these two VisualStateGroups, we can monitor the top level one's CurrentStateChanged and update the state in the second one accordingly.

All the logic above can be wrapped by a Behavior from the UWP XAML Behavior nuget package.

Once the Behavior in place, you can define your inner states as easy as -

---

Working Demo

---

Feel free to check out a working sample here.