wpf中带有图像和文本的按钮模板

我想创建包含图像和文本的按钮。例如，我会对“浏览文件夹”和“导入”等按钮使用不同的图像和文本

其中一个选项是使用模板。我看了一下类似的问题

---

但是有没有什么方法可以不使用依赖属性或任何其他类就绑定映像的源代码？

没有。您会将

映像.source

绑定到什么？您需要一个DependencyProperty来完成此操作。当然，您也可以定义一个普通类，该类包含两个属性：

Text

和

ImageSource

或

Uri

，然后使用DataTemplate来呈现该类的实例，但这将需要编写更多的代码，而且有点“难闻”

---

您不想使用依赖属性或自定义类的原因是什么？

不必那么复杂。将StackPanel放在按钮内这样简单的东西就可以做到：

<Button>
  <StackPanel>
    <TextBlock>My text here</TextBlock>
    <Image Source="some.jpg" Stretch="None" />
  </StackPanel>
</Button>

我的文本在这里

---

然后，您可以配置StackPanel来控制文本的显示位置、对齐方式等。

我添加了一些东西，使它们很好地对齐

<Button>
   <StackPanel Orientation="Horizontal">
       <Image Source="/ApplicationName;component/Images/MyImage.ico"/>
       <Label Padding="0">My Button Text</Label>
   </StackPanel>
</Button>

我的按钮文本

添加

在Sean的回答中添加了Stretch=“Uniform”，以解决图像最初大于按钮大小的问题（我也遇到了他在评论中提到的问题83）。有关拉伸选项的更多详细信息，请访问

我的按钮文本

---

想在BrainSlugs83下的答案中添加此作为注释，但由于缺少分数，无法添加，因此被拒绝编辑Sean的答案

对我来说，XCeed WPF工具包（免费软件）就是这样做的。

唯一的原因是我想知道是否还有其他简单的方法，或者你可以说是“更少代码”的方法。使用texblock我可以使用我想知道为什么我不能对图像的源属性做同样的操作？但是你会把

模板绑定放在哪里？您将绑定到哪个属性？我可以使用“Tag”属性绑定它吗？我不确定。这可能有用。然而，我个人认为，这是一个非常糟糕的代码，因为意图不明确，你没有任何类型的安全…这取决于你。好的，但是你怎么设置下划线字符呢？如果我把“_mytext here”放在这里，它会呈现下划线，并且alt+M不再起作用。那么，你是如何恢复它的呢？还有，你是如何让它缩小图像，这样按钮就不会爆炸到你图像的大小呢（也就是说，如果我有一个40x40的图像和一个任意大小的按钮按钮——我不想手动设置——我如何使图像缩小到正确的大小，而不是将我的按钮放大到超大型？我想补充一点，您可能需要将
堆栈面板的
方向设置为
水平
以使它们并排排列。请注意，如果使用网格而不是StackPanel，则必须使用边距将按钮上的图像和文本水平居中（因此StackPanel是一种方法）。这是answerNow图像和文本在按钮内居中。我如何将它们左对齐？这为我提供了一个正常的按钮标签（即alt+字母热键）--我测试过，当我按下正确的组合时，它会单击按钮。--现在我只需要找出如何将我的图像缩小到按钮的大小，并且不使其使按钮都变大。如何拉伸按钮内的StackPanel？
HorizontalAlignment=“stretch”
不起作用。P.S.WPF是不可预测和愚蠢的。
    <Button>
        <StackPanel Orientation="Horizontal">
            <Image Source="Resources/add.png" Stretch="None" />
            <TextBlock Margin="5,0,0,0">Add</TextBlock>
        </StackPanel>
    </Button>

<Button x:Name="MyCoolButton"Width="200" Height="75">
<Grid >
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Image Source="Pete-Brown-Silverlight-in-Action.png" Margin="5" Grid.Column="0" />
    <StackPanel Grid.Column="1" Margin="5">
        <TextBlock Text="Buy My Book!" FontWeight="Bold" />
        <TextBlock Text="Pete is writing THE Silverlight 4 book" TextWrapping="Wrap" />
    </StackPanel>
</Grid>

<Button>
    <StackPanel Orientation="Horizontal">
        <Image Source="/ApplicationName;component/Images/MyImage.ico" Stretch="Uniform"/>
        <Label Padding="0">My Button Text</Label>
    </StackPanel>
</Button>