08. Use StateTrigger to modify the global topic style and set statetrigger to global through custom dependency attributes.

08. Use StateTrigger to modify the global topic style and set statetrigger to global through custom dependency attributes.

 

In the UWP of Win 10, you need to use StateTrigger In The xaml to modify the global style of the text, Background, painter, and other dependency attributes. The following describes the font size and other dependency attributes.

 

 

1. First, add a subclass inherited from DependencyObject in the project, and add a Font_Size dependency attribute as the font size of the globally referenced Resource:

 

2. Add the resource in the App. xaml file. The Resource Key is HeaderSize:

 

 

3. Use TextBlcok to reference the resource in MainPage elsewhere:

As a control that can modify the font size in App. xaml, its Binding Mode is set to TwoWay:

 

 

Add StateTrigger on the page to modify the font size when the window width changes:

 

4. Use the HeaderSize resource elsewhere on the page to bind its Font_Size attribute:

 

5. When the window width changes, the font size of all referenced App. xaml resources changes with the window:

 

1) when the window width is greater than PX, the font size is Px:

 

 

2) When the window is 548px-> 1024px, the font is 60px:

 

 

3) when the window is smaller than 548px, the font is 20px:

 

Download demo: link