Xamarin.Forms学习历程(二)

本文阅读导航 展开

哈哈哈~~我最近在写的Xamarin.Forms工程终于到了收尾阶段了，主体功能都实现了，修复一些小Bug以及添加些小功能就算完成了，太高兴了，心里满满的成就感，特别是安卓端界面完整呈现的时候。今天讲点知识点，搭建一个小程序。

认识Xamarin.forms的工程结构##

我们先撇开安卓和iOS，先来了解公共部分。我们继续看我们上期写的HelloWorld程序

Snip20160811_28.png

先看这一块，项目刚开始时就存在这些文件，我们来逐一看一下这些文件都是干嘛用的，以及里面放些什么文件。
估计有人会问我，为什么我的是中文版，其实我可以告诉你我也不知道，具体地说我的是中英文混合版，

Snip20160811_29.png

不闲扯了，还是回到刚才所说的，

引用：这个我目前还没用到过，具体内容我不清楚，等我弄明白再回来补上吧（todo）
包：这个是导入一些库，就像iOS工程里有时候需要导入一些framework一样。
Properties：这个我也不清楚（todo）
App.xaml：这个文件比较重要，是程序的入口，和iOS 里 AppDelegate这个文件的功能有些类似，所以定义初始界面就在这里面。
HelloWorldPage：这个文件和Xcode生成Single APP是生成的启动界面一样，默认第一个界面，删除不影响的。这里我们点开前面的小三角会发现这里面其实有两个文件：HelloWordPage.xaml和HelloWordPage.xaml.cs，这里我说明一下，HelloWordPage.xaml相当于view，不涉及业务逻辑，只处理一些控件的显示和所要展示内容数据的绑定，相当于iOS里面的View。而HelloWordPage.xaml.cs里面正常情况下是写业务逻辑的，它和iOS里的ViewController很像，所以在这里面其实也是可以写界面的。不过代码规范正常情况下是不允许这么做的，但特殊情况可以理解。这两个文件是相关联的，绑定在一起。前段时间我把几个文件导入到其他工程，结果他们的关系就不存在了，我目前还不知道怎么让独立的两个文件绑定在一起。
packages：这个是包文件版本文件，工程内所有导入的包信息都可以在这里面看到，所以上传至git时不需要把包都上传，只需要把这个文件导入就可以了。
好了，说了这么多我们来练一下手，按照自己的理解写个小小的应用程序。

优化版HelloWorld##

创建文件###

Snip20160811_30.png

Snip20160811_31.png

看到这个界面可能你会觉得无从下手，不要慌，我们先和他们握个手，认识一下

Forms ContentPage： 这里有个诀窍，看到Page，咱们就可以把它看成ViewController，这样就好理解了，Forms ContentPage就是创建一个Forms ContentPage.cs文件，也就是用纯C#代码写界面。
Forms ContentPage Xaml：一般情况用这个，他会创建一个ContentPage.xaml文件和ContentPage.xaml.cs文件，
Forms ContentView：这个是生成用纯C#代码在定义View的文件
Forms ContentView Xaml：这个和之前的类似，不用说你也应该能猜到。

Snip20160811_32.png

这里我们新建一个MyHelloWorld文件,让我们在里面写点东西

Snip20160811_33.png

我把里面的代码贴出来吧

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"       
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"         
              x:Class="HelloWorld.MyHelloWorld">    
<ContentPage.Content>        
    <StackLayout  VerticalOptions = "FillAndExpand"
                    HorizontalOptions = "FillAndExpand">            
              <Label Text = "Hello My World!"                    
                     TextColor ="Red"                
                      FontSize = "25"
                    VerticalOptions = "CenterAndExpand"                    
                    HorizontalOptions = "CenterAndExpand"/>        
  </StackLayout>    
</ContentPage.Content>
</ContentPage>

然后我们在APP文件配置一下