如何从 ViewModel 读取 TextBox 焦点 - MVVM Light
How to read TextBox focus from ViewModel - MVVM Light
我有两个文本框,在我的 ViewModel 中,我希望能够跟踪哪个框当前处于焦点状态。
<TextBox x:Name="textBox1" Text="Text Box 1"/>
<TextBox x:Name="textBox2" Text="Text Box 2"/>
如何read/identify我的 ViewModel 中的当前焦点是哪个文本框?
public static DependencyProperty IsFocusedProperty = DependencyProperty.RegisterAttached(
"IsFocused",
typeof(bool),
typeof(TextBoxProperties),
new UIPropertyMetadata(false,OnIsFocusedChanged)
);
public static bool GetIsFocused(DependencyObject dependencyObject) {
return (bool)dependencyObject.GetValue(IsFocusedProperty);
}
public static void SetIsFocused(DependencyObject dependencyObject, bool value) {
dependencyObject.SetValue(IsFocusedProperty, value);
}
你可以用这个属性
这不能通过服务器端的 ViewModel 完成,解决方法如下所示:
查看代码:(js & html)
function updateFocus(textboxNr) {
$.ajax({
type: "POST",
url: '@Url.Action("Index", "Controller")',
data: {
Focus: textboxNr
},
contentType: "application/json; charset=utf-8",
dataType: "json",
});
}
<textarea id="1" name="1" onfocus="updateFocus(1)">Text Box 1</textarea>
<textarea id="2" name="2" onfocus="updateFocus(2)">Text Box 2</textarea>
有几种方法可以实现这一点,其中一些是:
1)使用行为:
- 你需要System.Windows.Interactivity.dll
行为(设置IsFocused
属性不会使元素聚焦,您需要稍微扩展行为才能实现此目的)
public class FocusChangedBehavior : Behavior<UIElement>
{
public static readonly DependencyProperty IsFocusedProperty =
DependencyProperty.Register(
nameof(IsFocused),
typeof(bool),
typeof(FocusChangedBehavior),
new FrameworkPropertyMetadata(default(bool),
FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
public bool IsFocused
{
get { return (bool)this.GetValue(IsFocusedProperty); }
set { this.SetValue(IsFocusedProperty, value); }
}
/// <inheritdoc />
protected override void OnAttached()
{
this.AssociatedObject.GotFocus += this.AssociatedObjectFocused;
this.AssociatedObject.LostFocus += this.AssociatedObjectUnfocused;
}
/// <inheritdoc />
protected override void OnDetaching()
{
this.AssociatedObject.GotFocus -= this.AssociatedObjectFocused;
this.AssociatedObject.LostFocus -= this.AssociatedObjectUnfocused;
}
private void AssociatedObjectFocused(object sender, RoutedEventArgs e)
{
this.IsFocused = true;
}
private void AssociatedObjectUnfocused(object sender, RoutedEventArgs e)
{
this.IsFocused = false;
}
}
在 XAML 中,您将 IsFocused
绑定到 ViewModel 中的 属性。
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
<TextBox x:Name="textBox1" Text="Text Box 1">
<i:Interaction.Behaviors>
<local:FocusChangedBehavior IsFocused="{Binding IsFocusedTxt1}" />
</i:Interaction.Behaviors>
</TextBox>
<TextBox x:Name="textBox2" Text="Text Box 2">
<i:Interaction.Behaviors>
<local:FocusChangedBehavior IsFocused="{Binding IsFocusedTxt2}" />
</i:Interaction.Behaviors>
</TextBox>
最后在视图模型中创建属性
public bool IsFocusedTxt1 { get; set; }
public bool IsFocusedTxt2 { get; set; }
2) 或者你可以在 XAML
中使用 EventTrigger
- 您需要 System.Windows.Interactivity.dll 和 MicrosoftExpressionInteractions(对于 ActionCommand)
事件触发器:
<TextBox x:Name="textBox1" Text="Text Box 1">
<i:Interaction.Triggers>
<i:EventTrigger EventName="GotFocus">
<i:InvokeCommandAction Command="{Binding NotifyFocusedReceivedTxt1Command}" />
</i:EventTrigger>
</i:Interaction.Triggers>
</TextBox>
在 ViewModel 中创建命令 NotifyFocusedReceivedTxt1Command
public ICommand NotifyFocusedReceivedTxt1Command { get; }
// in constructor
this.NotifyFocusedReceivedTxt1Command = new ActionCommand(this.FocusedReceivedTxt1);
// and method
private void FocusedReceivedTxt1()
{
// Your logic
}
此外,如果您不想引入很多 command/properties,您可以使用相同的命令并通过设置 CommandParameter
来传递不同的文本框(稍微破坏 MVVM,但并不严重)
<TextBox x:Name="textBox1" Text="Text Box 1">
<i:Interaction.Triggers>
<i:EventTrigger EventName="GotFocus">
<i:InvokeCommandAction Command="{Binding NotifyFocusedReceivedCommand}"
CommandParameter="{Binding ., ElementName=textBox1}" />
</i:EventTrigger>
</i:Interaction.Triggers>
</TextBox>
<TextBox x:Name="textBox2" Text="Text Box 2">
<i:Interaction.Triggers>
<i:EventTrigger EventName="GotFocus">
<i:InvokeCommandAction Command="{Binding NotifyFocusedReceivedCommand}"
CommandParameter="{Binding ., ElementName=textBox2}" />
</i:EventTrigger>
</i:Interaction.Triggers>
</TextBox>
和
public ICommand NotifyFocusedReceivedCommand { get; }
// in constructor
this.NotifyFocusedReceivedCommand = new ActionCommand(this.FocusedReceived);
// and method
private void FocusedReceived(object control)
{
var txt = (TextBox)control;
bool isFocused = txt.IsFocused;
string name = txt.Name;
}
我有两个文本框,在我的 ViewModel 中,我希望能够跟踪哪个框当前处于焦点状态。
<TextBox x:Name="textBox1" Text="Text Box 1"/>
<TextBox x:Name="textBox2" Text="Text Box 2"/>
如何read/identify我的 ViewModel 中的当前焦点是哪个文本框?
public static DependencyProperty IsFocusedProperty = DependencyProperty.RegisterAttached(
"IsFocused",
typeof(bool),
typeof(TextBoxProperties),
new UIPropertyMetadata(false,OnIsFocusedChanged)
);
public static bool GetIsFocused(DependencyObject dependencyObject) {
return (bool)dependencyObject.GetValue(IsFocusedProperty);
}
public static void SetIsFocused(DependencyObject dependencyObject, bool value) {
dependencyObject.SetValue(IsFocusedProperty, value);
}
你可以用这个属性
这不能通过服务器端的 ViewModel 完成,解决方法如下所示:
查看代码:(js & html)
function updateFocus(textboxNr) {
$.ajax({
type: "POST",
url: '@Url.Action("Index", "Controller")',
data: {
Focus: textboxNr
},
contentType: "application/json; charset=utf-8",
dataType: "json",
});
}
<textarea id="1" name="1" onfocus="updateFocus(1)">Text Box 1</textarea>
<textarea id="2" name="2" onfocus="updateFocus(2)">Text Box 2</textarea>
有几种方法可以实现这一点,其中一些是:
1)使用行为:
- 你需要System.Windows.Interactivity.dll
行为(设置
IsFocused
属性不会使元素聚焦,您需要稍微扩展行为才能实现此目的)public class FocusChangedBehavior : Behavior<UIElement> { public static readonly DependencyProperty IsFocusedProperty = DependencyProperty.Register( nameof(IsFocused), typeof(bool), typeof(FocusChangedBehavior), new FrameworkPropertyMetadata(default(bool), FrameworkPropertyMetadataOptions.BindsTwoWayByDefault)); public bool IsFocused { get { return (bool)this.GetValue(IsFocusedProperty); } set { this.SetValue(IsFocusedProperty, value); } } /// <inheritdoc /> protected override void OnAttached() { this.AssociatedObject.GotFocus += this.AssociatedObjectFocused; this.AssociatedObject.LostFocus += this.AssociatedObjectUnfocused; } /// <inheritdoc /> protected override void OnDetaching() { this.AssociatedObject.GotFocus -= this.AssociatedObjectFocused; this.AssociatedObject.LostFocus -= this.AssociatedObjectUnfocused; } private void AssociatedObjectFocused(object sender, RoutedEventArgs e) { this.IsFocused = true; } private void AssociatedObjectUnfocused(object sender, RoutedEventArgs e) { this.IsFocused = false; } }
在 XAML 中,您将
IsFocused
绑定到 ViewModel 中的 属性。
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
<TextBox x:Name="textBox1" Text="Text Box 1"> <i:Interaction.Behaviors> <local:FocusChangedBehavior IsFocused="{Binding IsFocusedTxt1}" /> </i:Interaction.Behaviors> </TextBox> <TextBox x:Name="textBox2" Text="Text Box 2"> <i:Interaction.Behaviors> <local:FocusChangedBehavior IsFocused="{Binding IsFocusedTxt2}" /> </i:Interaction.Behaviors> </TextBox>
最后在视图模型中创建属性
public bool IsFocusedTxt1 { get; set; } public bool IsFocusedTxt2 { get; set; }
2) 或者你可以在 XAML
EventTrigger
- 您需要 System.Windows.Interactivity.dll 和 MicrosoftExpressionInteractions(对于 ActionCommand)
事件触发器:
<TextBox x:Name="textBox1" Text="Text Box 1"> <i:Interaction.Triggers> <i:EventTrigger EventName="GotFocus"> <i:InvokeCommandAction Command="{Binding NotifyFocusedReceivedTxt1Command}" /> </i:EventTrigger> </i:Interaction.Triggers> </TextBox>
在 ViewModel 中创建命令 NotifyFocusedReceivedTxt1Command
public ICommand NotifyFocusedReceivedTxt1Command { get; } // in constructor this.NotifyFocusedReceivedTxt1Command = new ActionCommand(this.FocusedReceivedTxt1); // and method private void FocusedReceivedTxt1() { // Your logic }
此外,如果您不想引入很多 command/properties,您可以使用相同的命令并通过设置
CommandParameter
来传递不同的文本框(稍微破坏 MVVM,但并不严重)<TextBox x:Name="textBox1" Text="Text Box 1"> <i:Interaction.Triggers> <i:EventTrigger EventName="GotFocus"> <i:InvokeCommandAction Command="{Binding NotifyFocusedReceivedCommand}" CommandParameter="{Binding ., ElementName=textBox1}" /> </i:EventTrigger> </i:Interaction.Triggers> </TextBox> <TextBox x:Name="textBox2" Text="Text Box 2"> <i:Interaction.Triggers> <i:EventTrigger EventName="GotFocus"> <i:InvokeCommandAction Command="{Binding NotifyFocusedReceivedCommand}" CommandParameter="{Binding ., ElementName=textBox2}" /> </i:EventTrigger> </i:Interaction.Triggers> </TextBox>
和
public ICommand NotifyFocusedReceivedCommand { get; } // in constructor this.NotifyFocusedReceivedCommand = new ActionCommand(this.FocusedReceived); // and method private void FocusedReceived(object control) { var txt = (TextBox)control; bool isFocused = txt.IsFocused; string name = txt.Name; }