按钮中的水平对齐答案

【问题标题】：Horizontal alignment in a button按钮中的水平对齐
【发布时间】：2014-07-07 21:28:57
【问题描述】：

这是我的按钮代码：

<Button //namespaces
        x:Class="myProject.MyButton"
        FocusVisualStyle="{x:Null}"
        Foreground="White"
        Height="60"
        Width="200"
        HorizontalContentAlignment="Center"
        VerticalContentAlignment="Center"
        Padding="0 0 1 1"
        >
    <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
            <Border x:Name="border" CornerRadius="8">
                <Border.Background>
                    #006BB7
                </Border.Background>
                <DockPanel Margin="3">
                    <Image Source="{Binding Path=Tag, RelativeSource={RelativeSource TemplatedParent}}" Height="30" Stretch="Fill" Margin="0 0 0 0"  HorizontalAlignment="Left"/>
                    <TextBlock Text="{Binding Path=Content,RelativeSource={RelativeSource TemplatedParent}}" FontSize="20" VerticalAlignment="Center" Padding="10,0,10,0" HorizontalAlignment="Left"/>
                    <Image Source="{DynamicResource ResourceKey=Bmp}" Height="30" Width="30" HorizontalAlignment="Right" Margin="0 0 10 0"></Image>
                </DockPanel>
            </Border>
        </ControlTemplate>
    </Button.Template>
</Button>

当我这样称呼它时：

<ui:MyButton x:Name="btnGo" Tag="/Resources/Go.png" Content="Go" Command="{Binding Path=GoCommand}" Margin="20 0 0 0"/>

一切看起来都像我想要的那样：第一张图片没有显示，按钮的第三部分（第二张图片）右对齐。

但是，这里：

<ui:MyButton Margin="10" Content="{Binding MyName}" Tag="{Binding Path}" HorizontalAlignment="Center" VerticalAlignment="Top">
    <Button.Resources>
         <BitmapImage x:Key="Bmp" UriSource="/Images/arrowRight.png"></BitmapImage>
    </Button.Resources>
 </ui:MyButton>

当我这样调用按钮时，不会显示文本和第二张图片。显示的只是第一张图片，它通过整个按钮的宽度进行拉伸。为什么会这样？我想让它表现得像另一个。

【问题讨论】：

如果您要为您的Button 定义一个MyButton 自定义类，那么只需将适当的DependencyPropertys 添加到它以绑定到您的两个ImageSource 属性。
@Sheridan 我没有为按钮定义一个类。
@Sheridan 有一个类，但那是扩展 Button 类的类。没有别的了。没有定义属性。
天啊！ 如果您要为您的Button 定义一个MyButton 自定义类（您已经完成了），那么只需在其中添加适当的DependencyPropertys 以绑定到您的两个ImageSource 属性。 这就是解决方案...只需将 DependencyPropertys 添加到您的扩展类并绑定到它们。
@Sheridan LOL...我没有创建课程！我刚刚创建了一个类，但它派生自Button，它没有任何属性！！你不得不承认这很搞笑......

标签： wpf xaml button

【解决方案1】：

试试这个

在Change content of Image and of TextBlock when the Image and the TextBlock are in a button 中，我们将资源用于按钮，在这里我们用于<ui:MyButton>

<ui:MyButton Margin="10" Content="{Binding MyName}" Tag="{Binding Path}" HorizontalAlignment="Center" VerticalAlignment="Top">
    <ui:MyButton.Resources>
        <BitmapImage x:Key="Bmp" UriSource="/Images/arrowRight.png"></BitmapImage>
    </ui:MyButton.Resources>
</ui:MyButton>

【讨论】：

它在这里工作。我只使用你的代码在这里检查过。检查你的图像源。
@petko_stankoski 在 StackOverflow 中交流您的问题时请具体说明。 “它不起作用” 完全模糊、不具体，并不能帮助人们理解您的问题。请尽可能详细地说明您目前的情况，并说明您的预期结果。
@HighCore 对不起。我不工作 - 问题和以前一样。仅显示第一张图片并对其进行了拉伸。