WPF 在绑定表达式添加计算

发布于

很多时候一些简单的使用绑定需要对绑定的源做处理就需要通过转换器，这样的代码写起来不好看 本文告诉大家通过一个简单的库可以实现在界面绑定的时候通过表达式不需要转换

首先通过 Nuget 安装 CalcBinding 库，注意 Nuget 的地址是 https://api.nuget.org/v3/index.json 如果没有找到这个库就请复制链接点击更新，再输入 CalcBinding 寻找

在使用这个库之前需要引用命名空间，打开 MainWindow.xaml 文件，添加命名空间

代码语言：javascript
复制
xmlns:c="clr-namespace:CalcBinding;assembly=CalcBinding"

然后创建一个数据用来绑定

代码语言：javascript
复制
    public class ViewModel : INotifyPropertyChanged
    {
        public double A
        {
            get => _a;
            set
            {
                if (value.Equals(_a)) return;
                _a = value;
                OnPropertyChanged();
            }
        }

    public double B
    {
        get => _b;
        set
        {
            if (value.Equals(_b)) return;
            _b = value;
            OnPropertyChanged();
        }
    }

    public double C
    {
        get => _c;
        set
        {
            if (value.Equals(_c)) return;
            _c = value;
            OnPropertyChanged();
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    private double _a = 1;
    private double _b = 2;
    private double _c;

    [NotifyPropertyChangedInvocator]
    private void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}</code></pre></div></div><p>这时在界面如果需要创建一个 TextBlock 绑定三个值 A + B + C 就可以通过下面的方法</p><div class="rno-markdown-code"><div class="rno-markdown-code-toolbar"><div class="rno-markdown-code-toolbar-info"><div class="rno-markdown-code-toolbar-item is-type"><span class="is-m-hidden">代码语言：</span>javascript</div></div><div class="rno-markdown-code-toolbar-opt"><div class="rno-markdown-code-toolbar-copy"><i class="icon-copy"></i><span class="is-m-hidden">复制</span></div></div></div><div class="developer-code-block"><pre class="prism-token token line-numbers language-javascript"><code class="language-javascript" style="margin-left:0">        &lt;TextBlock Text=&#34;{c:Binding A+B+C}&#34; HorizontalAlignment=&#34;Center&#34; VerticalAlignment=&#34;Center&#34;&gt;&lt;/TextBlock&gt;</code></pre></div></div><p>通过直接写表达式的方式就可以，十分简单</p><p>那如果需要加上一些常量怎么做，如计算 <code>0.5*A+B</code> 可以怎么写？</p><div class="rno-markdown-code"><div class="rno-markdown-code-toolbar"><div class="rno-markdown-code-toolbar-info"><div class="rno-markdown-code-toolbar-item is-type"><span class="is-m-hidden">代码语言：</span>javascript</div></div><div class="rno-markdown-code-toolbar-opt"><div class="rno-markdown-code-toolbar-copy"><i class="icon-copy"></i><span class="is-m-hidden">复制</span></div></div></div><div class="developer-code-block"><pre class="prism-token token line-numbers language-javascript"><code class="language-javascript" style="margin-left:0">&lt;TextBlock Text=&#34;{c:Binding 0.5*A+B}&#34; /&gt;</code></pre></div></div><p>修改一下界面然后运行</p><div class="rno-markdown-code"><div class="rno-markdown-code-toolbar"><div class="rno-markdown-code-toolbar-info"><div class="rno-markdown-code-toolbar-item is-type"><span class="is-m-hidden">代码语言：</span>javascript</div></div><div class="rno-markdown-code-toolbar-opt"><div class="rno-markdown-code-toolbar-copy"><i class="icon-copy"></i><span class="is-m-hidden">复制</span></div></div></div><div class="developer-code-block"><pre class="prism-token token line-numbers language-javascript"><code class="language-javascript" style="margin-left:0">            &lt;StackPanel&gt;
            &lt;TextBlock&gt;
                &lt;Run Text=&#34;A=&#34; /&gt;
                &lt;Run Text=&#34;{Binding A}&#34; /&gt;
            &lt;/TextBlock&gt;
            &lt;TextBlock&gt;
                &lt;Run Text=&#34;B=&#34; /&gt;
                &lt;Run Text=&#34;{Binding B}&#34; /&gt;
            &lt;/TextBlock&gt;
            &lt;TextBlock&gt;
                &lt;Run Text=&#34;C=&#34; /&gt;
                &lt;Run Text=&#34;{Binding C}&#34; /&gt;
            &lt;/TextBlock&gt;
            &lt;TextBlock Text=&#34;0.5*A+B&#34; /&gt;
            &lt;TextBlock Text=&#34;{c:Binding 0.5*A+B}&#34; /&gt;
        &lt;/StackPanel&gt;</code></pre></div></div><figure class=""><div class="rno-markdown-img-url" style="text-align:center"><div class="rno-markdown-img-url-inner" style="width:54.85%"><div style="width:100%"><img src="https://cdn.static.attains.cn/app/developer-bbs/upload/1723276545003888907.jpeg" /></div></div></div></figure><p>如果此时的还有一些布尔量怎么办？打开 ViewModel 类添加下面代码</p><div class="rno-markdown-code"><div class="rno-markdown-code-toolbar"><div class="rno-markdown-code-toolbar-info"><div class="rno-markdown-code-toolbar-item is-type"><span class="is-m-hidden">代码语言：</span>javascript</div></div><div class="rno-markdown-code-toolbar-opt"><div class="rno-markdown-code-toolbar-copy"><i class="icon-copy"></i><span class="is-m-hidden">复制</span></div></div></div><div class="developer-code-block"><pre class="prism-token token line-numbers language-javascript"><code class="language-javascript" style="margin-left:0">        public bool BoolA
    {
        get =&gt; _boolA;
        set
        {
            if (value == _boolA) return;
            _boolA = value;
            OnPropertyChanged();
        }
    }

    public bool BoolB
    {
        get =&gt; _boolB;
        set
        {
            if (value == _boolB) return;
            _boolB = value;
            OnPropertyChanged();
        }
    }

    private bool _boolB;
    private bool _boolA = true;</code></pre></div></div><p>如果需要绑定 A 和 B 可以这样写</p><div class="rno-markdown-code"><div class="rno-markdown-code-toolbar"><div class="rno-markdown-code-toolbar-info"><div class="rno-markdown-code-toolbar-item is-type"><span class="is-m-hidden">代码语言：</span>javascript</div></div><div class="rno-markdown-code-toolbar-opt"><div class="rno-markdown-code-toolbar-copy"><i class="icon-copy"></i><span class="is-m-hidden">复制</span></div></div></div><div class="developer-code-block"><pre class="prism-token token line-numbers language-javascript"><code class="language-javascript" style="margin-left:0">&lt;TextBlock Text=&#34;{c:Binding BoolA and BoolB}&#34; /&gt;



<TextBlock Text="{c:Binding BoolA or BoolB}" />

<TextBlock Text="{c:Binding BoolA and BoolB or BoolB}" />

修改一下界面

代码语言：javascript
复制
            <StackPanel>

<TextBlock>

<Run Text="A=" />

<Run Text="{Binding BoolA}" />

</TextBlock>

<TextBlock>

<Run Text="B=" />

<Run Text="{Binding BoolB}" />

</TextBlock>

<TextBlock Text="A and B" />

<TextBlock Text="{c:Binding BoolA and BoolB}" />

<TextBlock Text="A or B" />

<TextBlock Text="{c:Binding BoolA or BoolB}" />

</StackPanel>

其他可以写的是表达式

代码语言：javascript
复制
<TextBox Text="{c:Binding A+B+C}"/>

<TextBox Text="{c:Binding A-B-C}"/>

<TextBox Text="{c:Binding A*(B+C)}"/>

<TextBox Text="{c:Binding 2A-B0.5}"/>

<TextBox Text="{c:Binding A/B, StringFormat={}{0:n2} --StringFormat is used}"/> {with string format}

<TextBox Text="{c:Binding A%B}"/>

<TextBox Text="{c:Binding '(A == 1) ? 10 : 20'}"/> {ternary operator}

判断布尔

代码语言：javascript
复制
<CheckBox Content="!IsChecked" IsChecked="{c:Binding !IsChecked}"/>

<TextBox Text="{c:Binding 'IsChecked and IsFull'}"/> {'and' is equvalent of '&&'}

<TextBox Text="{c:Binding '!IsChecked or (A > B)'}"/> {'or' is equvalent of '||', but you can leave '||'}

<TextBox Text="{c:Binding '(A == 1) and (B less= 5)'}"/> {'less=' is equvalent of '<='}

<TextBox Text="{c:Binding (IsChecked || !IsFull)}"/>

因为在 xaml 不能使用 && || <= 所以需要使用 and or ‘less=’ 替换

另外对于 : 之前需要添加空格，如下面代码

代码语言：javascript
复制
<TextBox Text="{c:Binding '(A == 2)?IsChecked : IsFull}"/> <!-- right -->

<TextBox Text="{c:Binding '(A == 2)?IsChecked :!IsFull}"/> <!-- right -->

<TextBox Text="{c:Binding '(A == 2) ? IsChecked :4 + IsFull}"/> <!-- right -->

这些都是对的，但是下面的代码是无法运行

代码语言：javascript
复制
<TextBox Text="{c:Binding '(A == 2)?IsChecked:IsFull}"/> <!-- wrong -->

可以绑定静态的值，静态的值的写法 xmlNamespace:Class.StaticProperty.NestedProperty 命名空间下的类的静态属性的属性

对于经常计算值这里也可以简单使用，如 Math 里面的方法

代码语言：javascript
复制
<TextBox Text="{c:Binding Math.Sin(A*Math.PI/180), StringFormat={}{0:n5} }"/>

<TextBox Text="{c:Binding A*Math.PI}" />

枚举值也可以点命名空间的枚举的值，可以用来判断 xmlNamespace:EnumClass.Value 如在 Foo 枚举里面有 A 这个值

代码语言：javascript
复制
<CheckBox IsChecked="{c:Binding 'Foo==local:Foo.A'}" />

经常会将 bool 转换为 Visibility 这个库也有简单的方法

代码语言：javascript
复制
<Button Content="TargetButton" Visibility="{c:Binding HasPrivileges, FalseToVisibility=Collapsed}"/>

or just

<Button Content="TargetButton" Visibility="{c:Binding !HasPrivileges}"/>


<Button Content="TargetButton" Visibility="{c:Binding !HasPrivileges, FalseToVisibility=Hidden}"/>

如果需要在样式使用，需要通过 RelativeSource 找到方法

代码语言：javascript
复制
<Button Content="Button" Width="100">

<Button.Template>

<ControlTemplate>

<TextBox Width="{c:Binding Width+10, RelativeSource={RelativeSource TemplatedParent} }"/>

</ControlTemplate>

</Button.Template>

</Button>

Alex141/CalcBinding: Advanced WPF Binding which supports expressions in Path property and other features

本文会经常更新，请阅读原文： https://lindexi.gitee.io/post/WPF-%E5%9C%A8%E7%BB%91%E5%AE%9A%E8%A1%A8%E8%BE%BE%E5%BC%8F%E6%B7%BB%E5%8A%A0%E8%AE%A1%E7%AE%97.html ，以避免陈旧错误知识的误导，同时有更好的阅读体验。

本作品采用 知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议 进行许可。欢迎转载、使用、重新发布，但务必保留文章署名林德熙（包含链接： https://lindexi.gitee.io ），不得用于商业目的，基于本文修改后的作品务必以相同的许可发布。如有任何疑问，请 与我联系 。

#https#网络安全#xml#wpf