如何在WINRT中将UniForm图像拉伸到按钮内容

Question

我正在使用CameraCaptureUI API来捕获和保存我在按钮中加载的图片，如下面的XAML。

<Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" VerticalAlignment="Center" HorizontalAlignment="Center">
        <StackPanel>
            <Button Width="150" Height="150">
                <Button.Content>
                    <Image x:Name="coffejpg" Stretch="Uniform" />
                </Button.Content>
            </Button>
        </StackPanel>
    </Grid>
</Page>

代码背后的代码：

namespace App1
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            coffejpg.Source = new BitmapImage(new Uri("ms-appx:///Assets/coffe.jpg"));
        }
    }
}

以下是我用网络摄像头加载咖啡文件的结果。

如何将图片拉伸到按钮边框。我尝试过使用图片的VerticalAlignment和HorizontalAlignment属性。还尝试了高度和宽度但它们会使图像变形。

Stretch 属性必须是Uniform 显式

这只是一个测试场景。

Answer 1

如果您坚持使用Stretch=Uniform，那么您需要了解它的作用。它保留了图像的纵横比。因此，如果原始图片为800x600，则图像将保持4x3的比例。您试图将图像放入1x1比例按钮，但图像本身不是1x1比率。因此按钮周围会有空白区域。

如果您不想使用UniformToFill，那么另一种解决方案是更改按钮的大小。

尝试仅在按钮上设置一个维度。

 <Button Width="150" Height="Auto">

或

 <Button Width="Auto" Height="150">