如何将图像添加到 mahapps tabcontrol

Question

我想创建包含文本和图像的选项卡项

我发现 this 问题，但它不再相关，因为 Controls:MetroImage 已过时。

MetroDemo.exe 有如何使用 TabControl 的示例，但没有关于如何做我想做的事情的演示。

有人有什么建议吗？

Answer 1

MahApps 只是扩展或重新设计了现有的 WPF 控件。有些人没有意识到的是，你想做的一切都已经成为可能，而无需做任何特别的事情。

TabItem.Header 属性是 object，并使用 ContentPresenter 设置样式。这意味着您可以自由地做这样的事情：

 <TabItem>
     <TabItem.Header>
         <Grid>
             <Grid.ColumnDefinitions>
                 <ColumnDefinition Width="Auto"/>
                 <ColumnDefinition/>
             </Grid.ColumnDefinitions>
             <Image Height="20" Width="20" Source="Resources/myimg.png"/>
             <TextBlock Grid.Column="1">Hello World!</TextBlock>
         </Grid>
     </TabItem.Header>
 </TabItem>

在 MahApps 预发行版 (1.3.0+) 中引入了一个新的 ModernUIPackIcon 和变体，这极大地简化了当前在 MahApps.Resources 包中的预打包图标的使用。如果您只想使用其中之一，可以替换 Image 元素。

Answer 2

也许我迟到了，但我就是这样做的，而且效果很好。

<TabItem  HorizontalAlignment="Center" VerticalAlignment="Bottom" FontFamily="Calibri" FontSize="8">
            <TabItem.HeaderTemplate>
                <ItemContainerTemplate>
                    <StackPanel Orientation="Vertical">
                        <icons:PackIconModern Width="16" Height="16" Kind="ColumnThree" HorizontalAlignment="Center"/>
                        <TextBlock FontSize="12">Columns</TextBlock>
                    </StackPanel>
                </ItemContainerTemplate>
            </TabItem.HeaderTemplate>
        </TabItem>

输出是 -

Answer 3

由于接受的答案“重置”了主题，我找到了一个保留样式的解决方案。这是通过使用 ContentPresenter 和 Headertemplate 完成的。

（DockPanel可以切换成Grid。）

<TabItem >
    <TabItem.HeaderTemplate>
        <DataTemplate>
            <DockPanel>
                <iconPacks:PackIconMaterial Kind="Bell" DockPanel.Dock="Left" VerticalAlignment="Center"/> <!-- or any other image -->
                <ContentPresenter Content="Content or Binding or... Hello World!"/>
            </DockPanel>
        </DataTemplate>                    
    </TabItem.HeaderTemplate>
    <!-- normal Tab content-->              
</TabItem>

如何将图像添加到 mahapps tabcontrol

How to add Image to mahapps tabcontrol

wpf

mahapps.metro