[X.Form] Image - Aspect 屬性

Image View 有三種屬性可以使用，分別為 Fill、AspectFill 和 AspectFit (預設值)

官網說明為

• Fill - Stretches the image to completely and exactly fill the display area. This may result in the image being distorted.
• AspectFill - Clips the image so that it fills the display area while preserving the aspect (ie. no distortion).
• AspectFit - Letterboxes the image (if required) so that the entire image fits into the display area, with blank space added to the top/bottom or sides depending on the whether the image is wide or tall.

在 MainPage.xaml 內故意設定 Image View 高度這樣比較容易呈現屬性效果，並直接把 Firework.jpg 圖檔放在 Android 內，直接抓取本地端圖片來顯示

MainPage.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"
             xmlns:local="clr-namespace:App1"
             x:Class="App1.MainPage">
    <StackLayout>
        <Image 
            Source="Firework.jpg" 
            HeightRequest="200"
            Aspect="AspectFit">
        </Image>
    </StackLayout>
</ContentPage>

Firework.jpg 位置

呈現效果為

• 原圖

• Fill

• AspectFill

• AspectFit

沒有故意設定 Image 高度，AspectFill 和 AspectFit 完全看不出哪裡有差異，>.<

參考資料
• Images
• Xamarin.Forms Image 圖片控制項的特色與使用說明
• Xamarin.Forms 教學系列文（十三.壹）從網址或內嵌資源載入圖片