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

How to stretch UniForm image to buttons content in WINRT

我正在使用 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"));
        }
    }
}

这是我用网络摄像头捕获的咖啡文件的加载结果。

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

Stretch 属性 必须是 Uniform 显式

这只是一个测试场景。

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

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

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

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

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