# XAML Markup Improvements

I have a Windows Store and Windows Phone app, and in this app I have many pages like this:

<Grid Background="Transparent">
<ScrollViewer Style="{StaticResource DataPage}">
<StackPanel>
<TextBlock>
Some text here:
<LineBreak/>
</TextBlock>
<Viewbox MaxHeight="112">
<Border BorderBrush="Black" BorderThickness="1">
<Image Source="MyImage.png"/>
</Border>
</Viewbox>
</StackPanel>
</ScrollViewer>
</Grid>


These pages are loaded into a Frame to be displayed when needed. Now, however, I have many pages, and I was wondering if there is a better way to do this. I have been doing it like this so far because easy to make the page content dynamically reload to fit the screen/app size the best with VisualStates and because it is easy to use XAML markup to style my text, image borders (not always there), and layout perfectly, and any solution provided must support everything this does and work in both Windows Store and Phone apps.

DataFrame.Navigate(Data.Pages[Items.SelectedIndex]);


DataFrame is the Frame, obviously; Data.Pages is an ObservableCollection<Type> in my ViewModel (Data is an instance of the VM class); Items is the ListBox that contains the selectable options.

This image shows the context of what I am doing, with the content in one of these pages outlined in black:

            <Border BorderBrush="Black" BorderThickness="1">