XAML ScrollViewer scroll bar hidden issue (Silverlight) - wpf

I’ve got this strange problem whereby the content within a scroll viewer increases in size, the scroll viewer then shows is horizontal scroll bar. However the grid the ScrollViewer is ultimately within doesn’t seem to resize enough to show the scroll bar.
I’ve isolated the problem in this sample app, basically some xaml and some code behind to simulate the content size increase.
Note how the right scroll bar is not correctly showing when you click the resize button, I’ve added some padding to show that its there but not in the correct place.
If I remove the top row it seems to work.
Any ideas and thanks in advance guys and girls?
<UserControl x:Class="SilverlightApplication7.MainPage"
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"
mc:Ignorable="d"
>
<Grid
ShowGridLines="True"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
>
<Grid.RowDefinitions>
<RowDefinition x:Name="DealHeaderRow" Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="DealBarColumn" Width="Auto"></ColumnDefinition>
<ColumnDefinition x:Name="MarketViewerColumn" Width="Auto"></ColumnDefinition>
<ColumnDefinition x:Name="DealEditorColumn" Width="*" ></ColumnDefinition>
<ColumnDefinition x:Name="InfoColumn" Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<ContentControl
x:Name="DealBarRegionContentControl"
Grid.Row="0"
Grid.Column="0"
Grid.RowSpan="2"
VerticalContentAlignment="Stretch"
HorizontalAlignment="Stretch"
Margin="0">
<TextBlock Text="DealBarRegion" Width="150" />
</ContentControl>
<ContentControl
Grid.Row="0"
Grid.Column="1"
Grid.RowSpan="2"
VerticalContentAlignment="Stretch"
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch">
<Border Background="#FF9AF172">
<TextBlock Text="MarketViewerRegion" Width="150" />
</Border>
</ContentControl>
<ContentControl
Grid.Column="2"
Grid.ColumnSpan="2"
Grid.Row="0"
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch" >
<Border Background="#FFC1FC9F">
<TextBlock Text="DealHeaderRegion" />
</Border>
</ContentControl>
<ContentControl
Grid.Column="2"
Grid.Row="1"
VerticalAlignment="Top"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch">
<Border Background="MistyRose" >
<TextBlock Text="DealEditorRegion" />
</Border>
</ContentControl>
<Grid
Grid.Column="3"
Grid.Row="1"
>
<ContentControl
x:Name="InfoRegionControl"
VerticalContentAlignment="Stretch"
HorizontalAlignment="Stretch">
<!-- without the padding here you can't see the scroll bar at all !! Its like the
scroll ScrollViewer isn't correctly calculating its width to include the scroll bar,
or the grid isn't sizing at the points its visible??-->
<Border Padding="0,0,9,0" MinWidth="200" x:Name="DealInfoControlPlaceHolder">
<ScrollViewer
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
VerticalScrollBarVisibility="Auto"
HorizontalScrollBarVisibility="Auto"
>
<StackPanel x:Name="ScrollContentPlaceHolder">
<Button Click="Button_Click" Content="Rezize Column" x:Name="ResizeButton" />
</StackPanel>
</ScrollViewer>
</Border>
</ContentControl>
</Grid>
</Grid>
And here is the code behind:
using System.Windows;
using System.Windows.Controls;
namespace SilverlightApplication7
{
public partial class MainPage : UserControl
{
double _dealInfoControlPlaceHolderHeight = 0;
double _dealInfoControlPlaceHolderWidth = 0;
public MainPage()
{
InitializeComponent();
Loaded += (o, e) =>
{
// cache the original width and height
_dealInfoControlPlaceHolderHeight = DealInfoControlPlaceHolder.Height;
_dealInfoControlPlaceHolderWidth = DealInfoControlPlaceHolder.Width;
};
}
private void Button_Click(object sender, RoutedEventArgs e)
{
if (ScrollContentPlaceHolder.Height == 1200)
{
ScrollContentPlaceHolder.Height = _dealInfoControlPlaceHolderHeight;
ScrollContentPlaceHolder.Width = _dealInfoControlPlaceHolderWidth;
}
else
{
ScrollContentPlaceHolder.Height = 1200;
ScrollContentPlaceHolder.Width = 250;
}
}
}
}

Ok I don’t know why the above doesn’t work, but as a workaround I just restructure the page so its behaves the same. That works:
<UserControl x:Class="SilverlightApplication7.MainPage"
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"
mc:Ignorable="d"
>
<Grid
ShowGridLines="True"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="DealBarColumn" Width="Auto"></ColumnDefinition>
<ColumnDefinition x:Name="MarketViewerColumn" Width="Auto"></ColumnDefinition>
<ColumnDefinition x:Name="DealEditorColumn" Width="*" ></ColumnDefinition>
</Grid.ColumnDefinitions>
<ContentControl
x:Name="DealBarRegionContentControl"
Grid.Column="0"
VerticalContentAlignment="Stretch"
HorizontalAlignment="Stretch"
Margin="0">
<TextBlock Text="DealBarRegion" Width="150" />
</ContentControl>
<ContentControl
Grid.Column="1"
VerticalContentAlignment="Stretch"
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch">
<Border Background="#FF9AF172">
<TextBlock Text="MarketViewerRegion" Width="150" />
</Border>
</ContentControl>
<Grid
Grid.Column="2" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<ContentControl
Grid.Row="0"
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch" >
<Border Background="#FFC1FC9F">
<TextBlock Text="DealHeaderRegion" />
</Border>
</ContentControl>
<Grid
Grid.Row="1"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<ContentControl
Grid.Column="0"
VerticalAlignment="Top"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch">
<Border Background="MistyRose" >
<TextBlock Text="DealEditorRegion" />
</Border>
</ContentControl>
<ContentControl
Grid.Column="1"
x:Name="InfoRegionControl"
VerticalContentAlignment="Stretch"
HorizontalAlignment="Right">
<!-- without the padding here you can't see the scroll bar at all !! Its like the
scroll ScrollViewer isn't correctly calculating its width to include the scroll bar,
or the grid isn't sizing at the points its visible??-->
<Border Padding="0,0,9,0" MinWidth="200" x:Name="DealInfoControlPlaceHolder">
<ScrollViewer
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
VerticalScrollBarVisibility="Auto"
HorizontalScrollBarVisibility="Auto"
>
<StackPanel x:Name="ScrollContentPlaceHolder">
<Button Click="Button_Click" Content="Rezize Column" x:Name="ResizeButton" />
</StackPanel>
</ScrollViewer>
</Border>
</ContentControl>
</Grid>
</Grid>
</Grid>

Related

How resize whole window when I drag window with mouse

I'm new with WPF controls, before I worked with WinForms applications, and there if I put anchor on control and put dock on container all works smoothly but here I have struggle where I mistake?
<Window x:Class="ChatApp.Client.ClientWindow"
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:ChatApp.Client"
mc:Ignorable="d"
Title="Client" Height="450" Width="800">
<Grid>
<DockPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<StackPanel DockPanel.Dock="Top" Orientation="Horizontal" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<GroupBox Header="Client" Height="Auto">
<StackPanel Orientation="Horizontal">
<TextBlock Margin="5, 0, 5, 0">Address:</TextBlock>
<TextBox x:Name="txtAddress" Width="80"></TextBox>
<TextBlock Margin="10, 0, 5, 0">Port:</TextBlock>
<TextBox x:Name="txtPort" Width="80"></TextBox>
<Button x:Name="btnConnect" Margin="430, 0, 5, 0" Content="Connect" Width="80" Click="btnConnect_Click"/>
</StackPanel>
</GroupBox>
</StackPanel>
<StackPanel DockPanel.Dock="Left" Orientation="Horizontal" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<GroupBox Header="Chat" Width="650" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<TextBox x:Name="txtConversation" AcceptsReturn="True"></TextBox>
</GroupBox>
</StackPanel>
<StackPanel DockPanel.Dock="Right" Orientation="Horizontal" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<GroupBox Header="Users" Width="135" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<ListBox x:Name="lbUsers" Height="Auto" Margin="5,0" VerticalAlignment="Stretch">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</GroupBox>
</StackPanel>
</DockPanel>
</Grid>
</Window>
I have three group box top dock, second left dock and last one is for right dock.
When I want to resize form with mouse right group box doesn't want to stretch when
I resize form.
Your layout seems very over complicated - are you just trying to clone what you did in Winforms in WPF?
It doesn't make any sense to have StackPanels or a Grid with only one child control each.
Try replacing your DockPanel with appropriately sized Grid Rows and Columns.
The GroupBoxes won't resize if you hard code their widths.
There's no need to define an ItemTemplate for the ListBox just to display a single string.
Something like the following would be a good starting point for your layout.
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="4*" />
<ColumnDefinition Width="*" MinWidth="135" />
</Grid.ColumnDefinitions>
<GroupBox Header="Client" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" Margin="5">
<Grid >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" Text="Address:"/>
<TextBox x:Name="txtAddress" Width="80" Grid.Row="1" Grid.Column="0" />
<TextBlock Grid.Row="2" Grid.Column="0" Text="Port:" />
<TextBox x:Name="txtPort" Width="80" Grid.Row="3" Grid.Column="0" />
<Button x:Name="btnConnect" Grid.Row="0" Grid.Column="2" Content="Connect" Width="80" />
</Grid>
</GroupBox>
<GroupBox Header="Chat" Grid.Row="1" Grid.Column="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<TextBox x:Name="txtConversation" AcceptsReturn="True" />
</GroupBox>
<GroupBox Header="Users" Grid.Row="1" Grid.Column="1" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<ListBox x:Name="lbUsers" />
</GroupBox>
</Grid>

Change keyboard focus to a specific control

I have a usercontrol which has several elements at different logical level. By default, keyboard focus goes to logical control at highest level, but I want to focus to switch to some other control which is deep down in logical tree (but all the controls are loaded when this user control is loaded).
The XAML is shown below, when the OverlayContent (a dialog) goes away, I want focus to move to "EigthLevelTB" a TextBox, but by default control goes to "ThridLevelGB". User can tab and navigate to "EigthLevelTB", but they want default focus to be here rather than tabbing.
I have tried setting focus on this EigthLevelTB in UserControl.Loaded, FocuableChanged events, etc. Also I tried setting KeyboardNavigation.TabIndex="0", but nothing is working for me.
Please suggest what could be going wrong here?
<Grid Name="OverlayGrid">
<Grid Name="TopMostGrid" Grid.Row="1" Margin="1,0,1,0" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Grid Name="FirstLevelGrid" Grid.Column="0" Grid.Row="0" Margin="0,0,0,0" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ContentControl Grid.Row="0" Margin="5,10,5,10" Content="{Binding HeaderInfo}" KeyboardNavigation.TabNavigation="None" Focusable="False"/>
<Grid Name="SecondLevelGrid" Grid.Row="1" Margin="1,0,0,0">
<Border Name="ThridLevelBorder" Margin="5,2.5,5,2.5">
<Border Name="FourthLevelBorder">
<Grid Name="FifthLevelGrid">
<Grid Name="SixthLevelGrid" Grid.Column="0" Visibility="{Binding GridVisibility, FallbackValue=Visible}">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Name="SeventhLevelGrid" Grid.Row="0" HorizontalAlignment="Center" Margin="2,15,2,2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
<ColumnDefinition Width="*" SharedSizeGroup="B"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" HorizontalAlignment="Left" Text="Enter:"/>
<TextBox Name="EigthLevelTB" Grid.Column="1"
Text="{Binding UserData, UpdateSourceTrigger=PropertyChanged, ValidatesOnExceptions=True}"
KeyboardNavigation.TabIndex="0">
</TextBox>
</Grid>
</Grid>
</Grid>
</Border>
</Border>
</Grid>
</Grid>
<ScrollViewer Name="FirstLevelScrollViewer" Grid.Column="1" CanContentScroll="True" VerticalScrollBarVisibility="Auto">
<DockPanel Name="SecondLevelPanel" LastChildFill="False">
<GroupBox DockPanel.Dock="Top">
<ContentControl Content="{Binding Legend}" Margin="5" IsTabStop="False" KeyboardNavigation.TabNavigation="None" Focusable="False"/>
</GroupBox>
<GroupBox Name="ThridLevelGB" DockPanel.Dock="Top" Content="{Binding ButtonList}"
Focusable="False" KeyboardNavigation.TabNavigation="Continue"
VerticalAlignment="Top" VerticalContentAlignment="Stretch" >
</GroupBox>
</DockPanel>
</ScrollViewer>
</Grid>
<ContentControl Name="OverlayContent" Content="{Binding OverlayContent}"/>
</Grid>
Thanks,
RDV

Negative-margin control get clipped when resizing the window in WPF

I try to understand why a border element get clipped when reducing the width of the main window.
Please take a look the code block below.
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="300" Width="500" Name="MainWin">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Border Background="Blue" Grid.Row="0" BorderBrush="Black" Width="{Binding ElementName=MainWin, Path=Width}" />
<Grid Grid.Row="1" Margin="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="150" />
<ColumnDefinition Width="150" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Background="Black">
<Border Background="White" Width="150" Height="150" BorderBrush="Black" BorderThickness="2"
Margin="0,-100,0,0">
<TextBlock Text="{Binding ElementName=MainWin, Path=Width}" FontSize="14" FontWeight="Bold"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
</Border>
</StackPanel>
<StackPanel Grid.Column="1" Background="Red" />
<StackPanel Grid.Column="2" Background="Yellow" />
</Grid>
</Grid>
</Window>
Here is what the border appears in the original window width:
Non-resized window
As you can see that the border is displayed outside its container because of the negative top margin, -100 in this case. This is what I expect to have for the border. But when I reduce the main window width to reach the right edge of the red rectangle the outside part of the border get clipped.
Resized window
I have tried to place this border element inside a custom StackPanel which overrides ArrangeOverride, MeasureOverride and GetLayoutClip method but unfortunately these methods are not invoked when the main window is being resized.
I appreciate if somebody can explain me what the reason is and how to work around with this issue.
Thanks a lot.
Based on the explanation of #Marks, here is my solution
Create a custom grid and overrides MeasureOverride method
Replace the inner grid by this custom grid
CustomGrid class
public class CustomGrid : Grid
{
private double _originalHeight = 0;
protected override Size MeasureOverride(Size constraint)
{
Size? size = null;
if (constraint.Width <= 300)
{
size = new Size(constraint.Width, _originalHeight);
}
else
{
size = base.MeasureOverride(constraint);
_originalHeight = constraint.Height;
}
return size.Value;
}
}
XAML code
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:wpfApplication1="clr-namespace:WpfApplication1"
Title="MainWindow" Height="300" Width="500" Name="MainWin">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Border Background="Blue" Grid.Row="0" BorderBrush="Black" Width="{Binding ElementName=MainWin, Path=Width}" />
<wpfApplication1:CustomGrid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="150" />
<ColumnDefinition Width="150" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Background="Black">
<Border Background="White" Width="150" Height="150" BorderBrush="Black" BorderThickness="2"
Margin="0,-100,0,0">
<TextBlock Text="{Binding ElementName=MainWin, Path=Width}" FontSize="14" FontWeight="Bold"
HorizontalAlignment="Center"
VerticalAlignment="Bottom" />
</Border>
</StackPanel>
<StackPanel Grid.Column="1" Background="Red" />
<StackPanel Grid.Column="2" Background="Yellow" />
</wpfApplication1:CustomGrid>
</Grid>
You're binding the blue border's Width to the MainWindow's Width.
For the future: if you want to bind to the width of any FrameworkElement bind to its ActualWidth property.
The order in which WPF draws its stuff is quite dependent on the containing control. I'd say in your case the outer Grid draws its children that need updating in the order they are defined. So you're good to go as long as the inner grid changes along with the border. This is the case as long as the Width of the third column changes. Once it's at 0 there's no more change so it doesn't get updated.
(2) is speculation =)
don't do (1), there's no need for it
Use one Grid
Some XAML:
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="150" />
<ColumnDefinition Width="150" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border Background="Blue" BorderBrush="Black" Grid.ColumnSpan="3"/>
<StackPanel Grid.Column="0" Grid.Row="1" Background="Black" >
<Border Background="White" Width="150" Height="150" BorderBrush="Black" BorderThickness="2" Margin="0,-100,0,0">
<TextBlock Text="{Binding ElementName=MainWin, Path=ActualWidth}" FontSize="14" FontWeight="Bold"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
</Border>
</StackPanel>
<StackPanel Grid.Column="1" Grid.Row="1" Background="Red" />
<StackPanel Grid.Column="2" Grid.Row="1" Background="Yellow" />
</Grid>

WPF: RichTextBox outside of window

There is Usercontrol with RichTextBox.
When user adds a text then bottom of RTB moves outside of window.
How to fit RTB to window and to do vertical scroll bar?
<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="clr-namespace:ServiceProcess.Helpers.Controls"
x:Class="ServiceProcess.Helpers.Views.ServiceView"
x:ClassModifier="internal"
Height="Auto" Width="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<UserControl.Resources>
<BooleanToVisibilityConverter x:Key="boolToVis" />
</UserControl.Resources>
<StackPanel VerticalAlignment="Stretch" HorizontalAlignment="Stretch" >
<Grid HorizontalAlignment="Stretch"
VerticalAlignment="Stretch" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBlock Margin="2"
Grid.Row="0" Grid.Column="0"
Text="{Binding Name}" />
<TextBlock Margin="2"
Grid.Row="0" Grid.Column="1"
Text="{Binding CurrentState}" HorizontalAlignment="Left"/>
<controls:GifImage Grid.Row="0" Grid.Column="2"
AnimationSource="pack://application:,,,/ServiceProcess.Helpers;component/Images/spinner.gif"
Stretch="None"
Visibility="{Binding Path=IsBusy, Converter={StaticResource boolToVis}}" />
</Grid>
<RichTextBox Name="rtb"
Height="Auto" Width="Auto"
HorizontalAlignment="Stretch"
Margin="6,6,0,0"
VerticalAlignment="Stretch"
VerticalScrollBarVisibility="Auto"
HorizontalScrollBarVisibility="Auto" >
<FlowDocument Name="rtbFlowDoc" PageWidth="{Binding ElementName=rtb, Path=ActualWidth}" >
<Paragraph FontSize="14">Hello, world!</Paragraph>
<Paragraph FontStyle="Italic" TextAlignment="Left" FontSize="12" Foreground="Gray">Thanks to the RichTextBox control, this FlowDocument is completely editable!</Paragraph>
</FlowDocument>
</RichTextBox>
</StackPanel>
</UserControl>
I am trying to add RTB to the free space of this window to display log messages
http://windowsservicehelper.codeplex.com/
If I understand it correctly from your code, this is inside a template of a ListView's item.
In ServicesControllerView.xaml add ScrollViewer.CanContentScroll="False" to the ListView.

Odd WPF Grid Behavior Affected by TextBox Text

I can't figure out why the contents of my TextBox is affecting my grid column widths. I have setup a grid with 3 columns with widths defined as 50, *, 50, as shown below
Now, when in use, the center column will grow/shrink as the text in the TextBox changes, see the 2 examples below. The actual TextBox is not changing size, so I can't understand why in the world the grid is changing. The Grid is inside of a Border inside a UserControl. The UserControl is used as a DataTemplate in a ListBox.
Edit: I've discovered that this issue is related to the UserControl being in a ListBox, see example image below (UserControl in ListBox (circled in red) vs. UserControl Placed on Form (circed in blue). The grid behaves as expected when the UserControl is placed directly on the form. Code for the form is given below.
UserControl XAML:
<Grid ShowGridLines="True">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TextBlock Text="Name:" Margin="2" />
<TextBox Grid.Column="1" Margin="2" Text="{Binding Name, UpdateSourceTrigger=PropertyChanged}" Grid.ColumnSpan="2" />
<TextBlock Text="Shift:" Grid.Row="1" Margin="2" />
<TextBox Grid.Column="1" Grid.Row="1" Margin="2" Text="{Binding TimeShift, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged, FallbackValue=0}" HorizontalContentAlignment="Right" />
<TextBlock Text="s" Grid.Row="1" Grid.Column="2" Margin="2" />
</Grid>
Window/Form XAML:
<Window x:Class="CrashSimOffice.FileImport"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:CrashSimOffice"
Title="File Import" Height="350" Width="450" Background="White" Icon="/CrashSimOffice;component/Images/16/page-white-save.png">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="75"/>
<ColumnDefinition Width="75"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="75"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Button Content="Add" Margin="2" Command="{Binding AddFileCommand}" />
<Button Content="Remove" Grid.Column="1" Margin="2" Command="{Binding RemoveFileCommand}" />
<ListBox HorizontalContentAlignment="Stretch" Grid.ColumnSpan="4" Margin="2" Grid.Row="1" ItemsSource="{Binding Files}" SelectedItem="{Binding CurrentFile}" ScrollViewer.CanContentScroll="False" Background="WhiteSmoke">
<ListBox.ItemTemplate>
<DataTemplate DataType="{x:Type local:FileViewModel}">
<local:FileView DataContext="{Binding}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button Content="Done" Grid.Column="3" Margin="2" Grid.Row="2" Click="Button_Click" />
<local:FileView Grid.Row="3" Grid.ColumnSpan="4" />
</Grid>
OK, I figured it out, Bruno V you got me thinking it must have something to do with the ListBox. I needed to add this to my ListBox:
ScrollViewer.HorizontalScrollBarVisibility="Disabled"
Not sure why that works, but it does.

Resources