@creative-account

Are you sure you want to delete the question?

Leaving a resolved question undeleted may help others!

WPFの画像が見切れる

画像が見切れるのを何とかしたい

WPFでアプリを作っていたのですが、なんか写真が見切れてしまって。
また、ボタンを配置しても見切れる時があるんですよ。
調べたけど、参考になるようなものが無くて。
自分の調べ方が悪いのか…
VisualStudioのデザイナーではうまく表示されています。

問題のコード

<Window x:Class="written_oracle.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:written_oracle"
        mc:Ignorable="d"
        Title="おみくじ" Height="450" Width="800" ResizeMode="NoResize">
    <Grid>
        <Image Margin="70,49,507,101" Source="/おみくじ入れ.png" Stretch="Fill" Height="283.52" Width="223" ClipToBounds="True"/>
        <Button Content="Button" HorizontalAlignment="Left" Height="100" Margin="435,99,0,0" VerticalAlignment="Top" Width="125"/>
        <Button Content="Button" HorizontalAlignment="Left" Height="100" Margin="355,314,0,0" VerticalAlignment="Top" Width="125"/>
        <Button Content="Button" HorizontalAlignment="Left" Height="100" Margin="640,219,0,0" VerticalAlignment="Top" Width="125"/>

    </Grid>
</Window>

発生している問題・エラー

今回はボタン見切れてませんでした。
スクリーンショット 2022-07-26 215300.png
スクリーンショット 2022-07-26 215409.png

自分で試したこと

paddingなるものがあるらしいのでプロパティーを見たけど見当たらなかった。
ClipToBoundsをTrueにしてみた。

0 likes

2Answer

表示位置を細かく指定したいのならば、Grid ではなく Canvas を使用する方が一般的な感じがします。

2Like

Comments

  1. 「デフォルトのでいっか!」という軽い気持ちでやってました。Canvasを使ってやってみます。

Comments

  1. ごめんなさい!コード載せ忘れてました。

    それで、ClipToBoundsのチェックボックスをオンにしてみたけど変わりませんでした。
  2. Marginが左上右下すべて設定してあるのに、HeightとWidthも設定されているのが気になりますね。
    Height、Widthを削除してみたり、Marginを「Margin="70,49,0,0"」としてみたり、試してみてください。
  3. <Image Margin="70,49,0,0" Source="/おみくじ入れ.png" Stretch="Fill" Height="283.52" Width="223" ClipToBounds="True"/>

    見切れるのは治ったけど、表示位置が調整できなくなりました。

    WidthとHeightは、(W)446x(H)566.2のをそれぞれ1/2にしているからです。
    プロパティからじゃなくて、元からそのサイズにすればいいですかね?
  4. 表示位置の調整というのはどういうことをさしてるでしょうか?
    「Margin="100,49,0,0"」とかにすれば左位置変更「Margin="70,100,0,0"」とかにすれば上位置変更ができませんでしょうか。
    あとは、デザイナ上で画像の位置を調整したら、Marginの値はは都度勝手に変わっちゃうと思いますが、0,0部分にも勝手に入っちゃう感じですかね?
  5. そうですね。
    デザイナーから動かすと、
    Margin="x, y, x', y'"って感じで連動します。
  6. で連動して0,0も勝手に変わっちゃいます。
  7. 本来WPFの画面構成はGridのRowやColumnを使って整列させるのがベターであり、その場合あまりこういう事は起きないのですが、
    ご提示の画面のように乱雑に配置したい場合はなかなかそうもいかないんですよね。

    割り切って、デザイナで位置調整をした後に毎回0,0にするか、
    やはり画像自体のサイズを元から1/2にする、とした方がいいかもしれないですね。
  8. わかりました!元からサイズを1/2でやってみます。

    長い間お付き合いありがとうございました。
    頑張ります!
  9. あまり力になれずに申し訳ないです!
    頑張ってください!
  10. 試しに初めから画像を半分にしたものを使ったら無事全部うつりました。ほんとにありがとうございます!!!

Your answer might help someone💌