[WPF] Áp dụng DataTemplate cho DataGridColumn với điều kiện cho trước

Nguyễn Xuân Luân viết ngày 18/02/2020

Giả sử ta có 1 DataGrid  hiển thị dữ liệu về thông tin về điểm số của sinh viên và với mỗi điểm số khác nhau ta sẽ cần hiển thị cột đánh giá tương ứng.  Trong trường hợp này ta cần tạo ra nhiều template khác nhau cho phần đánh giá và hiển thị nó với điều kiện tương ứng.

Dưới đây là class sinh viên mà mình tạo ra để làm ví dụ:

public class Student
    {
        public Student(string code, string name, double totalScore)
        {
            Code = code; Name = name; TotalScore = totalScore;
        }
        public string Code { get; set; }
        public string Name { get; set; }
        public double TotalScore { get; set; }
    }

Đầu tiên ta tạo một class để xử lý việc chọn template hiển thị ra:

 public class StudentTemplateSelector : DataTemplateSelector
    {
        public DataTemplate BadTemplate

        { get; set; }
        public DataTemplate MediumTemplate

        { get; set; }
        public DataTemplate GoodTemplate

        { get; set; }
        public DataTemplate ExcellentTemplate
        {
            get; set;
        }
        public override DataTemplate SelectTemplate(object item, DependencyObject container)

        {

            Student student = item as Student;
            if (student != null)

            {

                if (student.TotalScore >= 9)

                    return ExcellentTemplate;

                else if (student.TotalScore >= 8)

                    return GoodTemplate;
                else if (student.TotalScore >= 5)
                    return MediumTemplate;
                else return BadTemplate;
            }

            else

                return base.SelectTemplate(item, container);

        }
    }

Tiếp theo là tạo template tương ứng trên xaml:

<Window.Resources>
        <DataTemplate x:Key="ExcellentTemplate">
            <TextBlock Margin="2" Text="Excellent" Foreground="Red"/>
        </DataTemplate>
        <DataTemplate x:Key="GoodTemplate">
            <TextBlock Margin="2" Text="Good" Foreground="Yellow"/>
        </DataTemplate>
        <DataTemplate x:Key="MediumTemplate">
            <TextBlock Margin="2" Text="Medium" Foreground="Green"/>
        </DataTemplate>
        <DataTemplate x:Key="BadTemplate">
            <TextBlock Margin="2" Text="Bad" Foreground="Gray"/>
        </DataTemplate>
    </Window.Resources>

Sau đó hiển thị nó lên DataGrid:

 <DataGrid ItemsSource="{Binding}" AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTextColumn Header="Student Code" Binding="{Binding Code}"/>
                <DataGridTextColumn Header="Name" Binding="{Binding Name}"/>
                <DataGridTextColumn Header="Total Score" Binding="{Binding TotalScore}"/>
                <DataGridTemplateColumn Header="Grade">
                    <DataGridTemplateColumn.CellTemplateSelector>
                        <local:StudentTemplateSelector
                         BadTemplate="{StaticResource BadTemplate}" MediumTemplate="{StaticResource MediumTemplate}" 
                         ExcellentTemplate="{StaticResource ExcellentTemplate}" GoodTemplate="{StaticResource GoodTemplate}"/>
                    </DataGridTemplateColumn.CellTemplateSelector>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>

Cuối cùng ta được kết quả như bên dưới :

Bài viết có tham khảo nguồn Zeeshan Amjad's Blog

Bạn có thể tải source code demo tại đây

Bài viết liên quan

Tổng hợp một số thư viện hỗ trợ thiết kế giao diện đẹp cho wpf

Để tạo ra một giao diện đẹp mắt cho một ứng dụng wpf là một việc đòi hỏi rất nhiều công sức , để có một giao diện đẹp như một trang web chúng ta càng phải bỏ nhiều công sức hơn...

Nguyễn Xuân Luân

[WPF] Sử dụng Grid Panel cho ItemsControl

Chào các bạn, hôm nay mình sẽ hướng dẫn các bạn một cách để hiển thị dữ liệu của ItemsControl dưới dạng Grid Panel. Đầu tiên mình sẽ tạo một class để hiển thị dữ liệu...

Nguyễn Xuân Luân

[WPF] Setting global format datetime

Chào các bạn hôm nay mình sẽ hướng dẫn các bạn cách thiết lập định dạng datetime trong wpf application...

Nguyễn Xuân Luân