Custom Stretching with Nine-Grid

For Windows Store and universal apps, Image has a nifty built-in nine-grid feature that enables you to use a single image as a flexible border by customizing how it stretches. (It’s also hardware accelerated for great performance.) Without this support, you’d need to use up to nine separate images to create the same effect.

Figure 11.1 demonstrates the regular image-stretching behavior using the following Grid that contains the same image unstretched on the left versus stretched (and therefore pixelated) on the right:

<Page ...>  <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">    <Grid.ColumnDefinitions>      <ColumnDefinition Width="Auto"/>      <ColumnDefinition ...

Get XAML Unleashed now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.