CODEWITHSUNDEEP
xamlwin-universal-app
JAL
JAL

Reputation: 101

Simple XAML VisualStateManager

Good day,

I'm learning the basics of XAML and currently on the VisualSateManager topic.

I am trying to get a very simple code to work: To change the color and font size of the window when resized... However, it does not work. The "app" launches fine but resizing does not change anything.

Any assistance would be appreciated. Thank you in advance.

<Grid Name="ColorGrid" Background="Pink">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="VisualStateGroup">
                <VisualState x:Name="VisualStatePhone">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="0"/>
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="ColorGrid.Background" Value="Red"/>
                        <Setter Target="MessageTextBlock.Fontsize" Value="18"/>
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="VisualStateTablet">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="600"/>
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="ColorGrid.Background" Value="Yellow"/>
                        <Setter Target="MessageTextBlock.Fontsize" Value="40"/>
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="VisualStateDesktop">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="800"/>
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="ColorGrid.Background" Value="Blue"/>
                        <Setter Target="MessageTextBlock.Fontsize" Value="60"/>
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

        <TextBlock Name="MessageTextBlock" Text="Hello I am forgetting something"/>

    </Grid>

Upvotes: 1

Views: 33

Answers (1)

Petter Hesselberg
Petter Hesselberg

Reputation: 5498

Property names are case sensitive. Change these:

<Setter Target="MessageTextBlock.Fontsize" Value="60"/>

...to this (note FontSize rather than Fontsize):

<Setter Target="MessageTextBlock.FontSize" Value="60"/>

(There are three occurrences.)

The color changes worked for me just by copying your XAML, provided I just ran the program (Ctrl+F5). Starting the debugger (F5) resulted in a pink background.

Upvotes: 1

Related Questions