Windows Phone在隔离存储里存取图片文件

 

作为windows phone的初学者，第一个练手小应用是一个类似备忘录的软件，功能不是太多，涉及到即时任务，灵感，图文的一些记录。对于即时拍照然后附上相应描述再保存在独立存储里面，刚开始不太懂，搞了好几天（毕竟是新手），总算是搞定了，在此奉上关于照片存取的小小收获，给予像我一样的新手一点小小的帮助吧，也许对有些人有用而对有些人不值一提吧。

一共两个页面，第一个为mainpage.xaml，代码如下：

 1  <!--contentpanel - place additional content here-->

 2         <grid x:name="contentpanel" grid.row="1" margin="12,0,12,0">

 3             <image name="photoimage" height="342" horizontalalignment="left" margin="9,6,0,0"  stretch="fill" verticalalignment="top" width="441"/>

 4             <button name="savebutton" click="savebutton_click" content="保存" height="72" horizontalalignment="left" margin="7,482,0,0"  verticalalignment="top" width="441">

 5                 <button.background>

 6                     <lineargradientbrush endpoint="0.5,1" startpoint="0.5,0">

 7                         <gradientstop color="black" offset="0"/>

 8                         <gradientstop color="#ffeb1818" offset="1"/>

 9                     </lineargradientbrush>

10                 </button.background>

11             </button>

12             <textblock height="30" horizontalalignment="left" margin="27,442,0,0" name="textblock1" text="输入照片名：" fontsize="25" verticalalignment="top"/>

13             <textbox name="photoname" height="72" horizontalalignment="left" margin="165,424,0,0"  text="" verticalalignment="top" width="284">

14                 <textbox.background>

15                     <lineargradientbrush endpoint="0.5,1" startpoint="0.5,0">

16                         <gradientstop color="black" offset="0"/>

17                         <gradientstop color="#ffd01818" offset="1"/>

18                     </lineargradientbrush>

19                 </textbox.background>

20             </textbox>

21             <button name="takephotobutton" click="takephotobutton_click" content="拍照" height="72" margin="9,366,8,0" verticalalignment="top">

22                 <button.background>

23                     <lineargradientbrush endpoint="0.5,1" startpoint="0.5,0">

24                         <gradientstop color="black" offset="0"/>

25                         <gradientstop color="#ffd61212" offset="1"/>

26                     </lineargradientbrush>

27                 </button.background>

28             </button>

29         </grid>

30     </grid>

31 

32     <!--sample code showing usage of applicationbar-->

33     <phone:phoneapplicationpage.applicationbar>

34         <shell:applicationbar isvisible="true" ismenuenabled="true">

35             <shell:applicationbariconbutton iconuri="/images/appbar.feature.search.rest.png" text="查看" click="applicationbariconbutton_click"/>

36         </shell:applicationbar>

37     </phone:phoneapplicationpage.applicationbar>

后台代码如下：

  mainpage.xaml.cs

 1 using system;

 2 using system.collections.generic;

 3 using system.linq;

 4 using system.net;

 5 using system.windows;

 6 using system.windows.controls;

 7 using system.windows.documents;

 8 using system.windows.input;

 9 using system.windows.media;

10 using system.windows.media.animation;

11 using system.windows.shapes;

12 using microsoft.phone.controls;

13 using microsoft.phone.tasks;

14 using microsoft.phone;

15 using system.io;

16 using system.io.isolatedstorage;

17

18 namespace 在隔离存储中存取照片

19 {

20     public partial class mainpage : phoneapplicationpage

21     {

22         // constructor

23         string filename;

24         byte[] _imageasbyte;

25         public mainpage()

26         {

27             initializecomponent();

28         }

29

30         private void savebutton_click(object sender, routedeventargs e)

31         {

32             filename = photoname.text;

33             if (filename != ""&&photoimage.source!=null)

34             {

35                 using (var store = isolatedstoragefile.getuserstoreforapplication())

36                 {

37                     if (!store.fileexists(filename) || store.fileexists(filename) && messagebox.show("overwrite the file?", "question", messageboxbutton.okcancel) == messageboxresult.ok)

38                     {

39                         using (var stream = store.createfile(filename))

40                         {

41                             stream.write(_imageasbyte, 0, _imageasbyte.length);

42                         }

43                         photoimage.source = null;

44                         photoname.text = "";

45                         navigationservice.navigate(new uri("/page1.xaml", urikind.relative));

46                     }

47                 }

48             }

49             else

50             {

51                 messagebox.show("sorry,but you must take a photo and write the photo's name in the textbox!","warning!",messageboxbutton.ok);

52             }

53         }

54

55         private void takephotobutton_click(object sender, routedeventargs e)

56         {

57             cameracapturetask task = new cameracapturetask();

58             task.completed += new eventhandler<photoresult>(task_completed);

59             task.show();

60         }

61

62         void task_completed(object sender, photoresult e)

63         {

64             if (e.taskresult == taskresult.ok)

65             {

66                 _imageasbyte = new byte[e.chosenphoto.length];

67                 e.chosenphoto.read(_imageasbyte, 0, _imageasbyte.length);

68                 e.chosenphoto.seek(0, seekorigin.begin);

69                 this.photoimage.source = picturedecoder.decodejpeg(e.chosenphoto);

70             }

71         }

72

73         private void applicationbariconbutton_click(object sender, eventargs e)

74         {

75             navigationservice.navigate(new uri("/page1.xaml",urikind.relative));

76         }

77     }

78 }

 

效果如图所示：

 

 

同时还新建了一个照片文件的类，从isolatedstorage里读取出照片及照片名再绑定到page1.xaml中的listbox中。类代码如下：

  photofile.cs

 1 using system;

 2 using system.net;

 3 using system.windows;

 4 using system.windows.controls;

 5 using system.windows.documents;

 6 using system.windows.ink;

 7 using system.windows.input;

 8 using system.windows.media;

 9 using system.windows.media.animation;

10 using system.windows.shapes;

11

12 namespace 在隔离存储中存取照片

13 {

14     public class photofile

15     {

16         public imagesource image { get; set; }

17         public string imagename { get; set; }

18     }

19 }

 

第二个page1.xaml，代码如下：

 1  <!--contentpanel - place additional content here-->

 2         <grid x:name="contentpanel" grid.row="1" margin="12,0,12,0">

 3             <listbox height="550" horizontalalignment="left" margin="6,6,0,0" name="listbox1" verticalalignment="top" width="460">

 4                 <listbox.itemtemplate>

 5                     <datatemplate>

 6                         <grid margin="{staticresource phonetouchtargetoverhang}">

 7                             <stackpanel orientation="horizontal">

 8                                 <image source="{binding image}" width="130" height="120" stretch="fill"/>

 9                                 <textblock text="{binding imagename}" foreground="coral" fontsize="32" textwrapping="wrap" width="300"/>

10                             </stackpanel>

11                         </grid>

12                     </datatemplate>

13                 </listbox.itemtemplate>

14             </listbox>

15         </grid>

16     </grid>

17 

18     <!--sample code showing usage of applicationbar-->

19     <phone:phoneapplicationpage.applicationbar>

20         <shell:applicationbar isvisible="true" ismenuenabled="true">

21             <shell:applicationbariconbutton iconuri="/images/appbar.add.rest.png" text="添加" click="applicationbariconbutton_click"/>

22         </shell:applicationbar>

23     </phone:phoneapplicationpage.applicationbar>

后台代码：

  page1.xaml.cs

 1 using system;

 2 using system.collections.generic;

 3 using system.linq;

 4 using system.net;

 5 using system.windows;

 6 using system.windows.controls;

 7 using system.windows.documents;

 8 using system.windows.input;

 9 using system.windows.media;

10 using system.windows.media.animation;

11 using system.windows.shapes;

12 using microsoft.phone.controls;

13 using system.io;

14 using system.io.isolatedstorage;

15 using system.windows.media.imaging;

16

17 namespace 在隔离存储中存取照片

18 {

19     public partial class page1 : phoneapplicationpage

20     {

21         isolatedstoragefile file = isolatedstoragefile.getuserstoreforapplication();

22         public page1()

23         {

24             initializecomponent();

25         }

26

27         private void phoneapplicationpage_loaded(object sender, routedeventargs e)

28         {

29             list<photofile> filelist = new list<photofile>();

30             if (file.getfilenames() != null)

31             {

32                 foreach (string filename in file.getfilenames())

33                 {

34                     photofile photo = new photofile();

35                     bitmapimage bmp = new bitmapimage();

36                     using (isolatedstoragefilestream filestream = file.openfile(filename, filemode.open, fileaccess.readwrite))

37                     {

38                         bmp.setsource(filestream);

39                         filestream.flush();

40                         filestream.close();

41                         photo.image = bmp;

42                         photo.imagename = " 照片名："+filename;

43                     }

44                     filelist.add(photo);

45                 }

46                 listbox1.itemssource = filelist;

47             }

48         }

49

50         private void applicationbariconbutton_click(object sender, eventargs e)

51         {

52             navigationservice.navigate(new uri("/mainpage.xaml",urikind.relative));

53         }

54     }

55 }

运行效果如下：

 

 

 

 

希望对大家有所帮助，嘻嘻。祝大家wp开发更上一城楼，大家以后都去赚美刀！！！

作者：徐永杰