c#将图像拟合到另一个图像中检测到的正方形中
c# Fitting an image in a square detected in another image
所以基本上我需要制作一个应用程序,让一幅画适合方形墙上的画框。我正在使用 aforge 来检测正方形,并使用它的角放置我想要的图像并将其调整为框架。这是通过按下触发 imageAdapt() 方法的第三个按钮来完成的。不幸的是,图像没有重新缩放到正确的大小并且放置错误。这是我的代码:
namespace MyFirstJob
{
public sealed partial class MainPage : Page
{
public static int a = -1;
public static int b = -1;
FolderPicker folderPicker1 = new Windows.Storage.Pickers.FolderPicker();
FolderPicker folderPicker2 = new Windows.Storage.Pickers.FolderPicker();
StorageFolder folder1;
StorageFolder folder2;
System.Collections.Generic.IReadOnlyList<StorageFile> filesList1;
System.Collections.Generic.IReadOnlyList<StorageFile> filesList2;
public MainPage()
{
InitializeComponent();
folderPicker1.FileTypeFilter.Add(".png");
folderPicker2.FileTypeFilter.Add(".png");
}
private async void button1_Click(object sender, RoutedEventArgs e)
{
a++;
folder1 = await folderPicker1.PickSingleFolderAsync();
filesList1 = await folder1.GetFilesAsync();
var stream = await
filesList1[a].OpenAsync(Windows.Storage.FileAccessMode.Read);
var bitmapImage = new Windows.UI.Xaml.Media.Imaging.BitmapImage();
await bitmapImage.SetSourceAsync(stream);
image1.Source = bitmapImage;
}
private async void button2_Click(object sender, RoutedEventArgs e)
{
b++;
folder2 = await folderPicker2.PickSingleFolderAsync();
filesList2 = await folder2.GetFilesAsync();
var stream = await
filesList2[b].OpenAsync(Windows.Storage.FileAccessMode.Read);
var bitmapImage = new Windows.UI.Xaml.Media.Imaging.BitmapImage();
await bitmapImage.SetSourceAsync(stream);
image2.Source = bitmapImage;
}
private async void adaptImage()
{
var stream = await
filesList1[a].OpenAsync(Windows.Storage.FileAccessMode.Read);
BitmapDecoder decoder = await BitmapDecoder.CreateAsync(stream);
WriteableBitmap writableBitmap = new
WriteableBitmap((int)decoder.PixelWidth, (int)decoder.PixelHeight);
writableBitmap.SetSource(stream);
BlobCounter blobCounter = new BlobCounter();
blobCounter.MinHeight = 100;
blobCounter.MinWidth = 100;
blobCounter.MaxHeight = 600;
blobCounter.MaxWidth = 600;
blobCounter.ProcessImage((Bitmap)writableBitmap);
Blob[] blobs = blobCounter.GetObjectsInformation();
SimpleShapeChecker shapeChecker = new SimpleShapeChecker();
foreach (var blob in blobs)
{
List<IntPoint> edgePoints =
blobCounter.GetBlobsEdgePoints(blob);
List<IntPoint> cornerPoints;
if (shapeChecker.IsQuadrilateral(edgePoints, out cornerPoints))
{
if (shapeChecker.CheckPolygonSubType(cornerPoints) == PolygonSubType.Square)
{
double lenght = getLenght(cornerPoints[0].X,
cornerPoints[0].Y, cornerPoints[1].X, cornerPoints[1].Y);
image2.Height = lenght;
image2.Width = lenght;
image2.Margin = new Thickness(cornerPoints[0].X,
cornerPoints[0].Y, 0, 0);
}
}
}
}
private void button3_Click(object sender, RoutedEventArgs e)
{
adaptImage();
}
private double getLenght(int x1, int y1, int x2, int y2)
{
return Math.Sqrt((x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2));
}
}
}
启动时:第一个按钮加载背景,第二个按钮加载绘画,最后一个按钮使其适合绘画
加载后台后一切正常
正在加载绘画(随机方块)
最后一幅画不适合正方形的图片
由于您没有上传 XAML 代码,我添加了以下 XAML 代码进行测试,它可以很好地在我这边使用您的代码片段。
<Canvas>
<Image x:Name="image1" ></Image>
<Image x:Name="image2" ></Image>
<StackPanel Canvas.Top="20">
<Button x:Name="Button1" Click="button1_Click" Content="button1"></Button>
<Button x:Name="Button2" Click="button2_Click" Content="button2"></Button>
<Button x:Name="Button3" Click="button3_Click" Content="button3"></Button>
</StackPanel>
</Canvas>
后面的代码是一样的。我在 build 15036 上测试过。对于 aforge,我使用 AForge Core 2.2.5.60302 and Imaging 2.2.5.60302.
但我可以用 Grid
panel as the parent container, and at the same time the cornerPoints
of square doesn't begin from point 0,0
. Inside a Grid
panel, child elements are measured and arranged according to their row/column assignments.The image control may be positioned in the middle at default. But the cornerPoints
of square is the coordinate relative to the top-left corner of background image, so it may be wrong to calculate the margin
by cornerPoints
. Canvas
is suit for your scenarios. So please check if you are using a parent container for the Image
controls that will arrange the image controls , for example, a StackPanel
or a Grid
. More details please reference Layout panels 重现您的问题。
所以基本上我需要制作一个应用程序,让一幅画适合方形墙上的画框。我正在使用 aforge 来检测正方形,并使用它的角放置我想要的图像并将其调整为框架。这是通过按下触发 imageAdapt() 方法的第三个按钮来完成的。不幸的是,图像没有重新缩放到正确的大小并且放置错误。这是我的代码:
namespace MyFirstJob
{
public sealed partial class MainPage : Page
{
public static int a = -1;
public static int b = -1;
FolderPicker folderPicker1 = new Windows.Storage.Pickers.FolderPicker();
FolderPicker folderPicker2 = new Windows.Storage.Pickers.FolderPicker();
StorageFolder folder1;
StorageFolder folder2;
System.Collections.Generic.IReadOnlyList<StorageFile> filesList1;
System.Collections.Generic.IReadOnlyList<StorageFile> filesList2;
public MainPage()
{
InitializeComponent();
folderPicker1.FileTypeFilter.Add(".png");
folderPicker2.FileTypeFilter.Add(".png");
}
private async void button1_Click(object sender, RoutedEventArgs e)
{
a++;
folder1 = await folderPicker1.PickSingleFolderAsync();
filesList1 = await folder1.GetFilesAsync();
var stream = await
filesList1[a].OpenAsync(Windows.Storage.FileAccessMode.Read);
var bitmapImage = new Windows.UI.Xaml.Media.Imaging.BitmapImage();
await bitmapImage.SetSourceAsync(stream);
image1.Source = bitmapImage;
}
private async void button2_Click(object sender, RoutedEventArgs e)
{
b++;
folder2 = await folderPicker2.PickSingleFolderAsync();
filesList2 = await folder2.GetFilesAsync();
var stream = await
filesList2[b].OpenAsync(Windows.Storage.FileAccessMode.Read);
var bitmapImage = new Windows.UI.Xaml.Media.Imaging.BitmapImage();
await bitmapImage.SetSourceAsync(stream);
image2.Source = bitmapImage;
}
private async void adaptImage()
{
var stream = await
filesList1[a].OpenAsync(Windows.Storage.FileAccessMode.Read);
BitmapDecoder decoder = await BitmapDecoder.CreateAsync(stream);
WriteableBitmap writableBitmap = new
WriteableBitmap((int)decoder.PixelWidth, (int)decoder.PixelHeight);
writableBitmap.SetSource(stream);
BlobCounter blobCounter = new BlobCounter();
blobCounter.MinHeight = 100;
blobCounter.MinWidth = 100;
blobCounter.MaxHeight = 600;
blobCounter.MaxWidth = 600;
blobCounter.ProcessImage((Bitmap)writableBitmap);
Blob[] blobs = blobCounter.GetObjectsInformation();
SimpleShapeChecker shapeChecker = new SimpleShapeChecker();
foreach (var blob in blobs)
{
List<IntPoint> edgePoints =
blobCounter.GetBlobsEdgePoints(blob);
List<IntPoint> cornerPoints;
if (shapeChecker.IsQuadrilateral(edgePoints, out cornerPoints))
{
if (shapeChecker.CheckPolygonSubType(cornerPoints) == PolygonSubType.Square)
{
double lenght = getLenght(cornerPoints[0].X,
cornerPoints[0].Y, cornerPoints[1].X, cornerPoints[1].Y);
image2.Height = lenght;
image2.Width = lenght;
image2.Margin = new Thickness(cornerPoints[0].X,
cornerPoints[0].Y, 0, 0);
}
}
}
}
private void button3_Click(object sender, RoutedEventArgs e)
{
adaptImage();
}
private double getLenght(int x1, int y1, int x2, int y2)
{
return Math.Sqrt((x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2));
}
}
}
启动时:第一个按钮加载背景,第二个按钮加载绘画,最后一个按钮使其适合绘画
加载后台后一切正常
正在加载绘画(随机方块)
最后一幅画不适合正方形的图片
由于您没有上传 XAML 代码,我添加了以下 XAML 代码进行测试,它可以很好地在我这边使用您的代码片段。
<Canvas>
<Image x:Name="image1" ></Image>
<Image x:Name="image2" ></Image>
<StackPanel Canvas.Top="20">
<Button x:Name="Button1" Click="button1_Click" Content="button1"></Button>
<Button x:Name="Button2" Click="button2_Click" Content="button2"></Button>
<Button x:Name="Button3" Click="button3_Click" Content="button3"></Button>
</StackPanel>
</Canvas>
后面的代码是一样的。我在 build 15036 上测试过。对于 aforge,我使用 AForge Core 2.2.5.60302 and Imaging 2.2.5.60302.
但我可以用 Grid
panel as the parent container, and at the same time the cornerPoints
of square doesn't begin from point 0,0
. Inside a Grid
panel, child elements are measured and arranged according to their row/column assignments.The image control may be positioned in the middle at default. But the cornerPoints
of square is the coordinate relative to the top-left corner of background image, so it may be wrong to calculate the margin
by cornerPoints
. Canvas
is suit for your scenarios. So please check if you are using a parent container for the Image
controls that will arrange the image controls , for example, a StackPanel
or a Grid
. More details please reference Layout panels 重现您的问题。