剛開始要學習 Xamarin.Forms 開發時，一定會想說實作一個簡單的互動程式看看，查了語法敲了一串 <Button WidthRequest="100" HeightRequest="100" Text="I'm Button" /> 放上去之後，哇！怎麼 Button 那麼大？
我相信多數人會遭遇跟我一樣問題「怎麼讓 Button 依照我想要的位置去擺放？」
決定 View 物件擺放位置最基本的兩個屬性就是 HorizontalOptions 及 VerticalOptions，這兩個屬性的型別是 LayoutOptions 是 struct，裡面定義了 8 個靜態欄位：
- Start
- StartAndExpand
- Center
- CenterAndExpand
- End
- EndAndExpand
- Fill
- FillAndExpand
這 8 個靜態欄位有什麼不同？底下我們來一個一個探究。
Fill、Start、Center、End
這四個是最基本的起手式，除非 View 物件本身有特別改變設定，不然通常預設值是 Fill，所以剛剛那一串 Button 的語法可以看成是：
<Button HorizontalOptions="Fill" VerticalOptions="Fill" WidthRequest="100" HeightRequest="100" Text="I'm Button" />
除了 Fill 之外其他三個：Start、Center、End，再搭配 HorizontalOptions 及 VerticalOptions 我們的 View 物件就會出現額外 6 種位置的組合。
HorizontalOptions="Start"、"Center"、"End"
VerticalOptions="Start"、"Center"、"End"
所以我們要放一個 100×100 的 Button 在螢幕的中間，我們可以這樣做。
<Button HorizontalOptions="Center" VerticalOptions="Center" WidthRequest="100" HeightRequest="100" Text="I'm Button" />
那其他四個在做什麼？ StartAndExpand、CenterAndExpand、EndAndExpand、FillAndExpand
這四個通常會跟 Layout 搭配著使用，如果是認真要用 Xamarin.Forms 做一個 App 的話應該不會不用 Layout 來做 UI 佈局，我就加一個 StackLayout 來看看這四個值有何差別？
我們先看 Start、Center、End 在 StackLayout 中會有什麼影響？ 我給了 6 個 Button，前面 3 個的 VerticalOptions 值分別給定 Start、Center、End，可以看到在 StackLayout 中不受影響，後面的 3 個 Button 把 HorizontalOptions 值給 Start、Center、End 也符合預期。
我們換把 VerticalOptions 值給定 StartAndExpand、CenterAndExpand、EndAndExpand、FillAndExpand，並且在這之中另外安插 VerticalOptions 值非 Expand 結尾的 Button，可以看到 StackLayout 把空間先分配給非 Expand 的 Button 之後，把剩餘的空間平均分配給 Expand 的 Button，下圖框起來的地方就能看出來這些 Button 所分配到的空間是相同的。
如果把 StackLayout 的 Orientation 換成水平的，我們就會得到平均分配水平排列的 Buttons。
