Question

我有两个文本框，在ViewModel中，我希望能够跟踪当前焦点位于哪个框。

<TextBox x:Name="textBox1" Text="Text Box 1"/>
<TextBox x:Name="textBox2" Text="Text Box 2"/>

如何从ViewModel中读取/识别当前焦点在哪个文本框？

Answer 1

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);
}

您可以使用此属性

Answer 2

有几种方法可以实现这一目标，其中一些：

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 (For the 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
}

此外，如果您不想引入很多命令/属性，则可以使用相同的命令并通过设置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;
}

Answer 3

这不能通过服务器端的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>

如何从ViewModel读取TextBox焦点-MVVM Light

3 个答案: