2

私はWindowsストアアプリを開発しており、数か月前にこれを行ったことがありますが、突然、この新しいアプリでボタン内に画像を表示できません(適切に)。

    <Button x:Name="ShowView" Grid.Column="1" Width="32" Height="32" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,61,20,33">
        <StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
            <Image x:Name="ShowViewImage" Source="/Assets/ShowView.png" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
        </StackPanel>
    </Button>

ご覧のとおり、コードは問題ありません (変更が大幅に変更されている場合を除きますが、外観上はそうではありません)。それで、何が得られますか?これは、これまでのところ、VS が新しいプロジェクトとして生成するデフォルト以外の XAML ファイルにある唯一のコードです。

PS また、StackPanel を取り出して Button > Image だけを試してみましたが、これでも同じ結果が得られます。

そのため、実行時に BUtton が表示されるとき、私が見ることができるのは非常に小さな 2 ピクセルの画像だけです (ただし、画像は実際には32x32 ピクセルです。「画像ボタン」を適切に表示するにはどうすればよいですか?

4

2 に答える 2

2

いくつかのオプションがあります。Paddingたとえば、プロパティはテンプレートにバインドされており、事前に設定されたパディングが追加されています。したがってButton、固定HeightWidthて 32 に設定すると、実際のサイズに応じて、設定と同じくらい簡単にPadding="0"修正できますImage

最悪の場合は、いつでも独自のButtonテンプレートを作成できます。これを行う簡単な方法がいくつかあります。そのうちの1つは、デフォルトのテンプレートのコピーを作成し、Buttonそこにあるすべてのパディング/マージン/高さ/幅のがらくたプリセットを取り除き、その名前を変更して、新しいテンプレートをボタンに直接適用することです;

<Button x:Name="ShowView" Grid.Column="1" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,61,20,33" 
        Style="{StaticResource YourCustomButtonTemplateForImages}">
    <Image x:Name="ShowViewImage" Source="/Assets/ShowView.png"/>
</Button>

Imageまたは...別のオプションは、ボタンの内側に埋め込むViewBoxと、設定された使用可能なサイズに応じてフィットし、再スケーリングされます。

Background="Transparent"ああ、ただのイメージとして少しきれいに見せるために、あなたがそれをしている間にあなたも作りたいと思うかもしれません.

お役に立てれば。

于 2013-07-24T15:44:02.887 に答える
2

問題は、ボタンのWidthHeightが小さすぎることです。32x32 ピクセルにしましたが、ボタンはそのほとんどすべてを、表示される境界線の周囲に残すスペース、境界線自体、および境界線とボタンのコンテンツの間のパディングに使用します。

(エッジの周りにスペースを残して、目に見える外観よりも大きなヒット ターゲットを提供します。これは、正確な指の配置が難しいタッチスクリーンで役立ちます。)

画像に残っているのは、数ピクセルだけです。

ボタンを約 62x52 ピクセルにして、中央に 32x32 ピクセルのビットマップ用の十分なスペースを残す必要があります。

Margin明示的に smallとプロパティを設定すれば、わずかに小さいボタンで済む可能性がありPaddingますが、前述のように、マージンには理由があります。

于 2013-07-24T15:36:24.670 に答える