WPF TabControl页面绑定ItemsSource

TabControl的ItemsSource属性使用比较少。这里我使用ini配置文件,使用tabcontrol呈现。

每个Tabitem显示ini中一个节的信息,键值对使用表格显示。

xaml:

XML 复制代码
 <telerik:RadTabControl ItemsSource="{Binding Sections}" SelectedIndex="{Binding SelectSectionIndex}">
     <telerik:RadTabControl.ItemTemplate>
         <DataTemplate>
             <TextBlock Text="{Binding Name}" />
         </DataTemplate>
     </telerik:RadTabControl.ItemTemplate>
     <telerik:RadTabControl.ContentTemplate>
         <DataTemplate>
             <telerik:RadGridView
                 HorizontalContentAlignment="Center"
                 VerticalContentAlignment="Center"
                 AutoGenerateColumns="False"
                 CanUserGroupColumns="False"
                 CanUserReorderColumns="False"
                 CanUserResizeColumns="True"
                 CanUserSelect="True"
                 CanUserSortColumns="False"
                 CanUserSortGroups="False"
                 EnableLostFocusSelectedState="False"
                 FrozenColumnsSplitterVisibility="Collapsed"
                 IsFilteringAllowed="False"
                 IsHitTestVisible="True"
                 IsReadOnly="False"
                 IsTabStop="False"
                 ItemsSource="{Binding KeyValues, NotifyOnSourceUpdated=True}"
                 RowHeight="29"
                 RowIndicatorVisibility="Collapsed"
                 SelectionUnit="FullRow"
                 ShowGroupPanel="False"
                 ShowSearchPanel="False">
                 <telerik:RadGridView.Columns>
                     <telerik:GridViewDataColumn
                         Width="*"
                         DataMemberBinding="{Binding Key}"
                         Header="键"
                         IsReadOnly="True" />
                     <telerik:GridViewDataColumn
                         Width="2*"
                         DataMemberBinding="{Binding Value}"
                         Header="值" />
                 </telerik:RadGridView.Columns>
             </telerik:RadGridView>
         </DataTemplate>
     </telerik:RadTabControl.ContentTemplate>
 </telerik:RadTabControl>

VM:

cs 复制代码
private ObservableCollection<IniSection> _sections;
public ObservableCollection<IniSection> Sections
{
    get => _sections;
    set => this.RaiseAndSetIfChanged(ref _sections, value);
}
cs 复制代码
public class IniSection
{
    public string Name { get; set; }
    public ObservableCollection<IniKeyValue> KeyValues { get; set; } = new ObservableCollection<IniKeyValue>();
}
cs 复制代码
public class IniKeyValue
{
    public string Key { get; set; }
    public string Value { get; set; }
}

效果:

ini:

界面:

相关推荐
dotent·1 天前
C#基于WPF UI框架的通用基础上位机测试WPF框架
ui·c#·wpf
咩图2 天前
WPF+Prism8.0.0.1909+C#创建一个桌面程序
c#·wpf·prism
雁于飞2 天前
分布式基础
java·spring boot·分布式·spring·wpf·cloud native
oioihoii3 天前
WPF入门指南:解析默认项目结构
wpf
极客智造3 天前
深入解析 ReactiveUI:WPF 响应式 MVVM 开发的 “终极方案”
wpf
Macbethad4 天前
使用WPF编写一个多维度伺服系统的程序
大数据·hadoop·wpf
lingxiao168884 天前
WPF Prism框架应用
c#·wpf·prism
Macbethad5 天前
使用WPF编写一个Ethercat主站的程序
wpf
难搞靓仔5 天前
WPF 弹出窗体Popup
wpf·popup
Macbethad5 天前
使用WPF编写一个MODBUSTCP通信的程序
wpf