WPF使用代碼創建數據模板DataTemplate

Posted on by

起因

我們都知道, 在XAML界面當中編寫DataTemplate很簡單, 但是有時候我們需要在代碼當中去設置DataTemplate。

該怎麼辦?

比如, 實際需求是DataGrid當中需要創建100個DataTemplate列, 很明顯,這些列不太方便在XAML中編寫。

這個時候,我們就需要在代碼當中動態生成模板列。

答案

如下面所示,我創建瞭一個DataGridTemplateColumn,其中包含瞭一個StackPanel裡面放瞭兩個Button按鈕。

                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal">
                                <Button Content="編輯"/>
                                <Button Content="刪除"/>
                            </StackPanel>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

現在就是, 我們需要把這個過程用代碼去生成, 這個時候我們就可以用到FrameworkElementFactory 類。

步驟分為幾步:

  • 創建DataGridTemplateColumn 對象, 設置Header等內容
DataGridTemplateColumn templateColumn = new DataGridTemplateColumn();
templateColumn.Header = "標題";
  • 創建 FrameworkElementFactory 對象, 設置Orientation屬性水平排列
 FrameworkElementFactory factory = new FrameworkElementFactory(typeof(StackPanel));
 factory.SetValue(StackPanel.OrientationProperty, Orientation.Horizontal);
  • 向 FrameworkElementFactory 對象追加一個factory對象
            FrameworkElementFactory buttonEdit = new FrameworkElementFactory(typeof(Button));
            buttonEdit.SetValue(ContentProperty, "編輯");
            factory.AppendChild(buttonEdit);

            FrameworkElementFactory buttonDel = new FrameworkElementFactory(typeof(Button));
            buttonDel.SetValue(ContentProperty, "刪除");
            factory.AppendChild(buttonDel);
  • 創建DataTemplate對象, 設置VisualTree 值為factory
DataTemplate dataTemplate = new DataTemplate();
dataTemplate.VisualTree = factory;
  • 最後把DataGridTemplateColumn 的CellTemplate 值設置為dataTemplate
templateColumn.CellTemplate = dataTemplate;

最終效果

關於整個過程梳理

有一點,我們需要清楚, 在XAML界面當中編寫的任何代碼, 其實本質上都是轉化成C#代碼, 既然如此來說, 隻要XAML有的對象,我們都可以用C#代碼編寫, 但是為什麼一般我們不這麼做, 是因為XAML更加容易去表達界面上的元素, 代碼的可視化以及可維護性。

再回到上面, 我們需要清楚上面的流程, 我們通過FrameworkElementFactory 創建瞭一個完整的視覺樹的對象,裡面包含瞭一個StackPanel容器,容器中放置瞭兩個Button控件,最終把這個 FrameworkElementFactory 對象給瞭DataTemplate當中的VisualTree, 這裡的意思是 我們給DataTemplate設置瞭可視化的視覺樹結構, 最終DataTemplate決定瞭 DataGridTemplateColumn 的視覺呈現。

完整代碼

        DataGridTemplateColumn CreateDataGridTemplateColumn()
        {
            DataGridTemplateColumn templateColumn = new DataGridTemplateColumn();
            templateColumn.Header = "標題";

            FrameworkElementFactory factory = new FrameworkElementFactory(typeof(StackPanel));
            factory.SetValue(StackPanel.OrientationProperty, Orientation.Horizontal);

            FrameworkElementFactory buttonEdit = new FrameworkElementFactory(typeof(Button));
            buttonEdit.SetValue(ContentProperty, "編輯");
            factory.AppendChild(buttonEdit);

            FrameworkElementFactory buttonDel = new FrameworkElementFactory(typeof(Button));
            buttonDel.SetValue(ContentProperty, "刪除");
            factory.AppendChild(buttonDel);

            DataTemplate dataTemplate = new DataTemplate();
            dataTemplate.VisualTree = factory;

            templateColumn.CellTemplate = dataTemplate;

            return templateColumn;
        }

 到此這篇關於WPF使用代碼創建數據模板DataTemplate的文章就介紹到這瞭。希望對大傢的學習有所幫助，也希望大傢多多支持WalkonNet。

推薦閱讀：