I'm trying to make my scrollviewer zoom work. Without ZoomMaxFactor and ZoomMinFactor it is working great, but no limits for zoom.
So i added the properties ZoomMaxMinFactor and my image are resizing without any interaction, i already looked for an answer but got nothing.
My XAML:
<PivotItem Header="item 1" >
<StackPanel x:Name="MyPanel" Width="360" Height="460">
<ScrollViewer Width="360" Height="460" ZoomMode="Enabled"
VerticalScrollBarVisibility="Visible"
HorizontalScrollBarVisibility="Visible"
MaxZoomFactor="0.5" MinZoomFactor="0.5">
<Image x:Name="MyCoolImg"/>
</ScrollViewer>
</StackPanel>
</PivotItem>
And code behind:
protected async override void OnNavigatedTo(NavigationEventArgs e)
{
MyCoolImg.Source = (BitmapImage)e.Parameter;
}
Thanks for your time =)
I got it,
New XAML:
<PivotItem Header="item1" >
<Grid Grid.Row="1">
<ScrollViewer Width="360" Height="470" HorizontalAlignment="Left" VerticalAlignment="Top" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" ZoomMode="Enabled" MinZoomFactor="0.9" MaxZoomFactor="2.8">
<StackPanel>
<Image Width="360" Height="470" x:Name="myCoolImg" Stretch="Uniform" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</StackPanel>
</ScrollViewer>
</Grid>
</PivotItem>
Thanks for the help Kennyzx!
Related
I'm trying to add vertical scrolling to my GridView / AdaptiveGridView, but no success so far(Horizontal scrolling works).
I have already attempted with internal scrollviewer with the "ScrollViewer.---" in the GridView without luck.
I have also tried to place a ScrollViewer outside of the GridView without luck.
XAML
<ScrollViewer
HorizontalScrollBarVisibility="Disabled"
HorizontalScrollMode="Disabled"
VerticalScrollBarVisibility="Auto"
VerticalScrollMode="Auto">
<Grid Name="ChangeMe">
<controls:AdaptiveGridView
Name="MyPolls"
Margin="0,10,0,0"
DesiredWidth="320"
IsItemClickEnabled="True"
ItemClick="MyPolls_ItemClick"
ItemHeight="180"
ItemsSource="{x:Bind oc}"
SizeChanged="MyPolls_SizeChanged">
<controls:AdaptiveGridView.ItemTemplate>
<DataTemplate x:DataType="local:Poll">
<Grid ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollMode="Auto">
<Image Source="../Assets/Square44x44Logo.png" Stretch="UniformToFill" />
<StackPanel
Height="60"
Padding="12"
VerticalAlignment="Bottom"
Background="{ThemeResource SystemBaseLowColor}"
Orientation="Horizontal">
<StackPanel>
<TextBlock Text="{x:Bind poll_title}" />
<TextBlock
Foreground="{ThemeResource SystemControlPageTextBaseMediumBrush}"
Style="{ThemeResource CaptionTextBlockStyle}"
Text="{Binding poll_description}" />
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</controls:AdaptiveGridView.ItemTemplate>
</controls:AdaptiveGridView>
</Grid>
</ScrollViewer>
Code Behind
private void MyPolls_SizeChanged(object sender, Windows.UI.Xaml.SizeChangedEventArgs e)
{
ChangeMe.Height = MyPolls.Height;
ChangeMe.Width = MyPolls.Width;
}
Does anyone know a way to enable vertical scrolling for a GridView / AdaptiveGridView for when the gridview items go out of frame so you can scroll down and see them? (AdaptiveGridView inherits from GridView)
I am developing a WPF application that allows to connect two peers in a video chat. I have been designed the UI in the XAML designer for the last two months and everything went fine, when I ran the application it did show everything etc. Until yesterday, for absolutely no apparent reason.
Some part of the UI just does not show up anymore WHEN the code is running on another laptop. I insist on the fact that it did work before and now not anymore. I also did not change anything in the code that could have anything to do with that part of the UI, nor in the xaml.
I did check that I never mess up with any Visibility parameter in the code-behind as well, so I don't see any reason why the behavior of the application suddenly changed.
Does anyone have an idea why this would happen?
Here is the xaml:
<Window x:Class="RealSenseiConfFusion.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="1000" Width="1500"
WindowStartupLocation="Manual"
Left="0" Top="0"
Closing="Window_Closing"
Loaded="Window_Loaded" >
<Grid Background="LightSteelBlue">
<Rectangle Margin="10,10,498.6,0" Name="rectangle1" Stroke="Black" RadiusX="9" RadiusY="9" Fill="LightSlateGray" Height="142" VerticalAlignment="Top" />
<Grid Name="callAndSyncGrid" Margin="26,24,1165,835" Background="LightGray">
<StackPanel>
<TextBlock HorizontalAlignment="Center">ABOUT CALL</TextBlock>
<TextBlock Name="myIpTextBlock">Your ip is:</TextBlock>
<Grid Name="callGrid">
<TextBox Height="23" HorizontalAlignment="Left" Name="txtIP" Background="GhostWhite" Foreground="Black" Width="221" />
<Button Height="23" HorizontalAlignment="Right" Name="btnCall" Width="75" Click="btnCall_Click">Call</Button>
</Grid>
<Button Name="btnSync" Content="Start Synchronization" HorizontalAlignment="Left" Width="120" Height="25" Click="btnSynchronize_Click"/>
<TextBlock Name="currentConvText"></TextBlock>
</StackPanel>
</Grid>
<Grid Name="visSetupGrid" Margin="650,24,515,835" Background="LightGray">
<StackPanel>
<TextBlock HorizontalAlignment="Center">VISUALIZATION SETUP</TextBlock>
<Grid>
<TextBlock HorizontalAlignment="Left"> Visualization block 1:</TextBlock>
<ComboBox Name="vis1Combo" HorizontalAlignment="Right">
<ComboBoxItem IsSelected="True">Vis1UC1</ComboBoxItem>
<ComboBoxItem>Vis1UC1_2</ComboBoxItem>
<ComboBoxItem>Vis1UC2</ComboBoxItem>
<ComboBoxItem>Vis1UC2_2</ComboBoxItem>
<ComboBoxItem>Vis2UC1</ComboBoxItem>
<ComboBoxItem>Vis2UC2</ComboBoxItem>
<ComboBoxItem>Vis2UC3</ComboBoxItem>
<ComboBoxItem>Vis3UC1</ComboBoxItem>
<ComboBoxItem>Vis3UC2</ComboBoxItem>
<ComboBoxItem>Vis3UC3</ComboBoxItem>
</ComboBox>
</Grid>
<Grid>
<TextBlock HorizontalAlignment="Left"> Visualization block 2:</TextBlock>
<ComboBox Name="vis2Combo" HorizontalAlignment="Right">
<ComboBoxItem>Vis1UC1</ComboBoxItem>
<ComboBoxItem>Vis1UC1_2</ComboBoxItem>
<ComboBoxItem>Vis1UC2</ComboBoxItem>
<ComboBoxItem>Vis1UC2_2</ComboBoxItem>
<ComboBoxItem>Vis2UC1</ComboBoxItem>
<ComboBoxItem IsSelected="True">Vis2UC2</ComboBoxItem>
<ComboBoxItem>Vis2UC3</ComboBoxItem>
<ComboBoxItem>Vis3UC1</ComboBoxItem>
<ComboBoxItem>Vis3UC2</ComboBoxItem>
<ComboBoxItem>Vis3UC3</ComboBoxItem>
</ComboBox>
</Grid>
<Grid>
<TextBlock HorizontalAlignment="Left"> Visualization block 3:</TextBlock>
<ComboBox Name="vis3Combo" HorizontalAlignment="Right">
<ComboBoxItem>Vis1UC1</ComboBoxItem>
<ComboBoxItem>Vis1UC1_2</ComboBoxItem>
<ComboBoxItem IsSelected="True">Vis1UC2</ComboBoxItem>
<ComboBoxItem>Vis1UC2_2</ComboBoxItem>
<ComboBoxItem>Vis2UC1</ComboBoxItem>
<ComboBoxItem>Vis2UC2</ComboBoxItem>
<ComboBoxItem>Vis2UC3</ComboBoxItem>
<ComboBoxItem>Vis3UC1</ComboBoxItem>
<ComboBoxItem>Vis3UC2</ComboBoxItem>
<ComboBoxItem>Vis3UC3</ComboBoxItem>
</ComboBox>
</Grid>
<Button Name="btnVisApply" HorizontalAlignment="Center" Click="btnVisApply_Click">Apply!</Button>
</StackPanel>
</Grid>
<Grid Name="otherPeerVideo" HorizontalAlignment="Left" VerticalAlignment="Top" Width="1000" Height="700" Margin="0,83,0,0">
<Grid Width="960" Height="540">
<Border BorderBrush="DarkOrange" BorderThickness="4">
<WindowsFormsHost Name="wfServer"/>
</Border>
</Grid>
</Grid>
<StackPanel Name="feedbackAndMyVideoStackPanel" Background="WhiteSmoke" Margin="1000,83,0,0" VerticalAlignment="Top" Width="454" Height="800">
<Grid Name="vis1Grid" Height="160"></Grid>
<Grid Name="vis2Grid" Height="160"></Grid>
<Grid Name="vis3Grid" Height="160"></Grid>
<Grid Name="myVideoGrid" VerticalAlignment="Bottom" Height="320">
<Grid HorizontalAlignment="Left" VerticalAlignment="Bottom" Width="454" Height="300">
<Border BorderBrush="Blue" BorderThickness="4">
<WindowsFormsHost Name="myVideo" VerticalAlignment="Bottom" HorizontalAlignment="Left" Width="446" Height="292"/>
</Border>
</Grid>
<Button Name="myVideoHideButton" Click="myVideoHideButton_Click" HorizontalAlignment="Right" VerticalAlignment="Top" Width="80" Height="20">Hide/Unhide</Button>
</Grid>
</StackPanel>
</Grid>
Here is a screenshot of how it looks like in the designer (on both machines):
Here is a screenshot of how it looks like when the application is running on my machine:
And here a screenshot of how it looks like when the application is running on the laptop:
I compiled/tried your code.
When the window gets small, many components disappear.
Because of the margins.
Example of margins replacement
Before :
With margins for placement
<Grid Name="callAndSyncGrid" Margin="26,24,1165,835" Background="LightGray">
<!-- ... -->
</Grid>
<Grid Name="visSetupGrid" Margin="650,24,515,835" Background="LightGray">
<!-- ... -->
</Grid>
After
With margins for "breathing"
Placement is made with two columns (ColumnDefinitions and Grid.Column="1"; 0 by default).
Here each Column takes 50 % (50*) of the available room.
You can also express the size as "Auto" or 323 (hardcoded size)
<Grid Name="parentGridForLayout" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50*"/>
<ColumnDefinition Width="50*"/>
</Grid.ColumnDefinitions>
<Grid Name="callAndSyncGrid" Margin="10" Background="LightGray">
<!-- ... -->
</Grid>
<Grid Name="visSetupGrid" Margin="10" Background="LightGray">
<!-- ... -->
</Grid>
</Grid>
Advice
Using Grid+margin or Canvas are pretty close approaches. But with Grid you can create Columns and Rows to organize layout. And you can compose Grids(or other Panels like StackPanels, DockPanels, WrapPanels) into Grids for organizing the layout.
Disclaimer :
My piece of code alone is not enough.
You need to organize all your GUI, with many panels.
I would recreate the window from scratch : empty page, then put a first Grid (or any suitable Panel), split it with columns or rows. Then put some content imported from previous window at the grid level then go in the children grid to put some more grids/imported content
Regards
As #HighCore and #Emmanuel DURIN pointed out, the problem was that I defined the layout with Margins, which can lead to big trouble if I run the application on different screen sizes.
To correct this, I used Canvas'es in order to place every element with respect to their containers.
Now I can use the application on different screens and everything gets displayed as I want it.
Here the better layouted UI for reference:
<Window x:Class="RealSenseiConfFusion.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="860" Width="1500"
WindowStartupLocation="Manual"
Left="0" Top="0"
Closing="Window_Closing"
Loaded="Window_Loaded" >
<Grid Background="LightSteelBlue">
<Canvas>
<Canvas Canvas.Top="10" Canvas.Left="10" Width="980" Height="142">
<Rectangle Width="980" Height="132" Name="rectangle1" Stroke="Black" RadiusX="9" RadiusY="9" Fill="LightSlateGray" VerticalAlignment="Top" />
<Grid Name="callAndSyncGrid" Canvas.Top="15" Canvas.Left="15" Width="200" Background="LightGray">
<StackPanel>
<TextBlock HorizontalAlignment="Center">ABOUT CALL</TextBlock>
<TextBlock Name="myIpTextBlock">Your ip is:</TextBlock>
<Grid Name="callGrid">
<TextBox Height="23" HorizontalAlignment="Left" Name="txtIP" Background="GhostWhite" Foreground="Black" Width="221" />
<Button Height="23" HorizontalAlignment="Right" Name="btnCall" Width="75" Click="btnCall_Click">Call</Button>
</Grid>
<Button Name="btnSync" Content="Start Synchronization" HorizontalAlignment="Left" Width="120" Height="25" Click="btnSynchronize_Click"/>
<TextBlock Name="currentConvText"></TextBlock>
</StackPanel>
</Grid>
<Grid Name="visSetupGrid" Canvas.Top="15" Canvas.Right="15" Width="200" Background="LightGray">
<StackPanel>
<TextBlock HorizontalAlignment="Center">VISUALIZATION SETUP</TextBlock>
<Grid>
<TextBlock HorizontalAlignment="Left"> Visualization block 1:</TextBlock>
<ComboBox Name="vis1Combo" HorizontalAlignment="Right">
<ComboBoxItem IsSelected="True">Vis1UC1</ComboBoxItem>
<ComboBoxItem>Vis1UC1_2</ComboBoxItem>
<ComboBoxItem>Vis1UC2</ComboBoxItem>
<ComboBoxItem>Vis1UC2_2</ComboBoxItem>
<ComboBoxItem>Vis2UC1</ComboBoxItem>
<ComboBoxItem>Vis2UC2</ComboBoxItem>
<ComboBoxItem>Vis2UC3</ComboBoxItem>
<ComboBoxItem>Vis3UC1</ComboBoxItem>
<ComboBoxItem>Vis3UC2</ComboBoxItem>
<ComboBoxItem>Vis3UC3</ComboBoxItem>
</ComboBox>
</Grid>
<Grid>
<TextBlock HorizontalAlignment="Left"> Visualization block 2:</TextBlock>
<ComboBox Name="vis2Combo" HorizontalAlignment="Right">
<ComboBoxItem>Vis1UC1</ComboBoxItem>
<ComboBoxItem>Vis1UC1_2</ComboBoxItem>
<ComboBoxItem>Vis1UC2</ComboBoxItem>
<ComboBoxItem>Vis1UC2_2</ComboBoxItem>
<ComboBoxItem>Vis2UC1</ComboBoxItem>
<ComboBoxItem IsSelected="True">Vis2UC2</ComboBoxItem>
<ComboBoxItem>Vis2UC3</ComboBoxItem>
<ComboBoxItem>Vis3UC1</ComboBoxItem>
<ComboBoxItem>Vis3UC2</ComboBoxItem>
<ComboBoxItem>Vis3UC3</ComboBoxItem>
</ComboBox>
</Grid>
<Grid>
<TextBlock HorizontalAlignment="Left"> Visualization block 3:</TextBlock>
<ComboBox Name="vis3Combo" HorizontalAlignment="Right">
<ComboBoxItem>Vis1UC1</ComboBoxItem>
<ComboBoxItem>Vis1UC1_2</ComboBoxItem>
<ComboBoxItem IsSelected="True">Vis1UC2</ComboBoxItem>
<ComboBoxItem>Vis1UC2_2</ComboBoxItem>
<ComboBoxItem>Vis2UC1</ComboBoxItem>
<ComboBoxItem>Vis2UC2</ComboBoxItem>
<ComboBoxItem>Vis2UC3</ComboBoxItem>
<ComboBoxItem>Vis3UC1</ComboBoxItem>
<ComboBoxItem>Vis3UC2</ComboBoxItem>
<ComboBoxItem>Vis3UC3</ComboBoxItem>
</ComboBox>
</Grid>
<Button Name="btnVisApply" HorizontalAlignment="Center" Click="btnVisApply_Click">Apply!</Button>
</StackPanel>
</Grid>
</Canvas>
<Grid Name="otherPeerVideo" HorizontalAlignment="Left" Canvas.Top="150" Canvas.Left="20">
<Grid Width="960" Height="540">
<Border BorderBrush="DarkOrange" BorderThickness="4">
<WindowsFormsHost Name="wfServer"/>
</Border>
</Grid>
</Grid>
<StackPanel Name="feedbackAndMyVideoStackPanel" Background="WhiteSmoke" Canvas.Right="15" Canvas.Top="15" VerticalAlignment="Top" Width="454" Height="800">
<Grid Name="vis1Grid" Height="160"></Grid>
<Grid Name="vis2Grid" Height="160"></Grid>
<Grid Name="vis3Grid" Height="160"></Grid>
<Grid Name="myVideoGrid" VerticalAlignment="Bottom" Height="320">
<Grid HorizontalAlignment="Left" VerticalAlignment="Bottom" Width="454" Height="300">
<Border BorderBrush="Blue" BorderThickness="4">
<WindowsFormsHost Name="myVideo" VerticalAlignment="Bottom" HorizontalAlignment="Left" Width="446" Height="292"/>
</Border>
</Grid>
<Button Name="myVideoHideButton" Click="myVideoHideButton_Click" HorizontalAlignment="Right" VerticalAlignment="Top" Width="80" Height="20">Hide/Unhide</Button>
</Grid>
</StackPanel>
</Canvas>
</Grid>
I would like to ceate a text block inside a scroll view. I want the scroll view to be automatic on every device and every screen size. But for the moment, I am forced to fix an height, in pixels. Otherwise, the scroll view will adapt to the text size... Without doing its scrolling job.
How to do this properly?
Thanks!
EDIT: here is my XAML:
<Grid>
<StackPanel Orientation="Vertical" Margin="10,10,10,10">
<ProgressBar x:Name="progressBar" IsIndeterminate="True" IsEnabled="True" />
<TextBlock x:Name="titleBlock" Text="" VerticalAlignment="Top" FontSize="48"/>
<TextBlock x:Name="subtitleBlock" Text="" TextWrapping="Wrap" FontSize="24" FontStyle="Italic"/>
<TextBlock x:Name="dateBlock" TextWrapping="Wrap" Text="" FontSize="24"/>
<ScrollViewer VerticalAlignment="Top" Height="370" VerticalScrollBarVisibility="Visible" Margin="0,15,0,0" VerticalScrollMode="Enabled" AllowDrop="False" BringIntoViewOnFocusChange="True" HorizontalScrollMode="Disabled" IsHoldingEnabled="True" >
<Grid>
<TextBlock x:Name="descriptionBlock" TextWrapping="Wrap" Text="" FontSize="14.667"/>
</Grid>
</ScrollViewer>
<Button x:Name="buttonViewFlyer" Click="buttonViewFlyer_Click" Content="Voir le flyer" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="5,5,5,0"/>
<Button x:Name="buttonViewFacebookPage" Click="buttonViewFacebookPage_Click" Content="Page Facebook de l'évènement" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="5,0,5,5"/>
</StackPanel>
</Grid>
I want the scrollview to have a height that adapts with device screen size.
I want to make a list of ToggleButtons. Each of them is binded to a popup.
I had a problem with that, so I tried to put everything inside a StackPanel.
But, now, when the app is running, it shows an empty space (for the Popup) right after the ToggleButton. What can I do to solve that?
I've just added two images:
The first one is when the page is being uploaded.
The second one is when I scroll down the page.
<ListView x:Name="ListOfRecipes" HorizontalAlignment="Center" VerticalAlignment="Top" ItemsSource="{Binding}" Grid.Row="1" Margin="25,0.333,25,35" ScrollViewer.VerticalScrollMode="Enabled" Grid.RowSpan="5" >
<ListView.ItemTemplate>
<DataTemplate>
<Grid>
<ToggleButton x:Name="RecipeButton" Grid.Row="1" BorderBrush="#FF65C365" VerticalAlignment="Center" HorizontalAlignment="Center" Click="Button_Click" Height="150" Width="328" >
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center" Height="128" Width="328">
<Image Source="{Binding Path=ImageUri}" Height="128" Width="128" Margin="0,6,0,-5.667" />
<StackPanel Orientation="Vertical" HorizontalAlignment="Left" VerticalAlignment="Top" Height="128" Width="192">
<TextBlock Height="25" Width="190" Foreground="#FF6FDC13" Text="{Binding Name}" VerticalAlignment="Top" />
<Image Name="YesOrNoImage" Source="{Binding Path=YesOrNoImage}" Width="102" Height="102" HorizontalAlignment="Center" VerticalAlignment="Bottom"/>
</StackPanel>
</StackPanel>
</ToggleButton>
<Popup IsOpen="{Binding IsChecked, ElementName=RecipeButton, Mode=TwoWay}" Height="514" Width="328" VerticalAlignment="Center" Name="PopupOne" Grid.Row="1" Grid.RowSpan="4" IsLightDismissEnabled="True" IsHoldingEnabled="False" ScrollViewer.VerticalScrollMode="Enabled" >
<Border BorderBrush="#FF65C365" BorderThickness="1" Background="White" Height="514" Width="328">
<StackPanel Orientation="Vertical" ScrollViewer.VerticalScrollMode="Enabled">
<Image Source="{Binding Path=ImageUri}" Height="328" Width="328" />
<TextBlock Foreground="#FF6FDC13" Text="{Binding Name}" HorizontalAlignment="Left" FontSize="28" />
<ScrollViewer VerticalScrollMode="Enabled" >
<TextBlock Foreground="Black" Text="{Binding RecipeText}" HorizontalAlignment="Left" FontSize="18" />
</ScrollViewer>
</StackPanel>
</Border>
</Popup>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
It seems that the issue is caused by the <PopUp Height=514/>
To test it, set the height to 0 to see if it fixes the gap. If so, you can bind the visibility to PopUp.IsOpen using a Visibility converter (I think Blue MVVM has one). Since I'm not very educated on Converters at the moment, I came up with a workaround.
public RecipeButton : INotifyPropertyChanged {
// Need to implement INotifyPropertyChanged logic on IsCheckedVisiblity for UI to be notified of visibility changes
public Visibility IsCheckedVisibility { get; set; }
private bool _IsChecked;
public bool IsChecked {
get { return _IsChecked };
set { _IsChecked = value;
this.IsCheckedVisibility = value == true ? Visiblity.Collapsed : Visiblity.Visible;
}
}
<PopUp Visibility = "{Binding IsCheckedVisibility}"/>
Let me know if that doesn't work and I'll try something else.
I have one problem - my stackpanel is vey big and it breaks(background color is changed to black).. What should i do to improve it?
<Grid x:Name="LayoutRoot" Background="#FF2D2D2D" >
<Grid.RowDefinitions>
<RowDefinition Height="60"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackPanel x:Name="TitlePanel" Orientation="Horizontal" Grid.Row="0">
..
</StackPanel>
<ScrollViewer Name="viewer" Grid.Row="1" >
<StackPanel Name="ContentGrid" Canvas.ZIndex="1" Margin="0, 0,0,80" Background="White" Width="452">
<Image Name="ImageImage" Height="300" VerticalAlignment="Top"/>
<TextBlock Name="DateText" TextWrapping="Wrap" TextAlignment="Center" FontSize="18" Foreground="Black"/>
<TextBlock Name="TitleText" TextWrapping="Wrap" FontSize="20" TextAlignment="Center" Foreground="Black" Margin="10,0"/>
<TextBlock TextWrapping="Wrap" Margin="10,15,10,2" Name="DescroptionText" FontSize="23" Foreground="#FF494949" FontFamily="Portable User Interface"/>
<TextBlock TextWrapping="Wrap" TextTrimming="WordEllipsis" Margin="10,0,10,2" Name="DescroptionText2" FontSize="23" Foreground="#FF494949"/>
<ListBox SelectionChanged="GridImages_SelectionChanged" ScrollViewer.VerticalScrollBarVisibility="Disabled" Name="GridImages" ItemTemplate="{StaticResource AttachmentsItemTemlate}" Grid.RowSpan="2" FontFamily="Portable User Interface" >
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<toolkit:WrapPanel Orientation="Horizontal" FlowDirection="LeftToRight" ItemWidth="150" ItemHeight="150"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
</StackPanel>
</ScrollViewer>
</Grid>
There is a limitation of 2048px in Windows Phone UIElements.
You should try to break your different elements into smaller elements (for example: you could put several stackpanels inside the first one).
In TextBox elements there is a workaround explained here.
Best this is to make the Main Window to white background and Make your stackpanel as transparent background instead of giving any color to it. It works great as I have tested it.
Try this code, but first you need to add windows toolkit library.
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
<toolkit:PhoneTextBox
TextWrapping="Wrap"
Name="txtString"
ScrollViewer.VerticalScrollBarVisibility="Visible"
MaxHeight="200"
PlaceholderText="Add text"
Padding="5"
Width="370"
FontFamily="Open Sans Light"
FontSize="22"
Height="Auto" ///Use Auto or provide height value
Margin="10"
/>
This code is used for Scrolling as well work for Auto Growing Textbox. If you don't want Auto Growing Textbox then provide height instead of Auto in Height attribute.