uvp 18.1第五组 图像处理器app 第一周开发日记

项目地址:https://github.com/tyuchn/project

团队成员:黄成慧

2018418

实现添加滤镜界面的设计

为了实现添加滤镜的功能,使用了PivotGrid View等控件,首先实现了对界面的设计。

 uvp 18.1第五组 图像处理器app 第一周开发日记

2018422

设计界面后开始尝试实现界面功能——对图片添加滤镜功能。

网上查阅资料得知Win2D可以实现绘图,绘制文字,还有自带的滤镜属性,可以实现对图片添加滤镜。

因此决定使用Win2D来实现这一功能。

http://microsoft.github.io/Win2D/html/QuickStart.htm

首先在网上看了Win2D的入门的一些操作,学习了Win2D的一些基本功能。

通过这些入门的资料学会了将Win2DCanvasControl  添加到Xaml文件中。即添加一个画布可以来绘制你的图片。

通过例子我开始尝试使用Win2D绘制一些简单的文字,图形。

然后才开始尝试用Win2D开始进行对滤镜的添加。

Win2D中有自带的滤镜属性,这些属性以Effect结尾如InvertEffectGrayscaleEffect,HueRotationEffect等。开始想通过页面调用实现每加一个滤镜就打开新的画布进行绘制图片,但是没有实现,因为画过一次调用就会报错(文件已过期)。最后重新研究了Wind2D,实现了在一个画布上显示不同的滤镜效果。

最后增加了Finish Button 将加过滤镜的图片返回到原页面。

 uvp 18.1第五组 图像处理器app 第一周开发日记

 

 

团队成员:熊晓玲

4月17日:

增加了几个页面,通过frame来实现跳转,页面里就是一些按钮的控件。

增加了一个draw的功能,就是用inkcanvas画布里画画。

https://docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.inkcanvas

关于图片的打开  因为做了播放器,里面也有打开本地文件的功能,所以就找了

https://msdn.microsoft.com/zh-cn/library/windows/apps/windows.storage.pickers.fileopenpicker.aspx

文件是可以选择并打开,但是有涉及到图片的显示问题。

https://docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.image.source#Windows_UI_Xaml_Controls_Image_Source

这里讲了图片的uri的知识点,我参考了这个代码,实现了图片的打开。

 uvp 18.1第五组 图像处理器app 第一周开发日记

 

关于图片的文件保存

http://ju.outofmemory.cn/entry/228385

看里文件的保存,他安装了Edi.UWP.Helpers库,我觉得有点复杂,但是我看到了他把工程底下的图片文件转换为WriteableBitmap格式,所以我觉得应该是要这一步的

后来我找到了:

https://msdn.microsoft.com/zh-cn/library/windows/apps/windows.storage.pickers.aspx

这个网页里介绍了关于文件的东西,Windows.Storage.Pickers Namespace

提供用于创建和管理用户接口 (UI) 元素的类,该类允许用户在存储文件时浏览文件、选择要打开的文件和选择名称、扩展。

其中的一个类就是FileSavePicker Class

表示允许用户为文件选择文件名、扩展名和存储位置的选择器。这里例子是以.txt文件为例的,我就直接改成了图片的,但是没有成功,所以我有找了资料

https://blog.csdn.net/csdn_ergo/article/details/51281093

这里就是使用文件选择器保存文件,以图片为例,把Image控件中的图片保存到用户选择的位置,我知道了,要把图片的控件转换为图片才可以保存

图片的保存功能就实现了。

 uvp 18.1第五组 图像处理器app 第一周开发日记

 

4月24日

图片的剪切:

https://blog.csdn.net/github_36704374/article/details/60334156

可以对图片剪切的功能,所以我就运用了。但是我发现,这个只能用文件的形式传图片,所以我想有什么方法用控件图片传参,找到https://docs.microsoft.com/en-us/previous-versions/windows/desktop/apps/hh868203(v=win.10)

但是,这里的图片剪切不是可以人为的操作剪切,是设定好的一个矩形框剪切的。最后还是以文件传参实现了剪切的功能。

 uvp 18.1第五组 图像处理器app 第一周开发日记

Inkcanvas里的转换为图片,保存起来

http://ju.outofmemory.cn/entry/213649

https://docs.microsoft.com/zh-cn/windows/uwp/design/controls-and-patterns/inking-controls

 

我想在inkcavas里打开图片,对图片涂鸦,但是没有实现。我就查找怎么在一个画布上打开图片

http://www.cnblogs.com/hupo376787/p/8694724.html

这里我找到了在canvas上打开图片,我用了一下,但是canvas不能用鼠标画图,我又各种找资料,发现都用了canvas:CanvasControl,

https://msdn.microsoft.com/zh-cn/library/ms609109(v%3DVS.80).aspx

https://docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.canvas#methods-

我开始研究,这些画布的区别,各个属性,因为属性不同,所以实现的方式就不一样,所以,我就开始win2d的使用。https://www.cnblogs.com/TianFang/p/4738042.html,对图片的涂鸦还在进行中。

 

 

团队成员:刘思维

 

2018年4月17日:

UI开发:

新建project.xmal

向其中添加NavigatiionView和Frame。

然后新建一个空白页page1

向其中添加Button进行打开文件,功能选择等操作。

page1用Mainpage的Frame显示出来。

解决问题:

1.向程序中添加opencv的NuGet组件

2.实现一个OpenCVHelper类

 

2018年4月27日

解决问题:

OpenCVHelpe中编写函数blur,在page1中进行调用,利用opencv的Blur函数实现图像模糊功能

通过open按钮实现文件选择然后对图像进行模糊操作

uvp 18.1第五组 图像处理器app 第一周开发日记

 

团队成员:田宇辰

2018.04.17

尝试了多种调用系统SystemNavigationManager来实现后退功能的方法,但是目前都以失败告终,看了很多篇博客,大致的方法都是在app.xaml.cs中的Onlaunch函数中添加

SystemNavigationManager.GetForCurrentView().BackRequested += OnBackrequested; SystemNavigationManager.GetForCurrentView().AppViewBackButtonVisibility = rootFrame.CanGoBack ? AppViewBackButtonVisibility.Visible : AppViewBackButtonVisibility.Collapsed;

调用系统SystemNavigationManager来订阅返回事件,

然后OnBackrequest方法的写法也都是大同小异

private void OnNavigated(object sender, NavigationEventArgs e) {

 //根据页面是否可以返回,在窗口显示返回按钮 SystemNavigationManager.GetForCurrentView().AppViewBackButtonVisibility = ((Frame)sender).CanGoBack ? AppViewBackButtonVisibility.Visible : AppViewBackButtonVisibility.Collapsed; }

 

private void OnBackrequested(object sender, BackRequestedEventArgs e)

{

Frame rootFrame = Window.Current.Content as Frame;

 if (rootFrame != null && rootFrame.CanGoBack)

 {

e.Handled = true; rootFrame.GoBack();

 }

}

方法的解释大概就是通过在app.xaml.cs中设置监听器,如果能够返回的话,显示后退按键,并在点击后返回。

但是所有的问题都是程序运行页面实现跳转之后,并没有除非这些事件,很是疑惑

2018.04.21

在网上向老师请教了这个方法,老师说在微软的官方技术文档里找到了更简洁的掉用方法,在最新的windows 10 preview版本中,navigationview中增添了backrequest属性,可以直接在声明navigationview对象是设置这个属性

From:https://docs.microsoft.com/en-us/windows/uwp/design/controls-and-patterns/navigationview#backwards-navigation

2018.04.22

在安装了一个能直接生成程序框架的插件之后系统崩溃,system32里的debug程序无法运行,于是重新安装系统,重新开始。

2018.04.26

添加了camera功能,能够实现调用相机功能,并在拍照后保存并将照片显示在image

来自:

https://docs.microsoft.com/zh-cn/windows/uwp/audio-video-camera/capture-photos-and-video-with-cameracaptureui

通过对CameraCaptureUI方法调用系统相机,并调用StorageFile类中的方法在文件中中保存,最后将数据流读出,获取BitMap表示形式以便后需修改

效果如下

uvp 18.1第五组 图像处理器app 第一周开发日记

uvp 18.1第五组 图像处理器app 第一周开发日记

uvp 18.1第五组 图像处理器app 第一周开发日记