[Xamarin] Xamarin Form 初體驗
最近在看一下Xamarin 官方的文件看到一個應該不算新發表，但是很有趣的東西 就是Xamarin Form
一開始看到這技術有點嚇到，因為之前的Xamarin 他並沒有去解決各平台上面Layout 的問題，所以各個平台都要自己去撰寫UI，但是這東西出現Xamarin 推了一個自己的 XAML 然後一些基本的UI都有了，並且做出來的東西可以做到三平台上面的一致性
(官方的範例圖片)
所以當然我就直接開來玩玩看，當然就簡單寫個Hello World.
1. 打開專案，並且我取名是App2
2.可以在共用的專案(App2)，加入 Form Xaml Page
我取名為Page1.cs，此時候專案多了一個 Page1.xaml ，我測試環境是Windows 10 + Visual Studio 2015 ，目前是無法視覺化編輯XAML
預設是這樣
<?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="App2.Page1">
<Label Text="{Binding MainText}" VerticalOptions="Center" HorizontalOptions="Center" />
</ContentPage>
不過我們直接來改變一下，加入 StackLayout 跟一個Button ，並且做一些修改
<?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="App2.Page1">
<StackLayout
HorizontalOptions="Center"
VerticalOptions="Center">
<Label Text="Hello 當麻" VerticalOptions="Center" HorizontalOptions="Center" />
<Button Text="Click Me!!" x:Name="btnClick" VerticalOptions="Center" HorizontalOptions="Center" ></Button>
</StackLayout>
</ContentPage>
我希望其中按鈕點一下去後，可以跳出一個Hello Xamarin Form 的Dialog
3.因為打開專案預設他會自己生成一個Form 就在 App.cs 的地方 有一段 MianPage =…. ，我們把它註解起來，讓他直接變成Page1 是起始頁面
public App (){ // The root page of your application //MainPage = new ContentPage //{ // Content = new StackLayout // { // VerticalOptions = LayoutOptions.Center, // Children = { // new Label { // XAlign = TextAlignment.Center, // Text = "Welcome to Xamarin Forms!" // } // } // } //}; MainPage = new Page1();}
4. 我們可以撰寫在Page1.xaml.cs 下面撰寫btnClick 後的事件
using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;using System.Windows;using Xamarin.Forms;namespace App2{public partial class Page1 : ContentPage
{ public Page1 () {InitializeComponent ();
btnClick.Clicked += BtnClick_Clicked;
}
private void BtnClick_Clicked(object sender, EventArgs e)
{DisplayAlert("標題", "Hello, Xamarin Form.", "OK");
}
}
}
結果:
參考文件:
官方介紹 - http://xamarin.com/forms
Xamarin Form - https://developer.xamarin.com/guides/cross-platform/xamarin-forms/
Xamarin From Button - http://developer.xamarin.com/api/type/Xamarin.Forms.Button/
Getting Started - https://developer.xamarin.com/guides/cross-platform/xamarin-forms/getting-started/
User Interface - https://developer.xamarin.com/guides/android/user_interface/
Introduction - http://developer.xamarin.com/guides/cross-platform/xamarin-forms/getting-started/introduction-to-xamarin-forms/
大概玩了一下，發現他還有Data Binding 的部分，其實我很訝異，畢竟這是一個除了PhoneGap 以外另一個創舉，畢竟這樣考慮的東西還很多，目前你問我說我敢不敢拿來做Production 我覺得我還不敢，可能是操作上面我還並未夠成熟，而且現在無法視覺化編輯是一個小小的遺憾，但是我深深覺得Xamarin 團隊真的很強悍，或許在下個版本可以解決這個問題，我是給予高度肯定的態度，目前支援的UI Control 還是有限的，但是整個布局跟相容性來說，我對這團隊有信心，如果你對於跨平台真的有這需求，真的可以考慮Xamarin Form。
