haagel - Developer IT

WPF: TextBox expanding with surrounding Grid but not with text

- by haagel

I have a problem with a TextBox in an application... A window has a Grid with two columns. The left column contains a control with a constant width but with a height that adapts. The right column contains a TextBox that takes up all remaining space in the Grid (and thereby in the Window). The Grid is given a minimal width and height and is wrapped within a ScrollViewer. If the user resizes the window to be smaller than the minimal widht/height of the Grid, scrollbars are displayed. This is exactly how I want it to be. However, a problem occurs when the user starts typing text. If the text is to long to fit in one line in the TextBox, I want the text to wrap. Therefore I set TextWrapping="Wrap" on the TextBox. But since the TextBox has an automatic width and is wrapped in a ScrollViewer (its actually the whole Grid that is wrapped), the TextBox just keeps expanding to the right. I do want the TextBox to expand if the window is expanded, but I don't want the TextBox to expand by the text. Rather the text should wrap inside the available TextBox. If the text don't fit within the TextBox height, a scrollbar should be displayed within the TextBox. Is there a way to accomplish this? Below is some code that shows my problem. <Window x:Class="AdaptingTextBoxes.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="300" Width="400" Background="DarkCyan"> <Grid Margin="10" Name="LayoutRoot"> <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"> <Grid MinWidth="300" MinHeight="200"> <Grid.ColumnDefinitions> <ColumnDefinition Width="auto" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Button Grid.Column="0" Margin="0,0,10,0" Content="Button" Width="100" /> <TextBox Grid.Column="1" AcceptsReturn="True" TextWrapping="Wrap" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Auto" /> </Grid> </ScrollViewer> </Grid> </Window>

Read the article

Animate button on MouseOver and MouseDown

- by haagel

I'm making my own ControlTemplate for a standard Button in WPF. I want to change the background of my button when the user hovers over the button with the mouse, but also when the user presses the button (to yet another color). This seems like a common behavior, but I can't get it to work. My template consists of a Border with an Image inside. It is the background color (a gradient really) of the Border that I want to animate. I have triggers in my template that activates animations (storyboards). The MouseOver/Out works just fine. My problem occurs when I press the button. The Press animation runs as it should, and so does the Release animation. But after this the MouseOut will never run. The button gets stuck in the MouseOver state. What am I doing wrong? <ControlTemplate TargetType="{x:Type Button}"> <ControlTemplate.Resources> <Storyboard x:Key="MouseOverAnimation"> <ColorAnimation Storyboard.TargetName="ButtonBorderGradientStop1" Storyboard.TargetProperty="Color" To="#ffefefff" Duration="0:0:0.2" /> <ColorAnimation Storyboard.TargetName="ButtonBorderGradientStop2" Storyboard.TargetProperty="Color" To="#ffc7c7ff" Duration="0:0:0.2" /> </Storyboard> <Storyboard x:Key="MouseOutAnimation"> <ColorAnimation Storyboard.TargetName="ButtonBorderGradientStop1" Storyboard.TargetProperty="Color" To="#ffeeeeee" Duration="0:0:0.2" /> <ColorAnimation Storyboard.TargetName="ButtonBorderGradientStop2" Storyboard.TargetProperty="Color" To="#ffcccccc" Duration="0:0:0.2" /> </Storyboard> <Storyboard x:Key="MouseDownAnimation"> <ColorAnimation Storyboard.TargetName="ButtonBorderGradientStop1" Storyboard.TargetProperty="Color" To="#ffc7c7ff" Duration="0:0:0.1" /> <ColorAnimation Storyboard.TargetName="ButtonBorderGradientStop2" Storyboard.TargetProperty="Color" To="#ff9a9aff" Duration="0:0:0.1" /> </Storyboard> <Storyboard x:Key="MouseUpAnimation"> <ColorAnimation Storyboard.TargetName="ButtonBorderGradientStop1" Storyboard.TargetProperty="Color" To="#ffefefff" Duration="0:0:0.1" /> <ColorAnimation Storyboard.TargetName="ButtonBorderGradientStop2" Storyboard.TargetProperty="Color" To="#ffc7c7ff" Duration="0:0:0.1" /> </Storyboard> </ControlTemplate.Resources> <Border x:Name="ButtonBorder" CornerRadius="0" BorderBrush="#55aaaaaa" BorderThickness="1" Width="23" Height="22"> <Border.Background> <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> <GradientBrush.GradientStops> <GradientStop x:Name="ButtonBorderGradientStop1" Color="#ffeeeeee" Offset="0.0" /> <GradientStop x:Name="ButtonBorderGradientStop2" Color="#ffcccccc" Offset="1.0" /> </GradientBrush.GradientStops> </LinearGradientBrush> </Border.Background> <Image x:Name="ButtonIcon" Source="icons/searchicon_bw.png" Width="16" Height="16" /> </Border> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Trigger.EnterActions> <BeginStoryboard Storyboard="{StaticResource MouseOverAnimation}" /> </Trigger.EnterActions> <Trigger.ExitActions> <BeginStoryboard Storyboard="{StaticResource MouseOutAnimation}" /> </Trigger.ExitActions> </Trigger> <Trigger Property="IsPressed" Value="True"> <Trigger.EnterActions> <BeginStoryboard Storyboard="{StaticResource MouseDownAnimation}" /> </Trigger.EnterActions> <Trigger.ExitActions> <BeginStoryboard Storyboard="{StaticResource MouseUpAnimation}" /> </Trigger.ExitActions> </Trigger> </ControlTemplate.Triggers> </ControlTemplate>

Read the article

Putting binary resources (images) in a separate assembly (WPF/.NET)

- by haagel

I have a .NET solution with a couple of projects. The output is a WPF application. Now I would like to put my binary resources (images/icons) in a single project/assembly in this solution, so that all my other projects in can use them. My question is how I can do that? What type of project should I create and how should I reference these resources in my XAML code (in the other projects)? I've tried quite a few things but I can't seem to get it to work...

Read the article

WPF: Binding an integer to a TextBlock with TemplateBinding

- by haagel

I have a custom control in WPF. In this I have a DependencyProperty of the type integer. In the template for the custom control I have a TextBlock, I and would like to show the value of the integer in the TextBlock. But I can't get it to work. I'm using TemplateBinding. If I use the same code but change the type of the DependencyProperty to string it works fine. But I really want it to be an integer for the rest of my application to work. How can I do this? I've written simplified code that shows the problem. First the custom control: public class MyCustomControl : Control { static MyCustomControl() { DefaultStyleKeyProperty.OverrideMetadata(typeof(MyCustomControl), new FrameworkPropertyMetadata(typeof(MyCustomControl))); MyIntegerProperty = DependencyProperty.Register("MyInteger", typeof(int), typeof(MyCustomControl), new FrameworkPropertyMetadata(0)); } public int MyInteger { get { return (int)GetValue(MyCustomControl.MyIntegerProperty); } set { SetValue(MyCustomControl.MyIntegerProperty, value); } } public static readonly DependencyProperty MyIntegerProperty; } And this is my default template: <Style TargetType="{x:Type local:MyCustomControl}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type local:MyCustomControl}"> <Border BorderThickness="1" CornerRadius="4" BorderBrush="Black" Background="Azure"> <StackPanel Orientation="Vertical"> <TextBlock Text="{TemplateBinding MyInteger}" HorizontalAlignment="Center" /> </StackPanel> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> What am I doing wrong? Thanks // David

Read the article

I have a problem with a TextBox in an application... A window has a Grid with two columns. The left

- by haagel

I have a problem with a TextBox in an application... A window has a Grid with two columns. The left column contains a control with a constant width but with a height that adapts. The right column contains a TextBox that takes up all remaining space in the Grid (and thereby in the Window). The Grid is given a minimal width and height and is wrapped within a ScrollViewer. If the user resizes the window to be smaller than the minimal widht/height of the Grid, scrollbars are displayed. This is exactly how I want it to be. However, a problem occurs when the user starts typing text. If the text is to long to fit in one line in the TextBox, I want the text to wrap. Therefore I set TextWrapping="Wrap" on the TextBox. But since the TextBox has an automatic width and is wrapped in a ScrollViewer (its actually the whole Grid that is wrapped), the TextBox just keeps expanding to the right. I do want the TextBox to expand if the window is expanded, but I don't want the TextBox to expand by the text. Rather the text should wrap inside the available TextBox. If the text don't fit within the TextBox height, a scrollbar should be displayed within the TextBox. Is there a way to accomplish this? Below is some code that shows my problem. <Window x:Class="AdaptingTextBoxes.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="300" Width="400" Background="DarkCyan"> <Grid Margin="10" Name="LayoutRoot"> <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"> <Grid MinWidth="300" MinHeight="200"> <Grid.ColumnDefinitions> <ColumnDefinition Width="auto" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Button Grid.Column="0" Margin="0,0,10,0" Content="Button" Width="100" /> <TextBox Grid.Column="1" AcceptsReturn="True" TextWrapping="Wrap" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Auto" /> </Grid> </ScrollViewer> </Grid> </Window>

Developer IT