Cannot Set Foreground For TextBox in DataTemplate in WPF - c#

I am trying to set the Foreground property for a TextBox specified in a DataTemplate but the call doesn't work.
I have a UserControl with the following XAML:
<UserControl x:Class="TextBoxColourTest.TextFrameControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
xmlns:clrtest="clr-namespace:TextBoxColourTest"
d:DesignHeight="300" d:DesignWidth="300">
<UserControl.Resources>
<DataTemplate x:Key="EditModeTemplate">
<TextBox Text="Hello"></TextBox>
</DataTemplate>
<Style TargetType="{x:Type clrtest:TextFrameControl}">
<Setter Property="ContentTemplate" Value="{StaticResource EditModeTemplate}"></Setter>
</Style>
</UserControl.Resources>
</UserControl>
Then I have some XAML that makes use of the TextFrameControl:
<Window x:Class="TextBoxColourTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:textBoxColourTest="clr-namespace:TextBoxColourTest"
Title="MainWindow" Height="350" Width="525">
<Grid>
<StackPanel>
<textBoxColourTest:TextFrameControl x:Name="TextFrameControl"></textBoxColourTest:TextFrameControl>
<Button Content="Red" Click="OnMouseUpRed"></Button>
<Button Content="Green" Click="OnMouseUpGreen"></Button>
</StackPanel>
</Grid>
</Window>
Then finally the code behind where I have event handlers for the buttons to change the foreground color:
namespace TextBoxColourTest
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void OnMouseUpRed(object sender, RoutedEventArgs routedEventArgs)
{
TextFrameControl.Foreground = new SolidColorBrush(Colors.Red);
}
private void OnMouseUpGreen(object sender, RoutedEventArgs routedEventArgs)
{
TextFrameControl.Foreground = new SolidColorBrush(Colors.Green);
}
}
}
When one of the color buttons is clicked then the foreground color does not change.
If I change the code so that I can alter the value of the font family or font size properties then that does work. Also, I've found that if I replace the TextBox with a TextBlock then the color does change.

Bind the Foreground property of the TextBox to that of the UserControl:
<DataTemplate x:Key="EditModeTemplate">
<TextBox Text="Hello"
Foreground="{Binding Foreground,
RelativeSource={RelativeSource AncestorType=UserControl}}"/>
</DataTemplate>

Related

Focus Textbox across multiple Usercontrols controlling from MainWindow

i have two usercontrols which is bound in MainWindow. What i want when MainWindow is Loaded, textbox1 which is in usercontrol1 should be focused automatically, and when i hit down arrow from keyboard textbox2 which is in usercontrol2 should be focused. And again on up arrow focus textbox1.
Below is MainWindow's xaml code`
<Window x:Class="FocusTextboxesFromMain.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:FocusTextboxesFromMain" Loaded="Window_Loaded"
mc:Ignorable="d"
Title="Focus Textboxes Testing" Height="450" Width="800">
<Grid>
<StackPanel>
<local:UserControl1/>
<local:UserControl2/>
</StackPanel>
</Grid>
Below is Usercontrol1's xaml code`
<UserControl
x:Class="FocusTextboxesFromMain.UserControl1"
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:local="clr-namespace:FocusTextboxesFromMain"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
Width="800"
Height="200"
mc:Ignorable="d">
<Grid Background="Red">
<TextBlock
FontSize="50"
Foreground="White"
Text="UserControl1" />
<TextBox
x:Name="textbox1"
Width="200"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="25" />
</Grid>
and below is Usercontrol2's xaml code`
<UserControl
x:Class="FocusTextboxesFromMain.UserControl2"
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:local="clr-namespace:FocusTextboxesFromMain"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
Width="800"
Height="200"
mc:Ignorable="d">
<Grid Background="Green">
<TextBlock
FontSize="50"
Foreground="White"
Text="UserControl2" />
<TextBox
x:Name="textbox2"
Width="200"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="25" />
</Grid>
please note that i want all my logic in MainWindow Class, MvvM should not be involved
namespace FocusTextboxesFromMain
{
using System.Windows;
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void Window_Loaded(object sender, RoutedEventArgs e)
{
// Focus textbox1 of usercontrol1
}
// on down arrow then Focus textbox2 of usercontrol2
// and again on up arrow then Focus textbox1 of usercontrol1
}
}
sorry for bad explanation, thanks in advance
You can find what you are looking for in the answer of this question:
Moving to next control on Enter keypress in WPF
Just follow the code and create related event
public MainWindow()
{
InitializeComponent();
this.PreviewKeyDown += new KeyEventHandler(txtFirst_KeyDown);
this.PreviewKeyDown += new KeyEventHandler(txtSecond_KeyDown);
}
private void txtFirst_KeyDown(object sender, KeyEventArgs e)
{
if (e.Key == System.Windows.Input.Key.Down)
{
txtSecond.Focus();
}
}
private void txtSecond_KeyDown(object sender, KeyEventArgs e)
{
if (e.Key == System.Windows.Input.Key.Up)
{
txtFirst.Focus();
}
}
private void Window_Loaded_1(object sender, RoutedEventArgs e)
{
txtFirst.Focus();
}

ListBox within Popup - position and binding issue

Following is the code of UI and code behind. There is no additional code than this.
Issues are
ListBox is not visible when I bind value to ObservableCollection with some delay.
ListBox is not in center of the popup. Can see in Design Viewer.
I tried placing ListBox out of popup and it works well. My need is to place listbox with in popup.
MainWindow.xaml
<Window x:Class="WPFTest.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:WPFTest"
mc:Ignorable="d"
Title="TestWPF" MinHeight="500" MinWidth="600"
WindowStyle="SingleBorderWindow" WindowStartupLocation="CenterScreen">
<Grid x:Name="mainContainer">
<Popup x:Name="popup" IsOpen="False" Margin="10" PlacementTarget="{Binding ElementName=mainContainer}"
Placement="Center" Height="300" Width="300">
<ListBox ItemsSource="{Binding InstallationSummary}">
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="IsEnabled" Value="False"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<Border BorderThickness="0,0,0,1"
Margin="5" Padding="2">
<TextBlock Text="{Binding}"
TextWrapping="Wrap" Foreground="Black"/>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Popup>
</Grid>
</Window>
MainWindow.xaml.cs
using System.Collections.ObjectModel;
using System.Threading.Tasks;
using System.Windows;
namespace WPFTest
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
ObservableCollection<string> InstallationSummary;
public MainWindow()
{
InitializeComponent();
this.Loaded += MainWindow_Loaded;
InstallationSummary = new ObservableCollection<string>();
this.DataContext = this;
}
async private void MainWindow_Loaded(object sender, RoutedEventArgs e)
{
popup.IsOpen = true;
for (int i = 0; i < 25; i++)
{
await Task.Delay(1000);
App.Current.Dispatcher.Invoke(() =>
{
InstallationSummary.Add("New Item-" + i);
});
}
}
}
}
try converting your private variable
ObservableCollection InstallationSummary
to an public property like this
public ObservableCollection<string> InstallationSummary{ get set};
and should work fine..

Attaching Behaviour to MetroWindow fails and results in wrong Style

I have a simple test application that shows a simple Mahapps MetroWindow with an attached Behaviour. The problem is when attaching the Behaviour the outer border of the Mahapps MetroWindow is drawn.
<controls:MetroWindow x:Class="Desktop.Shell.Modern.ShellView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls"
xmlns:cal="http://www.caliburnproject.org"
xmlns:modern="clr-namespace:Desktop.Shell.Modern"
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
Height="350"
Width="525"
ResizeMode="CanResizeWithGrip"
WindowTransitionsEnabled="True"
ShowIconOnTitleBar="False"
TitleCaps="False"
GlowBrush="{DynamicResource WindowTitleColorBrush}" >
<i:Interaction.Behaviors>
<modern:SomeBehavior SomeKey="{Binding Key}" />
</i:Interaction.Behaviors>
<ContentControl cal:View.Model="{Binding ActiveItem}" />
</controls:MetroWindow>
When removing the Behaviour everything looks as expected:
... but the Behaviour itself did nothing (yet). Here is the code of the SomeBehaviour class:
public sealed class SomeBehavior : Behavior<Window>
{
public static readonly DependencyProperty SomeKeyProperty =
DependencyProperty.Register(
"SomeKey",
typeof(Key),
typeof(SomeBehavior),
new PropertyMetadata(default(Key)));
public Key SomeKey
{
get
{
return (Key)this.GetValue(SomeKeyProperty);
}
set
{
this.SetValue(SomeKeyProperty, value);
}
}
protected override void OnAttached()
{
base.OnAttached();
}
protected override void OnDetaching()
{
base.OnDetaching();
}
}
Am I doing something wrong? Should I attach the Behaviour in a different way than attaching them to "normal" Windows?
That's because Mahapps.Metro sets its required behaviours in the window style, see MetroWindow.xaml.
If you want to attach additional behaviors, you have to copy these behaviours to your window, e.g.
<controls:MetroWindow x:Class="Desktop.Shell.Modern.ShellView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls"
xmlns:cal="http://www.caliburnproject.org"
xmlns:modern="clr-namespace:Desktop.Shell.Modern"
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
xmlns:Behaviours="http://metro.mahapps.com/winfx/xaml/shared"
Height="350"
Width="525"
ResizeMode="CanResizeWithGrip"
WindowTransitionsEnabled="True"
ShowIconOnTitleBar="False"
TitleCaps="False"
GlowBrush="{DynamicResource WindowTitleColorBrush}" >
<i:Interaction.Behaviors>
<modern:SomeBehavior SomeKey="{Binding Key}" />
<Behaviours:BorderlessWindowBehavior />
<Behaviours:WindowsSettingBehaviour />
<Behaviours:GlowWindowBehavior />
</i:Interaction.Behaviors>
<ContentControl cal:View.Model="{Binding ActiveItem}" />
</controls:MetroWindow>

Custom Control Dependency Property Binding to Property

Just playing around with different types of bindings and having a property binding a Dependency Property of my custom control to another property.
XAML:
<UserControl x:Class="BrickBreaker.Brick"
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"
d:DesignHeight="20" d:DesignWidth="50" >
<Rectangle Width="50" Height="20" RadiusX="3" RadiusY="3" Stroke="Black" Fill="{Binding BrickFill, Mode=TwoWay}" />
Code Behind:
public partial class Brick : UserControl
{
public Brick()
{
InitializeComponent();
}
public Brush BrickFill
{
get { return (Brush)GetValue(BrickFillProperty); }
set { SetValue(BrickFillProperty, value); }
}
// Using a DependencyProperty as the backing store for BrickFill. This enables animation, styling, binding, etc...
public static readonly DependencyProperty BrickFillProperty =
DependencyProperty.Register("BrickFill", typeof(Brush), typeof(Brick), null);
}
Implemenation In MainWindow.xaml
<UserControl x:Class="BrickBreaker.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" xmlns:BrickBreaker="clr-namespace:BrickBreaker" mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<Grid x:Name="LayoutRoot" Background="White">
<BrickBreaker:Brick Margin="100,100,0,0" BrickFill="Azure"/>
</Grid>
Basically I want to bind the Rectangles Fill Property to the Dependency Property in the code behind.
Thanks.
Steve
What is the exact problem? Set DataContext of UserControl to code-behind, such as:
<UserControl DataContext="{Binding RelativeSource={RelativeSource Self}}">
</UserControl>
Missing this: DataContext="{Binding RelativeSource={RelativeSource Self}}"

How to put a MouseDown event in a Style?

This works:
XAML:
<Window x:Class="Test239992.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<StackPanel>
<TextBlock Tag="1" Text="Customers" MouseDown="Handle_Click"/>
<TextBlock Tag="2" Text="Appointments" MouseDown="Handle_Click"/>
</StackPanel>
</Window>
Code Behind:
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
namespace Test239992
{
public partial class Window1 : Window
{
public Window1()
{
InitializeComponent();
}
private void Handle_Click(object sender, MouseButtonEventArgs e)
{
int id = Int32.Parse(((TextBlock)sender).Tag.ToString());
MessageBox.Show("you chose id " + id.ToString());
}
}
}
But how do I put the MouseDown event in a style, this gives me the error "Cannot find the Style Property 'MouseDown' on the type 'System.Windows.Controls.TextBlock'":
<Window x:Class="Test239992.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Window.Resources>
<Style TargetType="{x:Type TextBlock}" x:Key="ClickableTextBlockStyle">
<Setter Property="MouseDown" Value="Handle_Click" />
</Style>
</Window.Resources>
<StackPanel>
<TextBlock Tag="1" Text="Customers" Style="{DynamicResource ClickableTextBlockStyle}"/>
<TextBlock Tag="2" Text="Appointments" Style="{DynamicResource ClickableTextBlockStyle}"/>
</StackPanel>
</Window>
Try EventSetter :)
<Style TargetType="{x:Type TextBlock}" x:Key="ClickableTextBlockStyle">
<EventSetter Event="MouseDown" Handler="Handle_Click" />
</Style>
Have a look at Triggers in WPF:
http://mark-dot-net.blogspot.com/2007/07/creating-custom-wpf-button-template-in.html

Categories