修改TabControl的标题

时间:2013-03-18 05:33:22

标签: wpf xaml mvvm binding datatemplate

所以我在运行时直接将我的视图添加到TabControl的Items集合中(而不是在它们周围创建TabItems并将这些TabItems添加到TabControl)。这些视图公开了一个名为HasChanges的属性(名称为TabItem的ViewModel属性的包装器),我希望将其绑定到DataTemplate的标头,以显示带有未保存更改的标签的星号(*)符号就像VS一样。我已经尝试过使用DataTemplates但是在访问<TabControl.ItemTemplate> <DataTemplate DataType="UserControl"> <StackPanel Orientation="Horizontal" Margin="0" Height="22"> <TextBlock VerticalAlignment="Center" Text="{Binding HeaderText, RelativeSource={RelativeSource AncestorType=UserControl}}" /> <TextBlock Text="*" Visibility="{Binding HasChanges, RelativeSource={RelativeSource Mode=TemplatedParent}, Converter={StaticResource B2VConverter}}" /> </StackPanel> </DataTemplate> </TabControl.ItemTemplate> 中的视图对象时遇到了问题。这样做的正确方法是什么?这是我的几次尝试之一:

TextBlock

请注意,我正在为两个UserControl尝试两种不同的绑定方法,但这些方法都不起作用。我的观点继承自HasChanges并公开了属性HeaderText和{{1}}。

1 个答案:

答案 0 :(得分:5)

行。我自己解决了。对于其他试图实现类似VS的关闭按钮和未保存的更改星号的人来说,这是模板:

<TabControl.ItemContainerStyle>
    <Style TargetType="{x:Type TabItem}">
        <Setter Property="HeaderTemplate" >
            <Setter.Value>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal" Margin="0" Height="22">
                        <TextBlock VerticalAlignment="Center" Text="{Binding RelativeSource={RelativeSource AncestorType=TabItem}, Path=Content.HeaderText}" />
                        <TextBlock Text=" *" ToolTip="Has unsaved changes" Visibility="{Binding Content.DataContext.HasChanges, RelativeSource={RelativeSource AncestorType=TabItem}, Converter={StaticResource B2VConverter}}" />
                        <Button Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}" Width="18" Height="18" 
                                Margin="6,0,0,0" Padding="0" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" HorizontalAlignment="Center" 
                                Command="{Binding DataContext.TabClosingCommand, RelativeSource={RelativeSource AncestorType={x:Type Window}}}"
                                CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=UserControl}}"
                                VerticalAlignment="Center" Focusable="False">
                            <Grid Margin="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <Line StrokeThickness="3" StrokeStartLineCap="Round"  StrokeEndLineCap="Round" Stroke="Gray" X1="1" Y1="1" X2="9" Y2="9" HorizontalAlignment="Center" VerticalAlignment="Center" />
                                <Line StrokeThickness="3" StrokeStartLineCap="Round" StrokeEndLineCap="Round" Stroke="Gray" X1="1" Y1="9" X2="9" Y2="1" HorizontalAlignment="Center" VerticalAlignment="Center" />
                            </Grid>
                        </Button>
                    </StackPanel>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</TabControl.ItemContainerStyle>

产生一个优雅的基于绘图的按钮,具有平面外观。您的视图必须实现布尔HasChangesHeaderText属性,此外您还需要在资源部分中定义BooleanToVisibilityConverter,名为B2VConverter。