It looks as though the last layer added to the Maps operational layers will constrain the MapViews viewport. Is this a bug or working as intended?
If it is working as intended, how would you then set the extent of your viewport programmatically?
I've added a bit of code to show what I mean:
Similar questions have been asked here and here, however, neither of those questions have any answers.
Attached is some code to show what I mean
<SPAN class="keyword token">public</SPAN> <SPAN class="keyword token">partial</SPAN> <SPAN class="keyword token">class</SPAN> <SPAN class="token class-name">MainWindow</SPAN> <SPAN class="punctuation token">:</SPAN> Window
<SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">public</SPAN> <SPAN class="token function">MainWindow</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">{</SPAN>
<SPAN class="token function">InitializeComponent</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
spatialReference <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">SpatialReference</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="number token">3395</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
smallEnvelope <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Envelope</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="operator token">-</SPAN><SPAN class="number token">500</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="operator token">-</SPAN><SPAN class="number token">500</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">500</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">500</SPAN><SPAN class="punctuation token">,</SPAN> spatialReference<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
centerEnvelope <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Envelope</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="operator token">-</SPAN><SPAN class="number token">1</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="operator token">-</SPAN><SPAN class="number token">1</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">1</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">1</SPAN><SPAN class="punctuation token">,</SPAN> spatialReference<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
largeEnvelope <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Envelope</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="operator token">-</SPAN><SPAN class="number token">1000</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="operator token">-</SPAN><SPAN class="number token">1000</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">1000</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">1000</SPAN><SPAN class="punctuation token">,</SPAN> spatialReference<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
Loaded <SPAN class="operator token">+</SPAN><SPAN class="operator token">=</SPAN> MainWindow_Loaded<SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>
<SPAN class="keyword token">private</SPAN> <SPAN class="keyword token">readonly</SPAN> SpatialReference spatialReference<SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">private</SPAN> <SPAN class="keyword token">readonly</SPAN> Envelope centerEnvelope<SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">private</SPAN> <SPAN class="keyword token">readonly</SPAN> Envelope smallEnvelope<SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">private</SPAN> <SPAN class="keyword token">readonly</SPAN> Envelope largeEnvelope<SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">private</SPAN> <SPAN class="keyword token">async</SPAN> <SPAN class="keyword token">void</SPAN> <SPAN class="token function">MainWindow_Loaded</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">object</SPAN> sender<SPAN class="punctuation token">,</SPAN> RoutedEventArgs e<SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">var</SPAN> leftFirst <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">await</SPAN> <SPAN class="token function">CreateLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"large"</SPAN><SPAN class="punctuation token">,</SPAN> largeEnvelope<SPAN class="punctuation token">,</SPAN> SimpleMarkerSymbolStyle<SPAN class="punctuation token">.</SPAN>Circle<SPAN class="punctuation token">,</SPAN> Colors<SPAN class="punctuation token">.</SPAN>Maroon<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> leftCenter <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">await</SPAN> <SPAN class="token function">CreateLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"center"</SPAN><SPAN class="punctuation token">,</SPAN> centerEnvelope<SPAN class="punctuation token">,</SPAN> SimpleMarkerSymbolStyle<SPAN class="punctuation token">.</SPAN>X<SPAN class="punctuation token">,</SPAN> Colors<SPAN class="punctuation token">.</SPAN>BlueViolet<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> leftLast <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">await</SPAN> <SPAN class="token function">CreateLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"small"</SPAN><SPAN class="punctuation token">,</SPAN> smallEnvelope<SPAN class="punctuation token">,</SPAN> SimpleMarkerSymbolStyle<SPAN class="punctuation token">.</SPAN>Cross<SPAN class="punctuation token">,</SPAN> Colors<SPAN class="punctuation token">.</SPAN>HotPink<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="comment token">// Set up the left map</SPAN>
<SPAN class="token function">InitializeMapView</SPAN><SPAN class="punctuation token">(</SPAN>mv_LeftMap<SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">List</SPAN><SPAN class="operator token"><</SPAN>Layer<SPAN class="operator token">></SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> leftFirst<SPAN class="punctuation token">,</SPAN> leftCenter<SPAN class="punctuation token">,</SPAN> leftLast <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="comment token">// Reverse the order they're added</SPAN>
<SPAN class="keyword token">var</SPAN> rightFirst <SPAN class="operator token">=</SPAN> leftLast<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Clone</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> rightCenter <SPAN class="operator token">=</SPAN> leftCenter<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Clone</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> rightLast <SPAN class="operator token">=</SPAN> leftFirst<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Clone</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="comment token">// Set up the right map</SPAN>
<SPAN class="token function">InitializeMapView</SPAN><SPAN class="punctuation token">(</SPAN>mv_RightMap<SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">List</SPAN><SPAN class="operator token"><</SPAN>Layer<SPAN class="operator token">></SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> rightFirst<SPAN class="punctuation token">,</SPAN> rightCenter<SPAN class="punctuation token">,</SPAN> rightLast <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>
<SPAN class="keyword token">private</SPAN> <SPAN class="keyword token">void</SPAN> <SPAN class="token function">InitializeMapView</SPAN><SPAN class="punctuation token">(</SPAN>MapView view<SPAN class="punctuation token">,</SPAN> List<SPAN class="operator token"><</SPAN>Layer<SPAN class="operator token">></SPAN> layers<SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">var</SPAN> map <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Map</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">{</SPAN>
Basemap <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Basemap</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">,</SPAN>
MinScale <SPAN class="operator token">=</SPAN> <SPAN class="number token">5000000</SPAN><SPAN class="punctuation token">,</SPAN>
MaxScale <SPAN class="operator token">=</SPAN> <SPAN class="number token">0</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">foreach</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">var</SPAN> layer <SPAN class="keyword token">in</SPAN> layers<SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">{</SPAN>
map<SPAN class="punctuation token">.</SPAN>OperationalLayers<SPAN class="punctuation token">.</SPAN><SPAN class="token function">Add</SPAN><SPAN class="punctuation token">(</SPAN>layer<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>
view<SPAN class="punctuation token">.</SPAN>Map <SPAN class="operator token">=</SPAN> map<SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>
<SPAN class="keyword token">private</SPAN> <SPAN class="keyword token">async</SPAN> Task<SPAN class="operator token"><</SPAN>Layer<SPAN class="operator token">></SPAN> <SPAN class="token function">CreateLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">string</SPAN> layerName<SPAN class="punctuation token">,</SPAN> Envelope envelope<SPAN class="punctuation token">,</SPAN> SimpleMarkerSymbolStyle style<SPAN class="punctuation token">,</SPAN> Color color<SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">var</SPAN> fields <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">List</SPAN><SPAN class="operator token"><</SPAN>Field<SPAN class="operator token">></SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> featureCollectionTable <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">FeatureCollectionTable</SPAN><SPAN class="punctuation token">(</SPAN>fields<SPAN class="punctuation token">,</SPAN> GeometryType<SPAN class="punctuation token">.</SPAN>Point<SPAN class="punctuation token">,</SPAN> envelope<SPAN class="punctuation token">.</SPAN>SpatialReference<SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">{</SPAN>
Renderer <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">SimpleRenderer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">SimpleMarkerSymbol</SPAN><SPAN class="punctuation token">(</SPAN>style<SPAN class="punctuation token">,</SPAN> color<SPAN class="punctuation token">,</SPAN> <SPAN class="number token">50</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> topLeft <SPAN class="operator token">=</SPAN> featureCollectionTable<SPAN class="punctuation token">.</SPAN><SPAN class="token function">CreateFeature</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> topRight <SPAN class="operator token">=</SPAN> featureCollectionTable<SPAN class="punctuation token">.</SPAN><SPAN class="token function">CreateFeature</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> bottomLeft <SPAN class="operator token">=</SPAN> featureCollectionTable<SPAN class="punctuation token">.</SPAN><SPAN class="token function">CreateFeature</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> bottomRight <SPAN class="operator token">=</SPAN> featureCollectionTable<SPAN class="punctuation token">.</SPAN><SPAN class="token function">CreateFeature</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
topLeft<SPAN class="punctuation token">.</SPAN>Geometry <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">MapPoint</SPAN><SPAN class="punctuation token">(</SPAN>envelope<SPAN class="punctuation token">.</SPAN>XMin<SPAN class="punctuation token">,</SPAN> envelope<SPAN class="punctuation token">.</SPAN>YMax<SPAN class="punctuation token">,</SPAN> spatialReference<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
topRight<SPAN class="punctuation token">.</SPAN>Geometry <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">MapPoint</SPAN><SPAN class="punctuation token">(</SPAN>envelope<SPAN class="punctuation token">.</SPAN>XMax<SPAN class="punctuation token">,</SPAN> envelope<SPAN class="punctuation token">.</SPAN>YMax<SPAN class="punctuation token">,</SPAN> spatialReference<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
bottomLeft<SPAN class="punctuation token">.</SPAN>Geometry <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">MapPoint</SPAN><SPAN class="punctuation token">(</SPAN>envelope<SPAN class="punctuation token">.</SPAN>XMin<SPAN class="punctuation token">,</SPAN> envelope<SPAN class="punctuation token">.</SPAN>YMin<SPAN class="punctuation token">,</SPAN> spatialReference<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
bottomRight<SPAN class="punctuation token">.</SPAN>Geometry <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">MapPoint</SPAN><SPAN class="punctuation token">(</SPAN>envelope<SPAN class="punctuation token">.</SPAN>XMax<SPAN class="punctuation token">,</SPAN> envelope<SPAN class="punctuation token">.</SPAN>YMin<SPAN class="punctuation token">,</SPAN> spatialReference<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">await</SPAN> featureCollectionTable<SPAN class="punctuation token">.</SPAN><SPAN class="token function">AddFeaturesAsync</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">new</SPAN><SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">]</SPAN> <SPAN class="punctuation token">{</SPAN> topLeft<SPAN class="punctuation token">,</SPAN> topRight<SPAN class="punctuation token">,</SPAN> bottomLeft<SPAN class="punctuation token">,</SPAN> bottomRight <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> featureCollection <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">FeatureCollection</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">new</SPAN><SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">]</SPAN> <SPAN class="punctuation token">{</SPAN> featureCollectionTable <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> featureCollectionLayer <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">FeatureCollectionLayer</SPAN><SPAN class="punctuation token">(</SPAN>featureCollection<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">return</SPAN> featureCollectionLayer<SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>Grid</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
<Grid.RowDefinitions>
<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>RowDefinition</SPAN> <SPAN class="punctuation token">/></SPAN></SPAN>
<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>RowDefinition</SPAN> <SPAN class="attr-name token">Height</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>Auto<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="punctuation token">/></SPAN></SPAN>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>ColumnDefinition</SPAN> <SPAN class="punctuation token">/></SPAN></SPAN>
<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>ColumnDefinition</SPAN> <SPAN class="punctuation token">/></SPAN></SPAN>
</Grid.ColumnDefinitions>
<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN><SPAN class="namespace token">esri:</SPAN>MapView</SPAN> <SPAN class="attr-name token"><SPAN class="namespace token">x:</SPAN>Name</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>mv_LeftMap<SPAN class="punctuation token">"</SPAN></SPAN>
<SPAN class="attr-name token">Grid.Column</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>0<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="punctuation token">/></SPAN></SPAN>
<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN><SPAN class="namespace token">esri:</SPAN>MapView</SPAN> <SPAN class="attr-name token"><SPAN class="namespace token">x:</SPAN>Name</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>mv_RightMap<SPAN class="punctuation token">"</SPAN></SPAN>
<SPAN class="attr-name token">Grid.Column</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>1<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="punctuation token">/></SPAN></SPAN>
<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>TextBlock</SPAN> <SPAN class="attr-name token">Text</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>Larger viewport<SPAN class="punctuation token">"</SPAN></SPAN>
<SPAN class="attr-name token">Grid.Row</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>1<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="punctuation token">/></SPAN></SPAN>
<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>TextBlock</SPAN> <SPAN class="attr-name token">Text</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>Smaller viewport<SPAN class="punctuation token">"</SPAN></SPAN>
<SPAN class="attr-name token">Grid.Row</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>1<SPAN class="punctuation token">"</SPAN></SPAN>
<SPAN class="attr-name token">Grid.Column</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>1<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="punctuation token">/></SPAN></SPAN>
<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>Grid</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>