December 29, 2013

PictureBox的SizeMode屬性應用

在某個Windows Forms專案中,有個功能是讓使用者點選按鈕後開啟一張圖片在一個表單中。表單使用了PictureBox來載入圖片,其AutoScroll屬性設為True,而PictureBox的SizeMode屬性設為AutoSize。在預設情況下,載入圖片會將PictureBox塞滿整張完整大小的圖片,使用者可以透過scrollbar來瀏覽圖片(如果圖片比表單內容大小還大的話)。


使用者操作過後提出了需求,希望載入的圖片可以適當的比例完整顯示在表單中。要達到這個需求,可以將PictureBox的Dock屬性設為Fill,SizeMode屬性設為StretchImage或Zoom。這個方式會讓PictureBox大小與表單內容大小一樣大,而StretchImage會將載入的圖片塞滿整個PictureBox;Zoom會將載入的圖片以比例顯示在PictureBox。然而這兩種設定對於尺寸較小的圖片,會因此被拉大造成影像失真。

另一個可行的方式是透過程式在載入圖片時做尺寸上的控制。
private void ShowPhotoForm_Load(object sender, EventArgs e)
{
    if (!File.Exists(this._filePath))
    {
        this.DisplayError(string.Format("檔案({0})不存在", this._filePath));
        this.Close();
        return;
    }

    try
    {
        this.PictureBox_Photo.Image = Image.FromFile(this._filePath);
        this.PictureBox_Photo.SizeMode = this.PhotoSmallerThanPictureBox() ? PictureBoxSizeMode.CenterImage : PictureBoxSizeMode.Zoom;
    }
    catch
    {
        this.DisplayError(string.Format("無法開啟檔案({0})", this._filePath));
        this.Close();
        return;
    }
}

[AllowLogging]
private bool PhotoSmallerThanPictureBox()
{
    return this.PictureBox_Photo.Image.Width < this.PictureBox_Photo.Width && this.PictureBox_Photo.Image.Height < this.PictureBox_Photo.Height;
}


PhotoSmallerThanPictureBox方法會回傳載入的圖片尺寸是否小於PictureBox的尺寸。如果是的話,我們將PictureBox的SizeMode設為CenterImage,如此尺寸較小的圖片會被放置在PictureBox正中央顯示。反之,SizeMode設為Zoom,圖片會以比例方式完整顯示在PictureBox內。要注意的是,PictureBox的Dock屬性需設為Fill