[WPF] Hướng dẫn sử dụng Binding 2 chiều (TwoWay) trong WPF

Giới thiệu

Trong WPF có một cách sử dụng Bind Data từ một Control này sang Control khác 2 chiều, nghĩa là nếu thay đổi giá trị của Control này sẽ làm thay đổi giá trị của Control khác. Như trên hình dưới đây ta có 2 Control là Slider và Textbox, khi ta thay đổi giá trị của Slider thì giá trị của Textbox sẽ thay đổi và ngược lại.

Hướng dẫn sử dụng Binding 2 chiều (TwoWay) trong WPF

Giải pháp: bạn hãy sử dụng System.Windows.Data.Binding, thiết lập thuộc tính Mode đến System.Windows.Data.BindingMode.TwoWay. Sử dụng thuộc tính UpdateSourceTrigger để xác định khi nào binding source được cập nhật.

Cơ chế hoạt động của Bind Data trong WPF

Cơ chế hoạt động: dữ liệu trong một data-binding có thể đi theo nhiều hướng: thuộc tính nguồn đến thuộc tính đích, thuộc tính đích đến thuộc tính nguồn, và cả hai. Chẳng hạn, thuộc tính Text của TextBlock được binding đến thuộc tính Value của Slider. Trong trường hợp này, thuộc tính Text của TextBlock là thuộc tính đích và thuộc tính Value của Slider là thuộc tính nguồn. Bạn có thể cấu hình hướng dữ liệu di chuyển theo nhiều cách khác nhau. Khi thuộc tính Value của Slider thay đổi thì thuộc tính Text của TextBlock cũng thay đổi theo – cái này gọi là OneWay binding (nguồn -> đích) Khi thuộc tính Value của Slider thay đổi thì thuộc tính Text của TextBlock cũng thay đổi hoặc khi thuộc tính Text của TextBlock thay đổi thì thuộc tính Value của Slider cũng tha đổi theo – cái này gọi là TwoWay binding (nguồn <-> đích).

Những twoway binding lắng nghe những thay đổi trên thuộc tính đích và cập nhật nguồn binding. Thuộc tính UpdateSourceTrigger quyết định khi nào việc cập nhật trên được thực thi.. Chẳng hạn, bạn cho thuộc tính Text của TextBox binding đến thuộc tính Value của Slider, bạn có thể cấu hình để khi bạn nhập giá trị vào textbox thì slider tự động cập nhật giá trị ngay lập tức hoặc nhập giá trị trong textbox xong, nhấn button thì mới cập nhật giá trị của Slider.

Sau đây là các giá trị của UpdateSourceTrigger:

–Default: Binding class sử dụng UpdateSourceTrigger mặc định của target binding. Ví dụ, UpdateSourceTrigger mặc định của TextBox.Text là LostFocus.

–Explicit: cập nhật binding source khi bạn gọi phương thức System.Windows.Data.BindingExpression.UpdateSource.

–LostFocus: cập nhật binding source bất cứ khi nào target binding bị mất focus.

–PropertyChanged: cập nhật binding source ngay lập tức khi một thuộc tính của target binding thay đổi.

Xây dựng ứng dụng

<Window x:Class="Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="TwoWay Data Binding" Height="300" Width="300">
    <StackPanel>
        <Slider Name="slider" Margin="4" Interval="1" TickFrequency="1" IsSnapToTickEnabled="True" Minimum="10" Maximum="100"></Slider>
        <StackPanel Orientation="Horizontal">
            <TextBlock Width="Auto" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="4" Text="Nhập giá trị cho slider ở đây:"></TextBlock>
            <TextBox Width="40" HorizontalAlignment="Center" Margin="4" Text="{Binding ElementName=slider, Path=Value, Mode=Twoway, UpdateSourceTrigger=PropertyChanged}"></TextBox>
        </StackPanel>
    </StackPanel>
</Window>

Kết luận

Như vậy, trên đây csharpcanban.com đã Hướng dẫn các bạn cách sử dụng Binding 2 chiều (TwoWay) trong WPF. Chúc các bạn thành công.