2

ax、y カスタム グラフィックに 2 次元のマトリックス ポイントを表示する Matrix2D という名前の UserControl を開発しています。

奇妙なことに、Auto を Width/Height に設定すると、次のように、この Matrix2D コントロールを含むグリッドに列/行が設定されます。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition />
    </Grid.RowDefinitions>

    <elem:Matrix2D x:Name="matrix2"
                   Grid.Row="0"
                   Grid.Column="0"
                   MaximumX="255"
                   MaximumY="127"
                   ZoomScale="1" />

</Grid>

期待どおりの結果が得られます (きれいなピクセル):

期待される結果 - きれいなピクセルで

次のように、Horizo​​ntalAlignment="Left" と VerticalAlignment="Top" を設定すると、期待される結果も得られます。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>
        <elem:Matrix2D x:Name="matrix2"
                       Grid.Row="0"
                       Grid.Column="0"
                       MaximumX="255"
                       MaximumY="127"
                       HorizontalAlignment="Left"
                       VerticalAlignment="Top"
                       ZoomScale="1" />
</Grid>

ただし、自動をグリッドに設定しない場合は、次のように配置も設定しません。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>
        <elem:Matrix2D x:Name="matrix2"
                       Grid.Row="0"
                       Grid.Column="0"
                       MaximumX="255"
                       MaximumY="127"
                       ZoomScale="1" />
</Grid>

このぼかし結果が得られます。

ぼかし結果

このユーザー コントロールを開発するいくつかの方法を既にテストしましたが、常に同じ結果が得られました。

これは現在のバージョンです:

<UserControl x:Class="Matrix2D"
             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"
             d:DesignHeight="300"
             d:DesignWidth="300"
             mc:Ignorable="d">
    <Grid Background="White">
        <Image x:Name="populationImg" Stretch="None" />
    </Grid>
</UserControl>

コード ビハインド: WriteableBitmap にデータを入力し、populationImg.Source を設定します。

RenderOptions.BitmapScalingMode="NearestNeighbor" を設定するトリックを既にテストしていますが、結果は概算であり、これは科学的グラフィックであるため、正確である必要があります。正確ではないこの結果のコーナーで確認できます。

正確でない結果

小さいグラフィックでさらに見やすく:

正確でない結果

RenderOptions.EdgeMode="Aliased" を設定しても何も変わりません。

アップデート


これは、私がこのぼかし効果を持っている理由を説明しています:

画像を適切に中央に配置するには、画像のピクセル幅と高さが偶数の場合、コンテナの幅と高さを等しくする必要があります。画像の幅と高さが奇数ピクセルの場合、それを含む要素も奇数の幅と高さを持つ必要があります。

WPFアプリケーションでのピクセルスナップから(@Nicolas Repiquetの回答で)

ただし、実際には問題を解決するのに役立ちませんでした。ユーザー コントロールをコンテナーから独立させたいと考えています。これを行う方法はありますか?

4

1 に答える 1

1

私の推測では、親コンテナー内のコントロールの位置がピクセル グリッドに揃えられていません (つまり、画面上のコントロールの x 座標と y 座標は、ピクセルのラウンド数ではありません)。

これを試して :

<elem:Matrix2D SnapsToDevicePixels="true" ... />

UIElement.SnapsToDevicePixels プロパティ

編集


「画像を適切に中央に配置するには、画像のピクセル幅と高さが偶数の場合、コンテナーの幅と高さを偶数にする必要があります。画像の幅と高さが奇数ピクセルの場合、それを含む要素の幅と高さも奇数にする必要があります。」WPF アプリケーションのピクセル スナッピングから

于 2014-02-13T16:26:23.617 に答える