UWP Adaptive UI Code not working as expected
<p>I'm trying to resize an image and a FontSize of a textblock based on the window width. My code is as shown below:</p>

<pre><code>&lt;DataTemplate x:Name="TestItemTemplate" x:DataType="data:TestItem"&gt;
        &lt;Grid&gt;
            &lt;Grid.ColumnDefinitions&gt;
                &lt;ColumnDefinition Width="*" /&gt;
            &lt;/Grid.ColumnDefinitions&gt;
            &lt;Grid.RowDefinitions&gt;
                &lt;RowDefinition Height="*" /&gt;
            &lt;/Grid.RowDefinitions&gt;
            &lt;VisualStateManager.VisualStateGroups&gt;
                &lt;VisualStateGroup&gt;
                    &lt;VisualState x:Name="Default" &gt;
                        &lt;VisualState.StateTriggers&gt;
                            &lt;AdaptiveTrigger MinWindowWidth="340" /&gt;
                        &lt;/VisualState.StateTriggers&gt;
                        &lt;VisualState.Setters&gt;
                            &lt;Setter Target="ChannelImage.Height" Value="80" /&gt;
                            &lt;Setter Target="ChannelImage.Width" Value="80" /&gt;
                            &lt;Setter Target="CategoryTitle.FontSize" Value="16" /&gt;
                        &lt;/VisualState.Setters&gt;
                    &lt;/VisualState&gt;
                &lt;/VisualStateGroup&gt;
            &lt;/VisualStateManager.VisualStateGroups&gt;
            &lt;RelativePanel Margin="5,5,5,5"&gt;
                &lt;Image x:Name="ChannelImage" Source="{Binding assetName}" HorizontalAlignment="Center"/&gt;
                &lt;TextBlock Foreground="Black" FontSize="14" RelativePanel.Below="ChannelImage" RelativePanel.AlignHorizontalCenterWith="ChannelImage"
                           Typography.Capitals="AllSmallCaps" x:Name="CategoryTitle" Text="{Binding itemName}" HorizontalAlignment="Center"/&gt;
            &lt;/RelativePanel&gt;
        &lt;/Grid&gt;
&lt;/DataTemplate&gt;
</code></pre>

<p>Here's the problems I'm having.</p>

<ol>
<li>I've tried using different phone emulators with resolutions whose width is more than 340 but the resolution of ChannelImage simple doesn't scale to 80x80 epx.</li>
<li>I've also tried running the desktop version of the program. The image doesn't scale to 80x80 BUT as soon as I start resizing the window it gets way bigger than 80x80 and continues to grow as the window is widened further.</li>
</ol>

<p>I would really appreciate if someone could point out what I'm doing wrong.</p>