Develop Reference

WPF scrollviewer for adding dynamic elements

I need help with my WPF application. In the bottom of my window I have a canvas which is filled dynamically with groupboxes, which contain several userlements like buttons and gridviews.
The inserted content is outside my window and I want to access it with scrollbars but the scrollbars aren't adjusting so I can't access the elements.
How can I reach the content with the scrollbars?
Thanks for your help.
<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Visible" >
<Grid Height="Auto">
<GroupBox Header="Fleet Import" HorizontalAlignment="Left" Height="115" Margin="23,21,0,0" VerticalAlignment="Top" Width="419">
<StackPanel Margin="0,0,-67,0">
<StackPanel Orientation="Horizontal">
<Button x:Name="btnSelectProject" Content="Select Project" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="88" Height="23" Click="btnSelectProject_Click"/>
<TextBox Name="tbPath" Height="17" Width="283" Margin="10,10,0,0" />
</StackPanel>
<Button x:Name="bntConnectTia" Content="Connect to TIA" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="88" Height="23" Click="bntConnectTia_Click"/>
</StackPanel>
</GroupBox>
<GroupBox Header="Start update" HorizontalAlignment="Left" Height="115" Margin="498,21,0,0" VerticalAlignment="Top" Width="277">
<StackPanel Orientation="Horizontal">
<StackPanel>
<RadioButton Content="Maintanace" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="88" Height="23"/>
<RadioButton Content="Production" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="88" Height="23"/>
</StackPanel>
<StackPanel>
<Button Content="Start Update" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="88" Height="23" Click="Button_Click_2"/>
<Button Content="Cancel" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="88" Height="23"/>
</StackPanel>
</StackPanel>
</GroupBox>
<GroupBox Header="GroupBox" HorizontalAlignment="Left" Height="164" Margin="23,157,0,0" VerticalAlignment="Top" Width="752">
<TextBox HorizontalAlignment="Left" Height="128" TextWrapping="Wrap" Name="tbOutput" VerticalAlignment="Top" Width="742" Margin="0,0,-2,0"/>
</GroupBox>
<Canvas x:Name="canvasDevices" Margin="23,346,25,10" Height="Auto" />
<GroupBox Header="GroupBox" HorizontalAlignment="Left" Height="164" Margin="-393,337,0,-439" VerticalAlignment="Top" Width="752" Visibility="Hidden">
<StackPanel>
<StackPanel Orientation="Horizontal">
<Button Content="Button" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="75"/>
<TextBox HorizontalAlignment="Left" Height="23" Margin="10,10,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="120"/>
<Button Content="Button" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="75"/>
</StackPanel>
<DataGrid Margin="20,10,20,0" RenderTransformOrigin="0.163,0.543" Height="88"/>
</StackPanel>
</GroupBox>
<Button Content="Button" HorizontalAlignment="Left" Margin="89,151,0,0" VerticalAlignment="Top" Width="75" Click="Button_Click_3"/>
</Grid>
</ScrollViewer>
GroupBox groupbox = new GroupBox();
groupbox.Header = deviceName;
groupbox.Name = deviceName;
groupbox.Width = 742;
groupbox.Height = 250;
stackPanelV.Children.Add(stackPanelH);
stackPanelV.Children.Add(dgDevice);
groupbox.Content = stackPanelV;
Canvas.SetTop(groupbox,0);
canvasDevices.Children.Add(groupbox);

Your items get out the canvas bounds, canvas is not resized and ScrollView not applied.
By the way I dont recommend you using canvas for that prupose.
There is plenty of other layouts that will give you a better result such as StackPanel or WrapPanel, and if you give to WrapPanel a width it will nicely rearrange your items.

ScrollViewer does not scroll after adding textbox by code behind

I have problem with having ScrollViewer working.
This is my MainWindow XAML:
<Window x:Class="Labels.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Labels"
mc:Ignorable="d"
Title="Labels" Height="350" Width="250" WindowStartupLocation="CenterScreen"
ResizeMode="NoResize" Background="#FFF6A300">
<ScrollViewer VerticalScrollBarVisibility="Hidden" Name="Scroll">
<Grid Margin="0,0,0,0" HorizontalAlignment="Center" Height="auto"
VerticalAlignment="Center" Name="mainGrid">
<Label x:Name="ProductLabel" Content="Product" HorizontalAlignment="Center"
Width="200" FontSize="16"
FontWeight="Bold" VerticalAlignment="Top"
HorizontalContentAlignment="Center" Margin="15,-5,9,0"/>
<TextBox x:Name="ProductTextBox" HorizontalAlignment="Center" Height="28"
Margin="13,22,11,0"
TextWrapping="Wrap" VerticalAlignment="Top" Width="200"
PreviewKeyDown="ProductTextBox_PreviewKeyDown"
SpellCheck.IsEnabled="True" FontSize="16"
HorizontalContentAlignment="Center"/>
<Label x:Name="IndexLabel" Content="Index: " HorizontalAlignment="Left"
Margin="10,50,0,0" VerticalAlignment="Top" Height="35" Width="62"/>
<Label x:Name="NameLabel" Content="Name:" HorizontalAlignment="Left"
Margin="10,80,0,0" VerticalAlignment="Top" Height="31" Width="62"/>
<TextBlock x:Name="IndexTextBlock" HorizontalAlignment="Left"
Margin="58,55,0,0" TextWrapping="Wrap" VerticalAlignment="Top"
Width="156" Height="23"/>
<TextBlock x:Name="NameTextBlock" HorizontalAlignment="Left"
Margin="58,85,0,0" TextWrapping="Wrap" VerticalAlignment="Top"
Width="155" Height="52"/>
<Label x:Name="TypeLabel" Content="Label template:"
HorizontalAlignment="Center" VerticalAlignment="Top" Height="30"
Width="199" FontSize="16" FontWeight="Bold"
Margin="15,142,10,0" HorizontalContentAlignment="Center"/>
<TextBox x:Name="TypeTextBox" HorizontalAlignment="Center"
Height="29" Margin="15,172,9,0" TextWrapping="Wrap"
VerticalAlignment="Top" Width="200"
PreviewKeyDown="TypeTextBox_PreviewKeyDown"
HorizontalContentAlignment="Center" FontSize="16"/>
<Label x:Name="CountLabel" Content="Print Copies: " HorizontalAlignment="Center"
Margin="14,206,10,0"
VerticalAlignment="Top" Height="31" Width="200" FontSize="16"
FontWeight="Bold" HorizontalContentAlignment="Center"/>
<TextBox x:Name="CountTextBox"
PreviewTextInput="CountTextBox_PreviewTextInput"
HorizontalAlignment="Center"
Height="28" Margin="13,232,11,0" TextWrapping="Wrap"
VerticalAlignment="Top" Width="200"
PreviewKeyDown="CountTextBox_PreviewKeyDown"
HorizontalContentAlignment="Center" FontSize="16"/>
<Label x:Name="LogoLabel" Content="Label" HorizontalAlignment="Left"
Margin="93,268,0,-8" VerticalAlignment="Top" Visibility="Hidden"/>
</Grid>
</ScrollViewer>
In code behind, I'm adding TextBox under LogoLabel and then I'm updating ScrollViewer's Layout like this:
mainGrid.Children.Add(nameTxt);
LogoLabel.Visibility = Visibility.Visible;
CountTextBox.IsEnabled = false;
nameTxt.Focus();
Scroll.UpdateLayout();
Scroll.ScrollToVerticalOffset(nameTxt.Margin.Top);
It looks like this:
As you can see on screenshoot uploaded above, I don't know how to make ScrollViewer to scroll that I could see entire LogoTextBox height. How to do it ? Any suggestions ?

You should scroll to a point outside of visible bounds. The Scroll.ScrollToVerticalOffset(nameTxt.Margin.Top) is already visible so no need to scroll.
You can try something like this:
Scroll.ScrollToVerticalOffset(nameTxt.Margin.Top + nameTxt.Height);
By doing this the scroll control will scroll to show the full text box.

The problem is with mainGrid height. It was set to auto. I changed it to static and in code I increase it's height by nameTxt height. And it works.

How to make Grid control scroll?

How to make this code scroll'able?
I've tried this solution but it won't work: Need to scroll one WPF Grid
My XAML (Grid named Photos has to scroll):
<Grid Height="533" VerticalAlignment="Bottom">
<TextBox x:Name="siteAdressTextBox" HorizontalAlignment="Left" Height="23" Margin="10,10,0,0" TextWrapping="Wrap" Text="http://www.etrapez.pl/" VerticalAlignment="Top" Width="215"/>
<Button x:Name="sendWebRequestButton" Content="Wyślij zapytanie" HorizontalAlignment="Left" Margin="10,38,0,0" VerticalAlignment="Top" Width="107" Click="webRequest"/>
<Button Content="Pobierz wszystko" HorizontalAlignment="Left" Margin="122,38,0,0" VerticalAlignment="Top" Width="103" Click="downThemAll"/>
<ScrollViewer HorizontalAlignment="Left" Height="460" Margin="10,63,0,0" VerticalAlignment="Top" Width="1000" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Visible" CanContentScroll="True">
<Grid x:Name="Photos" HorizontalAlignment="Left" Height="460" VerticalAlignment="Top" Width="1000" ShowGridLines="False" ScrollViewer.CanContentScroll="True" ScrollViewer.VerticalScrollBarVisibility="Visible" />
</ScrollViewer>
<TextBox Name="InfoBoxLabel" IsReadOnly="True" VerticalScrollBarVisibility="Auto" HorizontalAlignment="Left" Height="48" Margin="230,10,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="300"/>
</Grid>

try this
<Grid Height="533" VerticalAlignment="Bottom">
<TextBox x:Name="siteAdressTextBox" HorizontalAlignment="Left" Height="23" Margin="10,10,0,0" TextWrapping="Wrap" Text="http://www.etrapez.pl/" VerticalAlignment="Top" Width="215"/>
<Button x:Name="sendWebRequestButton" Content="Wyślij zapytanie" HorizontalAlignment="Left" Margin="10,38,0,0" VerticalAlignment="Top" Width="107"/>
<Button Content="Pobierz wszystko" HorizontalAlignment="Left" Margin="122,38,0,0" VerticalAlignment="Top" Width="103" />
<ScrollViewer HorizontalAlignment="Left" Height="460" Margin="10,63,0,0" VerticalAlignment="Top" Width="1000" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Visible">
<Grid x:Name="Photos" ShowGridLines="False">
<TextBlock TextWrapping="Wrap" Text="text here"/>
</Grid>
</ScrollViewer>
<TextBox Name="InfoBoxLabel" IsReadOnly="True" VerticalScrollBarVisibility="Auto" HorizontalAlignment="Left" Height="48" Margin="230,10,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="300"/>
</Grid>
Output will be http://prntscr.com/3w0cr9

How to add multiple controls inside a Frame in Silverlight

I am new to silverlight. I have to add multiple controls in a Navigation Frame. When i do like this ,i am getting error.
<Navigation:Frame Name="ContentFrame" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="0,55,12,12" BorderThickness="1" BorderBrush="Black" Grid.Column="1" Grid.ColumnSpan="3" Grid.RowSpan="5">
<TextBlock Grid.Column="1" Height="23" HorizontalAlignment="Left" Margin="9,129,0,0" Name="textBlock2" Text="UserName:" VerticalAlignment="Top" />
<TextBlock Grid.Column="1" Height="23" HorizontalAlignment="Left" Margin="12,22,0,0" Name="textBlock3" Text="Password:" VerticalAlignment="Top" Grid.Row="1" />
</Navigation:Frame>
The Error is The property 'Content' cannot be set more than once. Where i am wrong. How to achieve this?

Frame is a ContentControl which means that it can only have a single child. You need to add a child control that is able to hold multiple children. Try a Grid for example:
<Navigation:Frame >
<Grid>
<TextBlock Grid.Column="1" Height="23" HorizontalAlignment="Left" Margin="9,129,0,0" Name="textBlock2" Text="UserName:" VerticalAlignment="Top" />
<TextBlock Grid.Column="1" Height="23" HorizontalAlignment="Left" Margin="12,22,0,0" Name="textBlock3" Text="Password:" VerticalAlignment="Top" Grid.Row="1" />
</Grid>
</Navigation:Frame>

Vertical scroll in Pivot Page

It's a very stupid question :)
Which property sets vertical scroll?
Developing Windows Phone 7 app, I switched off this property, and I don't understand, how I did it :)
I use ComboBox, and when I create project, I can scroll text in ComboBox, but now I can't

You need to include all the items inside the Scrollviewer, as in pivot page, we can't make the content scroller without scroll viewer.
Here is the sample content.
<ScrollViewer HorizontalAlignment="Left" VerticalAlignment="Top" Height="647" Margin="0" Grid.Row="1">
<Grid x:Name="ContentPanel" Margin="0,0,0,24" Width="480" Height="1470" Grid.Row="1">
<Image x:Name="ImgProcess" Source="/GoogTaxi;component/images/loading2.jpg" Visibility="Collapsed" Stretch="None" Opacity="0.60" VerticalAlignment="Top" />
<TextBlock x:Name="tbkCompanyName" TextWrapping="Wrap" Text="Company Name" Margin="20,20,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="txtCompanyName" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,47,8,0"/>
<TextBlock x:Name="tbkAddress" TextWrapping="Wrap" Text="Address" Margin="20,120,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="txtAddress" AcceptsReturn="True" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,147,8,336" VerticalScrollBarVisibility="Auto" Height="131"/>
<TextBlock x:Name="tbkEmailId" TextWrapping="Wrap" Text="Email Id" Margin="20,279,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="txtEmailId" IsEnabled="False" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,306,8,0" d:LayoutOverrides="VerticalAlignment"/>
<TextBlock x:Name="tbkWebsite" TextWrapping="Wrap" Margin="20,379,0,0" VerticalAlignment="Top"><Run Text="Website"/><LineBreak/><Run/></TextBlock>
<TextBox x:Name="txtWebsite" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,406,8,0" d:LayoutOverrides="VerticalAlignment"/>
<TextBlock x:Name="tbkPhone" TextWrapping="Wrap" Text="Phone" Margin="20,479,0,0" VerticalAlignment="Top" d:LayoutOverrides="VerticalAlignment"/>
<TextBox x:Name="txtPhone" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,506,8,0"/>
<TextBlock x:Name="tbkCity" TextWrapping="Wrap" Margin="20,579,0,0" VerticalAlignment="Top" Text="City"/>
<TextBox x:Name="txtCity" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,606,8,0"/>
<TextBlock x:Name="tbkState" TextWrapping="Wrap" Text="State" Margin="20,676,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="txtState" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,704,8,0"/>
<TextBlock x:Name="tblCountry" TextWrapping="Wrap" Text="Country" Margin="20,780,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="txtCountry" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,806,8,0"/>
<TextBlock x:Name="tbkCompany_logo" Visibility="Collapsed" TextWrapping="Wrap" Text="Contact Person" Margin="20,0,0,42.602" VerticalAlignment="Top" d:IsHidden="True"/>
<TextBox x:Name="txtCompany_logo" Visibility="Collapsed" TextWrapping="Wrap" Margin="8,0,8,-29.305" VerticalAlignment="Top" d:IsHidden="True"/>
<TextBlock x:Name="tbkContactPerson" TextWrapping="Wrap" Text="Contact Person" Margin="20,879,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="txtContactPerson" TextWrapping="Wrap" Margin="8,908,8,0" VerticalAlignment="Top"/>
<TextBlock x:Name="tbkContactPhone" TextWrapping="Wrap" Text="Contact Person Phone" Margin="20,982,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="txtContactPhone" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,1005,8,0"/>
<TextBlock x:Name="tbkContactEmail" TextWrapping="Wrap" Text="Contact person Email ID" Margin="20,1079,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="txtContactEmail" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,1106,8,0"/>
<TextBlock x:Name="tbkMerchantId" TextWrapping="Wrap" Text="Google Merchant Id" Margin="20,1180,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="txtMerchantId" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,1209,8,0" IsEnabled="False" />
<TextBlock x:Name="tbkMerchantKey" TextWrapping="Wrap" Text="Google Merchant Key" Margin="20,1282,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="txtMerchantKey" TextWrapping="Wrap" VerticalAlignment="Top" Margin="8,1310,8,0" IsEnabled="False" />
<Button x:Name="btnsave" Content="Save" Margin="33,1390,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Click="btnsave_Click" />
<Button x:Name="btnCancel" Content="Cancel" Margin="0,1390,33,0" VerticalAlignment="Top" HorizontalAlignment="Right" d:LayoutOverrides="HorizontalAlignment" Click="btnCancel_Click" />
</Grid>
</ScrollViewer>

There is no scroll functionality inside PivotItem. You should use ScrollViewer control to get it by your own.

In a pivot control, if the content is overflowing the vertical page then there should be default "vertical" scrolling available to you.
I had a similar control with "list box" bounded to property. Having the list box should automatically allow you to scroll.
Don't add a scrollviewer over the stack panel as it would make the scrolling enabled for each list item which you don't want.
<controls:PivotItem Header="all authors" Foreground="#FF0C388A">
<Grid>
<ListBox Margin="0,0,-12,0" ItemsSource="{Binding AllAuthorsList}" Foreground="#FF0C388A">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,0,17" Width="432" Height="Auto">
<TextBlock Tap="TextBlockAuthor_Tap" Text="{Binding}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}" Foreground="#FF0C388A"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</controls:PivotItem>